[SCEditor] ZzQuickPreview - Mở chức năng xem trước nhanh không chuyển trang

  Bài viết hay nhất1
ZzQuickPreview phiên bản SCEditor giúp bạn mở chức năng xem trước khi trả lời nhanh, không bị chuyển trang.
Sử dụng chế wysiwyg và một số tùy chỉnh BBcode nên có thể đáp ứng hiển thị gần như ngay lập tức. Đây cũng chính là ưu điểm lớn nhất của ZzQuickPreview so với những chức năng tương tự khác hiện có.
Ngoài ra, bạn cũng có thể chọn chế độ tải xem trước kiểu thông dụng. Chức năng này tự khởi động nếu trình duyệt không hỗ trợ wysiwyg.

[You must be registered and logged in to see this image.]
Giao diện ZzQuickPreview SCEditor


Hướng dẫn

Bước 1: Thêm vào CSS

ACP >> Display >> Pictures and Colors >> Colors >> CSS Stylesheet:

Code:
/* Zzpreview by devs.forumvi.com */
#Zzpreview_overlay{position:fixed;width:100%;height:100%;left:0;top:0;background:rgba(0,0,0,0.85);z-index:999}
#Zzpreview_post{width:700px;min-height:300px;max-height:500px;overflow:auto;background:#FFF;border:3px solid #333;margin:0 auto;padding:10px 20px}
#Zzpreview_overlay > p.h2{height:40px;line-height:40px;background:#111;border-bottom:3px solid #0085FF;margin-bottom:30px;text-align:right}
#Zzpreview_overlay .Zzpreview_title{font-weight:700;display:block;background:#0085FF;color:#FFF;font-size:1.23em;margin:0 10px;padding:0 15px}
#Zzpreview_overlay > div.center > input.Zzpreview_button{border:1px solid;height:34px!important;line-height:32px;color:#FFF;background:#0085FF;margin:10px;padding:0 15px!important}
#Zzpreview_overlay > div.center > input.Zzpreview_button:hover{cursor:pointer;background:#444}
#Zzpreview_overlay .Zzpreview_close{display:inline-block;height:40px;background:red;color:#FFF;font-weight:700;padding:0 15px}
.Zzpreview_close:hover,.Zzpreview_get:hover{color:#FF0;cursor:pointer}
#Zzpreview_post ol,#Zzpreview_post ul{margin-left:30px}


Bước 2: Tạo file javascript

ACP >> Modules >> HTML & JAVASCRIPT >> Javascript Codes >> Create a new javascript:
Title * : ZzQuickPreview
Placement : In all the topics
Javascript Code * :
Code:
$(function () {
   $(function () {
      $("#quick_reply input[name='preview']").click(function (b) {
         b.preventDefault();
         b = $("#text_editor_textarea").sceditor("instance");
         3 >= b.val().length ? alert("Bài viết quá ngắn!") : ($("#Zzpreview_overlay").length || ($("body").append('<div id="Zzpreview_overlay"><p class="h2"><span class="Zzpreview_title left">Xem trước</span><span class="Zzpreview_get left"><label><input type="checkbox" id="getPreview" /> Tải dữ liệu</label></span><a href="#quickreply" class="Zzpreview_close">Đóng</a></p><div class="post-entry"><div class="entry-content"><div id="Zzpreview_post"><img src="http://i.imgur.com/m3NXDa6.gif" alt="loading..." /> Đang tải dữ liệu...</div></div></div><div class="center"><input type="button" class="Zzpreview_full Zzpreview_button" value="Dùng đầy đủ chức năng"> <input type="button" class="Zzpreview_submit Zzpreview_button" value="Gửi bài"></div></div>'),
            $("#Zzpreview_post").width($(".entry-content:first").width()), "true" == my_getcookie("Zzpreview_check") && $("#getPreview").prop("checked", !0)), $("#Zzpreview_post").html('<img src="http://i.imgur.com/m3NXDa6.gif" alt="loading..." /> Đang tải dữ liệu...'), $.sceditor.isWysiwygSupported && !$("#getPreview").prop("checked") ? (b.toggleSourceMode(), b.inSourceMode() && b.toggleSourceMode(), $("#Zzpreview_post").html(b.getBody().clone().html()), $("#Zzpreview_post > div:not([align])").replaceWith(function () {
               return $(this).html().replace(/<br>$/g,
                  "") + "<br />"
            }), $("#Zzpreview_post").html(function () {
               var a = $(this).html(),
                  a = a.replace(/(\[spoiler=\"(.*)\"\])/g, '<dl class="codebox spoiler"><dt style="cursor: pointer;">$2:</dt><dd><div class="spoiler_content">'),
                  a = a.replace(/(\[spoiler\])/g, '<dl class="codebox spoiler"><dt style="cursor: pointer;">Spoiler:</dt><dd><div class="spoiler_content">'),
                  a = a.replace(/(\[\/spoiler\])/g, "</div></dd></dl>"),
                  a = a.replace(/\[hide\]/g, '<dl class="codebox hidecode"><dd>');
               return a = a.replace(/\[\/hide\]/g, "</dd></dl>")
            }),
            $("#Zzpreview_post code").wrap('<dl class="codebox"><dd class="cont_code"></dd></dl>').parent("dd").before("<dt>Code:</dt>")) : $.post("/post", {
            mode: "reply",
            notify: 1,
            preview: 1,
            t: $("#quick_reply input[name='t']").val(),
            message: $("#text_editor_textarea").sceditor("instance").val()
         }, function (a) {
            $("#Zzpreview_post").html($(a).find(".entry-content:first").html())
         }), $("#Zzpreview_overlay").fadeIn())
      });
      $(document).on("change", "#getPreview", function () {
         my_setcookie("Zzpreview_check", $("#getPreview").prop("checked"), !0)
      });
      $(document).on("click", ".Zzpreview_full", function () {
         $("#quick_reply").attr("action", "/post?preview=1").submit()
      });
      $(document).on("click", ".Zzpreview_submit", function () {
         $("#quick_reply input[name='post']").click()
      });
      $(document).on("click", ".Zzpreview_close", function () {
         $("#Zzpreview_overlay").fadeOut()
      })
   })
});

Bước 3: Tắt kiểm duyệt

ACP >> QLTT >> Forum >> Security:
Unauthorize unofficial forms to post messages and private messages on the forum : No


Zzbaivong
  Bài viết hay nhất2
Is it possible for making new topics?
  Bài viết hay nhất3
[You must be registered and logged in to see this link.]
[You must be registered and logged in to see this link.] wrote:Is it possible for making new topics?
No it isn't. It is only use the in the quick reply.
  Bài viết hay nhất4
thím viết cho OldEditor đi
  Bài viết hay nhất5
Cập nhật giao diện và chức năng mới.
Sửa một số lỗi BBcode.
  Bài viết hay nhất6
Khi add xong thì khi test ở Quick Reply thì nó cứ báo là "bài viết quá ngắn"

Link: [You must be registered and logged in to see this link.]
ID test: nicktest
Pass: testne123

<3 ^_^
  Bài viết hay nhất7
Làm theo hướng dẫn bài này nhé, code trong forum bạn là của phiên bản [You must be registered and logged in to see this link.].
  Bài viết hay nhất8
You cannot reply to topics in this forum