kiteditor 1.0.1

data/app/views/mercury/modals/table.html

@@ -0,0 +1,84 @@
+<form id="mercury_table" style="width:700px">
+
+  <div class="mercury-display-pane-container">
+    <div class="mercury-display-pane">
+
+      <div id="table_display">
+        <table border="1" cellspacing="0">
+          <tr>
+            <td>&nbsp;</td>
+            <td>&nbsp;</td>
+            <td>&nbsp;</td>
+          </tr>
+          <tr>
+            <td>&nbsp;</td>
+            <td>&nbsp;</td>
+            <td>&nbsp;</td>
+          </tr>
+        </table>
+      </div>
+
+      <div id="table_options">
+        <fieldset class="inputs">
+          <ol>
+            <li id="table_rows_input" class="select input optional">
+              <label for="table_rows">Rows</label>
+              <input type="button" class="action" value="Add Before" name="insertRowBefore"/>
+              <input type="button" class="action" value="Add After" name="insertRowAfter"/>
+              <input type="button" class="action" value="Remove" name="deleteRow"/>
+            </li>
+            <li id="table_columns_input" class="select input optional">
+              <label for="table_columns">Columns</label>
+              <input type="button" class="action" value="Add Before" name="insertColumnBefore"/>
+              <input type="button" class="action" value="Add After" name="insertColumnAfter"/>
+              <input type="button" class="action" value="Remove" name="deleteColumn"/>
+            </li>
+            <hr/>
+            <li id="table_row_adjust_input" class="select input optional">
+              <label for="table_row_adjust">Row Span</label>
+              <input type="button" class="action" value="+" name="increaseRowspan"/>
+              <input type="button" class="action" value="-" name="decreaseRowspan"/>
+            </li>
+            <li id="table_column_adjust_input" class="select input optional">
+              <label for="table_column_adjust">Column Span</label>
+              <input type="button" class="action" value="+" name="increaseColspan"/>
+              <input type="button" class="action" value="-" name="decreaseColspan"/>
+            </li>
+          </ol>
+        </fieldset>
+
+        <fieldset class="inputs">
+          <legend><span>Options</span></legend>
+          <ol>
+            <li id="table_alignment_input" class="select input optional">
+              <label class="label" for="table_alignment">Alignment</label>
+              <select id="table_alignment" name="table[alignment]">
+                <option value="">None</option>
+                <option value="left">Left</option>
+                <option value="right">Right</option>
+              </select>
+            </li>
+            <li id="table_border_input" class="string input optional stringish">
+              <label class="label" for="table_border">Border</label>
+              <input id="table_border" name="table[border]" type="text" value="1"/>
+            </li>
+            <li id="table_spacing_input" class="string input optional stringish">
+              <label class="label" for="table_spacing">Spacing</label>
+              <input id="table_spacing" name="table[spacing]" type="text" value="0"/>
+            </li>
+          </ol>
+        </fieldset>
+      </div>
+
+    </div>
+  </div>
+
+  <div class="mercury-display-controls">
+    <fieldset class="buttons">
+      <ol>
+        <li class="commit button"><input class="submit" name="commit" type="submit" value="Insert Table" /></li>
+      </ol>
+    </fieldset>
+  </div>
+
+</form>

data/app/views/mercury/palettes/backcolor.html

@@ -0,0 +1,73 @@
+<div class="mercury-color-picker">
+  <div class="picker" style="background:#FFFFFF"></div>
+  <div class="picker" style="background:#FFCCCC"></div>
+  <div class="picker" style="background:#FFCC99"></div>
+  <div class="picker" style="background:#FFFF99"></div>
+  <div class="picker" style="background:#FFFFCC"></div>
+  <div class="picker" style="background:#99FF99"></div>
+  <div class="picker" style="background:#99FFFF"></div>
+  <div class="picker" style="background:#CCFFFF"></div>
+  <div class="picker" style="background:#CCCCFF"></div>
+  <div class="picker" style="background:#FFCCFF"></div>
+  <div class="picker" style="background:#CCCCCC"></div>
+  <div class="picker" style="background:#FF6666"></div>
+  <div class="picker" style="background:#FF9966"></div>
+  <div class="picker" style="background:#FFFF66"></div>
+  <div class="picker" style="background:#FFFF33"></div>
+  <div class="picker" style="background:#66FF99"></div>
+  <div class="picker" style="background:#33FFFF"></div>
+  <div class="picker" style="background:#66FFFF"></div>
+  <div class="picker" style="background:#9999FF"></div>
+  <div class="picker" style="background:#FF99FF"></div>
+  <div class="picker" style="background:#C0C0C0"></div>
+  <div class="picker" style="background:#FF0000"></div>
+  <div class="picker" style="background:#FF9900"></div>
+  <div class="picker" style="background:#FFCC66"></div>
+  <div class="picker" style="background:#FFFF00"></div>
+  <div class="picker" style="background:#33FF33"></div>
+  <div class="picker" style="background:#66CCCC"></div>
+  <div class="picker" style="background:#33CCFF"></div>
+  <div class="picker" style="background:#6666CC"></div>
+  <div class="picker" style="background:#CC66CC"></div>
+  <div class="picker" style="background:#999999"></div>
+  <div class="picker" style="background:#CC0000"></div>
+  <div class="picker" style="background:#FF6600"></div>
+  <div class="picker" style="background:#FFCC33"></div>
+  <div class="picker" style="background:#FFCC00"></div>
+  <div class="picker" style="background:#33CC00"></div>
+  <div class="picker" style="background:#00CCCC"></div>
+  <div class="picker" style="background:#3366FF"></div>
+  <div class="picker" style="background:#6633FF"></div>
+  <div class="picker" style="background:#CC33CC"></div>
+  <div class="picker" style="background:#666666"></div>
+  <div class="picker" style="background:#990000"></div>
+  <div class="picker" style="background:#CC6600"></div>
+  <div class="picker" style="background:#CC9933"></div>
+  <div class="picker" style="background:#999900"></div>
+  <div class="picker" style="background:#009900"></div>
+  <div class="picker" style="background:#339999"></div>
+  <div class="picker" style="background:#3333FF"></div>
+  <div class="picker" style="background:#6600CC"></div>
+  <div class="picker" style="background:#993399"></div>
+  <div class="picker" style="background:#333333"></div>
+  <div class="picker" style="background:#660000"></div>
+  <div class="picker" style="background:#993300"></div>
+  <div class="picker" style="background:#996633"></div>
+  <div class="picker" style="background:#666600"></div>
+  <div class="picker" style="background:#006600"></div>
+  <div class="picker" style="background:#336666"></div>
+  <div class="picker" style="background:#000099"></div>
+  <div class="picker" style="background:#333399"></div>
+  <div class="picker" style="background:#663366"></div>
+  <div class="picker" style="background:#000000"></div>
+  <div class="picker" style="background:#330000"></div>
+  <div class="picker" style="background:#663300"></div>
+  <div class="picker" style="background:#663333"></div>
+  <div class="picker" style="background:#333300"></div>
+  <div class="picker" style="background:#003300"></div>
+  <div class="picker" style="background:#003333"></div>
+  <div class="picker" style="background:#000066"></div>
+  <div class="picker" style="background:#330099"></div>
+  <div class="picker" style="background:#330033"></div>
+  <div class="last-picked">Last Color Picked</div>
+</div>

data/app/views/mercury/palettes/forecolor.html

@@ -0,0 +1,73 @@
+<div class="mercury-color-picker">
+  <div class="picker" style="background:#FFFFFF"></div>
+  <div class="picker" style="background:#FFCCCC"></div>
+  <div class="picker" style="background:#FFCC99"></div>
+  <div class="picker" style="background:#FFFF99"></div>
+  <div class="picker" style="background:#FFFFCC"></div>
+  <div class="picker" style="background:#99FF99"></div>
+  <div class="picker" style="background:#99FFFF"></div>
+  <div class="picker" style="background:#CCFFFF"></div>
+  <div class="picker" style="background:#CCCCFF"></div>
+  <div class="picker" style="background:#FFCCFF"></div>
+  <div class="picker" style="background:#CCCCCC"></div>
+  <div class="picker" style="background:#FF6666"></div>
+  <div class="picker" style="background:#FF9966"></div>
+  <div class="picker" style="background:#FFFF66"></div>
+  <div class="picker" style="background:#FFFF33"></div>
+  <div class="picker" style="background:#66FF99"></div>
+  <div class="picker" style="background:#33FFFF"></div>
+  <div class="picker" style="background:#66FFFF"></div>
+  <div class="picker" style="background:#9999FF"></div>
+  <div class="picker" style="background:#FF99FF"></div>
+  <div class="picker" style="background:#C0C0C0"></div>
+  <div class="picker" style="background:#FF0000"></div>
+  <div class="picker" style="background:#FF9900"></div>
+  <div class="picker" style="background:#FFCC66"></div>
+  <div class="picker" style="background:#FFFF00"></div>
+  <div class="picker" style="background:#33FF33"></div>
+  <div class="picker" style="background:#66CCCC"></div>
+  <div class="picker" style="background:#33CCFF"></div>
+  <div class="picker" style="background:#6666CC"></div>
+  <div class="picker" style="background:#CC66CC"></div>
+  <div class="picker" style="background:#999999"></div>
+  <div class="picker" style="background:#CC0000"></div>
+  <div class="picker" style="background:#FF6600"></div>
+  <div class="picker" style="background:#FFCC33"></div>
+  <div class="picker" style="background:#FFCC00"></div>
+  <div class="picker" style="background:#33CC00"></div>
+  <div class="picker" style="background:#00CCCC"></div>
+  <div class="picker" style="background:#3366FF"></div>
+  <div class="picker" style="background:#6633FF"></div>
+  <div class="picker" style="background:#CC33CC"></div>
+  <div class="picker" style="background:#666666"></div>
+  <div class="picker" style="background:#990000"></div>
+  <div class="picker" style="background:#CC6600"></div>
+  <div class="picker" style="background:#CC9933"></div>
+  <div class="picker" style="background:#999900"></div>
+  <div class="picker" style="background:#009900"></div>
+  <div class="picker" style="background:#339999"></div>
+  <div class="picker" style="background:#3333FF"></div>
+  <div class="picker" style="background:#6600CC"></div>
+  <div class="picker" style="background:#993399"></div>
+  <div class="picker" style="background:#333333"></div>
+  <div class="picker" style="background:#660000"></div>
+  <div class="picker" style="background:#993300"></div>
+  <div class="picker" style="background:#996633"></div>
+  <div class="picker" style="background:#666600"></div>
+  <div class="picker" style="background:#006600"></div>
+  <div class="picker" style="background:#336666"></div>
+  <div class="picker" style="background:#000099"></div>
+  <div class="picker" style="background:#333399"></div>
+  <div class="picker" style="background:#663366"></div>
+  <div class="picker" style="background:#000000"></div>
+  <div class="picker" style="background:#330000"></div>
+  <div class="picker" style="background:#663300"></div>
+  <div class="picker" style="background:#663333"></div>
+  <div class="picker" style="background:#333300"></div>
+  <div class="picker" style="background:#003300"></div>
+  <div class="picker" style="background:#003333"></div>
+  <div class="picker" style="background:#000066"></div>
+  <div class="picker" style="background:#330099"></div>
+  <div class="picker" style="background:#330033"></div>
+  <div class="last-picked">Last Color Picked</div>
+</div>

data/app/views/mercury/panels/history.html

@@ -0,0 +1,3 @@
+<div class="mercury-history-panel">
+  <p>The history panel is expected to be implemented with a server back end.  Since this is a demo, we didn't include it.</p>
+</div>

data/app/views/mercury/panels/notes.html

@@ -0,0 +1,3 @@
+<div class="mercury-notes-panel">
+  <p>The notes panel is expected to be implemented with a server back end.  Since this is a demo, we didn't include it.</p>
+</div>

data/app/views/mercury/panels/snippets.html

@@ -0,0 +1,12 @@
+<div class="mercury-snippet-panel">
+  <div class="filter">
+    <input class="filter" type="text">
+  </div>
+  <ul>
+    <li data-filter="example, snippet, favorite, beer">
+      <img alt="Snippet Name" data-snippet="example" src="/assets/mercury/default-snippet.png"/>
+      <h4>Snippet Name</h4>
+      <div class="description">A one or two line long description of what this snippet does.</div>
+    </li>
+  </ul>
+</div>

data/app/views/mercury/selects/formatblock.html

@@ -0,0 +1,11 @@
+<div class="mercury-select-options">
+  <h1 data-tag="h1">Heading 1 <span>&lt;h1&gt;</span></h1>
+  <h2 data-tag="h2">Heading 2 <span>&lt;h2&gt;</span></h2>
+  <h3 data-tag="h3">Heading 3 <span>&lt;h3&gt;</span></h3>
+  <h4 data-tag="h4">Heading 4 <span>&lt;h4&gt;</span></h4>
+  <h5 data-tag="h5">Heading 5 <span>&lt;h5&gt;</span></h5>
+  <h6 data-tag="h6">Heading 6 <span>&lt;h6&gt;</span></h6>
+  <div data-tag="p">Paragraph <span>&lt;p&gt;</span></div>
+  <div data-tag="blockquote">Blockquote <span>&lt;blockquote&gt;</span></div>
+  <div data-tag="pre">Formatted <span>&lt;pre&gt;</span></div>
+</div>

data/app/views/mercury/selects/style.html

@@ -0,0 +1,5 @@
+<div class="mercury-select-options">
+  <div class="red" data-class="red">Red text</div>
+  <div class="large-bold" data-class="large-bold">Large bold text</div>
+  <div class="blue" data-class="blue">Blue background</div>
+</div>

data/app/views/mercury/snippets/example/options.html.erb

@@ -0,0 +1,34 @@
+<%= form_for 'options', { :html => { :style => 'width:600px' } } do |f| %>
+
+  <div class="mercury-display-pane-container">
+    <div class="mercury-display-pane">
+      <fieldset class="inputs">
+        <ol>
+          <li class="string input optional stringish" id="options_first_name_input">
+            <label class="label" for="options_first_name">First Name</label>
+            <input id="options_first_name" name="options[first_name]" type="text" value="<%= @options[:first_name] %>"/>
+          </li>
+        </ol>
+      </fieldset>
+
+      <fieldset class="inputs">
+        <legend><span>Options</span></legend>
+        <ol>
+          <li class="string input optional stringish" id="options_favorite_beer_input">
+            <label class="label" for="options_favorite_beer">Favorite Beer</label>
+            <input id="options_favorite_beer" name="options[favorite_beer]" type="text" value="<%= @options[:favorite_beer] %>"/>
+          </li>
+        </ol>
+      </fieldset>
+    </div>
+  </div>
+
+  <div class="mercury-display-controls">
+    <fieldset class="buttons">
+      <ol>
+        <li class="commit button"><input class="submit" name="commit" type="submit" value="Insert Snippet"/></li>
+      </ol>
+    </fieldset>
+  </div>
+
+<% end %>

data/app/views/mercury/snippets/example/preview.html.erb

@@ -0,0 +1 @@
+<strong><%= params[:options][:first_name] %></strong> likes <%= params[:options][:favorite_beer] %>

data/config/engine.rb

@@ -0,0 +1,44 @@
+require "rails"
+
+module Mercury
+  class Engine < Rails::Engine
+
+    # Additional application configuration to include precompiled assets.
+    initializer :assets do |app|
+      app.config.assets.precompile += %w( mercury.js mercury.css mercury_overrides.css )
+    end
+
+    # Require mercury authentication module and potentially other aspects later (so they can be overridden).
+    initializer 'mercury.add_lib' do |app|
+      require 'mercury/authentication'
+    end
+
+    # To load the routes for this Engine, within your main apps routes.rb file include:
+    #
+    # Mercury::Engine.routes
+    #
+    def self.routes
+      Rails.application.routes.draw do
+        #match '/editor(/*requested_uri)' => "mercury#edit", :as => :mercury_editor
+
+        # images handled by gnric (as assets)
+        #match '/mercury/images/browse' => 'mercury/images#index'
+        #put '/mercury/images/:id' => 'mercury/images#update'
+        #namespace :mercury do
+        #  resources :images
+        #end
+
+        scope '/mercury' do
+          match ':type/:resource' => "mercury#resource"
+          match 'snippets/:name/options' => "mercury#snippet_options"
+          match 'snippets/:name/preview' => "mercury#snippet_preview"
+        end
+
+        if defined?(Mercury::Application)
+          match 'mercury/test_page' => "mercury#test_page"
+        end
+      end
+    end
+
+  end
+end

data/db/migrate/20110526035601_create_mercury_images.rb

@@ -0,0 +1,11 @@
+class CreateMercuryImages < ActiveRecord::Migration
+  def change
+    create_table :mercury_images do |t|
+      t.string :image_file_name
+      t.string :image_content_type
+      t.integer :image_file_size
+      t.datetime :image_updated_at
+      t.timestamps
+    end
+  end
+end

data/features/loading/loading.feature

@@ -0,0 +1,22 @@
+@javascript
+Feature:
+  As a content editor type person
+  In order to manage content
+  I should be able to expect the editor to load properly
+
+  Background:
+    Given I am on an editable page
+
+
+  Scenario: A user can expect to see the toolbar
+    Then I should see "Save" within the toolbar
+    And I should see "Preview" within the toolbar
+    And I should see "Bold" within the toolbar
+
+
+  Scenario: A user can expect to see the contents of the iframe
+    Then I should see "Editable region" in the content frame
+
+
+  Scenario: A user can expect to see the status bar
+    Then I should see "Mercury Editor v0.3.0" within the statusbar

data/features/loading/navigating.feature

@@ -0,0 +1,77 @@
+@javascript
+Feature:
+  As a content editor type person
+  In order to manage content
+  I should be able to expect the editor to not get in the way when I navigate and submit forms
+
+  Background:
+    Given I adjust the configuration to have: {"nonHijackableClasses": ["lightview"]}
+    And am on an editable page
+
+
+  Scenario: A user can navigate links targeting _top
+    When I follow "_top" in the content frame
+    Then I should be on the test page
+
+
+  Scenario: A user can navigate links targeting _blank
+    When I follow "_blank" in the content frame
+    Then I should be on the editable page
+    And I should see "test_page" in the "/mercury/test_page" window
+
+
+  Scenario: A user can navigate links targeting _self
+    When I follow "_self" in the content frame
+    Then I should be on the test page
+
+
+  Scenario: A user can navigate links with no target set
+    When I follow "[none]" in the content frame
+    Then I should be on the test page
+
+
+  Scenario: A user can navigate links that are ignored by configuration
+    When I follow "_self .lightview" in the content frame
+    Then I should be on the editable page
+
+
+  Scenario: A user can navigate links targeting random windows
+    When I follow "foo" in the content frame
+    Then I should be on the editable page
+    Then I should see "test_page" in the "foo" window
+
+
+  Scenario: A user can submit forms targeting _top
+    When I press "post _top" in the content frame
+    Then I should be on the test page
+    And I should see "post _top"
+
+
+  # todo: intermittent failure
+#  Scenario: A user can submit forms targeting _blank
+#    When I press "post _blank" in the content frame
+#    Then I should be on the editable page
+#    And I should see "post _blank" in the "/mercury/test_page" window
+
+
+  Scenario: A user can submit forms targeting _self
+    When I press "post _self" in the content frame
+    Then I should be on the test page
+    And I should see "post _self"
+
+
+  Scenario: A user can submit forms with no target set
+    When I press "get [none]" in the content frame
+    Then I should be on the test page
+    And I should see "get [none]"
+
+
+  Scenario: A user can submit forms that are ignored by configuration
+    When I press "post _self .lightview" in the content frame
+    Then I should be on the editable page
+
+
+  Scenario: A user can submit forms targeting random windows
+    When I press "get foo" in the content frame
+    Then I should be on the editable page
+    And I should see "get foo" in the "foo" window

data/features/loading/user_interface.feature

@@ -0,0 +1,67 @@
+@javascript
+Feature:
+  As a content editor type person
+  In order to manage content
+  I should be able to interact with various user interface aspects of the editor
+
+  Background:
+    Given I am on an editable page
+
+  Scenario: A user can expect all this!
+
+
+#  Scenario: A user can view and close the about dialog
+    When I click on the about the editor link
+    Then I should see "Mercury Editor" within the lightview title
+    And I should see "Mercury Editor is an open source HTML5 WYSIWYG editor written in Coffeescript using jQuery. The project has been released under the MIT license." within the lightview window
+    And I should see "Project Home" within the lightview window
+    And I should see "Project Source" within the lightview window
+
+    When I click on the lightview overlay
+    Then the lightview window should not be visible
+    And the lightview overlay should not be visible
+
+
+#  Scenario: A user can open and close select dropdowns
+    When I click on the formatblock editor dropdown
+    Then the formatblock select should be visible
+    And I should see "Heading 1 <h1>" within the formatblock select
+
+    When I click on the style editor dropdown
+    Then the style select should be visible
+    And the formatblock select should not be visible
+
+
+#  Scenario: A user can open and close palette dialogs
+    When I click on the background color editor button
+    Then the background color palette should be visible
+
+    When I click on the foreground color editor button
+    Then the foreground color palette should be visible
+    And the background color palette should not be visible
+
+
+#  Scenario: A user can open and close a panel
+    When I click on the "View History" button
+    Then the history panel should be visible
+    And I should see "Page Version History" within the history panel
+
+    When I click on the "View History" button
+    Then the history panel should not be visible
+
+
+#  Scenario: A user can open and close a modal window
+    When I click on the "Insert Link" button
+    Then the modal window should be visible
+    And the modal overlay should be visible
+    And I should see "Insert Link" within the modal title
+    And I should see "Standard Links" within the insert link modal
+
+    When I click on the modal close button
+    Then the modal window should not be visible
+    And the modal overlay should not be visible
+
+    When I click on the "Insert Link" button
+    And click on the modal overlay
+    Then the modal window should not be visible
+    And the modal overlay should not be visible