Prevent multiple JS instance creation where necessary

js/src/bundles/protected.js

@@ -20,19 +20,18 @@ import {Sidebar} from '../sidebar.js';
 import {PersonalTools} from '../personaltools.js';
 
 export * from '../batcheditems.js';
+export * from '../colormode.js';
 export * from '../copysupport.js';
 export * from '../keybinder.js';
-export * from '../keybinder.js';
+export * from '../personaltools.js';
 export * from '../referencebrowser.js';
+export * from '../scrollbar.js';
 export * from '../selectable.js';
 export * from '../sharing.js';
+export * from '../sidebar.js';
 export * from '../tabletoolbar.js';
 export * from '../translation.js';
 export * from '../utils.js';
-export * from '../colormode.js';
-export * from '../scrollbar.js';
-export * from '../sidebar.js';
-export * from '../personaltools.js';
 
 $(function() {
     new KeyBinder();

js/src/cone.js

@@ -1,32 +1,32 @@
 import * as batcheditems from './batcheditems.js';
+import * as colormode from './colormode.js';
 import * as copysupport from './copysupport.js';
 import * as keybinder from './keybinder.js';
 import * as livesearch from './livesearch.js';
+import * as personaltools from './personaltools.js';
 import * as referencebrowser from './referencebrowser.js';
 import * as selectable from './selectable.js';
 import * as settingstabs from './settingstabs.js';
 import * as sharing from './sharing.js';
+import * as sidebar from './sidebar.js';
 import * as tabletoolbar from './tabletoolbar.js';
 import * as utils from './utils.js';
-import * as colormode from './colormode.js';
-import * as sidebar from './sidebar.js';
-import * as personaltools from './personaltools.js';
 
 let api = {};
 
 Object.assign(api, batcheditems);
+Object.assign(api, colormode);
 Object.assign(api, copysupport);
 Object.assign(api, keybinder);
 Object.assign(api, livesearch);
+Object.assign(api, personaltools);
 Object.assign(api, referencebrowser);
 Object.assign(api, selectable);
 Object.assign(api, settingstabs);
 Object.assign(api, sharing);
+Object.assign(api, sidebar);
 Object.assign(api, tabletoolbar);
 Object.assign(api, utils);
-Object.assign(api, colormode);
-Object.assign(api, sidebar);
-Object.assign(api, personaltools);
 
 let cone = api;
 export default cone;

js/src/keybinder.js

@@ -7,7 +7,6 @@ export let keys = {
 
 /**
  * XXX: Use ``ts.KeyState`` instead.
- *      Need a mechanism to attach and unload instances with ``ts.ajax`` first.
  */
 export class KeyBinder {
 
@@ -31,7 +30,7 @@ export class KeyBinder {
         switch (e.keyCode || e.which) {
             case 16:
                 keys.shift_down = false;
-                   break;
+                break;
             case 17:
                 keys.ctrl_down = false;
                 break;

js/src/livesearch.js

@@ -1,11 +1,10 @@
-import $ from 'jquery';
 import ts from 'treibstoff';
 
 export class LiveSearch {
 
     static initialize(context, factory=null) {
-        let elem = $('input#search-text', context);
-        if (!elem.length) {
+        const elem = ts.query_elem('input#search-text', context);
+        if (!elem) {
             return;
         }
         if (factory === null) {

js/src/personaltools.js

@@ -4,8 +4,8 @@ import ts from 'treibstoff';
 export class PersonalTools extends ts.Events {
 
     static initialize(context) {
-        const elem = $('#header-main', context);
-        if (!elem.length) {
+        const elem = ts.query_elem('#header-main', context);
+        if (!elem) {
             return;
         }
         new PersonalTools(elem);

js/src/sidebar.js

@@ -4,12 +4,16 @@ import ts from 'treibstoff';
 export class Sidebar extends ts.Motion {
 
     static initialize(context) {
-        new Sidebar(context);
+        const elem = ts.query_elem('#sidebar_left', context);
+        if (!elem) {
+            return;
+        }
+        new Sidebar(context, elem);
     }
 
-    constructor(context) {
+    constructor(context, elem) {
         super();
-        this.elem = $('#sidebar_left', context);
+        this.elem = elem;
         this.resizer_elem = $('#sidebar_resizer', context);
         this.collapse_elem = $('#sidebar_collapse', context);
 

src/cone/app/browser/static/cone/cone.app.protected.js

@@ -225,7 +225,7 @@ var cone_app_protected = (function (exports, $, ts) {
             switch (e.keyCode || e.which) {
                 case 16:
                     keys.shift_down = false;
-                       break;
+                    break;
                 case 17:
                     keys.ctrl_down = false;
                     break;
@@ -764,11 +764,15 @@ var cone_app_protected = (function (exports, $, ts) {
 
     class Sidebar extends ts.Motion {
         static initialize(context) {
-            new Sidebar(context);
+            const elem = ts.query_elem('#sidebar_left', context);
+            if (!elem) {
+                return;
+            }
+            new Sidebar(context, elem);
         }
-        constructor(context) {
+        constructor(context, elem) {
             super();
-            this.elem = $('#sidebar_left', context);
+            this.elem = elem;
             this.resizer_elem = $('#sidebar_resizer', context);
             this.collapse_elem = $('#sidebar_collapse', context);
             this.on_click = this.on_click.bind(this);
@@ -821,8 +825,8 @@ var cone_app_protected = (function (exports, $, ts) {
 
     class PersonalTools extends ts.Events {
         static initialize(context) {
-            const elem = $('#header-main', context);
-            if (!elem.length) {
+            const elem = ts.query_elem('#header-main', context);
+            if (!elem) {
                 return;
             }
             new PersonalTools(elem);

src/cone/app/browser/static/cone/cone.app.public.js

@@ -3,8 +3,8 @@ var cone_app_public = (function (exports, $, ts) {
 
     class LiveSearch {
         static initialize(context, factory=null) {
-            let elem = $('input#search-text', context);
-            if (!elem.length) {
+            const elem = ts.query_elem('input#search-text', context);
+            if (!elem) {
                 return;
             }
             if (factory === null) {