RubyGems - grandejs_rails - Versions diffs - 0.0.1 - Mend

grandejs_rails 0.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (10) hide show

data/.gitignore +17 -0
data/Gemfile +4 -0
data/LICENSE.txt +22 -0
data/README.md +44 -0
data/Rakefile +1 -0
data/app/assets/javascripts/grande.js +445 -0
data/grandejs_rails.gemspec +23 -0
data/lib/grandejs_rails.rb +8 -0
data/lib/grandejs_rails/version.rb +3 -0
metadata +103 -0

data/.gitignore ADDED Viewed

@@ -0,0 +1,17 @@
+*.gem
+*.rbc
+.bundle
+.config
+.yardoc
+Gemfile.lock
+InstalledFiles
+_yardoc
+coverage
+doc/
+lib/bundler/man
+pkg
+rdoc
+spec/reports
+test/tmp
+test/version_tmp
+tmp

data/Gemfile ADDED Viewed

@@ -0,0 +1,4 @@
+source 'https://rubygems.org'
+# Specify your gem's dependencies in grandejs_rails.gemspec
+gemspec

data/LICENSE.txt ADDED Viewed

@@ -0,0 +1,22 @@
+Copyright (c) 2013 Guy Israeli
+MIT License
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

data/README.md ADDED Viewed

@@ -0,0 +1,44 @@
+# GrandejsRails
+Javascript library that implements features from Medium's editing experience.
+see demo here http://mattduvall.com/grande.js/
+## Installation
+Add this line to your application's Gemfile:
+    gem 'grandejs_rails'
+add to js manifest
+    //= require grande
+And then execute:
+    $ bundle
+Or install it yourself as:
+    $ gem install grandejs_rails
+## Usage
+as said in the source - https://github.com/mduvall/grande.js
+    To get up and running simply...
+    Include an <article> with contenteditable
+    Include the grande.js file at the bottom of your <body>
+    Bind the events on the document with grande.init()
+    You are set!
+## Contributing
+1. Fork it
+2. Create your feature branch (`git checkout -b my-new-feature`)
+3. Commit your changes (`git commit -am 'Add some feature'`)
+4. Push to the branch (`git push origin my-new-feature`)
+5. Create new Pull Request

data/Rakefile ADDED Viewed

	@@ -0,0 +1 @@
1	+ require "bundler/gem_tasks"

data/app/assets/javascripts/grande.js ADDED Viewed

@@ -0,0 +1,445 @@
+// grande.js
+// version: 0.0.1
+// Matt DuVall <matt@mattduvall.com>
+// Open source implementation of Medium's UI features
+//     "url": "https://github.com/mduvall/grande.js"
+//
+(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
+      editableNodes = document.querySelectorAll(".g-body article"),
+      isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1,
+      textMenu,
+      optionsNode,
+      urlInput,
+      previouslySelectedText,
+      grande = {
+        bind: function(bindableNodes) {
+          if (bindableNodes) {
+            editableNodes = bindableNodes;
+          }
+          attachToolbarTemplate();
+          bindTextSelectionEvents();
+          bindTextStylingEvents();
+        },
+        select: function() {
+          triggerTextSelection();
+        }
+      },
+      tagClassMap = {
+        "b": "bold",
+        "i": "italic",
+        "h1": "header1",
+        "h2": "header2",
+        "a": "url",
+        "blockquote": "quote"
+      };
+  function attachToolbarTemplate() {
+    var div = document.createElement("div"),
+        toolbarTemplate = "<div class='options'> \
+          <span class='no-overflow'> \
+            <span class='ui-inputs'> \
+              <button class='bold'>B</button> \
+              <button class='italic'>i</button> \
+              <button class='header1'>h1</button> \
+              <button class='header2'>h2</button> \
+              <button class='quote'>&rdquo;</button> \
+              <button class='url useicons'>&#xe001;</button> \
+              <input class='url-input' type='text' placeholder='Paste or type a link'/> \
+            </span> \
+          </span> \
+        </div>";
+    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,
+        node;
+    // Trigger on both mousedown and mouseup so that the click on the menu
+    // feels more instantaneously active
+    document.onmousedown = triggerTextSelection;
+    document.onmouseup = function(event) {
+      setTimeout(function() {
+        triggerTextSelection(event);
+      }, 1);
+    };
+    document.onkeydown = preprocessKeyDown;
+    document.onkeyup = function(event){
+      var sel = window.getSelection();
+      // FF will return sel.anchorNode to be the parentNode when the triggered keyCode is 13
+      if (sel.anchorNode && sel.anchorNode.nodeName !== "ARTICLE") {
+        triggerNodeAnalysis(event);
+        if (sel.isCollapsed) {
+          triggerTextParse(event);
+        }
+      }
+    };
+    // Handle window resize events
+    root.onresize = triggerTextSelection;
+    urlInput.onblur = triggerUrlBlur;
+    urlInput.onkeydown = triggerUrlSet;
+    for (i = 0, len = editableNodes.length; i < len; i++) {
+      node = editableNodes[i];
+      node.contentEditable = true;
+      node.onmousedown = node.onkeyup = node.onmouseup = triggerTextSelection;
+    }
+  }
+  function iterateTextMenuButtons(callback) {
+    var textMenuButtons = document.querySelectorAll(".text-menu button"),
+        i,
+        len,
+        node;
+    for (i = 0, len = textMenuButtons.length; i < len; i++) {
+      node = textMenuButtons[i];
+      (function(n) {
+        callback(n);
+      })(node);
+    }
+  }
+  function bindTextStylingEvents() {
+    iterateTextMenuButtons(function(node) {
+      node.onmousedown = function(event) {
+        triggerTextStyling(node);
+      };
+    });
+  }
+  function getFocusNode() {
+    return root.getSelection().focusNode;
+  }
+  function reloadMenuState() {
+    var className,
+        focusNode = getFocusNode(),
+        tagClass,
+        reTag;
+    iterateTextMenuButtons(function(node) {
+      className = node.className;
+      for (var tag in tagClassMap) {
+        tagClass = tagClassMap[tag];
+        reTag = new RegExp(tagClass);
+        if (reTag.test(className)) {
+          if (hasParentWithTag(focusNode, tag)) {
+            node.className = tagClass + " active";
+          } else {
+            node.className = tagClass;
+          }
+          break;
+        }
+      }
+    });
+  }
+  function preprocessKeyDown(event) {
+    var sel = window.getSelection(),
+        parentParagraph = getParentWithTag(sel.anchorNode, "p"),
+        p,
+        isHr;
+    if (event.keyCode === 13 && parentParagraph) {
+      prevSibling = parentParagraph.previousSibling;
+      isHr = prevSibling && prevSibling.nodeName === "HR" &&
+        !parentParagraph.textContent.length;
+      // Stop enters from creating another <p> after a <hr> on enter
+      if (isHr) {
+        event.preventDefault();
+      }
+    }
+  }
+  function triggerNodeAnalysis(event) {
+    var sel = window.getSelection(),
+        anchorNode,
+        parentParagraph;
+    if (event.keyCode === 13) {
+      // Enters should replace it's parent <div> with a <p>
+      if (sel.anchorNode.nodeName === "DIV") {
+        toggleFormatBlock("p");
+      }
+      parentParagraph = getParentWithTag(sel.anchorNode, "p");
+      if (parentParagraph) {
+        insertHorizontalRule(parentParagraph);
+      }
+    }
+  }
+  function insertHorizontalRule(parentParagraph) {
+    var prevSibling,
+        prevPrevSibling,
+        hr;
+    prevSibling = parentParagraph.previousSibling;
+    prevPrevSibling = prevSibling;
+    while(prevPrevSibling = prevPrevSibling.previousSibling){
+    	if (prevPrevSibling.nodeType != Node.TEXT_NODE) break;
+    }
+    if (prevSibling.nodeName === "P" && !prevSibling.textContent.length && prevPrevSibling.nodeName !== "HR") {
+      hr = document.createElement("hr");
+      hr.contentEditable = false;
+      parentParagraph.parentNode.replaceChild(hr, prevSibling);
+    }
+  }
+  function getTextProp(el) {
+    var textProp;
+    if (el.nodeType === Node.TEXT_NODE) {
+      textProp = "data";
+    } else if (isFirefox) {
+      textProp = "textContent";
+    } else {
+      textProp = "innerText";
+    }
+    return textProp;
+  }
+  function insertListOnSelection(sel, textProp, listType) {
+    var execListCommand = listType === "ol" ? "insertOrderedList" : "insertUnorderedList",
+        nodeOffset = listType === "ol" ? 3 : 2;
+    document.execCommand(execListCommand);
+    sel.anchorNode[textProp] = sel.anchorNode[textProp].substring(nodeOffset);
+    return getParentWithTag(sel.anchorNode, listType);
+  }
+  function triggerTextParse(event) {
+    var sel = window.getSelection(),
+        textProp,
+        subject,
+        insertedNode,
+        unwrap,
+        node,
+        parent,
+        range;
+    // FF will return sel.anchorNode to be the parentNode when the triggered keyCode is 13
+    if (!sel.isCollapsed || !sel.anchorNode || sel.anchorNode.nodeName === "ARTICLE") {
+      return;
+    }
+    textProp = getTextProp(sel.anchorNode);
+    subject = sel.anchorNode[textProp];
+    if (subject.match(/^-\s/) && sel.anchorNode.parentNode.nodeName !== "LI") {
+      insertedNode = insertListOnSelection(sel, textProp, "ul");
+    }
+    if (subject.match(/^1\.\s/) && sel.anchorNode.parentNode.nodeName !== "LI") {
+      insertedNode = insertListOnSelection(sel, textProp, "ol");
+    }
+    unwrap = insertedNode &&
+            ["ul", "ol"].indexOf(insertedNode.nodeName.toLocaleLowerCase()) >= 0 &&
+            ["p", "div"].indexOf(insertedNode.parentNode.nodeName.toLocaleLowerCase()) >= 0;
+    if (unwrap) {
+      node = sel.anchorNode;
+      parent = insertedNode.parentNode;
+      parent.parentNode.insertBefore(insertedNode, parent);
+      parent.parentNode.removeChild(parent);
+      moveCursorToBeginningOfSelection(sel, node);
+    }
+  }
+  function moveCursorToBeginningOfSelection(selection, node) {
+    range = document.createRange();
+    range.setStart(node, 0);
+    range.setEnd(node, 0);
+    selection.removeAllRanges();
+    selection.addRange(range);
+  }
+  function triggerTextStyling(node) {
+    var className = node.className,
+        sel = window.getSelection(),
+        selNode = sel.anchorNode,
+        tagClass,
+        reTag;
+    for (var tag in tagClassMap) {
+      tagClass = tagClassMap[tag];
+      reTag = new RegExp(tagClass);
+      if (reTag.test(className)) {
+        switch(tag) {
+          case "b":
+            if (selNode && !hasParentWithTag(selNode, "h1") && !hasParentWithTag(selNode, "h2")) {
+              document.execCommand(tagClass, false);
+            }
+            return;
+          case "i":
+            document.execCommand(tagClass, false);
+            return;
+          case "h1":
+          case "h2":
+          case "h3":
+          case "blockquote":
+            toggleFormatBlock(tag);
+            return;
+          case "a":
+            toggleUrlInput();
+            optionsNode.className = "options url-mode";
+            return;
+        }
+      }
+    }
+    triggerTextSelection();
+  }
+  function triggerUrlBlur(event) {
+    var url = urlInput.value;
+    optionsNode.className = "options";
+    window.getSelection().addRange(previouslySelectedText);
+    document.execCommand("unlink", false);
+    if (url === "") {
+      return false;
+    }
+    if (!url.match("^(http://|https://|mailto:)")) {
+      url = "http://" + url;
+    }
+    document.execCommand("createLink", false, url);
+    urlInput.value = "";
+  }
+  function triggerUrlSet(event) {
+    if (event.keyCode === 13) {
+      event.preventDefault();
+      event.stopPropagation();
+      urlInput.blur();
+    }
+  }
+  function toggleFormatBlock(tag) {
+    if (hasParentWithTag(getFocusNode(), tag)) {
+      document.execCommand("formatBlock", false, "p");
+      document.execCommand("outdent");
+    } else {
+      document.execCommand("formatBlock", false, tag);
+    }
+  }
+  function toggleUrlInput() {
+    setTimeout(function() {
+      var url = getParentHref(getFocusNode());
+      if (typeof url !== "undefined") {
+        urlInput.value = url;
+      } else {
+        document.execCommand("createLink", false, "/");
+      }
+      previouslySelectedText = window.getSelection().getRangeAt(0);
+      urlInput.focus();
+    }, 150);
+  }
+  function getParent(node, condition, returnCallback) {
+    while (node.parentNode) {
+      if (condition(node)) {
+        return returnCallback(node);
+      }
+      node = node.parentNode;
+    }
+  }
+  function getParentWithTag(node, nodeType) {
+    var checkNodeType = function(node) { return node.nodeName.toLowerCase() === nodeType; },
+        returnNode = function(node) { return node; };
+    return getParent(node, checkNodeType, returnNode);
+  }
+  function hasParentWithTag(node, nodeType) {
+    return !!getParentWithTag(node, nodeType);
+  }
+  function getParentHref(node) {
+    var checkHref = function(node) { return typeof node.href !== "undefined"; },
+        returnHref = function(node) { return node.href; };
+    return getParent(node, checkHref, returnHref);
+  }
+  function triggerTextSelection() {
+      var selectedText = root.getSelection(),
+          range,
+          clientRectBounds;
+      // The selected text is collapsed, push the menu out of the way
+      if (selectedText.isCollapsed) {
+        setTextMenuPosition(-999, -999);
+      } else {
+        range = selectedText.getRangeAt(0);
+        clientRectBounds = range.getBoundingClientRect();
+        // Every time we show the menu, reload the state
+        reloadMenuState();
+        setTextMenuPosition(
+          clientRectBounds.top - 5 + root.pageYOffset,
+          (clientRectBounds.left + clientRectBounds.right) / 2
+        );
+      }
+  }
+  function setTextMenuPosition(top, left) {
+    textMenu.style.top = top + "px";
+    textMenu.style.left = left + "px";
+  }
+  root.grande = grande;
+}).call(this);

data/grandejs_rails.gemspec ADDED Viewed

@@ -0,0 +1,23 @@
+# coding: utf-8
+lib = File.expand_path('../lib', __FILE__)
+$LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
+require 'grandejs_rails/version'
+Gem::Specification.new do |spec|
+  spec.name          = "grandejs_rails"
+  spec.version       = GrandejsRails::VERSION
+  spec.authors       = ["Guy Israeli"]
+  spec.description   = %q{Grande.js For Rails 3.1+ }
+  spec.summary       = %q{Grande.js is a great javascript library that implements features from Medium's editing experience.}
+  spec.homepage      = ""
+  spec.license       = "MIT"
+  spec.files         = `git ls-files`.split($/)
+  spec.executables   = spec.files.grep(%r{^bin/}) { |f| File.basename(f) }
+  spec.test_files    = spec.files.grep(%r{^(test|spec|features)/})
+  spec.require_paths = ["lib"]
+  spec.add_development_dependency "bundler", "~> 1.3"
+  spec.add_development_dependency "rake"
+  spec.add_dependency "railties", ">=3.1"
+end

data/lib/grandejs_rails.rb ADDED Viewed

@@ -0,0 +1,8 @@
+require "grandejs_rails/version"
+module GrandejsRails
+   module Rails
+  class Engine < ::Rails::Engine
+  end
+ end
+end

data/lib/grandejs_rails/version.rb ADDED Viewed

@@ -0,0 +1,3 @@
+module GrandejsRails
+  VERSION = "0.0.1"
+end

metadata ADDED Viewed

@@ -0,0 +1,103 @@
+--- !ruby/object:Gem::Specification
+name: grandejs_rails
+version: !ruby/object:Gem::Version
+  version: 0.0.1
+  prerelease:
+platform: ruby
+authors:
+- Guy Israeli
+autorequire:
+bindir: bin
+cert_chain: []
+date: 2013-09-13 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: bundler
+  requirement: !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ~>
+      - !ruby/object:Gem::Version
+        version: '1.3'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ~>
+      - !ruby/object:Gem::Version
+        version: '1.3'
+- !ruby/object:Gem::Dependency
+  name: rake
+  requirement: !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '0'
+- !ruby/object:Gem::Dependency
+  name: railties
+  requirement: !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '3.1'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '3.1'
+description: ! 'Grande.js For Rails 3.1+ '
+email:
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- .gitignore
+- Gemfile
+- LICENSE.txt
+- README.md
+- Rakefile
+- app/assets/javascripts/grande.js
+- grandejs_rails.gemspec
+- lib/grandejs_rails.rb
+- lib/grandejs_rails/version.rb
+homepage: ''
+licenses:
+- MIT
+post_install_message:
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  none: false
+  requirements:
+  - - ! '>='
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  none: false
+  requirements:
+  - - ! '>='
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubyforge_project:
+rubygems_version: 1.8.24
+signing_key:
+specification_version: 3
+summary: Grande.js is a great javascript library that implements features from Medium's
+  editing experience.
+test_files: []