update core js to be consistent with the latest gh-pages

js/app/constructor.js

@@ -3,21 +3,15 @@
 const Editor = require('../editor');
 const TracerManager = require('../tracer_manager');
 const DOM = require('../dom/setup');
-const {
-  getFileDir
-} = require('../utils');
 
 const Cache = require('./cache');
 
-const {
-  each
-} = $;
-
 const state = {
   isLoading: null,
   editor: null,
   tracerManager: null,
-  categories: null
+  categories: null,
+  loadedScratch: null
 };
 
 const initState = (tracerManager) => {
@@ -25,12 +19,13 @@ const initState = (tracerManager) => {
   state.editor = new Editor(tracerManager);
   state.tracerManager = tracerManager;
   state.categories = {};
+  state.loadedScratch = null;
 };
 
 /**
  * Global application singleton.
  */
-const App = function() {
+const App = function () {
 
   this.getIsLoading = () => {
     return state.isLoading;
@@ -69,6 +64,14 @@ const App = function() {
     return state.tracerManager;
   };
 
+  this.getLoadedScratch = () => {
+    return state.loadedScratch;
+  };
+
+  this.setLoadedScratch = (loadedScratch) => {
+    state.loadedScratch = loadedScratch;
+  };
+
   const tracerManager = TracerManager.init();
 
   initState(tracerManager);

js/dom/show_categories.js → js/dom/add_categories.js

 'use strict';
 
-const appInstance = require('../app');
+const app = require('../app');
 const Server = require('../server');
 const showAlgorithm = require('./show_algorithm');
 
@@ -13,7 +13,7 @@ const addAlgorithmToCategoryDOM = (category, subList, algorithm) => {
     .append(subList[algorithm])
     .attr('data-algorithm', algorithm)
     .attr('data-category', category)
-    .click(function() {
+    .click(function () {
       Server.loadAlgorithm(category, algorithm).then((data) => {
         showAlgorithm(category, algorithm, data);
       });
@@ -27,14 +27,15 @@ const addCategoryToDOM = (category) => {
   const {
     name: categoryName,
     list: categorySubList
-  } = appInstance.getCategory(category);
+  } = app.getCategory(category);
 
   const $category = $('<button class="category">')
     .append('<i class="fa fa-fw fa-caret-right">')
-    .append(categoryName);
+    .append(categoryName)
+    .attr('data-category', category);
 
-  $category.click(function() {
-    $(`[data-category="${category}"]`).toggleClass('collapse');
+  $category.click(function () {
+    $(`.indent[data-category="${category}"]`).toggleClass('collapse');
     $(this).find('i.fa').toggleClass('fa-caret-right fa-caret-down');
   });
 
@@ -46,5 +47,5 @@ const addCategoryToDOM = (category) => {
 };
 
 module.exports = () => {
-  each(appInstance.getCategories(), addCategoryToDOM);
+  each(app.getCategories(), addCategoryToDOM);
 };
\ No newline at end of file

js/dom/show_files.js → js/dom/add_files.js

@@ -7,21 +7,26 @@ const {
 } = $;
 
 const addFileToDOM = (category, algorithm, file, explanation) => {
-  var $file = $('<button>').append(file).click(function() {
-    Server.loadFile(category, algorithm, file, explanation);
-    $('.files_bar > .wrapper > button').removeClass('active');
-    $(this).addClass('active');
-  });
+  var $file = $('<button>')
+    .append(file)
+    .attr('data-file', file)
+    .click(function () {
+      Server.loadFile(category, algorithm, file, explanation);
+      $('.files_bar > .wrapper > button').removeClass('active');
+      $(this).addClass('active');
+    });
   $('.files_bar > .wrapper').append($file);
+  return $file;
 };
 
-module.exports = (category, algorithm, files) => {
+module.exports = (category, algorithm, files, requestedFile) => {
   $('.files_bar > .wrapper').empty();
 
   each(files, (file, explanation) => {
-    addFileToDOM(category, algorithm, file, explanation);
+    var $file = addFileToDOM(category, algorithm, file, explanation);
+    if (requestedFile && requestedFile == file) $file.click();
   });
 
-  $('.files_bar > .wrapper > button').first().click();
+  if (!requestedFile) $('.files_bar > .wrapper > button').first().click();
   $('.files_bar > .wrapper').scroll();
 };
\ No newline at end of file

js/dom/index.js

 'use strict';
 
 const showAlgorithm = require('./show_algorithm');
-const showCategories = require('./show_categories');
+const addCategories = require('./add_categories');
 const showDescription = require('./show_description');
-const showFiles = require('./show_files');
+const addFiles = require('./add_files');
 const showFirstAlgorithm = require('./show_first_algorithm');
+const showRequestedAlgorithm = require('./show_requested_algorithm');
 
 module.exports = {
   showAlgorithm,
-  showCategories,
+  addCategories,
   showDescription,
-  showFiles,
-  showFirstAlgorithm
+  addFiles,
+  showFirstAlgorithm,
+  showRequestedAlgorithm
 };
\ No newline at end of file

js/dom/setup/setup_dividers.js

-const appInstance = require('../../app');
+const app = require('../../app');
 
 const addDividerToDom = (divider) => {
   const [vertical, $first, $second] = divider;
@@ -37,7 +37,7 @@ const addDividerToDom = (divider) => {
         $first.css('right', (100 - percent) + '%');
         $second.css('left', percent + '%');
         x = pageX;
-        appInstance.getTracerManager().resize();
+        app.getTracerManager().resize();
         $('.files_bar > .wrapper').scroll();
       }
     });
@@ -75,7 +75,7 @@ const addDividerToDom = (divider) => {
         $first.css('bottom', (100 - percent) + '%');
         $second.css('top', percent + '%');
         y = pageY;
-        appInstance.getTracerManager().resize();
+        app.getTracerManager().resize();
       }
     });
 

js/dom/setup/setup_document.js

-const appInstance = require('../../app');
+const app = require('../../app');
 
 module.exports = () => {
   $(document).on('click', 'a', (e) => {
@@ -10,6 +10,6 @@ module.exports = () => {
   });
 
   $(document).mouseup(function(e) {
-    appInstance.getTracerManager().command('mouseup', e);
+    app.getTracerManager().command('mouseup', e);
   });
 };
\ No newline at end of file

js/dom/setup/setup_interval.js

-const appInstance = require('../../app');
+const app = require('../../app');
 const Toast = require('../toast');
 
 const {
@@ -40,7 +40,7 @@ module.exports = () => {
   });
 
   $('#interval').on('change', function() {
-    const tracerManager = appInstance.getTracerManager();
+    const tracerManager = app.getTracerManager();
     const [seconds, message] = normalize(parseFloat($(this).val()));
 
     $(this).val(seconds);

js/dom/setup/setup_module_container.js

-const appInstance = require('../../app');
+const app = require('../../app');
 
 module.exports = () => {
 
   const $module_container = $('.module_container');
 
   $module_container.on('mousedown', '.module_wrapper', function(e) {
-    appInstance.getTracerManager().findOwner(this).mousedown(e);
+    app.getTracerManager().findOwner(this).mousedown(e);
   });
 
   $module_container.on('mousemove', '.module_wrapper', function(e) {
-    appInstance.getTracerManager().findOwner(this).mousemove(e);
+    app.getTracerManager().findOwner(this).mousemove(e);
   });
 
   $module_container.on('DOMMouseScroll mousewheel', '.module_wrapper', function(e) {
-    appInstance.getTracerManager().findOwner(this).mousewheel(e);
+    app.getTracerManager().findOwner(this).mousewheel(e);
   });
 }
\ No newline at end of file

js/dom/setup/setup_scratch_paper.js

+const app = require('../../app');
 const Server = require('../../server');
 const showAlgorithm = require('../show_algorithm');
 
 module.exports = () => {
   $('#scratch-paper').click(function() {
-    const category = null;
-    const algorithm = 'scratch_paper';
+    const category = 'scratch';
+    const algorithm = app.getLoadedScratch();
     Server.loadAlgorithm(category, algorithm).then((data) => {
       showAlgorithm(category, algorithm, data);
     });

js/dom/setup/setup_side_menu.js

-const appInstance = require('../../app');
+const app = require('../../app');
 
 let sidemenu_percent;
 
@@ -20,6 +20,6 @@ module.exports = () => {
       $workspace.css('left', 0);
     }
 
-    appInstance.getTracerManager().resize();
+    app.getTracerManager().resize();
   });
 }
\ No newline at end of file

js/dom/setup/setup_top_menu.js

-const appInstance = require('../../app');
+const app = require('../../app');
 const Server = require('../../server');
 const Toast = require('../toast');
 
@@ -26,26 +26,26 @@ module.exports = () => {
 
   $('#btn_run').click(() => {
     $('#btn_trace').click();
-    var err = appInstance.getEditor().execute();
+    var err = app.getEditor().execute();
     if (err) {
       console.error(err);
       Toast.showErrorToast(err);
     }
   });
   $('#btn_pause').click(function() {
-    if (appInstance.getTracerManager().isPause()) {
-      appInstance.getTracerManager().resumeStep();
+    if (app.getTracerManager().isPause()) {
+      app.getTracerManager().resumeStep();
     } else {
-      appInstance.getTracerManager().pauseStep();
+      app.getTracerManager().pauseStep();
     }
   });
   $('#btn_prev').click(() => {
-    appInstance.getTracerManager().pauseStep();
-    appInstance.getTracerManager().prevStep();
+    app.getTracerManager().pauseStep();
+    app.getTracerManager().prevStep();
   });
   $('#btn_next').click(() => {
-    appInstance.getTracerManager().pauseStep();
-    appInstance.getTracerManager().nextStep();
+    app.getTracerManager().pauseStep();
+    app.getTracerManager().nextStep();
   });
 
   // description & trace

js/dom/setup/setup_window.js

-const appInstance = require('../../app');
+const app = require('../../app');
 
 module.exports = function() {
   $(window).resize(function() {
-    appInstance.getTracerManager().resize();
+    app.getTracerManager().resize();
   });
 };
\ No newline at end of file

js/dom/show_algorithm.js

 'use strict';
 
-const appInstance = require('../app');
+const app = require('../app');
+
 const {
   isScratchPaper
 } = require('../utils');
 
 const showDescription = require('./show_description');
-const showFiles = require('./show_files');
-
+const addFiles = require('./add_files');
 
-module.exports = (category, algorithm, data) => {
+module.exports = (category, algorithm, data, requestedFile) => {
   let $menu;
   let category_name;
   let algorithm_name;
 
-  if (isScratchPaper(category, algorithm)) {
+  if (isScratchPaper(category)) {
     $menu = $('#scratch-paper');
-    category_name = '';
-    algorithm_name = 'Scratch Paper';
+    category_name = 'Scratch Paper';
+    algorithm_name = algorithm ? 'Shared' : 'Temporary';
   } else {
     $menu = $(`[data-category="${category}"][data-algorithm="${algorithm}"]`);
-    const categoryObj = appInstance.getCategory(category);
+    const categoryObj = app.getCategory(category);
     category_name = categoryObj.name;
     algorithm_name = categoryObj.list[algorithm];
   }
 
   $('.sidemenu button').removeClass('active');
   $menu.addClass('active');
-  $('#btn_desc').click();
 
   $('#category').html(category_name);
   $('#algorithm').html(algorithm_name);
@@ -35,8 +34,8 @@ module.exports = (category, algorithm, data) => {
   $('.files_bar > .wrapper').empty();
   $('#explanation').html('');
 
-  appInstance.setLastFileUsed(null);
-  appInstance.getEditor().clearContent();
+  app.setLastFileUsed(null);
+  app.getEditor().clearContent();
 
   const {
     files
@@ -45,5 +44,5 @@ module.exports = (category, algorithm, data) => {
   delete data.files;
 
   showDescription(data);
-  showFiles(category, algorithm, files);
+  addFiles(category, algorithm, files, requestedFile);
 };
\ No newline at end of file

js/dom/show_requested_algorithm.js

+'use strict';
+
+const Server = require('../server');
+const showAlgorithm = require('./show_algorithm');
+
+module.exports = (category, algorithm, file) => {
+  $(`.category[data-category="${category}"]`).click();
+  Server.loadAlgorithm(category, algorithm).then((data) => {
+    showAlgorithm(category, algorithm, data, file);
+  });
+};

js/editor/index.js

 'use strict';
 
-const appInstance = require('../app');
+const app = require('../app');
 const createEditor = require('./create');
 const Executor = require('./executor');
 
@@ -57,9 +57,9 @@ function Editor(tracerManager) {
 
   this.dataEditor.on('change', () => {
     const data = this.dataEditor.getValue();
-    const lastFileUsed = appInstance.getLastFileUsed();
+    const lastFileUsed = app.getLastFileUsed();
     if (lastFileUsed) {
-      appInstance.updateCachedFile(lastFileUsed, {
+      app.updateCachedFile(lastFileUsed, {
         data
       });
     }
@@ -68,9 +68,9 @@ function Editor(tracerManager) {
 
   this.codeEditor.on('change', () => {
     const code = this.codeEditor.getValue();
-    const lastFileUsed = appInstance.getLastFileUsed();
+    const lastFileUsed = app.getLastFileUsed();
     if (lastFileUsed) {
-      appInstance.updateCachedFile(lastFileUsed, {
+      app.updateCachedFile(lastFileUsed, {
         code
       });
     }

js/index.js

@@ -5,7 +5,6 @@ const appInstance = require('./app');
 const AppConstructor = require('./app/constructor');
 const DOM = require('./dom');
 const Server = require('./server');
-const Helpers = require('./server/helpers');
 
 const modules = require('./module');
 
@@ -18,8 +17,16 @@ $.ajaxSetup({
   dataType: 'text'
 });
 
+const {
+  isScratchPaper
+} = require('./utils');
+
+const {
+  getPath
+} = require('./server/helpers');
+
 // set global promise error handler
-RSVP.on('error', function(reason) {
+RSVP.on('error', function (reason) {
   console.assert(false, reason);
 });
 
@@ -34,19 +41,27 @@ $(() => {
 
   Server.loadCategories().then((data) => {
     appInstance.setCategories(data);
-    DOM.showCategories();
+    DOM.addCategories();
 
     // determine if the app is loading a pre-existing scratch-pad
     // or the home page
-    const gistID = Helpers.getParameterByName('scratch-paper');
-    if (gistID) {
-      Server.loadScratchPaper(gistID).then(({
-        category,
-        algorithm,
-        data
-      }) => {
-        DOM.showAlgorithm(category, algorithm, data);
-      });
+    const {
+      category,
+      algorithm,
+      file
+    } = getPath();
+    if (isScratchPaper(category)) {
+      if (algorithm) {
+        Server.loadScratchPaper(algorithm).then(({category, algorithm, data}) => {
+          DOM.showAlgorithm(category, algorithm, data);
+        });
+      } else {
+        Server.loadAlgorithm(category).then((data) => {
+          DOM.showAlgorithm(category, null, data);
+        });
+      }
+    } else if (category && algorithm) {
+      DOM.showRequestedAlgorithm(category, algorithm, file);
     } else {
       DOM.showFirstAlgorithm();
     }

js/server/ajax/request.js

 'use strict';
 
 const RSVP = require('rsvp');
-const appInstance = require('../../app');
+const app = require('../../app');
 
 const {
   ajax,
@@ -13,16 +13,16 @@ const defaults = {
 };
 
 module.exports = function(url, options = {}) {
-  appInstance.setIsLoading(true);
+  app.setIsLoading(true);
 
   return new RSVP.Promise((resolve, reject) => {
     const callbacks = {
       success(response) {
-        appInstance.setIsLoading(false);
+        app.setIsLoading(false);
         resolve(response);
       },
       error(reason) {
-        appInstance.setIsLoading(false);
+        app.setIsLoading(false);
         reject(reason);
       }
     };

js/server/helpers.js

 'use strict';
 
-const appInstance = require('../app');
+const app = require('../app');
 const Toast = require('../dom/toast');
 
 const checkLoading = () => {
-  if (appInstance.getIsLoading()) {
+  if (app.getIsLoading()) {
     Toast.showErrorToast('Wait until it completes loading of previous file.');
     return true;
   }
@@ -13,7 +13,6 @@ const checkLoading = () => {
 
 const getParameterByName = (name) => {
   const url = window.location.href;
-  const cleanName = name.replace(/[\[\]]/g, '\\$&');
   const regex = new RegExp(`[?&]${name}(=([^&#]*)|&|#|$)`);
 
   const results = regex.exec(url);
@@ -27,7 +26,79 @@ const getParameterByName = (name) => {
   return id;
 };
 
+const getHashValue = (key)=> {
+  if (!key) return null;
+  const hash = window.location.hash.substr(1);
+  const params = hash ? hash.split('&') : [];
+  for (let i = 0; i < params.length; i++) {
+    const pair = params[i].split('=');
+    if (pair[0] === key) {
+      return pair[1];
+    }
+  }
+  return null;
+};
+
+const setHashValue = (key, value)=> {
+  if (!key || !value) return;
+  const hash = window.location.hash.substr(1);
+  const params = hash ? hash.split('&') : [];
+
+  let found = false;
+  for (let i = 0; i < params.length && !found; i++) {
+    const pair = params[i].split('=');
+    if (pair[0] === key) {
+      pair[1] = value;
+      params[i] = pair.join('=');
+      found = true;
+    }
+  }
+  if (!found) {
+    params.push([key, value].join('='));
+  }
+
+  const newHash = params.join('&');
+  window.location.hash = '#' + newHash;
+};
+
+const removeHashValue = (key) => {
+  if (!key) return;
+  const hash = window.location.hash.substr(1);
+  const params = hash ? hash.split('&') : [];
+
+  for (let i = 0; i < params.length; i++) {
+    const pair = params[i].split('=');
+    if (pair[0] === key) {
+      params.splice(i, 1);
+      break;
+    }
+  }
+
+  const newHash = params.join('&');
+  window.location.hash = '#' + newHash;
+};
+
+const setPath = (category, algorithm, file) => {
+  const path = category ? category + (algorithm ? '/' + algorithm + (file ? '/' + file : '') : '') : '';
+  setHashValue('path', path);
+};
+
+const getPath = () => {
+  const hash = getHashValue('path');
+  if (hash) {
+    const parts = hash.split('/');
+    return {category: parts[0], algorithm: parts[1], file: parts[2]};
+  } else {
+    return false;
+  }
+};
+
 module.exports = {
   checkLoading,
-  getParameterByName
+  getParameterByName,
+  getHashValue,
+  setHashValue,
+  removeHashValue,
+  setPath,
+  getPath
 };
\ No newline at end of file

js/server/load_algorithm.js

 'use strict';
 
-const Utils = require('../utils');
 const getJSON = require('./ajax/get_json');
 
+const {
+  getAlgorithmDir
+} = require('../utils');
+
 module.exports = (category, algorithm) => {
-  const dir = Utils.getAlgorithmDir(category, algorithm);
+  const dir = getAlgorithmDir(category, algorithm);
   return getJSON(`${dir}desc.json`);
 };
\ No newline at end of file

js/server/load_categories.js

 'use strict';
 
-const appInstance = require('../app');
 const getJSON = require('./ajax/get_json');
 
 module.exports = () => {

js/server/load_file.js

@@ -2,11 +2,16 @@
 
 const RSVP = require('rsvp');
 
-const appInstance = require('../app');
-const Utils = require('../utils');
+const app = require('../app');
 
 const {
-  checkLoading
+  getFileDir,
+  isScratchPaper
+} = require('../utils');
+
+const {
+  checkLoading,
+  setPath
 } = require('./helpers');
 
 const get = require('./ajax/get');
@@ -19,11 +24,11 @@ const loadDataAndCode = (dir) => {
 };
 
 const loadFileAndUpdateContent = (dir) => {
-  appInstance.getEditor().clearContent();
+  app.getEditor().clearContent();
 
   return loadDataAndCode(dir).then((content) => {
-    appInstance.updateCachedFile(dir, content);
-    appInstance.getEditor().setContent(content);
+    app.updateCachedFile(dir, content);
+    app.getEditor().setContent(content);
   });
 };
 
@@ -35,18 +40,22 @@ const cachedContentExists = (cachedFile) => {
 
 module.exports = (category, algorithm, file, explanation) => {
   return new RSVP.Promise((resolve, reject) => {
-
     if (checkLoading()) {
       reject();
     } else {
+      if (isScratchPaper(category)) {
+        setPath(category, app.getLoadedScratch());
+      } else {
+        setPath(category, algorithm, file);
+      }
       $('#explanation').html(explanation);
 
-      let dir = Utils.getFileDir(category, algorithm, file);
-      appInstance.setLastFileUsed(dir);
-      const cachedFile = appInstance.getCachedFile(dir);
+      let dir = getFileDir(category, algorithm, file);
+      app.setLastFileUsed(dir);
+      const cachedFile = app.getCachedFile(dir);
 
       if (cachedContentExists(cachedFile)) {
-        appInstance.getEditor().setContent(cachedFile);
+        app.getEditor().setContent(cachedFile);
         resolve();
       } else {
         loadFileAndUpdateContent(dir).then(resolve, reject);

js/server/load_scratch_paper.js

 'use strict';
 
 const RSVP = require('rsvp');
+const app = require('../app');
 
-const Utils = require('../utils');
-const appInstance = require('../app');
+const {
+  getFileDir
+} = require('../utils');
 
 const getJSON = require('./ajax/get_json');
 const loadAlgorithm = require('./load_algorithm');
@@ -12,12 +14,14 @@ const extractGistCode = (files, name) => files[`${name}.js`].content;
 
 module.exports = (gistID) => {
   return new RSVP.Promise((resolve, reject) => {
+    app.setLoadedScratch(gistID);
+
     getJSON(`https://api.github.com/gists/${gistID}`).then(({
       files
     }) => {
 
-      const algorithm = 'scratch_paper';
-      const category = null;
+      const category = 'scratch';
+      const algorithm = gistID;
 
       loadAlgorithm(category, algorithm).then((data) => {
 
@@ -25,8 +29,8 @@ module.exports = (gistID) => {
         const algoCode = extractGistCode(files, 'code');
 
         // update scratch paper algo code with the loaded gist code
-        const dir = Utils.getFileDir(category, algorithm, 'scratch_paper');
-        appInstance.updateCachedFile(dir, {
+        const dir = getFileDir(category, algorithm, 'scratch_paper');
+        app.updateCachedFile(dir, {
           data: algoData,
           code: algoCode,
           'CREDIT.md': 'Shared by an anonymous user from http://parkjs814.github.io/AlgorithmVisualizer'

js/server/share_scratch_paper.js

 'use strict';
 
 const RSVP = require('rsvp');
-const appInstance = require('../app');
+const app = require('../app');
 
 const postJSON = require('./ajax/post_json');
 
+const {
+  setPath
+} = require('./helpers');
+
 module.exports = () => {
   return new RSVP.Promise((resolve, reject) => {
 
     const {
       dataEditor,
       codeEditor
-    } = appInstance.getEditor();
+    } = app.getEditor();
 
     const gist = {
       'description': 'temp',
@@ -29,15 +33,13 @@ module.exports = () => {
     postJSON('https://api.github.com/gists', gist).then(({
       id
     }) => {
-
+      app.setLoadedScratch(id);
+      setPath('scratch', id);
       const {
-        protocol,
-        host,
-        pathname
+        href
       } = location;
-
-      const url = `${protocol}//${host}${pathname}?scratch-paper=${id}`;
-      resolve(url);
+      $('#algorithm').html('Shared');
+      resolve(href);
     });
   });
 };
\ No newline at end of file

js/utils/index.js

 'use strict';
 
 const isScratchPaper = (category, algorithm) => {
-  return category === null && algorithm === 'scratch_paper';
+  return category == 'scratch';
 };
 
 const getAlgorithmDir = (category, algorithm) => {
-  if (isScratchPaper(category, algorithm)) {
-    return './algorithm/scratch_paper/';
-  }
+  if (isScratchPaper(category)) return './algorithm/scratch_paper/';
   return `./algorithm/${category}/${algorithm}/`;
 };
 
 const getFileDir = (category, algorithm, file) => {
-  if (isScratchPaper(category, algorithm)) {
-    return './algorithm/scratch_paper/';
-  }
-
+  if (isScratchPaper(category)) return './algorithm/scratch_paper/';
   return `./algorithm/${category}/${algorithm}/${file}/`;
 };
 

public/algorithm_visualizer.css

@@ -220,7 +220,7 @@ nav h3 {
     padding: 0 4px;
 }
 
-#category:empty + .nav-arrow {
+#navigation span:empty + .nav-arrow {
     display: none;
 }
 
@@ -324,6 +324,7 @@ section {
     width: 100%;
     height: 100%;
     visibility: hidden;
+    overflow: scroll;
 }
 
 .tab > .wrapper {

public/algorithm_visualizer.min.css

@@ -13,4 +13,4 @@
  * "Fork me on GitHub" CSS ribbon v0.2.0 | MIT License
  * https://github.com/simonwhitaker/github-fork-ribbon-css
 */.github-fork-ribbon{width:12.1em;height:12.1em;position:absolute;overflow:hidden;top:0;right:0;z-index:9999;pointer-events:none;font-size:13px;text-decoration:none;text-indent:-999999px}.github-fork-ribbon.fixed{position:fixed}.github-fork-ribbon:after,.github-fork-ribbon:before{position:absolute;display:block;width:15.38em;height:1.54em;top:3.23em;right:-3.23em;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.github-fork-ribbon:before{content:"";padding:.38em 0;background-color:#a00;background-image:-webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,0)),to(rgba(0,0,0,.15)));background-image:-webkit-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,.15));background-image:linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,.15));box-shadow:0 .15em .23em 0 rgba(0,0,0,.5);pointer-events:auto}.github-fork-ribbon:after{content:attr(title);color:#fff;font:700 1em "Helvetica Neue",Helvetica,Arial,sans-serif;line-height:1.54em;text-decoration:none;text-shadow:0 -.08em rgba(0,0,0,.5);text-align:center;text-indent:0;padding:.15em 0;margin:.15em 0;border-width:.08em 0;border-style:dotted;border-color:#fff;border-color:rgba(255,255,255,.7)}.github-fork-ribbon.left-bottom,.github-fork-ribbon.left-top{right:auto;left:0}.github-fork-ribbon.left-bottom,.github-fork-ribbon.right-bottom{top:auto;bottom:0}.github-fork-ribbon.left-bottom:after,.github-fork-ribbon.left-bottom:before,.github-fork-ribbon.left-top:after,.github-fork-ribbon.left-top:before{right:auto;left:-3.23em}.github-fork-ribbon.left-bottom:after,.github-fork-ribbon.left-bottom:before,.github-fork-ribbon.right-bottom:after,.github-fork-ribbon.right-bottom:before{top:auto;bottom:3.23em}.github-fork-ribbon.left-top:after,.github-fork-ribbon.left-top:before,.github-fork-ribbon.right-bottom:after,.github-fork-ribbon.right-bottom:before{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}
-#explanation,.btn,button{white-space:nowrap;text-overflow:ellipsis}.tab>.wrapper,nav,pre,section{box-sizing:border-box}.btn,button,pre{margin:0;outline:0}body,html{margin:0;padding:0;overflow:hidden}body{background:#3f3f3f;font-family:Roboto,sans-serif;color:#bbb;-webkit-font-smoothing:subpixel-antialiased}::-webkit-scrollbar{display:none}a{text-decoration:none}*{color:inherit}:not(input){-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none}.btn{display:inline-table}.btn>.wrapper{display:table-cell;vertical-align:middle}.btn,button{vertical-align:top;border:none;height:100%;padding:0 12px;background:0 0;font-size:12px;overflow:hidden}.btn:hover,button:not([disabled]):hover{background:rgba(0,0,0,.15)!important;cursor:pointer}.btn.active,button.active{background:#262626}.btn input,button input{outline:0;background:rgba(0,0,0,.3);padding:4px;border:none}.divider{position:absolute!important;z-index:3}.tab,.workspace{position:absolute}.divider.vertical{cursor:ew-resize}.divider.horizontal{cursor:ns-resize}nav{height:30px;width:100%;padding:0 16px}nav h3{display:inline}.nav-arrow{padding:0 4px}#category:empty+.nav-arrow{display:none}.buttons{float:right;height:100%}#shared{width:128px}#shared.collapse{display:none}#interval{width:24px;text-align:right}.sidemenu{top:30px;right:85%;visibility:hidden;overflow:scroll;padding-bottom:120px}.sidemenu.active{visibility:visible}.sidemenu #footer{border-top:2px solid #262626}.sidemenu button{display:block;width:100%;height:30px;text-align:left}button.category{background:rgba(0,0,0,.1)}button.indent{padding-left:28px}button.collapse{display:none}.workspace{top:30px;bottom:0;left:15%;right:0}.editor_container,.viewer_container,nav,section{position:absolute;top:0;bottom:0;left:0;right:0}nav,section{border:1px solid #262626}.viewer_container{right:50%}.editor_container{left:50%}.module_container{overflow:hidden;border:none}.tab_container{top:30px}.tab{width:100%;height:100%;visibility:hidden}.tab>.wrapper{padding:16px}.tab.active{visibility:visible}.module_wrapper{overflow:scroll}.module_wrapper .name{position:fixed;z-index:5;padding:4px;font-size:14px;background:rgba(0,0,0,.4)}.module_wrapper>.wrapper{padding:24px 16px;box-sizing:border-box}#tab_desc h3{border-bottom:1px solid #515151;padding:5px;margin:2px}#tab_desc>.wrapper a{text-decoration:underline}.files_bar,.tab_bar{height:30px}.files_bar>*{position:absolute;height:100%}.files_bar>button{width:30px}.files_bar>button:disabled{background:rgba(0,0,0,.15)}.files_bar>.btn-left{left:0}.files_bar>.btn-right{right:0}.files_bar>.wrapper{left:30px;right:30px;overflow:scroll;white-space:nowrap}.files_bar>.wrapper>button{max-width:80%}.files_bar>.wrapper.shadow-left{box-shadow:inset 16px 0 16px -16px rgba(0,0,0,.6)}.files_bar>.wrapper.shadow-right{box-shadow:inset -16px 0 16px -16px rgba(0,0,0,.6)}.files_bar>.wrapper.shadow-left.shadow-right{box-shadow:inset 16px 0 16px -16px rgba(0,0,0,.6),inset -16px 0 16px -16px rgba(0,0,0,.6)}.explanation_container{border:none;top:30px;height:30px;background:#262626;padding:8px;font-size:12px}#explanation:before{font-family:FontAwesome;content:'\f05a\00a0\00a0'}#explanation{display:block;overflow:hidden}.explanation_container:hover{z-index:5;height:auto;bottom:auto;box-shadow:0 8px 8px -8px rgba(0,0,0,.8)}.explanation_container:hover #explanation{white-space:normal}.data_container{top:60px;bottom:60%}.code_container{top:40%}pre{height:100%;width:100%;padding:0;border:1px solid #515151;background:#2b2b2b;resize:none}.toast_container{position:absolute;bottom:0;right:0;padding:12px;z-index:4}.toast{width:280px;border:1px solid;border-radius:4px;padding:16px;margin:16px}.toast.error{border-color:#960000;background:rgba(120,0,0,.8)}.toast.info{border-color:#009600;background:rgba(0,120,0,.8)}.github-fork-ribbon{position:fixed}.github-fork-ribbon.left-bottom:before{background-color:#333}.fa-spin-faster{-webkit-animation:fa-spin 1s infinite ease-in-out;animation:fa-spin 1s infinite ease-in-out}.mtbl-wrapper{width:100%;height:100%}.mtbl-table{display:inline-table;color:#fff;table-layout:fixed}.mtbl-row{display:table-row}.mtbl-col{display:table-cell;vertical-align:middle;text-align:center;background:#888}.mtbl-empty-row{display:table-row;background:#3f3f3f;height:2px}.mtbl-empty-col{display:table-cell;background:#3f3f3f;width:2px}#loading-slider,.line{width:100%;position:absolute}.mtbl-col.selected{background:#00f}.mtbl-col.notified{background:red}#loading-slider{height:2px}#loading-slider.loaded{visibility:hidden}.line{background:#4a8df8;left:0;right:0;top:0;height:3px}.break{position:absolute;background:#222;width:6px;height:2px}.dot1{-webkit-animation:loading 2s infinite;animation:loading 2s infinite}.dot2{-webkit-animation:loading 2s .5s infinite;animation:loading 2s .5s infinite}.dot3{-webkit-animation:loading 2s 1s infinite;animation:loading 2s 1s infinite}@-webkit-keyframes loading{from{left:0}to{left:100%}}@keyframes loading{from{left:0}to{left:100%}}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
\ No newline at end of file
+#explanation,.btn,button{white-space:nowrap;text-overflow:ellipsis}.tab>.wrapper,nav,pre,section{box-sizing:border-box}.btn,button,pre{margin:0;outline:0}body,html{margin:0;padding:0;overflow:hidden}body{background:#3f3f3f;font-family:Roboto,sans-serif;color:#bbb;-webkit-font-smoothing:subpixel-antialiased}::-webkit-scrollbar{display:none}a{text-decoration:none}*{color:inherit}:not(input){-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none}.btn{display:inline-table}.btn>.wrapper{display:table-cell;vertical-align:middle}.btn,button{vertical-align:top;border:none;height:100%;padding:0 12px;background:0 0;font-size:12px;overflow:hidden}.btn:hover,button:not([disabled]):hover{background:rgba(0,0,0,.15)!important;cursor:pointer}.btn.active,button.active{background:#262626}.btn input,button input{outline:0;background:rgba(0,0,0,.3);padding:4px;border:none}.divider{position:absolute!important;z-index:3}.tab,.workspace{position:absolute}.divider.vertical{cursor:ew-resize}.divider.horizontal{cursor:ns-resize}nav{height:30px;width:100%;padding:0 16px}nav h3{display:inline}.nav-arrow{padding:0 4px}#navigation span:empty+.nav-arrow{display:none}.buttons{float:right;height:100%}#shared{width:128px}#shared.collapse{display:none}#interval{width:24px;text-align:right}.sidemenu{top:30px;right:85%;visibility:hidden;overflow:scroll;padding-bottom:120px}.sidemenu.active{visibility:visible}.sidemenu #footer{border-top:2px solid #262626}.sidemenu button{display:block;width:100%;height:30px;text-align:left}button.category{background:rgba(0,0,0,.1)}button.indent{padding-left:28px}button.collapse{display:none}.workspace{top:30px;bottom:0;left:15%;right:0}.editor_container,.viewer_container,nav,section{position:absolute;top:0;bottom:0;left:0;right:0}nav,section{border:1px solid #262626}.viewer_container{right:50%}.editor_container{left:50%}.module_container{overflow:hidden;border:none}.module_wrapper,.tab{overflow:scroll}.tab_container{top:30px}.tab{width:100%;height:100%;visibility:hidden}.tab>.wrapper{padding:16px}.tab.active{visibility:visible}.module_wrapper .name{position:fixed;z-index:5;padding:4px;font-size:14px;background:rgba(0,0,0,.4)}.module_wrapper>.wrapper{padding:24px 16px;box-sizing:border-box}#tab_desc h3{border-bottom:1px solid #515151;padding:5px;margin:2px}#tab_desc>.wrapper a{text-decoration:underline}.files_bar,.tab_bar{height:30px}.files_bar>*{position:absolute;height:100%}.files_bar>button{width:30px}.files_bar>button:disabled{background:rgba(0,0,0,.15)}.files_bar>.btn-left{left:0}.files_bar>.btn-right{right:0}.files_bar>.wrapper{left:30px;right:30px;overflow:scroll;white-space:nowrap}.files_bar>.wrapper>button{max-width:80%}.files_bar>.wrapper.shadow-left{box-shadow:inset 16px 0 16px -16px rgba(0,0,0,.6)}.files_bar>.wrapper.shadow-right{box-shadow:inset -16px 0 16px -16px rgba(0,0,0,.6)}.files_bar>.wrapper.shadow-left.shadow-right{box-shadow:inset 16px 0 16px -16px rgba(0,0,0,.6),inset -16px 0 16px -16px rgba(0,0,0,.6)}.explanation_container{border:none;top:30px;height:30px;background:#262626;padding:8px;font-size:12px}#explanation:before{font-family:FontAwesome;content:'\f05a\00a0\00a0'}#explanation{display:block;overflow:hidden}.explanation_container:hover{z-index:5;height:auto;bottom:auto;box-shadow:0 8px 8px -8px rgba(0,0,0,.8)}.explanation_container:hover #explanation{white-space:normal}.data_container{top:60px;bottom:60%}.code_container{top:40%}pre{height:100%;width:100%;padding:0;border:1px solid #515151;background:#2b2b2b;resize:none}.toast_container{position:absolute;bottom:0;right:0;padding:12px;z-index:4}.toast{width:280px;border:1px solid;border-radius:4px;padding:16px;margin:16px}.toast.error{border-color:#960000;background:rgba(120,0,0,.8)}.toast.info{border-color:#009600;background:rgba(0,120,0,.8)}.github-fork-ribbon{position:fixed}.github-fork-ribbon.left-bottom:before{background-color:#333}.fa-spin-faster{-webkit-animation:fa-spin 1s infinite ease-in-out;animation:fa-spin 1s infinite ease-in-out}.mtbl-wrapper{width:100%;height:100%}.mtbl-table{display:inline-table;color:#fff;table-layout:fixed}.mtbl-row{display:table-row}.mtbl-col{display:table-cell;vertical-align:middle;text-align:center;background:#888}.mtbl-empty-row{display:table-row;background:#3f3f3f;height:2px}.mtbl-empty-col{display:table-cell;background:#3f3f3f;width:2px}#loading-slider,.line{width:100%;position:absolute}.mtbl-col.selected{background:#00f}.mtbl-col.notified{background:red}#loading-slider{height:2px}#loading-slider.loaded{visibility:hidden}.line{background:#4a8df8;left:0;right:0;top:0;height:3px}.break{position:absolute;background:#222;width:6px;height:2px}.dot1{-webkit-animation:loading 2s infinite;animation:loading 2s infinite}.dot2{-webkit-animation:loading 2s .5s infinite;animation:loading 2s .5s infinite}.dot3{-webkit-animation:loading 2s 1s infinite;animation:loading 2s 1s infinite}@-webkit-keyframes loading{from{left:0}to{left:100%}}@keyframes loading{from{left:0}to{left:100%}}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
\ No newline at end of file