diff --git a/js/grande.js b/js/grande.js index 4023f79..ce7b81a 100644 --- a/js/grande.js +++ b/js/grande.js @@ -1,39 +1,16 @@ (function() { var root = this, // Root object, this is going to be the window for now document = this.document, // Safely store a document here for us to use - div = document.createElement("div"), - toolbarTemplate = "
\ - \ - \ - \ - \ - \ - \ - \ - \ - \ - \ - \ -
"; - - div.className = "text-menu hide"; - div.innerHTML = toolbarTemplate; - - // If user hasn't provided a .text-menu, insert one into the DOM - if (!document.querySelector(".text-menu")) - document.body.appendChild(div); - - - var editableNodes = document.querySelectorAll(".g-body article"), - textMenu = document.querySelectorAll(".g-body .text-menu")[0], - optionsNode = document.querySelectorAll(".g-body .text-menu .options")[0], - urlInput = document.querySelectorAll(".g-body .text-menu .url-input")[0], + editableNodes = document.querySelectorAll(".g-body article"), isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1, - + textMenu, + optionsNode, + urlInput, previouslySelectedText, grande = { bind: function() { + attachToolbarTemplate(); bindTextSelectionEvents(); bindTextStylingEvents(); }, @@ -51,6 +28,34 @@ "blockquote": "quote" }; + function attachToolbarTemplate() { + var div = document.createElement("div"), + toolbarTemplate = "
\ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ +
"; + + div.className = "text-menu hide"; + div.innerHTML = toolbarTemplate; + + if (document.querySelectorAll(".text-menu").length === 0) { + document.body.appendChild(div); + } + + textMenu = document.querySelectorAll(".text-menu")[0]; + optionsNode = document.querySelectorAll(".text-menu .options")[0]; + urlInput = document.querySelectorAll(".text-menu .url-input")[0]; + } + function bindTextSelectionEvents() { var i, len, @@ -79,7 +84,7 @@ } function iterateTextMenuButtons(callback) { - var textMenuButtons = document.querySelectorAll(".g-body .text-menu button"), + var textMenuButtons = document.querySelectorAll(".text-menu button"), i, len, node; diff --git a/test/grande.html b/test/grande.html index 7f7ace2..ff84187 100644 --- a/test/grande.html +++ b/test/grande.html @@ -9,22 +9,6 @@
-
-
- - - - - - - - - - - -
-
-
diff --git a/test/grande.js b/test/grande.js index 43bc81e..8e2dae8 100644 --- a/test/grande.js +++ b/test/grande.js @@ -64,11 +64,26 @@ test("it should bind to the windows resize event", function() { "window resize should be bound to a function"); }); +test("it should attach the toolbar template to the DOM", function() { + equal(document.querySelectorAll(".text-menu").length, 0, + "text menu should not be defined on the dom"); + + grande.bind(); + + equal(document.querySelectorAll(".text-menu").length, 1, + "text menu should be defined on the dom"); +}); + function unbind() { document.onmousedown = document.onmouseup = document.onkeyup = window.onresize = null; + + var menuEl = document.querySelectorAll(".text-menu"); + if (menuEl.length) { + menuEl[0].parentNode.removeChild(menuEl[0]); + } }