Move toolbar buttons to their own files

The toolbar gets wired with its buttons during the
creation of the extended Prism object.

src/js/prism/edit.js

@@ -0,0 +1,60 @@
+var secret;
+var secretTimeout;
+
+getSecret();
+
+/**
+ * Re-get the secret when it was added later on.
+ */
+function getSecret() {
+    if (window.self === window.top || !!secret) {
+        return;
+    }
+
+    secret = window.location.hash.replace(/.*secret=([\d\w]{10}).*/, '$1');
+
+    clearTimeout(secretTimeout);
+
+    secretTimeout = setTimeout(function () {
+        getSecret();
+    }, 100);
+}
+
+/**
+ * Registers the edit button with the toolbar.
+ *
+ * @param env
+ * @returns {Element}
+ */
+exports.button = function(env) {
+    var pre = env.element.parentElement;
+
+    if (!pre.hasAttribute('data-edit-url')) {
+        return;
+    }
+
+    var url = pre.getAttribute('data-edit-url');
+
+    var editBtn = document.createElement('a');
+    editBtn.innerHTML = 'Edit';
+
+    editBtn.addEventListener('click', function () {
+        sendEmbedMessage('link', url);
+    });
+
+    return editBtn;
+};
+
+/**
+ * Sends a formatted message to the parent window.
+ *
+ * @param {string} message - Message name.
+ * @param {mixed} value - Data to send.
+ */
+function sendEmbedMessage(message, value) {
+    window.parent.postMessage({
+        message: message,
+        value: value,
+        secret: secret
+    }, '*');
+}

src/js/prism/filename.js

@@ -0,0 +1,12 @@
+exports.button = function(env) {
+    var filename = document.createElement('span');
+    var pre = env.element.parentElement;
+
+    if (!pre.hasAttribute('data-filename')) {
+        return;
+    }
+
+    filename.innerHTML = pre.getAttribute('data-filename');
+
+    return filename;
+};

src/js/prism/index.js

@@ -1,11 +1,34 @@
-var Prism = require('./compiled');
+/**
+ * Load our dependencies.
+ */
 var extend = require('lodash.assign');
 
+/**
+ * Import Prism and its autoloader.
+ */
+var Prism = require('prismjs/components/prism-core');
+require('prismjs/plugins/autoloader/prism-autoloader');
+// Prism highlights automatically by default.
+document.removeEventListener('DOMContentLoaded', Prism.highlightAll);
 
+/**
+ * Register the toolbar and its buttons.
+ */
+var toolbar = require('./toolbar');
 
+var edit = require('./edit');
+toolbar.registerButton(edit.button);
 
+var clipboard = require('./clipboard');
+toolbar.registerButton(clipboard.button);
 
+var filename = require('./filename');
+toolbar.registerButton(filename.button);
 
+/**
+ * Register the toolbar with Prism.
+ */
+Prism.hooks.add('after-highlight', toolbar.hook);
 
 var api = {};
 
@@ -17,4 +40,7 @@ var pluginloader = require('./pluginloader');
 
 extend(api, Prism, themeloader, pluginloader);
 
+/**
+ * Exports!
+ */
 module.exports = api;

src/js/web.js

@@ -1,103 +1,26 @@
 var Prism = require('./prism');
 var Plite = require('plite');
-var toolbar = require('./prism/toolbar');
-var clipboard =require('./prism/clipboard');
 var forOwn = require('lodash.forown');
 
-var secret, secretTimeout;
+/**
+ * Configure Prism.
+ */
+Prism.plugins.autoloader.languages_path = Gistpen_Settings.url + 'assets/js/';
+Prism.setDebug("1" === Gistpen_Settings.debug);
 
+var showInvisibles = false;
 var promises = [];
 
 promises.push(Prism.loadTheme(Gistpen_Settings.prism.theme));
-promises.push(Prism.loadPlugin('toolbar'));
-
-toolbar.registerButton(function(env) {
-    var pre = env.element.parentElement;
-
-    if (!pre.hasAttribute('data-edit-url')) {
-        return;
-    }
-
-    var url = pre.getAttribute('data-edit-url');
-
-    var editBtn = document.createElement('a');
-    editBtn.innerHTML = 'Edit';
-
-    editBtn.addEventListener('click', function () {
-        sendEmbedMessage('link', url);
-    });
-
-    return editBtn;
-});
-
-toolbar.registerButton(clipboard.button);
 
 forOwn(Gistpen_Settings.prism.plugins, function(props, plugin) {
     if (props.enabled) {
         promises.push(Prism.loadPlugin(plugin));
     }
 });
 
-toolbar.registerButton(function(env) {
-    var filename = document.createElement('span');
-    var pre = env.element.parentElement;
-
-    if (!pre.hasAttribute('data-filename')) {
-        return;
-    }
-
-    filename.innerHTML = pre.getAttribute('data-filename');
-
-    return filename;
-});
-
-Prism.hooks.add('after-highlight', toolbar.hook);
-
-getSecret();
-
 Plite.all(promises)
     .then(Prism.highlightAll)
     .catch(function(err) {
         console.error(err);
     });
-
-/**
- * WordPress-borrowed functions.
- *
- * @todo Is there a better way to hook into this?
- * The link tag doesn't exist on page load for us,
- * so the WP oembed script doesn't grab it and add
- * the click handler for us. We're simply copying
- * functions for reuse.
- */
-
-/**
- * Sends a formatted message to the parent window.
- *
- * @param {string} message - Message name.
- * @param {mixed} value - Data to send.
- */
-function sendEmbedMessage(message, value) {
-    window.parent.postMessage({
-        message: message,
-        value: value,
-        secret: secret
-    }, '*');
-}
-
-/**
- * Re-get the secret when it was added later on.
- */
-function getSecret() {
-    if (window.self === window.top || !!secret) {
-        return;
-    }
-
-    secret = window.location.hash.replace(/.*secret=([\d\w]{10}).*/, '$1');
-
-    clearTimeout(secretTimeout);
-
-    secretTimeout = setTimeout(function () {
-        getSecret();
-    }, 100);
-}