提交作品、提交作业、发布课程帖子、组织文章实现每隔10秒自动保存帖子

app/views/boards/_course_new.html.erb

@@ -1,7 +1,123 @@
 <%= content_for(:header_tags) do %>
-    <%= import_ke(enable_at: true, prettify: false) %>
+    <%= import_ke(enable_at: true, prettify: false, init_activity: false) %>
 <% end %>
-
+<script type="text/javascript">
+    function nh_check_field(params){
+        var result=true;
+        if(!regexTopicSubject()) {
+            result=false;
+            return result;
+        }
+        if(params.content!=undefined){
+            if(params.content.isEmpty()){
+                result=false;
+            }
+            if(params.content.html()!=params.textarea.html() || params.issubmit==true){
+                params.textarea.html(params.content.html());
+                params.content.sync();
+                if(params.content.isEmpty())
+                {
+                    params.contentmsg.text("描述不能为空");
+                    params.contentmsg.css('color','#ff0000');
+                }
+                else if(params.content.html().length >=20000){
+                    params.contentmsg.text("描述最多20000个汉字(或40000个英文字符)");
+                    params.contentmsg.css('color','#ff0000');
+                    result=false;
+                }
+                else
+                {
+                    params.contentmsg.text("填写正确");
+                    params.contentmsg.css('color','#008000');
+                }
+            }
+        }
+        return result;
+    }
+    function init_homework_form(params){
+        params.form.submit(function(){
+            params.textarea.html(params.editor.html());
+            params.editor.sync();
+            var flag = false;
+            if(params.form.attr('data-remote') != undefined ){
+                flag = true
+            }
+            var is_checked = false;
+            is_checked = nh_check_field({
+             issubmit:true,
+             content:params.editor,
+             contentmsg:params.contentmsg,
+             textarea:params.textarea
+             });
+            if(is_checked){
+                if(flag){
+                    return true;
+                }else{
+                    $(this)[0].submit();
+                    return false;
+                }
+            }
+            return false;
+        });
+    }
+    function init_homework_editor(params){
+        params.textarea.removeAttr('placeholder');
+        var editor = params.kindutil.create(params.textarea, {
+            resizeType : 1,minWidth:"1px",width:"100%",minHeight:"30px",height:"30px",
+            items : ['code','emoticons','fontname',
+                'forecolor', 'hilitecolor', 'bold', '|', 'justifyleft', 'justifycenter', 'insertorderedlist','insertunorderedlist', '|',
+                'formatblock', 'fontsize', '|','indent', 'outdent',
+                '|','imagedirectupload','table',   'media', 'preview',"more"
+            ],
+            afterChange:function(){//按键事件
+                var edit = this.edit;
+                var body = edit.doc.body;
+                //paramsHeight = params.kindutil.removeUnit(this.height);
+                edit.iframe.height(150);
+                this.resize(null, Math.max((params.kindutil.IE ? body.scrollHeight : body.offsetHeight) +  33, 150));
+            },
+            afterCreate:function(){
+                //init
+                var edit = this.edit;
+                var body = edit.doc.body;
+                edit.iframe[0].scroll = 'no';
+                body.style.overflowY = 'hidden';
+                //reset height
+                var edit = this.edit;
+                var body = edit.doc.body;
+                edit.html(params.textarea.innerHTML);
+                //paramsHeight = params.kindutil.removeUnit(this.height);
+                edit.iframe.height(150);
+                this.resize(null, Math.max((params.kindutil.IE ? body.scrollHeight : body.offsetHeight) , 150));
+                elocalStorage(message_content_editor,'topic_course_<%=course.id %>');
+            }
+        }).loadPlugin('paste');
+        return editor;
+    }
+    KindEditor.ready(function(K){
+        $("div[nhname='topic_form']").each(function(){
+            var params = {};
+            params.kindutil = K;
+            params.div_form = $(this);
+            params.form = $("form",params.div_form);
+            if(params.form==undefined || params.form.length==0){
+                return;
+            }
+            params.textarea = $("textarea[nhname='topic_textarea']",params.div_form);
+            params.contentmsg = $("#message_content_span");
+            params.submit_btn = $("#new_message_submit_btn");
+            if(params.textarea.data('init') == undefined) {
+                params.editor = init_homework_editor(params);
+                message_content_editor = params.editor;
+                init_homework_form(params);
+                params.submit_btn.click(function () {
+                    params.form.submit();
+                });
+                params.textarea.data('init', 1);
+            }
+        });
+    });
+</script>
 <%= error_messages_for 'message' %>
 <div class="resources mt10">
   <div id="new_course_topic">
@@ -25,7 +141,7 @@
           <%= text_area :quote,:quote,:style => 'display:none' %>
           <%= hidden_field_tag :asset_id,params[:asset_id],:required => false,:style => 'display:none' %>
 
-          <%= f.kindeditor :content, :editor_id => 'message_content_editor',
+          <%#= f.kindeditor :content, :editor_id => 'message_content_editor',
                            :owner_id => topic.nil? ? 0: topic.id,
                            :owner_type => OwnerTypeHelper::MESSAGE,
                            :width => '100%',
@@ -37,8 +153,11 @@
                                             :maxlength => 5000 },
                            at_id: topic.id, at_type: topic.class.to_s
           %>
+          <textarea placeholder="有问题或有建议，请直接给我留言吧！" style="display: none" nhname='topic_textarea' name="message[content]"><%=topic.content %></textarea>
           <div class="cl"></div>
           <p id="message_content_span"></p>
+          <p id="e_tip" class="c_grey"></p>
+          <p id="e_tips" class="c_grey"></p>
         </div>
         <div class="cl"></div>
         <div class="mt10">
@@ -49,11 +168,11 @@
         <div class="cl"></div>
         <div class="mt5">
           <%if !edit_mode %>
-              <a href="javascript:void(0);" class="BlueCirBtnMini fr" onclick="submit_topic();">确定</a>
+              <a href="javascript:void(0);" class="BlueCirBtnMini fr" id="new_message_submit_btn">确定</a>
               <span class="fr mr10 mt3">或</span>
               <a href="javascript:void(0);" class="fr mr10 mt3" onclick="reset_topic();">取消</a>
           <% else %>
-              <a href="javascript:void(0);" class="BlueCirBtnMini fr" onclick="submit_topic();">确定</a>
+              <a href="javascript:void(0);" class="BlueCirBtnMini fr" id="new_message_submit_btn" onclick="submit_topic();">确定</a>
               <span class="fr mr10 mt3">或</span>
               <%= link_to "取消",board_message_url(topic.board, topic.root, :r => (topic.parent_id && topic.id)), :class => "fr mr10 mt3"%>
         <% end %>

app/views/boards/_course_show.html.erb

@@ -25,11 +25,13 @@
       课程问答区
     </div>
   </div>
+  <div nhname="topic_form">
   <% if User.current.logged? %>
     <%= labelled_form_for @message, :url =>{:controller=>'messages',:action => 'new',  :board_id => @board.id, :is_board => 'true'},
                           :html => {:nhname=>'form',:multipart => true, :id => 'message-form'} do |f| %>
         <%= render :partial => 'course_new', :locals => {:f => f, :topic => @message, :edit_mode => false, :course => @board.course} %>
     <% end %>
   <% end %>
+  </div>
   <%= render :partial=> 'course_show_detail',:locals =>{:topics => @topics, :page => 0} %>
 </div>

app/views/messages/edit.html.erb

@@ -12,6 +12,7 @@
         <% end %>
 
 <% elsif @message.course %>
+    <div  nhname="topic_form">
     <%= form_for @message, {
             :as => :message,
             :url => {:action => 'edit',:is_course=>@is_course,:is_board=>@is_board},
@@ -22,7 +23,7 @@
         <%= render :partial => 'boards/course_message_edit',
                    :locals => {:f => f, :edit_mode => true, :topic => @message, :course => @message.course} %>
     <% end %>
-
+    </div>
 <% elsif @message.board.org_subfield %>
     <%= form_for @message, {
                                  :as => :message,

app/views/org_document_comments/_new.html.erb

@@ -50,6 +50,8 @@
         </div>
         <div class="cl"></div>
         <p id="homework_course_id_span" class="c_red mt5"></p>
+        <p id="e_tip" class="c_grey"></p>
+        <p id="e_tips" class="c_grey"></p>
         <div class="cl"></div>
         <div class="mt10">
           <div class="fl" id="topic_attachments">

app/views/org_document_comments/edit.html.erb

@@ -39,6 +39,8 @@
         <div class="cl"></div>
 
         <p id="homework_course_id_span" class="c_red mt5"></p>
+        <p id="e_tip" class="c_grey"></p>
+        <p id="e_tips" class="c_grey"></p>
         <div class="cl"></div>
 
         <div class="mt10">

app/views/org_document_comments/new.html.erb

@@ -46,6 +46,8 @@
       </div>
       <div class="cl"></div>
       <p id="homework_course_id_span" class="c_red mt5"></p>
+      <p id="e_tip" class="c_grey"></p>
+      <p id="e_tips" class="c_grey"></p>
       <div class="cl"></div>
       <div class="mt10">
         <div class="fl" id="topic_attachments">

app/views/student_work/edit.html.erb

@@ -58,6 +58,8 @@
           </script>-->
           <div class="cl"></div>
           <p id="student_work_description_textarea" class="c_red mb10"></p>
+          <p id="e_tip" class="c_grey"></p>
+          <p id="e_tips" class="c_grey"></p>
         </div>
 
         <div id="homework_attachments">
@@ -198,7 +200,7 @@
                 //paramsHeight = params.kindutil.removeUnit(this.height);
                 edit.iframe.height(150);
                 this.resize(null, Math.max((params.kindutil.IE ? body.scrollHeight : body.offsetHeight) , 150));
-
+                elocalStorage(editor2,'student_work_<%=@work.id %>');
             }
         }).loadPlugin('paste');
         return editor;
@@ -217,6 +219,7 @@
             params.submit_btn = $("#new_message_submit_btn");
             if(params.textarea.data('init') == undefined) {
                 params.editor = init_homework_editor(params);
+                editor2 = params.editor;
                 init_homework_form(params);
                 params.submit_btn.click(function () {
                     params.form.submit();

app/views/student_work/new.html.erb

@@ -79,6 +79,10 @@
       }
   }
 
+  var KE = {
+      MDU: "1234455",//当前文章标识符
+  };
+
   function nh_check_field(params){
       var result=true;
       if(!regexStudentWorkName()) {
@@ -159,7 +163,7 @@
               //paramsHeight = params.kindutil.removeUnit(this.height);
               edit.iframe.height(150);
               this.resize(null, Math.max((params.kindutil.IE ? body.scrollHeight : body.offsetHeight) , 150));
-
+              elocalStorage(editor2,'student_work_<%=@homework.id %>');
           }
       }).loadPlugin('paste');
       return editor;
@@ -178,6 +182,7 @@
           params.submit_btn = $("#new_message_submit_btn");
           if(params.textarea.data('init') == undefined) {
               params.editor = init_homework_editor(params);
+              editor2 = params.editor;
               init_homework_form(params);
               params.submit_btn.click(function () {
                   params.form.submit();
@@ -250,6 +255,8 @@
           </script>-->
           <div class="cl"></div>
           <p id="student_work_description_textarea" class="c_red mb10"></p>
+          <p id="e_tip" class="c_grey"></p>
+          <p id="e_tips" class="c_grey"></p>
         </div>
 
         <div id="homework_attachments">

app/views/users/_user_homework_form.html.erb

@@ -16,7 +16,6 @@
             $("#GroupPopupBox a.group_save_btn").click();
         <% end %>
       });
-      var homework_description_editor;
       function checked_val() {
           if ($("#anonymous_comment").is(":checked")) {
               $("#anonymous_comment").val(1);
@@ -106,7 +105,7 @@
                   //paramsHeight = params.kindutil.removeUnit(this.height);
                   edit.iframe.height(150);
                   this.resize(null, Math.max((params.kindutil.IE ? body.scrollHeight : body.offsetHeight) , 150));
-
+                  elocalStorage(homework_description_editor,'homework_<%=User.current.id %>');
               }
           }).loadPlugin('paste');
           return editor;
@@ -199,6 +198,8 @@
       <%= select_tag :course_id, options_for_select(get_as_teacher_courses(User.current), homework.course_id), {:class => "InputBox w709",:value => "请选择发布作业的课程"} %>
     </div>
     <p id="homework_course_id_span" class="c_red mt5"></p>
+    <p id="e_tip" class="c_grey"></p>
+    <p id="e_tips" class="c_grey"></p>
     <div class="cl"></div>
 
     <div id="homework_attachments">

public/javascripts/application.js

@@ -1152,3 +1152,50 @@ function disable_down(source, des, hint){
 
   }
 }
+
+//自动保存草稿
+var editor2;
+function elocalStorage(editor,mdu){
+    if (window.sessionStorage){
+        editor2 = editor;
+        var oc = window.sessionStorage.getItem('content'+mdu);
+        if(oc !== null ){
+            var h = '您上次有已保存的数据，是否<a onclick="rec_data(\'content\',\''+ mdu + '\')">恢复</a> ? / <a onclick="clear_data(\'content\',\''+ mdu + '\')">不恢复</a>';
+            $('#e_tips').html(h);
+        }
+        setInterval(function() {
+            d = new Date();
+            var h = d.getHours();
+            var m = d.getMinutes();
+            var s = d.getSeconds();
+            h = h < 10 ? '0' + h : h;
+            m = m < 10 ? '0' + m : m;
+            s = s < 10 ? '0' + s : s;
+            if(!editor.isEmpty()){
+                add_data("content",mdu,editor.html());
+                $('#e_tip').html(" 数据已于 " + h + ':' + m + ':' + s +" 保存   ");
+                $('#e_tips').html("");
+            }
+        },10000);
+
+    }else{
+        $('.ke-edit').after('您的浏览器不支持localStorage.无法开启自动保存草稿服务,请升级浏览器！');
+    }
+}
+function add_data(k,mdu,d){
+    window.sessionStorage.setItem(k+mdu,d);
+}
+function rec_data(k,mdu){
+    if(window.sessionStorage.getItem(k+mdu) !== null){
+        editor2.html(window.sessionStorage.getItem(k+mdu));
+        clear_data(k,mdu);
+    }
+}
+function clear_data(k,mdu){
+    window.sessionStorage.removeItem(k+mdu);
+    if(k == 'content'){
+        $("#e_tips").html("");
+    }else{
+        $("#e_tip").html("");
+    }
+}

public/javascripts/des_kindEditor.js

@@ -1,3 +1,4 @@
+var editor2;
 function init_des_editor(params){
     // var minHeight;  //最小高度
     var paramsHeight = params.height; //设定的高度
@@ -32,7 +33,7 @@ function init_des_editor(params){
             paramsHeight = paramsHeight == undefined ? params.kindutil.removeUnit(this.height) : paramsHeight;
             edit.iframe.height(paramsHeight);
             this.resize(null, Math.max((params.kindutil.IE ? body.scrollHeight : body.offsetHeight), paramsHeight));
-
+            elocalStorage(editor2,'org_document');
         }
     }).loadPlugin('paste');
     return editor;
@@ -123,6 +124,7 @@ function init_des_data(){
             params.width = width;
             if (params.textarea.data('init') == undefined) {
                 params.editor = init_des_editor(params);
+                editor2 = params.editor;
                 init_form(params);
                 params.cancel_btn.click(function () {
                     nh_reset_form(params);