saner separation of concerns for root element

ShMcK · ShMcK · commit 9f09ff5ba7b7 · 2016-03-17T14:17:38.000-07:00
diff --git a/lib/atom/main.js b/lib/atom/main.js
@@ -19,7 +19,7 @@ var Main = (function () {
             item: this.root,
             priority: 0
         });
-        subscriptions_1.onActivateSubscriptions();
+        subscriptions_1.onActivate();
         render_1.render(this.root);
     };
     Main.prototype.consumeStatusBar = function (statusBar) {
@@ -30,7 +30,7 @@ var Main = (function () {
             this.statusBarTile.destroy();
             this.statusBarTile = null;
         }
-        subscriptions_1.onDeactivateSubscriptionsAndUnmount();
+        subscriptions_1.onDeactivate();
     };
     Main.prototype.toggle = function () {
         render_1.togglePanel();
diff --git a/lib/atom/subscriptions.js b/lib/atom/subscriptions.js
@@ -4,7 +4,7 @@ var store_1 = require('../store/store');
 var Action = require('../actions/actions');
 var render_1 = require('../components/render');
 var subscriptions = null;
-function onActivateSubscriptions() {
+function onActivate() {
     subscriptions = new CompositeDisposable;
     subscriptions.add(atom.commands.add('atom-workspace', {
         'cr-viewer:toggle': render_1.togglePanel
@@ -23,13 +23,13 @@ function onActivateSubscriptions() {
     }));
     return subscriptions;
 }
-exports.onActivateSubscriptions = onActivateSubscriptions;
-function onDeactivateSubscriptionsAndUnmount() {
+exports.onActivate = onActivate;
+function onDeactivate() {
     window.onresize = null;
-    render_1.unmount(document.getElementById('crv'));
+    render_1.unmount();
     subscriptions.dispose();
 }
-exports.onDeactivateSubscriptionsAndUnmount = onDeactivateSubscriptionsAndUnmount;
+exports.onDeactivate = onDeactivate;
 function addToStatusBar(statusBar) {
     var replay = document.createElement('div');
     replay.className = 'cr-alert-replay';
diff --git a/lib/components/render.js b/lib/components/render.js
@@ -5,23 +5,24 @@ var react_redux_1 = require('react-redux');
 var _base_1 = require('../_base');
 var app_1 = require('./app');
 require('./remove-later');
-var rootName = 'crv';
 function render(target) {
     ReactDOM.render(React.createElement(react_redux_1.Provider, {store: _base_1.store}, React.createElement(app_1.default, null)), target);
 }
 exports.render = render;
-function unmount(target) {
-    ReactDOM.unmountComponentAtNode(target);
+var rootName = 'crv';
+var root = null;
+function unmount() {
+    ReactDOM.unmountComponentAtNode(root);
 }
 exports.unmount = unmount;
 function initRoot() {
-    var root = document.createElement('div');
+    root = document.createElement('div');
     root.setAttribute('id', rootName);
     root.hidden = true;
     return root;
 }
 exports.initRoot = initRoot;
 function togglePanel() {
-    document.getElementById(rootName).hidden = !document.getElementById(rootName).hidden;
+    root.hidden = !root.hidden;
 }
 exports.togglePanel = togglePanel;
diff --git a/src/atom/main.ts b/src/atom/main.ts
@@ -2,7 +2,7 @@
 import * as React from 'react';
 import {render, initRoot, togglePanel} from '../components/render';
 import loadPolyfills from '../services/polyfills';
-import {onActivateSubscriptions, onDeactivateSubscriptionsAndUnmount, addToStatusBar} from './subscriptions';
+import {onActivate, onDeactivate, addToStatusBar} from './subscriptions';
 import {setAtomGlobals} from './editor';
 import {verifySetupComplete} from '../services/setup-checks';
 
@@ -24,7 +24,7 @@ class Main {
       item: this.root,
       priority: 0
     });
-    onActivateSubscriptions();
+    onActivate();
     // render React component
     render(this.root);
   }
@@ -38,7 +38,7 @@ class Main {
       this.statusBarTile = null;
     }
     // remove subscriptions & unmount react app
-    onDeactivateSubscriptionsAndUnmount();
+    onDeactivate();
   }
   toggle(): void {
     togglePanel();
diff --git a/src/atom/subscriptions.ts b/src/atom/subscriptions.ts
@@ -5,7 +5,7 @@ import {unmount, togglePanel} from '../components/render';
 
 let subscriptions = null;
 
-export function onActivateSubscriptions() {
+export function onActivate() {
   subscriptions = new CompositeDisposable;
   /**
    * Atom Listeners
@@ -38,11 +38,11 @@ export function onActivateSubscriptions() {
   return subscriptions;
 }
 
-export function onDeactivateSubscriptionsAndUnmount() {
+export function onDeactivate() {
   // unmount React
   // TODO: animate close first
   window.onresize = null;
-  unmount(document.getElementById('crv'));
+  unmount();
   // cleanup subscriptions
   subscriptions.dispose();
 }
diff --git a/src/components/render.tsx b/src/components/render.tsx
@@ -7,8 +7,6 @@ import {store} from '../_base';
 import App from './app';
 import './remove-later';
 
-const rootName = 'crv';
-
 /**
  * Render react component on activate
  */
@@ -21,21 +19,22 @@ export function render(target: HTMLElement) {
   );
 }
 
+const rootName = 'crv';
+var root = null;
+
 /**
  * Unmount React on deactivate
  */
-export function unmount(target: HTMLElement) {
-  ReactDOM.unmountComponentAtNode(target);
+export function unmount() {
+  ReactDOM.unmountComponentAtNode(root);
 }
-
 export function initRoot(): HTMLElement {
-  var root = document.createElement('div');
+  root = document.createElement('div');
   root.setAttribute('id', rootName);
   // mark panel visibility as hidden, triggers immediately
   root.hidden = true;
   return root;
 }
-
 export function togglePanel() {
-  document.getElementById(rootName).hidden = !document.getElementById(rootName).hidden;
+  root.hidden = !root.hidden;
 }
