Filemanager for CKeditor

app/assets/javascripts/admin/filemanager.js

@@ -0,0 +1,141 @@
+!function ($) {
+    $.fn.checkListLength = function (param){
+        _defaultSettings = {
+            onlyOne: null,
+        };
+        _set = $.extend(_defaultSettings, param);
+        $this = this;
+        $li = this.children('li');
+        $dropzone = $('#dropzone');
+        if(($li.length - _set.onlyOne) == 0) {
+        $('#dropzone').fadeIn(300);
+    } else {
+        $('#dropzone').fadeOut(300);
+    };
+    $('#file-list').nanoScroller({ scrollTop: 0, iOSNativeScrolling: true });
+    }
+}(window.jQuery);
+$(function () {
+    'use strict';
+    // Initialize the jQuery File Upload widget:
+    $('#fileupload').fileupload({
+        maxFileSize: 5000000,
+        acceptFileTypes: /(\.|\/)(gif|jpe?g|png|pdf|doc|docx|ppt|pptx|xls|xlsx)$/i,
+        dropZone: $('#dropzone'),
+        headers:{
+            'X-CSRF-Token': $('meta[name="csrf-token"]').attr("content")
+        }
+    }).bind('fileuploadstop', function (e, data) {
+      window.location.reload();
+    });
+});
+$(document).ready(function(){
+  var insertBtn = $("#insert_btn"),
+    deleteBtn = $("#delete_btn"),
+    url = null;
+  
+  var showPreview = function(elem){
+    var type = $("#ext_" + elem.val()).val(),
+      imgexp = new RegExp(/(\.|\/)(gif|jpe?g|png)$/i),
+      otherexp = new RegExp(/(\.|\/)(pdf|doc|docx|ppt|pptx|xls|xlsx)$/i)
+      img = $("<img />"),
+      preview = $( ".preview-area" );
+    preview.text("Preview is loading...");
+    if( imgexp.test(type) ){
+      var url = $("#url_" + elem.val()).val();
+      img.attr("src",url).load(function(){
+        var ratio = this.width / this.height,
+          targetWidth = targetHeight = 200;
+        if( ratio < 1 ){
+          targetWidth = targetHeight * ratio;
+        }else{
+          targetHeight = targetWidth / ratio;
+        }
+        img.height(targetHeight).width(targetWidth);
+        preview.html(img);
+      })
+    }else if( otherexp.test(type) ) {
+      var t = type.replace(".",""),
+        url = "/assets/ft-icons/" + t + "/" + t + "-128_32.png";
+      img.attr('src', url).load(function(){
+        preview.html(img);
+      });
+    }else{
+      preview.html("Preview not available.");
+    }
+  }
+
+  $("#asset_sort_list").on(clickEvent,"input[type=checkbox]",function(){
+    if($("#asset_sort_list input[type=checkbox]:checked").length == 1){
+      url = window.location.protocol + "//" + window.location.host + $("#url_" + $("input[type=checkbox]:checked").val()).val();
+      insertBtn.show();
+      showPreview($("input[type=checkbox]:checked"))
+    }else{
+      insertBtn.hide();
+      url = null;
+      $( ".preview-area" ).empty();
+    }
+    if($("#asset_sort_list input[type=checkbox]:checked").length)
+      deleteBtn.show();
+    else
+      deleteBtn.hide();
+  })
+  insertBtn.bind(clickEvent,function(){
+    var alt_text = $("#"+language+"_desc_"+$("input[type=checkbox]:checked").val()).val();
+    alt_text = (alt_text ? alt_text : "This is an image");
+    if(url){
+      window.opener.CKEDITOR.tools.callFunction( funcNum, url, function() {
+          var element,
+              dialog = this.getDialog();
+          if ( dialog.getName() == 'image' ) {
+              element = dialog.getContentElement( 'info', 'txtAlt' );
+              if ( element )
+                  element.setValue( alt_text );
+          }
+      });
+      window.close();
+    }
+  })
+  deleteBtn.bind( clickEvent,function(){
+    var items_to_delete = [],
+      type = getUrlParam("type");
+    $("input[type=checkbox]:checked").each(function(){
+      items_to_delete.push($(this).val());
+    })
+    $.post("/admin/assets/delete_files",{"files":items_to_delete,"type":type},function(){
+      deleteBtn.hide();
+    })
+  })
+  var currentEdit = null;
+  $(document).on("ajax:success","form[data-remote=true]",function(evt, data, xhr){
+    if(currentEdit){
+      currentEdit.replaceWith($(data));
+      $("#editform").modal("hide");
+    }
+  })
+
+  $("#asset_sort_list").on(clickEvent,".editform",function(){
+    currentEdit = $(this).parent().parent();
+    $.get($(this).attr("href"),function(data){
+      $("#editform").html(data).modal("show");
+    })
+    return false;
+  })
+
+  $("#editform").on("hidden",function(){
+    currentEdit = null;
+  })
+
+  function getUrlParam( paramName ) {
+      var reParam = new RegExp( '(?:[\?&]|&)' + paramName + '=([^&]+)', 'i' ) ;
+      var match = window.location.search.match(reParam) ;
+
+      return ( match && match.length > 1 ) ? match[ 1 ] : null ;
+  }
+  var funcNum = getUrlParam( 'CKEditorFuncNum' ),
+    t = getUrlParam('CKEditor').split("_"),
+    language = t[t.length-1];
+
+  language = (language == "tw" ? "zh_tw" : language); 
+
+})

app/assets/javascripts/ckeditor/config.js.erb

@@ -26,9 +26,8 @@ CKEDITOR.editorConfig = function( config ) {
 	// config.filebrowserImageBrowseUrl = '/browser/browse.php?type=Images';
 	// config.filebrowserUploadUrl = '/uploader/upload.php';
 	
-	config.filebrowserBrowseUrl = "<%= Rails.application.routes.url_helpers.admin_assets_path(:module_app_id=>ModuleApp.where(:key=>'asset').first.id) rescue '' %>";
+	config.filebrowserBrowseUrl = "<%= Rails.application.routes.url_helpers.admin_assets_path %>";
-	config.filebrowserImageBrowseUrl = "<%= Rails.application.routes.url_helpers.admin_assets_path(:type=>'image',:module_app_id=>ModuleApp.where(:key=>'asset').first.id) rescue '' %>";
+	config.filebrowserImageBrowseUrl = "<%= Rails.application.routes.url_helpers.admin_assets_path %>";
-  	// config.filebrowserUploadUrl = "<%#= Rails.application.routes.url_helpers.file_upload_admin_assets_path %>";
 
 	// config.contentsCss  = '/orbit_4.0.1/assets/javascripts/lib/ckeditor/plugins/stylesheetparser/samples/assets/sample.css';
 	

app/assets/stylesheets/lib/filemanager.css

@@ -2,7 +2,7 @@ body > section {
   padding: 20px;
 }
 #panel_l {
-  width: 80%;
+  width: 75%;
 }
 #panel_l .control-label {
   margin-right: 10px;
@@ -11,7 +11,7 @@ body > section {
   margin-left: 0;
 }
 #panel_r {
-  width: 18%;
+  width: 23%;
   padding-left: 2%;
 }
 #panel_r .control-label {
@@ -30,7 +30,7 @@ body > section {
   width: auto;
 }
 #filemanager .preview-area {
-  margin-bottom: 0;
+  margin-bottom: 40px;
   text-align: center;
 }
 #editform .edit_asset {

app/controllers/admin/assets_controller.rb

@@ -0,0 +1,66 @@
+class Admin::AssetsController < OrbitAdminController
+  
+  def index
+    @assets = current_user.assets
+    @assets = @assets.page(params[:page]).per(10)
+    render :layout => "assets" 
+  end
+
+  def new
+    
+  end
+
+  def create
+    
+  end
+
+  def edit
+    @asset = Asset.find(params[:id])
+    render layout: false
+  end
+
+  def update
+    @asset = Asset.find(params[:id])
+    @asset.update_attributes(asset_params)
+    if asset_params['data'].blank?
+      render layout: false
+    else
+      redirect_to admin_assets_path
+    end
+  end
+
+  def destroy
+    
+  end
+
+  def delete
+    
+  end
+
+  def delete_files
+    Asset.where(:id.in=>params[:files]).destroy
+    @assets = current_user.assets.page(params[:page]).per(10)
+  end
+
+  def file_upload
+    @files = params['files']
+    a = Array.new
+    @files.each do |file|
+      @asset = current_user.assets.new
+      @asset.data = file
+      @asset.title_translations = {:en => file.original_filename, :zh_tw => file.original_filename}
+      @asset.save!
+      a << {"url"=>@asset.data.url}
+    end
+    render :json=>{"files"=>a}.to_json
+  end
+
+  def file_select
+    
+  end
+
+  def asset_params
+    params.require(:asset).permit! unless params[:asset].blank?
+  end
+
+end

app/helpers/orbit_backend_helper.rb

@@ -118,7 +118,7 @@ module OrbitBackendHelper
       visits = Impression.where( created_at: {
         '$gte' => Time.now.beginning_of_day-i.days, 
         '$lte' => Time.now.end_of_day-i.days}
-        ).count
+        ).distinct(:request_hash).count
       result.push([ Time.now.beginning_of_day-i.days, visits])
     end
 

app/models/asset.rb

@@ -0,0 +1,24 @@
+class Asset
+  include Mongoid::Document
+  include Mongoid::Timestamps
+
+  mount_uploader :data, AssetUploader
+
+  field :filename
+  field :description, localize: true
+  field :title, localize: true
+
+  delegate :url, :current_path, :size, :content_type, :filename, :to => :data
+
+  belongs_to :user
+
+  validates_presence_of :data
+
+  def content_type
+    data.file.content_type
+  end
+
+  def file_size
+    data.file.size
+  end
+end

app/models/ckeditor/asset.rb

@@ -1,7 +0,0 @@
-class Ckeditor::Asset
-  include Ckeditor::Orm::Mongoid::AssetBase
-
-  delegate :url, :current_path, :size, :content_type, :filename, :to => :data
-
-  validates_presence_of :data
-end

app/models/ckeditor/attachment_file.rb

@@ -1,7 +0,0 @@
-class Ckeditor::AttachmentFile < Ckeditor::Asset
-  mount_uploader :data, CkeditorAttachmentFileUploader, :mount_on => :data_file_name
-
-  def url_thumb
-    @url_thumb ||= Ckeditor::Utils.filethumb(filename)
-  end
-end

app/models/ckeditor/picture.rb

@@ -1,7 +0,0 @@
-class Ckeditor::Picture < Ckeditor::Asset
-  mount_uploader :data, CkeditorPictureUploader, :mount_on => :data_file_name
-
-  def url_content
-    url(:content)
-  end
-end

app/models/user.rb

@@ -9,6 +9,7 @@ class User
   field :password_digest, type: String
   field :confirmation_token, type: String
   field :reset_token, type: String
+  has_many :assets
 
   index({ confirmation_token: 1}, { unique: true })
 

app/views/admin/assets/_asset.html.erb

@@ -0,0 +1,17 @@
+<tr id="asset_<%= asset.id %>" class="with_action">
+  <td>
+    <%= check_box_tag 'files[]', asset.id, false, :class => "checkbox_in_list" %>
+    <input type="hidden" value="<%= asset.data.url %>" id="url_<%= asset.id %>" />
+    <% @current_site.in_use_locales.each_with_index do |locale, i| %>
+      <input type="hidden" value="<%= asset.description_translations[locale] rescue nil %>" id="<%= locale %>_desc_<%= asset.id %>" />
+      <input type="hidden" value="<%= asset.title_translations[locale] rescue nil %>" id="<%= locale %>_title_<%= asset.id %>" />
+    <% end %>
+    <input type="hidden" value="<%= File.extname(asset.data.url) %>" id="ext_<%= asset.id %>" />
+  </td>
+  <td><%= asset.title_translations[I18n.locale.to_s] rescue nil %></td>
+  <td><%= number_to_human_size(asset.data.file.size) rescue nil %></td>
+  <td><%= asset.description rescue nil %></td>
+  <td>
+    <a href="<%= edit_admin_asset_path(asset) %>" class="editform"><%= t(:edit) %></a>
+  </td>
+</tr>

app/views/admin/assets/delete_files.js.erb

@@ -0,0 +1,2 @@
+$("#tbody_assets").html("<%= j render :partial => 'asset', :collection => @assets %>");
+$("#asset_pagination").html("<%= j paginate @assets, :params => {:direction => params[:direction], :sort => params[:sort], :filter => @filter, :new_filter => nil} %>");

app/views/admin/assets/edit.html.erb

@@ -0,0 +1,55 @@
+<div class="modal-header">
+    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+    <h3><%= t('edit_file') %></h3>
+</div>
+<%= form_for @asset, :url => admin_asset_path(@asset), :remote => true do |f| %>
+  <%= token_tag form_authenticity_token %>
+  <div class="modal-body main-forms" id="modal_body">
+    <fieldset>
+      <div class="input-area form-horizontal">
+        <div class="nav-name">
+          <strong><%= t(:language) %></strong>
+        </div>
+        <ul class="nav nav-pills language-nav">
+          <% @current_site.in_use_locales.each_with_index do |locale, i| %>
+            <li <%= ( i == 0 ) ? "class=active" : '' %>><a data-toggle="tab" href=".<%= locale %>"><%= t(locale) %></a></li>
+          <% end %>
+        </ul>
+        <div class="tab-content">
+          <% @current_site.in_use_locales.each_with_index do |locale, i| %>
+            <div class="<%= locale %> fade tab-pane <%= ( i == 0 ) ? "in active" : '' %>">
+              <div class="control-group input-title">
+                <%= f.label :title , t('title'), :class=>"control-label muted" %>
+                <div class="controls">
+                  <%= f.fields_for :title_translations do |f| %>
+                    <%= f.text_field locale, :class=>'post-title', :value => (@asset.title_translations[locale] rescue nil) %>
+                  <% end %>
+                </div>
+              </div>
+              <div class="control-group input-content">
+                <%= f.label :description ,t('description'), :class => "control-label muted" %>
+                <%= f.fields_for :description_translations do |f| %>
+                  <div class="controls">
+                    <div class="textarea">
+                      <%= f.text_area locale, :style=>"height:100px", :class => '', :value => (@asset.description_translations[locale] rescue nil) %>
+                    </div>
+                  </div>
+                <% end %>
+              </div>
+            </div>
+          <% end %>
+        </div>
+        <div class="control-group">
+          <label class="control-label muted"><%= f.label :data, t(:file_) %></label>
+          <div class="controls">
+            <%= f.file_field :data, :class => 'upload' %>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div class="modal-footer">
+    <a href="#" class="btn" data-dismiss="modal">Close</a>
+      <%= f.submit t('submit'), class: 'btn btn-primary' %>
+  </div>
+<% end %>

app/views/admin/assets/index.html.erb

@@ -0,0 +1,400 @@
+<style>
+  /* File Upload */
+  #upload-panel {
+    clear: both;
+  }
+  #upload-panel iframe {
+    width: 100%;
+    border: none;
+  }
+  #fileupload {
+    position: relative;
+    clear: both;
+    overflow: hidden;
+    margin: 0 0 20px;
+    height: 254px;
+    border: 1px solid #d4d4d4;
+    border-radius: 4px;
+    background-color: #FDFDFD;
+    /*-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, .15) inset;
+        box-shadow: 0px 0px 10px rgba(0, 0, 0, .15) inset;*/
+  }
+  #fileupload table {
+    margin: 0;
+  }
+  #fileupload .fileupload-buttonbar .navbar {
+    margin-bottom: 0;
+  }
+  #fileupload .fileupload-buttonbar .navbar .add-photo {
+    border: none;
+    border-right: 1px solid #d4d4d4;
+    background-color: transparent;
+    padding: 10px 15px 10px;
+    color: #777777;
+    text-decoration: none;
+    text-shadow: 0 1px 0 #ffffff;
+  }
+  #fileupload .fileupload-buttonbar .navbar .add-photo:hover {
+    color: #333333;
+    text-decoration: none;
+    background-color: #EDEDED;
+  }
+  #fileupload .fileupload-buttonbar .navbar .fileinput-button {
+    position: relative;
+    overflow: hidden;
+  }
+  #fileupload .fileupload-buttonbar .navbar .fileinput-button input {
+    position: absolute;
+    top: 0;
+    right: 0;
+    margin: 0;
+    font-size: 23px;
+    opacity: 0;
+    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
+    filter: alpha(opacity=0);
+    cursor: pointer;
+    -webkit-transform: translate(-300px, 0) scale(4);
+       -moz-transform: translate(-300px, 0) scale(4);
+      -ms-transform: translate(-300px, 0) scale(4);
+       -o-transform: translate(-300px, 0) scale(4);
+        transform: translate(-300px, 0) scale(4);
+    direction: ltr;
+  }
+  #fileupload .fileupload-buttonbar .navbar-inner {
+    border-width: 0 0 1px;
+    border-radius: 4px 4px 0 0;
+    padding: 0;
+  }
+
+  #fileupload .fileupload-progress .progress {
+    position: absolute;
+    right: 0;
+    left: 0;
+    margin-bottom: 0;
+    height: 5px;
+    border-radius: 0;
+    background-color: transparent;
+    background-image: none;
+  }
+  #fileupload .fileupload-progress .progress-success.progress-striped .bar {
+    background-color: #0088CC;
+  }
+  #fileupload .fileupload-progress .progress-extended {
+    position: absolute;
+    top: 1px;
+    right: 0;
+    padding-right: 15px;
+    color: #0088CC;
+    text-align: right;
+    text-shadow: 0 1px 0 #ffffff;
+    letter-spacing: -0.1em;
+    font-size: 12px;
+    font-family: 'Varela Round', sans-serif;
+    line-height: 40px;
+  }
+  #fileupload .fileupload-buttonbar {
+    position: relative;
+    z-index: 3;
+  }
+  #fileupload #dropzone {
+    margin: 15px 10px 10px;
+    padding: 30px;
+    text-align: center;
+    font-size: 2em;
+    font-family: 'Raleway';
+    line-height: 1.2em;
+    color: #e4e4e4;
+  }
+  #fileupload #dropzone div[data-icons] {
+    font-size: 4em;
+    height: 70px;
+    padding-top: 30px;
+    text-shadow: 0px -1px 0px #ececec;
+    color: #f5f5f5;
+  }
+  #fileupload #dropzone.drop {
+    position: absolute;
+    top: 37px;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    border: 2px dashed #0088CC;
+    border-radius: 10px;
+    color: #0088CC;
+    background-color: #FFFFFF;
+    z-index: 0;
+  }
+  #fileupload #dropzone.fade {
+    opacity: .3;
+  }
+  #fileupload #dropzone.in {
+    opacity: .7;
+    z-index: 2;
+    border-color: #faa732;
+    color: #faa732;
+  }
+  #fileupload #dropzone.drop div[data-icons] {
+    text-shadow: 0px -1px 0px #0c5f80;
+    color: #0088CC;
+  }
+  #fileupload #dropzone.in div[data-icons] {
+    text-shadow: 0px -1px 0px #a28a10;
+    color: #faa732;
+  }
+  #fileupload #file-list {
+    position: relative;
+    z-index: 1;
+    height: 209px;
+    margin: 2px 0;
+  }
+  #fileupload #file-list .pane {
+    margin-right: 2px;
+  }
+  #fileupload #file-list .files {
+    margin: 0;
+    padding: 10px 14px 10px 10px;
+    list-style: none;
+  }
+  #fileupload #file-list .files > li {
+    padding: 10px;
+  }
+  #fileupload #file-list .files > li:nth-child(even) {
+    background-color: #e9e9e9;
+    border-radius: 3px;
+  }
+  #fileupload #file-list .files ul {
+    position: relative;
+    margin: 0;
+    padding: 0;
+    list-style: none;
+  }
+  #fileupload #file-list .files ul li {
+    float: left;
+  }
+  #fileupload #file-list .files ul li.action-bnt {
+    float: right;
+  }
+  #fileupload #file-list .preview {
+    width: 80px;
+    min-height: 1px;
+    margin-right: 10px;
+    text-align: center;
+  }
+  #fileupload #file-list .name {
+    width: 150px;
+    max-width: 250px;
+    margin-left: 15px;
+  }
+  #fileupload #file-list .progress {
+    position: absolute;
+    left: -5px;
+    right: -5px;
+    bottom: -5px;
+    margin-bottom: 0;
+    height: 5px;
+    box-shadow: none;
+    background-color: transparent;
+    background-image: none;
+  }
+  #fileupload #file-list .size {
+    width: 80px;
+  }
+  #fileupload #file-list .action-bnt {
+    text-align: right;
+  }
+  .preview-area{
+    /*min-height: 200px;
+    min-width: 200px;*/
+  }
+
+  .preview-area img{
+    box-shadow: 0 10px 20px #888;
+  }
+</style>
+<%= stylesheet_link_tag "lib/filemanager"%>
+<%= stylesheet_link_tag "lib/main-forms"%>
+<div class="form-horizontal main-forms">
+  <fieldset>
+    <ul class="nav nav-pills">
+      <li class="active"><a href="#filemanager" data-toggle="tab"><%= t(:filemanager) %></a></li>
+      <li><a href="#upload" data-toggle="tab"><%= t(:upload) %></a></li>
+    </ul>
+    <div class="tab-content">
+      <div class="tab-pane fade in active" id="filemanager">
+        <div class="input-area clearfix">
+          <div id="panel_l" class="tab-pane fade in active pull-left">
+            <form data-remote='true' action="<%= admin_assets_path(request.filtered_parameters) %>" method="get">
+              <div class="control-group">
+                <label class="control-label"><%= t(:search_files) %></label>
+                <div class="controls">
+                  <input type="text" name="filter" placeholder="<%= t(:filename) %>" />
+                </div>
+              </div>
+            </form>
+            <table id="asset_sort_list" class="table main-list">
+              <thead>
+                <tr>
+                    <th></th>
+                    <th><%= t(:filename) %></th>
+                    <th><%= t(:size) %></th>
+                    <th><%= t(:description) %></th>
+                    <th></th>
+                </tr>
+              </thead>
+              <tbody id="tbody_assets" class="sort-holder">
+                <%= render :partial => 'asset', :collection => @assets %>
+              </tbody>
+            </table>
+            <div class="pagination pagination-centered">
+               <%= paginate @assets, :params => {:direction => params[:direction], :sort => params[:sort], :type => params[:type]}, :remote => true %>
+            </div>
+          </div>
+          <div id="panel_r" class="pull-left">
+            <div class="control-group">
+              <label class="control-label"><%= t(:preview) %></label>
+            </div>
+            <div class="preview-area">
+            </div>
+          </div>
+        </div>
+        <div class="form-actions form-fixed pagination-right">
+          <button class="btn btn-primary" id="insert_btn" style="display:none;"><%= t(:insert) %></button>
+          <button class="btn btn-primary" id="delete_btn" style="display:none;"><%= t(:delete_) %></button>
+        </div>
+      </div>
+      <div class="tab-pane fade" id="upload">
+        <div class="input-area">
+          <form action="<%= file_upload_admin_assets_path %>", id='fileupload'>
+            <!-- Redirect browsers with JavaScript disabled to the origin page -->
+            <!-- The fileupload-buttonbar contains buttons to add/delete files and start/cancel the upload -->
+            <div class="fileupload-buttonbar">
+              <div class="navbar">
+                <div class="navbar-inner">
+                  <ul class="nav">
+                    <li>
+                      <div class="fileinput-button add-photo">
+                        <i class="icon-plus icon-white"></i>
+                        <span><%= t(:add_files) %></span>
+                        <input type="file" name="files[]" multiple>
+                      </div>
+                    </li>
+                    <li>
+                      <button type="submit" class="start add-photo">
+                        <i class="icon-upload icon-white"></i>
+                        <span><%= t(:start_upload) %></span>
+                      </button>
+                    </li>
+                    <li>
+                      <button type="reset" class="cancel add-photo">
+                        <i class="icon-ban-circle icon-white"></i>
+                        <span><%= t(:cancel_upload) %></span>
+                      </button>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <!-- The global progress information -->
+              <div class="fileupload-progress">
+                <!-- The global progress bar -->
+                <div class="progress progress-success progress-striped active" role="progressbar" aria-valuemin="0" aria-valuemax="100">
+                  <div class="bar" style="width:0%;"></div>
+                </div>
+                <!-- The extended global progress information -->
+                <div class="progress-extended"></div>
+              </div>
+            </div>
+            <!-- Drop Zone -->
+            <div id="dropzone" class="drop">
+              <div data-icons="&#xe0a3;"></div>
+              <%= t(:drop_the_files_here) %>
+            </div>
+            <!-- The loading indicator is shown during file processing -->
+            <div class="fileupload-loading"></div>
+            <!-- The table listing the files available for upload/download -->
+            <div id="file-list" class="nano">
+              <div class="content">
+                <ul role="presentation" class="files clearfix">
+                </ul>
+              </div>
+            </div>
+          </form>
+        </div>
+      </div>
+    </div>
+  </fieldset>
+</div>
+
+<div id="editform" class="modal hide fade"></div>
+<% content_for :page_specific_javascript do %>
+  <%= javascript_include_tag "file-upload/vendor/jquery.ui.widget.js" %>
+  <%= javascript_include_tag "file-upload/tmpl.min.js" %>
+  <%= javascript_include_tag "file-upload/load-image.min.js" %>
+  <%= javascript_include_tag "file-upload/canvas-to-blob.min.js" %>
+  <%= javascript_include_tag "file-upload/jquery.iframe-transport.js" %>
+  <%= javascript_include_tag "file-upload/jquery.fileupload.js" %>
+  <%= javascript_include_tag "file-upload/jquery.fileupload-fp.js" %>
+  <%= javascript_include_tag "file-upload/jquery.fileupload-ui.js" %>
+  <%= javascript_include_tag "file-upload/drop-zone.js" %>
+  <%= javascript_include_tag "admin/filemanager.js" %>
+<% end %>
+
+<script id="template-upload" type="text/x-tmpl">
+  {% for (var i=0, file; file=o.files[i]; i++) { %}
+    <li class="template-upload fade">
+      <ul class="clearfix">
+              <li class="action-bnt">
+                {% if (o.files.valid && !i) { %}
+                  <div class="progress progress-success progress-striped active" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0">
+                    <div class="bar" style="width:0%;"></div>
+                  </div>
+                  {% if (!o.options.autoUpload) { %}
+                    <button class="btn btn-primary start">
+                      <i class="icon-upload icon-white"></i>
+                    </button>
+                  {% } %}
+              {% } %}
+              {% if (!i) { %}
+                <button class="btn btn-warning cancel">
+                  <i class="icon-ban-circle icon-white"></i>
+                    </button>
+                {% } %}
+              </li>
+              <li class="preview pull-left"><span class="fade"></span></li>
+              <li class="name-size">
+                  <p>{%=file.name%}</p>
+                  {% if (file.error) { %}
+                    <p class="error"><span class="label label-important">Error</span> {%=file.error%}</p>
+                  {% } else if (o.files.valid && !i) { %}
+                    <p class="label label-info">{%=o.formatFileSize(file.size)%}</p>
+                  {% } %}
+              </li>
+            </ul>
+        </li>
+    {% } %}
+</script>
+<!-- The template to display files available for download -->
+<script id="template-download" type="text/x-tmpl">
+  {% for (var i=0, file; file=o.files[i]; i++) { %}
+    <li class="template-download fade">
+          <ul class="clearfix">
+            {% if (file.error) { %}
+                <li class="name-size">
+                  <p>{%=file.name%}</p>
+                  <p class="error"><span class="label label-important">Error</span> {%=file.error%}</p>
+                </li>
+            {% } else { %}
+                <li class="preview">
+                  {% if (file.thumbnail_url) { %}
+                      <a href="{%=file.url%}" title="{%=file.name%}" data-gallery="gallery" download="{%=file.name%}"><img src="{%=file.thumbnail_url%}"></a>
+                  {% } %}
+                </li>
+                <li class="name-size">
+                  <p><a href="{%=file.url%}" title="{%=file.name%}" data-gallery="{%=file.thumbnail_url&&'gallery'%}" download="{%=file.name%}">{%=file.name%}</a></p>
+                  <p ><span class="label label-success">Success</span> File uploaded successfully!</p>
+                  <p class="label label-info">{%=o.formatFileSize(file.size)%}</p>
+                </li>
+            {% } %}
+          </ul>
+      </li>
+    {% } %}
+</script>

app/views/admin/assets/update.html.erb

@@ -0,0 +1 @@
+<%= render :partial => 'asset', :object => @asset %>

app/views/layouts/assets.html.erb

@@ -0,0 +1,18 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <title><%= @title %></title>
+  <%= render 'shared/google_font' %>
+  <%= stylesheet_link_tag "back_end" %>
+  <%= yield :page_specific_css %>
+  <%= render 'shared/ie_html5_fix' %>
+  <%= javascript_include_tag "back_end" %>
+  <%= yield :page_specific_javascript %>
+  <%= csrf_meta_tag %>
+</head>
+<body id="dashboards">
+  <section>
+    <%= yield %>
+  </section>
+</body>
+</html>

config/application.rb

@@ -28,9 +28,6 @@ module Orbit
         config.assets.paths << "#{path}/assets/fonts"
     end
 
-    # Ckeditor
-    config.autoload_paths += %W(#{config.root}/app/models/ckeditor)
-
      # tell the I18n library where to find your translations
     I18n.load_path += Dir[Rails.root.join('lib', 'locale', '*.{rb,yml}')]
  

config/locales/en.yml

@@ -231,6 +231,7 @@ en:
     type: File type
     upload: File upload
   file_: File
+  filename: File name
   file_type: File Type
   followers: Followers
   forgot_password: Forgot your password?

config/locales/zh_tw.yml

@@ -83,6 +83,17 @@ zh_tw:
   all_content: 所有內容
   quantity: 數量
   hits: 點擊次數
+  insert: 插入
+  search_files: 搜尋檔案
+  filename: 檔案名稱
+  filemanager: 檔案管理員
+  upload: 上傳
+  start_upload: 開始上傳
+  cancel_upload: 取消上傳
+  add_files: 新增檔案
+  size: 大小
+  edit_file: 編輯檔案
+
 
   site: 
     system_preference: 系統狀態

config/routes.rb

@@ -83,6 +83,14 @@ Orbit::Application.routes.draw do
         end
       end
 
+      resources :assets do   
+        collection do
+          post 'file_upload'
+          get 'delete'
+          post 'delete_files'
+        end
+      end
+
       get 'authorizations(/:module(/:type(/:id)))' => 'authorizations#index', :as => :authorizations
       
       resources :authorizations