initial commit

.gitignore

@@ -0,0 +1,17 @@
+# See http://help.github.com/ignore-files/ for more about ignoring files.
+#
+# If you find yourself ignoring temporary files generated by your text editor
+# or operating system, you probably want to add a global ignore instead:
+# git config --global core.excludesfile ~/.gitignore_global
+
+# Ignore bundler config
+/.bundle
+
+# Ignore the build directory
+/build
+
+# Ignore Sass' cache
+/.sass-cache
+
+# Ignore .DS_store file
+.DS_Store

Gemfile

@@ -0,0 +1,16 @@
+# If you have OpenSSL installed, we recommend updating
+# the following line to use "https"
+source 'http://rubygems.org'
+
+gem "middleman", "~>3.1.4"
+
+# Live-reloading plugin
+gem "middleman-livereload", "~> 3.1.0"
+
+# For faster file watcher updates on Windows:
+gem "wdm", "~> 0.1.0", :platforms => [:mswin, :mingw]
+
+# Cross-templating language block fix for Ruby 1.8
+platforms :mri_18 do
+  gem "ruby18_source_location"
+end

Gemfile.lock

@@ -0,0 +1,109 @@
+GEM
+  remote: http://rubygems.org/
+  specs:
+    activesupport (3.2.19)
+      i18n (~> 0.6, >= 0.6.4)
+      multi_json (~> 1.0)
+    chunky_png (1.3.1)
+    coffee-script (2.2.0)
+      coffee-script-source
+      execjs
+    coffee-script-source (1.8.0)
+    compass (1.0.1)
+      chunky_png (~> 1.2)
+      compass-core (~> 1.0.1)
+      compass-import-once (~> 1.0.5)
+      rb-fsevent (>= 0.9.3)
+      rb-inotify (>= 0.9)
+      sass (>= 3.3.13, < 3.5)
+    compass-core (1.0.1)
+      multi_json (~> 1.0)
+      sass (>= 3.3.0, < 3.5)
+    compass-import-once (1.0.5)
+      sass (>= 3.2, < 3.5)
+    em-websocket (0.5.1)
+      eventmachine (>= 0.12.9)
+      http_parser.rb (~> 0.6.0)
+    eventmachine (1.0.3)
+    execjs (1.4.1)
+      multi_json (~> 1.0)
+    ffi (1.9.6)
+    haml (4.0.5)
+      tilt
+    hike (1.2.3)
+    http_parser.rb (0.6.0)
+    i18n (0.6.11)
+    kramdown (1.4.2)
+    listen (1.3.1)
+      rb-fsevent (>= 0.9.3)
+      rb-inotify (>= 0.9)
+      rb-kqueue (>= 0.2)
+    middleman (3.1.6)
+      coffee-script (~> 2.2.0)
+      compass (>= 0.12.2)
+      execjs (~> 1.4.0)
+      haml (>= 3.1.6)
+      kramdown (~> 1.2)
+      middleman-core (= 3.1.6)
+      middleman-more (= 3.1.6)
+      middleman-sprockets (>= 3.1.2)
+      sass (>= 3.1.20)
+      uglifier (~> 2.1.0)
+    middleman-core (3.1.6)
+      activesupport (~> 3.2.6)
+      bundler (~> 1.1)
+      i18n (~> 0.6.1)
+      listen (~> 1.1)
+      rack (>= 1.4.5)
+      rack-test (~> 0.6.1)
+      thor (>= 0.15.2, < 2.0)
+      tilt (~> 1.3.6)
+    middleman-livereload (3.1.1)
+      em-websocket (>= 0.2.0)
+      middleman-core (>= 3.0.2)
+      multi_json (~> 1.0)
+      rack-livereload
+    middleman-more (3.1.6)
+    middleman-sprockets (3.1.4)
+      middleman-core (>= 3.0.14)
+      middleman-more (>= 3.0.14)
+      sprockets (~> 2.1)
+      sprockets-helpers (~> 1.0.0)
+      sprockets-sass (~> 1.0.0)
+    multi_json (1.10.1)
+    rack (1.5.2)
+    rack-livereload (0.3.15)
+      rack
+    rack-test (0.6.2)
+      rack (>= 1.0)
+    rb-fsevent (0.9.4)
+    rb-inotify (0.9.5)
+      ffi (>= 0.5.0)
+    rb-kqueue (0.2.3)
+      ffi (>= 0.5.0)
+    ruby18_source_location (0.2)
+    sass (3.4.6)
+    sprockets (2.12.2)
+      hike (~> 1.2)
+      multi_json (~> 1.0)
+      rack (~> 1.0)
+      tilt (~> 1.1, != 1.3.0)
+    sprockets-helpers (1.0.1)
+      sprockets (~> 2.0)
+    sprockets-sass (1.0.3)
+      sprockets (~> 2.0)
+      tilt (~> 1.1)
+    thor (0.19.1)
+    tilt (1.3.7)
+    uglifier (2.1.2)
+      execjs (>= 0.3.0)
+      multi_json (~> 1.0, >= 1.0.2)
+
+PLATFORMS
+  ruby
+
+DEPENDENCIES
+  middleman (~> 3.1.4)
+  middleman-livereload (~> 3.1.0)
+  ruby18_source_location
+  wdm (~> 0.1.0)

config.rb

@@ -0,0 +1,70 @@
+###
+# Compass
+###
+
+# Change Compass configuration
+# compass_config do |config|
+#   config.output_style = :compact
+# end
+
+###
+# Page options, layouts, aliases and proxies
+###
+
+# Per-page layout changes:
+#
+# With no layout
+# page "/path/to/file.html", :layout => false
+#
+# With alternative layout
+# page "/path/to/file.html", :layout => :otherlayout
+#
+# A path which all have the same layout
+# with_layout :admin do
+#   page "/admin/*"
+# end
+
+# Proxy pages (http://middlemanapp.com/dynamic-pages/)
+# proxy "/this-page-has-no-template.html", "/template-file.html", :locals => {
+#  :which_fake_page => "Rendering a fake page with a local variable" }
+
+###
+# Helpers
+###
+
+# Automatic image dimensions on image_tag helper
+# activate :automatic_image_sizes
+
+# Reload the browser automatically whenever files change
+# activate :livereload
+
+# Methods defined in the helpers block are available in templates
+# helpers do
+#   def some_helper
+#     "Helping"
+#   end
+# end
+
+set :css_dir, 'stylesheets'
+
+set :js_dir, 'javascripts'
+
+set :images_dir, 'images'
+
+# Build-specific configuration
+configure :build do
+  # For example, change the Compass output style for deployment
+  # activate :minify_css
+
+  # Minify Javascript on build
+  # activate :minify_javascript
+
+  # Enable cache buster
+  # activate :asset_hash
+
+  # Use relative URLs
+  # activate :relative_assets
+
+  # Or use a different image path
+  # set :http_path, "/Content/images/"
+end

source/index.html.erb

@@ -0,0 +1,23 @@
+---
+title: Editor example
+---
+
+<div class="welcome">
+
+  <h1>Editor!</h1>
+  <div id="editor" class="postField postField--body editable smart-media-plugin">
+
+  </div>
+
+</div><!-- .welcome -->
+
+<div class="indicators" style="">
+  <div class="offset-indicator"></div>
+  <div class="position-indicator"></div>
+</div>
+
+
+<script>
+  editor = new Editor.MainEditor({}) ;
+  editor.render()
+</script>

source/javascripts/all.js

@@ -0,0 +1,7 @@
+//= require libs/jquery.min
+//= require libs/caret.min
+//= require libs/underscore.min
+//= require libs/backbone.min
+
+//= require editor/main
+

source/javascripts/editor/main.js.coffee

@@ -0,0 +1,111 @@
+window.Editor = {
+
+}
+
+# make it accessible
+window.selection = 0
+
+class Editor.MainEditor extends Backbone.View
+  el: "#editor"
+
+  events:
+    "blur"    : "handleBlur"
+    #"focus"   : "handleCaret"
+    #"keyup"   : "handleCaret"
+    #"mouseup" : "handleCaret"
+    "selectstart": "getSelection"
+
+  initialize: (opts = {})=>
+    @editor_options = opts
+
+  template: ()=>
+    "<section class='section-content'>
+      <div class='section-inner'>
+        <h3 class='graf--h3'>title here</h3>
+        <p class='graf--p'>body here<p>
+      </div>
+    </section>"
+
+  render: ()=>
+    @template()
+    $(@el).html @template()
+    $(@el).attr("contenteditable", "true")
+    $("<div id='editor-menu' class='editor-menu' style='display: none;'></div>").insertAfter(@el)
+    @editor_menu = new Editor.Menu()
+    @editor_menu.delegateEvents()
+
+  handleBlur: (ev)=>
+    console.log("Handle blur #{ev}")
+    @editor_menu.hide()
+
+  handleFocus: (ev)=>
+    console.log("Handle focus #{ev}")
+
+  getSelection: (ev)->
+    _this = @
+    $(document).one 'mouseup', ()->
+      _this.displayMenu @.getSelection()
+
+  displayMenu: (sel)->
+    #we only display menu if sel.type is "Range"
+    console.log sel
+    return unless sel.type is "Range"
+    if sel.extentOffset > 0 and sel.baseOffset > 0
+      @handleCaret()
+      @editor_menu.render()
+    else
+      @editor_menu.hide()
+
+  handleCaret: ()->
+    @resetOffset($(@el));
+
+  resetOffset: ($textField)=>
+    offset = $textField.caret('offset');
+    position = $textField.caret('position');
+    @resizeBox(offset, position)
+    offset
+
+  resizeBox: (offset, position)->
+    @editor_menu.$el.offset({left: offset.left-50, top: offset.top + offset.height + 2})
+    ###
+    $('.indicators')
+      .offset({left: offset.left, top: offset.top + offset.height + 2})
+      .find('.offset-indicator')
+      .html("Offset: left: " + offset.left + ", " + "top: " + offset.top + "&nbsp;" + "height: " + offset.height);
+
+    $('.position-indicator')
+      .html("Position: left: " + position.left + ", " + "top: " + position.top + "&nbsp;");
+    ###
+
+
+
+class Editor.Menu extends Backbone.View
+  el: "#editor-menu"
+
+  initialize: ()=>
+
+  template: ()=>
+    '<i class="editor-icon icon-blockquote" data-action="blockquote"></i>
+      <i class="editor-icon icon-h2" data-action="h2"></i>
+      <i class="editor-icon icon-h3" data-action="h3"></i>'
+  render: ()=>
+    console.log "RENDER"
+    $(@el).html(@template())
+    console.log $(@el).length
+    @show()
+
+  show: ()->
+    $(@el).show()
+
+  hide: ()->
+    $(@el).hide()
+###
+addEvent(document.getElementById('clear'), 'click', function () {
+  localStorage.clear();
+  window.location = window.location; // refresh
+});
+
+if (localStorage.getItem('contenteditable')) {
+  editable.innerHTML = localStorage.getItem('contenteditable');
+}
+###