active_admin_editor 0.3.6 → 1.0.0

data/app/assets/javascripts/active_admin/editor/templates/toolbar.jst.ejs

@@ -0,0 +1,47 @@
+<div id="<%= id %>" class="toolbar">
+  <ul>
+    <li><a data-wysihtml5-action="change_view">Source</a></li>
+    <li><a data-wysihtml5-command="bold" title="Bold">Bold</a></li>
+    <li><a data-wysihtml5-command="italic" title="Italic">Italic</a></li>
+    <li><a data-wysihtml5-command="createLink" title="Link">Link</a></li>
+    <li><a data-wysihtml5-command="insertImage" class="insertImage" title="Image">Image</a></li>
+    <li><a data-wysihtml5-command="insertUnorderedList" title="Unordered list">Bulleted List</a></li>
+    <li><a data-wysihtml5-command="insertOrderedList" title="Ordered list">Numbered List</a></li>
+    <li><a data-wysihtml5-command="formatBlock" data-wysihtml5-command-value="h1">h1</a></li>
+    <li><a data-wysihtml5-command="formatBlock" data-wysihtml5-command-value="h2">h2</a></li>
+    <li><a data-wysihtml5-command="formatBlock" data-wysihtml5-command-value="h3">h3</a></li>
+  </ul>
+
+  <div class="dialog" data-wysihtml5-dialog="createLink" style="display: none;">
+    <div class="action-group">
+      <a href="#" data-wysihtml5-dialog-action="save" class="button">OK</a>
+      <a href="#" data-wysihtml5-dialog-action="cancel">Cancel</a>
+    </div>
+    <label>
+      Link:
+      <input class="uploadable" type="text" data-wysihtml5-dialog-field="href" value="http://">
+    </label>
+    <div style="clear: both;"></div>
+  </div>
+
+  <div class="dialog" data-wysihtml5-dialog="insertImage" style="display: none;">
+    <div class="action-group">
+      <a href="#" data-wysihtml5-dialog-action="save" class="button">OK</a>
+      <a href="#" data-wysihtml5-dialog-action="cancel">Cancel</a>
+    </div>
+    <label>
+      Image URL:
+      <input class="uploadable" type="text" data-wysihtml5-dialog-field="src" value="http://" id="image_url">
+    </label>
+    <label>
+      Align:
+      <select data-wysihtml5-dialog-field="className">
+        <option value="">default</option>
+        <option value="wysiwyg-float-left">left</option>
+        <option value="wysiwyg-float-right">right</option>
+      </select>
+    </label>
+    <div style="clear: both;"></div>
+  </div>
+  
+</div>

data/app/assets/javascripts/active_admin/editor/templates/uploader.jst.ejs

@@ -0,0 +1,6 @@
+<div class="upload">
+  or
+  <input type="file" />
+  <img src="<%= spinner %>" class="spinner"></img>
+</div>
+<div style="clear: both;"></div>

data/app/assets/stylesheets/active_admin/editor.css.scss

@@ -1,219 +1,80 @@
 @import 'active_admin/mixins';
-@import 'active_admin/editor/wysiwyg';
 
-.active_admin_editor {
+.html_editor {
+  .wrap {
     width: 76%;
     float: left;
-
-    textarea {
-        width: 100%;
-        font-family: Georgia;
-        font-size: 1.3em;
-        height: 700px;
-        line-height: 1.5em;
+  }
+
+  &.uploading .spinner {
+    display: inline;
+  }
+
+  .spinner {
+    display: none;
+  }
+
+  textarea {
+    border-radius: 0 0 3px 3px;
+    width: 100%;
+    height: 300px;
+    border-top: 1px solid lighten(#C9D0D6, 10%);
+
+    &:focus {
+      @include box-shadow(none);
+      border: 1px solid #C9D0D6;
+      border-top: 1px solid lighten(#C9D0D6, 10%);
+    }
+  }
+
+  .toolbar {
+    width: 100%;
+    padding: 0 10px;
+    border: 1px solid #C9D0D6;
+    border-bottom: none;
+    border-radius: 3px 3px 0 0;
+    background: #fff;
+
+    ul li {
+      display: inline-block;
     }
 
-    .active_admin_editor_toolbar {
-        position: relative;
-        margin-bottom: 8px;
-
-        /* Formatting Buttons */
-        [data-wysihtml5-command],
-        [data-wysihtml5-action="change_view"] {
-          text-decoration: none;
-          background: #fff;
-          color: #000;
-          padding: 4px 6px;
-          margin: 0 2px 2px 0;
-          border: 1px solid #C9D0D6;
-          border-radius: 4px;
-
-          &.wysihtml5-command-active {
-            @include gradient(#eee, #f9f9f9);
-          }
-        }
-
-        &.wysihtml5-commands-disabled [data-wysihtml5-command] {
-          opacity: 0.5;
-        }
-
-        &.wysihtml5-commands-disabled [data-wysihtml5-action="change_view"] {
-          @include gradient(#eee, #f9f9f9);
-        }
-
-        [data-wysihtml5-command="bold"] {
-          font-weight: bold;
-        }
-
-        [data-wysihtml5-command="italic"] {
-          font-style: italic;
-        }
-
-        [data-wysihtml5-command="createLink"] span {
-          border-bottom: 1px solid #38678B;
-        }
-
-        /* Dialog Window */
-        [data-wysihtml5-dialog] {
-            position: absolute;
-            top: 35px;
-            left: 10px;
-            width: 600px;
-            background: #fff;
-            padding: 20px;
-            border: 1px solid #c9d0d6;
-
-            -moz-border-radius: 3px;
-            -webkit-border-radius: 3px;
-            border-radius: 3px;
-
-            -moz-box-shadow: 0 0 5px #ccc;
-            -webkit-box-shadow: 0 0 5px #ccc;
-            box-shadow: 0 0 5px #ccc;
-
-            label {
-                display: block;
-                margin: 10px 0;
-
-                & + label {
-                  clear: both;
-                }
-            }
-
-            input {
-                width: 400px;
-                border: 1px solid #c9d0d6;
-                -webkit-border-radius: 3px;
-                -moz-border-radius: 3px;
-                border-radius: 3px;
-                font-size: 0.95em;
-                font-family: Helvetica, Arial, sans-serif;
-                outline: none;
-                padding: 8px 10px 7px;
-            }
-
-            .asset_scale_selection {
-              clear: both;
-              @include clearfix;
-
-              label {
-                clear: none;
-                display: block;
-                float: left;
-                width: auto;
-                margin-right: 20px;
-
-                input {
-                  width: auto;
-                }
-              }
-
-              & + label {
-                clear: both;
-              }
-            }
-
-            #asset_uploader {
-              margin-top: 27px;
-              float: right;
-            }
-
-            .assets_container {
-              clear: both;
-              @include clearfix;
-              margin: 10px 0;
-              padding: 20px 0;
-
-              .asset {
-                float: left;
-                margin: 5px;
-                line-height: 0;
-                width: 110px;
-                height: 126px;
-                text-align: center;
-
-                &.active {
-                  img {
-                    border-color: #999;
-                  }
-                }
-
-                img {
-                  cursor: pointer;
-                  border: 3px solid #ddd;
-                }
-              }
-
-              a.upload {
-                display: block;
-                float: right;
-                margin-right: 20px;
-              }
-
-              .page_navigation {
-                clear: both;
-                float: right;
+    ul li a {
+      display: block;
+      padding: 5px 10px;
+      text-decoration: none;
 
-                & > span {
-                  display: inline-block;
-                  margin: 0 3px;
+      &.wysihtml5-command-active,
+      &.wysihtml5-action-active,
+      &.wysihtml5-command-dialog-opened {
+        text-decoration: underline;
+      }
+    }
+  }
 
-                  &.active {
-                    font-weight: bold;
-                  }
-                }
-              }
-            }
+  .dialog {
+    border-top: 1px solid lighten(#C9D0D6, 10%);
+    padding: 10px 20px;
+    margin: 0 -10px;
 
-            .action-group {
-                padding-top: 20px;
-                clear: both;
-            }
+    label {
+      margin-bottom: 10px;
+      width: 300px;
 
-            [data-wysihtml5-dialog-action] {
-                cursor: pointer;
-            }
-        }
+      input {
+        display: block;
+      }
 
-        .button.quicksave {
-            float: right;
-            margin-top: -5px;
-            margin-right: -20px;
-            position: relative;
-            top: -5px;
-        }
+      select {
+        display: block;
+      }
     }
-}
 
-// AJAX Uploader
-.qq-uploader { position:relative; width: 100%; clear: both;}
-
-.qq-upload-button {
-    display:block; /* or inline-block */
-    width: 105px; padding: 7px 0; text-align:center;    
-    background:#880000; border-bottom:1px solid #ddd;color:#fff;
-}
-.qq-upload-button-hover {background:#cc0000;}
-.qq-upload-button-focus {outline:1px dotted black;}
-
-.qq-upload-drop-area {
-    position:absolute; top:0; left:0; width:100%; height:100%; min-height: 70px; z-index:2;
-    background:#FF9797; text-align:center; 
-}
-.qq-upload-drop-area span {
-    display:block; position:absolute; top: 50%; width:100%; margin-top:-8px; font-size:16px;
-}
-.qq-upload-drop-area-active {background:#FF7171;}
-
-.qq-upload-list {display: none;margin:15px 35px; padding:0; list-style:disc;}
-.qq-upload-list li { margin:0; padding:0; line-height:15px; font-size:12px;}
-.qq-upload-file, .qq-upload-spinner, .qq-upload-size, .qq-upload-cancel, .qq-upload-failed-text {
-    margin-right: 7px;
+    .action-group {
+      display: block;
+      float: right;
+      margin-top: 5px;
+      clear: both;
+    }
+  }
 }
-
-.qq-upload-file {}
-.qq-upload-spinner {display:inline-block; background: url("loading.gif"); width:15px; height:15px; vertical-align:text-bottom;}
-.qq-upload-size,.qq-upload-cancel {font-size:11px;}
-
-.qq-upload-failed-text {display:none;}
-.qq-upload-fail .qq-upload-failed-text {display:inline;}

data/app/inputs/html_editor_input.rb

@@ -1,89 +1,19 @@
 class HtmlEditorInput < Formtastic::Inputs::TextInput
-  def toolbar
-    <<-HTML
-    <div id="#{input_html_options[:id]}-toolbar" class="active_admin_editor_toolbar">
-      
-      <a data-wysihtml5-action="change_view"><span>Source</span></a>
-      <a data-wysihtml5-command="bold" title="Bold"><span>Bold</span></a>
-      <a data-wysihtml5-command="italic" title="Italic"><span>Italic</span></a>
-      <a data-wysihtml5-command="createLink" title="Link"><span>Link</span></a>
-      <a data-wysihtml5-command="insertImage" class="insertImage" title="Image"><span>Image</span></a>
-      <a data-wysihtml5-command="insertUnorderedList" title="Unordered list"><span>Bulleted List</span></a>
-      <a data-wysihtml5-command="insertOrderedList" title="Ordered list"><span>Numbered List</span></a>
-      <a data-wysihtml5-command="formatBlock" data-wysihtml5-command-value="h1">h1</a>
-      <a data-wysihtml5-command="formatBlock" data-wysihtml5-command-value="h2">h2</a>
-      <a data-wysihtml5-command="formatBlock" data-wysihtml5-command-value="h3">h3</a>
-      #{%Q{<a class="button quicksave" href="#">Save</a>} if input_html_options[:quicksave]}
+  def upload_enabled?
+    ActiveAdmin::Editor.configuration.s3_configured?
+  end
 
-      <div data-wysihtml5-dialog="createLink" style="display: none">
-        <label>
-          Link:
-          <input data-wysihtml5-dialog-field="href" value="http://">
-        </label>
-        <div class="action-group">
-          <a data-wysihtml5-dialog-action="save" class="button">OK</a>
-          <a data-wysihtml5-dialog-action="cancel">Cancel</a>
-        </div>
-      </div>
-      
-      <div data-wysihtml5-dialog="insertImage" style="display: none">
-        <div id="asset_uploader">
-          <noscript>
-            <a href="/admin/image_assets/new">Upload &raquo;</a>
-          </noscript>
-        </div>
-        <label>
-          Image:
-          <input data-wysihtml5-dialog-field="src" value="http://" />
-        </label>
-        <div class="assets_container">
-        </div>
-        <div class="asset_scale_selection">
-          <label>Scale:</label>
-          <label>
-            100%
-            <input data-scale="full" type="radio" name="asset_scale" checked="checked" />
-          </label>
-          <label>
-            75%
-            <input data-scale="three_quarters" type="radio" name="asset_scale" />
-          </label>
-          <label>
-            50%
-            <input data-scale="half" type="radio" name="asset_scale" />
-          </label>
-          <label>
-            25%
-            <input data-scale="one_quarter" type="radio" name="asset_scale" />
-          </label>
-        </div>
-        <label>
-          Align:
-          <select data-wysihtml5-dialog-field="className">
-            <option value="">default</option>
-            <option value="wysiwyg-float-left">left</option>
-            <option value="wysiwyg-float-right">right</option>
-          </select>
-        </label>
-        <div class="action-group">
-          <a data-wysihtml5-dialog-action="save" class="button">OK</a>
-          <a data-wysihtml5-dialog-action="cancel">Cancel</a>
-        </div>
-      </div>
-      
-    </div>
-    HTML
+  def policy
+    ActiveAdmin::Editor::Policy.new
   end
 
-  def input_html_options
-    {
-      quicksave: false
-    }.merge(super)
+  def wrapper_html_options
+    return super unless upload_enabled?
+    super.merge( :data => { :policy => policy.to_json })
   end
 
   def to_html
-    html = '<div class="active_admin_editor">'
-    html << toolbar.html_safe
+    html = '<div class="wrap">'
     html << builder.text_area(method, input_html_options)
     html << '</div>'
     html << '<div style="clear: both"></div>'

data/lib/active_admin/editor.rb

@@ -1,4 +1,4 @@
-require 'carrierwave'
-
 require 'active_admin/editor/version'
+require 'active_admin/editor/config'
+require 'active_admin/editor/policy'
 require 'active_admin/editor/rails/engine'

data/lib/active_admin/editor/config.rb

@@ -0,0 +1,34 @@
+require 'logger'
+
+module ActiveAdmin
+  module Editor
+    class << self
+      # Returns the current Configuration
+      def configuration
+        @configuration ||= Configuration.new
+      end
+
+      # Yields the Configuration
+      def configure
+        yield configuration
+      end
+    end
+
+    class Configuration
+      attr_accessor :aws_access_key_id
+      attr_accessor :aws_access_secret
+      attr_accessor :s3_bucket
+      attr_accessor :storage_dir
+
+      def storage_dir
+        @storage_dir ||= 'uploads'
+      end
+
+      def s3_configured?
+        aws_access_key_id.present? &&
+          aws_access_secret.present? &&
+          s3_bucket.present?
+      end
+    end
+  end
+end