kiteditor 1.0.11 → 1.0.12

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

@@ -1,6 +1,6 @@
 <div class="mercury-snippet-panel">
   <div class="filter">
-    <input class="filter" type="text">
+    <input class="filter focusable" type="text">
   </div>
   <ul>
     <li data-filter="example, snippet, favorite, beer">
@@ -8,5 +8,10 @@
       <h4>Snippet Name</h4>
       <div class="description">A one or two line long description of what this snippet does.</div>
     </li>
+    <li data-filter="no options, snippet">
+      <img alt="No Option Snippet" data-snippet="no_options" data-options="false" src="/assets/mercury/default-snippet.png"/>
+      <h4>No Options Snippet</h4>
+      <div class="description">This snippet doesn't have options.</div>
+    </li>
   </ul>
 </div>

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

@@ -1,34 +1,30 @@
-<%= form_for 'options', { :html => { :style => 'width:600px' } } do |f| %>
+<%= form_for 'options', {url: '', html: {class: 'form-horizontal', style: 'width:615px'}} 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>
+  <div class="form-inputs mercury-display-pane-container">
 
-      <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>
+    <fieldset>
+      <div class="control-group string optional">
+        <label class="string optional control-label" for="options_first_name">First Name</label>
+        <div class="controls">
+          <input class="span6 string optional" id="options_first_name" name="options[first_name]" size="50" type="text" value="<%= @options[:first_name] %>">
+        </div>
+      </div>
+    </fieldset>
 
-  <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>
+      <legend>Options</legend>
+      <div class="control-group string optional">
+        <label class="string optional control-label" for="options_favorite_beer">Favorite Beer</label>
+        <div class="controls">
+          <input class="span6 string optional" id="options_favorite_beer" name="options[favorite_beer]" size="50" type="text" value="<%= @options[:favorite_beer] %>">
+        </div>
+      </div>
     </fieldset>
+
+  </div>
+
+  <div class="form-actions mercury-display-controls">
+    <input class="btn btn-primary" name="commit" type="submit" value="Insert Snippet"/>
   </div>
 
 <% end %>

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

@@ -0,0 +1 @@
+<strong>No Option Snippet</strong>

data/config/routes.rb

@@ -0,0 +1,9 @@
+Mercury::Engine.routes.draw do
+  get '/editor(/*requested_uri)' => "mercury#edit", :as => :mercury_editor
+
+  scope '/mercury' do
+    get ':type/:resource' => "mercury#resource"
+    get 'snippets/:name/options' => "mercury#snippet_options"
+    get 'snippets/:name/preview' => "mercury#snippet_preview"
+  end
+end

data/features/generators/authentication.feature

@@ -0,0 +1,10 @@
+Feature:
+  As a developer
+  In order to restrict editing using Mercury
+  I should be able to use a generator to setup my application
+
+  Scenario: I can install a basic authentication template
+    Given I have created a new rails application
+    When I successfully run `bundle exec rails generate mercury:install:authentication --trace`
+    Then the following files should exist:
+      | lib/mercury/authentication.rb           |

data/features/generators/images.feature

@@ -0,0 +1,41 @@
+Feature:
+  As a developer
+  In order to use image processing within Mercury
+  I should be able to use a generator to setup my application
+
+  Scenario: I can install the image processing files required for Mercury
+    Given I have created a new rails application
+    When I successfully run `bundle exec rails generate mercury:install:images --trace`
+    Then the following files should exist:
+      | app/controllers/mercury/images_controller.rb |
+      | app/models/mercury/image.rb |
+    And the file "app/models/mercury/image.rb" should contain "class Mercury::Image < ActiveRecord::Base"
+    And should have the migration "create_mercury_images.rb"
+    And the file "config/routes.rb" should contain:
+      """
+          namespace :mercury do
+            resources :images
+          end
+      """
+    And the file "Gemfile" should contain "gem 'paperclip'"
+
+  Scenario: I can install the image processing files required for Mercury using Mongoid
+    Given I have created a new rails application
+    When I successfully run `bundle exec rails generate mercury:install:images --orm mongoid --trace`
+    Then the following files should exist:
+      | app/controllers/mercury/images_controller.rb |
+      | app/models/mercury/image.rb |
+    And the file "app/models/mercury/image.rb" should contain:
+    """
+    class Mercury::Image
+      include Mongoid::Document
+      include Mongoid::Paperclip
+    """
+    And should not have the migration "create_mercury_images.rb"
+    And the file "config/routes.rb" should contain:
+      """
+          namespace :mercury do
+            resources :images
+          end
+      """
+    And the file "Gemfile" should contain "gem 'paperclip'"

data/features/generators/install.feature

@@ -0,0 +1,21 @@
+Feature:
+  As a developer
+  In order to use Mercury
+  I should be able to use a generator to install configuration and overrides into my application
+
+  Scenario: I can install the Mercury configuration file
+    Given I have created a new rails application
+    When I run `bundle exec rails generate mercury:install --trace` interactively
+    And I type "N"
+    Then the following files should exist:
+      | app/assets/javascripts/mercury.js             |
+    And the file "config/routes.rb" should contain "mount Mercury::Engine => '/'"
+
+  Scenario: I can install the configuration file and overrides
+    Given I have created a new rails application
+    When I successfully run `bundle exec rails generate mercury:install --full --trace`
+    Then the following files should exist:
+      | app/assets/javascripts/mercury.js             |
+      | app/assets/stylesheets/mercury.css            |
+      | app/views/layouts/mercury.html.erb            |
+    And the file "config/routes.rb" should contain "mount Mercury::Engine => '/'"

data/features/loading/loading.feature

@@ -15,8 +15,11 @@ Feature:
 
 
   Scenario: A user can expect to see the contents of the iframe
-    Then I should see "Editable region" in the content frame
+    Then I should see "Full region" in the content frame
 
 
+  # Latest selenium webdriver seems to consider the lightview hidden
+  @use_hidden_elements
   Scenario: A user can expect to see the status bar
-    Then I should see "Mercury Editor v0.3.0" within the statusbar
+    Then I should see "Mercury Editor v0.9.0" within the statusbar
+

data/features/loading/user_interface.feature

@@ -7,12 +7,14 @@ Feature:
   Background:
     Given I am on an editable page
 
-  Scenario: A user can expect all this!
+  # Scenario: A user can expect all this!
 
 
-#  Scenario: A user can view and close the about dialog
+ # Latest selenium webdriver seems to consider the lightview hidden
+ @use_hidden_elements
+ 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
+    Then I should see "Mercury Editor" within the lightview window
     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
@@ -22,7 +24,7 @@ Feature:
     And the lightview overlay should not be visible
 
 
-#  Scenario: A user can open and close select dropdowns
+  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
@@ -32,7 +34,7 @@ Feature:
     And the formatblock select should not be visible
 
 
-#  Scenario: A user can open and close palette dialogs
+ 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
 
@@ -41,7 +43,7 @@ Feature:
     And the background color palette should not be visible
 
 
-#  Scenario: A user can open and close a panel
+ 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
@@ -50,7 +52,7 @@ Feature:
     Then the history panel should not be visible
 
 
-#  Scenario: A user can open and close a modal window
+ 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

data/features/regions/full/basic_editing.feature

@@ -0,0 +1,198 @@
+@javascript
+Feature:
+  As a content editor type person
+  In order to manage content
+  I should be able to manipulate it in various ways (eg. bold, add italics, set headers, colors, etc.)
+
+  Background:
+    Given I am on an editable page
+    And the editor won't prompt when leaving the page
+
+  Scenario: A user can expect all this!
+
+
+  Scenario: A user can set and unset bold content
+    Given the content of the full region is simple content
+    And I make a selection
+
+    When I click on the bold editor button
+    Then the contents of the full region should be "this is <b><span>simple</span></b> <b>content</b>"
+
+    When I click on the bold editor button
+    Then the contents of the full region should be "this is <span>simple</span> <b>content</b>"
+
+
+  Scenario: A user can italicize content
+    Given the content of the full region is simple content
+    And I make a selection
+
+    When I click on the italicize editor button
+    Then the contents of the full region should be "this is <i><span>simple</span></i> <b>content</b>"
+
+    When I click on the italicize editor button
+    Then the contents of the full region should be "this is <span>simple</span> <b>content</b>"
+
+
+  Scenario: A user can overline content
+    Given the content of the full region is simple content
+    And I make a selection
+
+    When I click on the overline editor button
+    Then the contents of the full region should be "this is <span style='text-decoration:overline'><span>simple</span></span> <b>content</b>"
+    # doesn't remove overlines
+
+
+  Scenario: A user can strikeout content
+    Given the content of the full region is simple content
+    And I make a selection
+
+    When I click on the strikethrough editor button
+    Then the contents of the full region should be "this is <strike><span>simple</span></strike> <b>content</b>"
+
+    When I click on the strikethrough editor button
+    Then the contents of the full region should be "this is <span>simple</span> <b>content</b>"
+
+
+  Scenario: A user can underline content
+    Given the content of the full region is simple content
+    And I make a selection
+
+    When I click on the underline editor button
+    Then the contents of the full region should be "this is <u><span>simple</span></u> <b>content</b>"
+
+    When I click on the underline editor button
+    Then the contents of the full region should be "this is <span>simple</span> <b>content</b>"
+
+
+  Scenario: A user can make content superscript
+    Given the content of the full region is simple content
+    And I make a selection
+
+    When I click on the superscript editor button
+    Then the contents of the full region should be "this is <sup><span>simple</span></sup> <b>content</b>"
+
+    When I click on the superscript editor button
+    Then the contents of the full region should be "this is <span>simple</span> <b>content</b>"
+
+
+  Scenario: A user can make content subscript
+    Given the content of the full region is simple content
+    And I make a selection
+
+    When I click on the subscript editor button
+    Then the contents of the full region should be "this is <sub><span>simple</span></sub> <b>content</b>"
+
+    When I click on the subscript editor button
+    Then the contents of the full region should be "this is <span>simple</span> <b>content</b>"
+
+
+  Scenario: A user can justify content to the left, center, right, or fully justified
+    # firefox: this isn't possible on the first line due to a bug in gecko, so we have special content for it
+    Given the content of the full region has justifiable content
+    And I make a selection
+
+    When I click on the justify left editor button
+    Then the contents of the full region should be "<div>first line</div><br><div align='left'>this is <span>justifiable</span><b>content</b></div>"
+
+    When I click on the justify center editor button
+    Then the contents of the full region should be "<div>first line</div><br><div align='center'>this is <span>justifiable</span><b>content</b></div>"
+
+    When I click on the justify right editor button
+    Then the contents of the full region should be "<div>first line</div><br><div align='right'>this is <span>justifiable</span><b>content</b></div>"
+
+    When I click on the full justification editor button
+    Then the contents of the full region should be "<div>first line</div><br><div align='justify'>this is <span>justifiable</span><b>content</b></div>"
+
+
+  Scenario: A user can make an unordered list
+    Given the content of the full region is simple content
+    And I make a selection
+
+    When I click on the insert unordered list editor button
+    Then the contents of the full region should be "<ul><li>this is <span>simple</span> <b>content</b></li></ul>"
+
+    # todo: we should test enter and tab, and shift+tab in advanced editing
+
+
+  Scenario: A user can make an ordered list
+    Given the content of the full region is simple content
+    And I make a selection
+
+    When I click on the insert ordered list editor button
+    Then the contents of the full region should be "<ol><li>this is <span>simple</span> <b>content</b></li></ol>"
+
+    # todo: we should test enter and tab, and shift+tab in advanced editing
+
+
+  Scenario: A user can indent and outdent content
+    # firefox: this isn't possible on the first line due to a bug in gecko, so we have special content for it
+    Given the content of the full region has justifiable content
+    And I make a selection
+
+    When I click on the indent editor button
+    Then the contents of the full region should be "<div>first line</div><br><blockquote>this is <span>justifiable</span><b>content</b></blockquote>"
+
+    When I click on the indent editor button
+    Then the contents of the full region should be "<div>first line</div><br><blockquote><blockquote>this is <span>justifiable</span><b>content</b></blockquote></blockquote>"
+
+    When I click on the outdent editor button
+    Then the contents of the full region should be "<div>first line</div><br><blockquote>this is <span>justifiable</span><b>content</b></blockquote>"
+
+    When I click on the outdent editor button
+    Then the contents of the full region should be "<div>first line</div><br>this is <span>justifiable</span><b>content</b>"
+
+
+  Scenario: A user can insert horizontal rules
+    Given the content of the full region is simple content
+    And I make a selection
+
+    When I click on the insert hr editor button
+    Then the contents of the full region should be "this is&nbsp;<hr> <b>content</b>"
+
+    When I click on the insert hr editor button
+    Then the contents of the full region should be "this is&nbsp;<hr><hr> <b>content</b>"
+
+
+  Scenario: A user can clean/remove formatting on their selection
+    Given the content of the full region has wrapped content
+    And I make a selection
+
+    When I click on the remove formatting editor button
+    Then the contents of the full region should be "this is wrapped content"
+
+
+  Scenario: A user can wrap content within predefined styles
+    Given the content of the full region is simple content
+    And I make a selection
+
+    When I click on the style editor dropdown
+    And select the red style from the dropdown
+    Then the contents of the full region should be "this is <span class='red'><span>simple</span></span> <b>content</b>"
+
+
+  Scenario: A user can wrap content in formatted block tags
+    Given the content of the full region is simple content
+    And I make a selection
+
+    When I click on the block format editor dropdown
+    And select the heading 2 block from the dropdown
+    Then the contents of the full region should be "<h2>this is <span>simple</span> <b>content</b></h2>"
+
+
+  Scenario: A user can set the background color of a selection
+    Given the content of the full region is simple content
+    And I make a selection
+
+    When I click on the background color editor palette
+    And click on the color red
+    Then the contents of the full region should be "this is <span style='background-color:#FF0000'><span>simple</span></span> <b>content</b>"
+
+
+  Scenario: A user can set the foreground color
+    Given the content of the full region is simple content
+    And I make a selection
+
+    When I click on the foreground color editor palette
+    And click on the color red
+    Then the contents of the full region should be "this is <font color='#FF0000'><span>simple</span></font> <b>content</b>"
+

data/features/regions/{editable → full}/inserting_links.feature

@@ -8,11 +8,11 @@ Feature:
     Given I am on an editable page
     And the editor won't prompt when leaving the page
 
-  Scenario: A user can expect all this!
+  # Scenario: A user can expect all this!
 
 
-#  Scenario: A user can insert and edit a link to an external site
-    Given the content of the editable region is simple content
+  Scenario: A user can insert and edit a link to an external site
+    Given the content of the full region is simple content
     And I make a selection
 
     When I click on the "Insert Link" button
@@ -21,7 +21,7 @@ Feature:
 
     When I fill in "URL" with "http://google.com"
     And press "Insert Link"
-    Then the contents of the editable region should be "this is <a href='http://google.com'>simple</a> <b>content</b>"
+    Then the contents of the full region should be "this is <a href='http://google.com'>simple</a> <b>content</b>"
     And the modal window should not be visible
 
     When I click on the "Insert Link" button
@@ -29,27 +29,27 @@ Feature:
 
     When I fill in "URL" with "http://cnn.com"
     And press "Insert Link"
-    Then the contents of the editable region should be "this is <a href='http://cnn.com'>simple</a> <b>content</b>"
+    Then the contents of the full region should be "this is <a href='http://cnn.com'>simple</a> <b>content</b>"
 
 
-#  Scenario: A user can insert and edit a link with a target set
-    Given the content of the editable region is simple content
+  Scenario: A user can insert and edit a link with a target set
+    Given the content of the full region is simple content
     And I make a selection
 
     When I click on the "Insert Link" button
     And fill in "URL" with "http://google.com"
     And select "Blank (a new window or tab)" from "Link Target"
     And press "Insert Link"
-    Then the contents of the editable region should be "this is <a target='_blank' href='http://google.com'>simple</a> <b>content</b>"
+    Then the contents of the full region should be "this is <a target='_blank' href='http://google.com'>simple</a> <b>content</b>"
 
     When I click on the "Insert Link" button
     And select "Top (removes any frames)" from "Link Target"
     And press "Insert Link"
-    Then the contents of the editable region should be "this is <a target='_top' href='http://google.com'>simple</a> <b>content</b>"
+    Then the contents of the full region should be "this is <a target='_top' href='http://google.com'>simple</a> <b>content</b>"
 
 
-#  Scenario: A user can insert a link to an external site and open it in a popup
-    Given the content of the editable region is simple content
+  Scenario: A user can insert a link to an external site and open it in a popup
+    Given the content of the full region is simple content
     And I make a selection
 
     When I click on the "Insert Link" button
@@ -58,29 +58,29 @@ Feature:
     And I fill in "Popup Width" with "500"
     And fill in "Popup Height" with "200"
     And press "Insert Link"
-    Then the contents of the editable region should be "this is <a href='javascript:void(window.open('http://google.com', 'popup_window', 'width=500,height=200,menubar=no,toolbar=no'))'>simple</a> <b>content</b>"
+    Then the contents of the full region should be "this is <a href='javascript:void(window.open('http://google.com', 'popup_window', 'width=500,height=200,menubar=no,toolbar=no'))'>simple</a> <b>content</b>"
 
     When I click on the "Insert Link" button
     Then the "Popup Width" field should contain "500"
     And the "Popup Height" field should contain "200"
 
 
-#  Scenario: A user can insert a bookmark and then link to it
-    Given the content of the editable region is simple content
+  Scenario: A user can insert a bookmark and then link to it
+    Given the content of the full region is simple content
     And I make a selection
 
     When I click on the "Insert Link" button
     And I choose "Bookmark"
     And fill in "Bookmark" with "test-bookmark1"
     And press "Insert Link"
-    Then the contents of the editable region should be "this is <a name='test-bookmark1'>simple</a> <b>content</b>"
+    Then the contents of the full region should be "this is <a name='test-bookmark1'>simple</a> <b>content</b>"
 
     When I make a selection for "b"
     And click on the "Insert Link" button
     And I choose "Existing Links"
     And select "simple" from "Existing Links"
     And press "Insert Link"
-    Then the contents of the editable region should be "this is <a name='test-bookmark1'>simple</a> <a href='#test-bookmark1'>content</a>"
+    Then the contents of the full region should be "this is <a name='test-bookmark1'>simple</a> <a href='#test-bookmark1'>content</a>"
 
     When I make a selection for "a"
     And click on the "Insert Link" button
@@ -89,10 +89,11 @@ Feature:
     And I choose "Bookmark"
     And fill in "Bookmark" with "test-bookmark2"
     And press "Insert Link"
-    Then the contents of the editable region should be "this is <a name='test-bookmark2'>simple</a> <a href='#test-bookmark1'>content</a>"
+    Then the contents of the full region should be "this is <a name='test-bookmark2'>simple</a> <a href='#test-bookmark1'>content</a>"
 
     # todo: when I change the name of a bookmark, and bookmarks that are pointing to me should also be updated (on this page)
 
 
-  Scenario: A user can navigate links inside of regions
-    # todo: finish
+  # Scenario: A user can navigate links inside of regions
+    # todo: finish
+