Giao diện :GOeditor - Quick Editor
Written by : Get_Over
![[GOeditor] GOeditor 1.5 77777710](https://i.servimg.com/u/f56/18/08/48/57/77777710.png)
- Code:
Tính năng chính :
+ Hỗ trợ bbcode
+ Trả lời nhanh không chuyển trang
+ Preview nhanh
Cập nhật sau bản 1.5 :
+ Chỉnh lại CSS
+ Tự động focus giữa bbcode
+ Làm lại smile và color
+ Gửi tin nhắn nhanh đến tường
+ Quote nhanh (Cái này riêng)
Hướng dẫn :
Mình viết hướng dẫn dựa trên viewtopic punbb mặc định còn 2 phiên bản phpbb3 và Invision mình sẽ convert sau
Bước 1 : ACP --> QLTT --> Forum --> Security
Unauthorize unofficial forms to post messages and private messages on the forum : Không
Bước 2 : ACP --> Messages and e-mails --> Cấu hình diễn đàn
Allow Quick Reply : Không
Bước 3 : ACP --> Display --> CSS :
Trong CSS tìm : #GOeditor và tìm thông số width:70% thay 70% thành độ dài để phù hợp với forum bạn
- Code:
#GO-quickrep .repnotice{background-color:#d9ffd1;background-image:url(http://cdn1.iconfinder.com/data/icons/musthave/24/Information.png);background-position:10px center;background-repeat:no-repeat;border:1px solid #36bf00;display:block;font-size:15px;font-weight:700;height:40px;line-height:35px;margin:20px auto;padding:5px;text-align:center;width:50%}
#GO-quickrep .previewdata{background:#fcfcfc;border:1.5px solid #D5D5D5;margin:20px auto;width:97%}
#GO-quickrep .buttonrep #sendrep:focus,#GO-quickrep .buttonrep #preview:focus,#GO-quickrep #backpreview:focus,#GO-quickrep .buttonrep #re-advance:focus{outline:none}
#GO-quickrep #repsmile{background:#F7F7F7;border:1px solid #D5D5D5;display:none;margin-left:15%;margin-top:35px;min-height:100px;padding:3px;position:absolute;width:600px}
#GO-quickrep #repcolour td{border:1px solid #AAA;float:left;height:13px;margin:0 2px 2px 0;outline:0 none;width:13px}
#GO-quickrep #repcolour table:last-child{background-color:transparent!important}
#GO-quickrep #repcolour{background:#F7F7F7;border:1px solid #D5D5D5;display:none;margin-left:20%;margin-top:35px;max-width:400px;min-height:100px;padding:3px;position:absolute}
#GO-quickrep .go-bbcodeimg,#GO-quickrep .senddata{background:#fff;border:1px solid #D5D5D5;color:#000;display:none;height:100px;margin-top:20px;padding:3px;position:absolute;width:230px}
#GO-quickrep #bbcodeimg,#GOdata{border-radius:none;display:block;margin-left:auto;margin-right:auto;margin-top:10px;min-height:20px!important;outline:none;padding:5px;width:70%!important}
#GO-quickrep #gorep{border:1px solid #B6B6B6;border-radius:none;display:block;margin:auto;min-height:200px!important;outline:none;width:97%!important}
#GO-quickrep .buttonimg,#GO-quickrep .buttonwall{background-color:#2797f2!important;border:none;color:#fff!important;cursor:pointer;display:block;font-size:12px;font-weight:700;height:25px;margin:10px auto;min-width:50px;padding:0 10px}
#GO-quickrep .buttonrep #sendrep,#GO-quickrep #backpreview{margin-left:1.5%}
#GO-quickrep .buttonrep #re-advance{-moz-transition:all .2s ease;-ms-transition:all .2s ease;-webkit-transition:all .2s ease;background-color:#000!important;color:#FFF!important;float:right!important;margin-right:1.5%;o-transition:all .2s ease;transition:all .2s ease}
#GO-quickrep #backpreview{margin-top:-20px}
#GO-quickrep .buttonrep #sendrep,#GO-quickrep .buttonrep #preview,#GO-quickrep .buttonrep #re-advance,#GO-quickrep #backpreview{background-color:#2797f2;border:none;color:#fff;cursor:pointer;display:inline-block;font-size:15px;font-weight:700;height:40px;min-width:80px;padding:0 10px}
#GO-quickrep .buttonrep #sendrep:hover,#GO-quickrep .buttonrep #preview:hover,#GO-quickrep #backpreview:hover,.buttonimg:hover{background-color:#7fc5ff;color:#fff}
#GO-quickrep .bbcode{border:none;color:#fff;cursor:pointer;display:block;font-size:12px;font-weight:700;height:30px;margin:auto;width:97%}
#GO-quickrep .bbcode span{-moz-border-radius:2px;-moz-box-shadow:inset 0 7px 10px #FFF;-webkit-border-radius:2px;-webkit-box-shadow:inset 0 7px 10px #FFF;border:1px solid #CCC;border-radius:2px;box-shadow:inset 0 7px 10px #FFF;color:#888;cursor:pointer;display:block;float:left;margin-right:3px;padding:4px 10px;text-shadow:0 1px #FFF}
#GO-quickrep .bbcode span:hover{border:1px solid #006adb;color:#000}
#GO-quickrep .buttonrep #re-advance:hover{background-color:#2797f2!important;color:#FFF!important}
#GO-quickrep textarea:focus,#GO-quickrep #bbcodeimg:focus{border:1px solid #0081eb!important;outline:none}
#GOeditor{background: #f5f5f5;border:1px solid #B6B6B6;box-shadow:0 0 3px rgba(0,0,0,0.15);margin:auto;min-height:50px;padding:5px;width:70%}
#GO-quickrep #backpreview,#GO-quickrep .repnotice,#GO-quickrep #repcolour form tr:first-child,#repcolour td:first-child,#repcolour td:nth-child(2),#repcolour td:nth-child(3){display:none}
Title : GOeditor - Quick Editor
Place : In the topic
- Spoiler:
- Code:
$(function () {
// // // // // // // // // // // // // // // // // // // // GOeditor © Get Over - doannamthai // // // // // // // // // // // // // // // // // // // //
// // // // // // STRUCTURE // // // // // //
if ($('a[href*="inbox"]').length) {
var z = $('a[href*="mode=reply"]').attr("href");
function insertBBcode(editor, tagstart, tagend) {
var selectedText = document.selection ? document.selection.createRange().text : editor.value.substring(editor.selectionStart, editor.selectionEnd);
var newText = '[' + tagstart + ']' + selectedText + '[/' + tagend + ']';
if (document.selection) {
editor.focus();
var st = getCaret(editor) + tagstart.length + 2;
document.selection.createRange().text = newText;
var range = editor.createTextRange();
range.collapse(true);
range.moveStart('character', st);
range.moveEnd('character', selectedText.length);
range.select();
editor.focus();
} else {
var st = editor.selectionStart + tagstart.length + 2;
var end = editor.selectionEnd + tagstart.length + 2;
editor.value = editor.value.substring(0, editor.selectionStart) + newText + editor.value.substring(editor.selectionEnd, editor.value.length);
editor.focus();
editor.setSelectionRange(st, end)
}
}
function getCaret(editor) {
editor.focus();
var r = document.selection.createRange();
if (r == null) {
return 0;
}
var re = editor.createTextRange(),
rc = re.duplicate();
re.moveToBookmark(r.getBookmark());
rc.setEndPoint('EndToStart', re);
var add_newlines = 0;
for (var i = 0; i < rc.text.length; i++) {
if (rc.text.substr(i, 2) == '\r\n') {
add_newlines += 2;
i++;
}
}
return rc.text.length + add_newlines;
}
$(".pun-crumbs:last").after('<div id="GOeditor"><form id="GO-quickrep" action="/post" method="post" name="GOeditor"><div class="repnotice" ></div><div style="display:none;" class="previewdata"></div><br><input type="submit" id="backpreview" style="display:none;" value="Back"/><div class="GO-post"><textarea id="gorep" placeholder="Bình luận..." name="GOpost"></textarea><div><br><div class= "bbcode"><span class = "repbbcode" title = "Bold" value="b" style="font-weight:bold" >B</span><span class = "repbbcode" title="Italic" value="i" style="font-style: italic">I</span><span class = "repbbcode" title="Underline" value="u" style="text-decoration: underline">U</span><span class = "repbbcode" title="Strikethrough" value ="strike" style="text-decoration: line-through;font-weight:bold">S</span><span class = "repbbcode" title="Code" value="code">Code</span><span class = "repbbcode" title="Quote" value="quote">Quote</span><span class = "repbbcode2" id="repimg" title="Imagine" value="img">IMG</span><div class="go-bbcodeimg" style="display:none;margin-top: 27px;"><input type="text" id="bbcodeimg" placeholder="Nhập url..."><input type="button" style = "margin-top: 15px;" class="buttonimg" value="Insert"></div><span class = "repbbcode-smile" title="Smile" >Smiles</span><span class = "repbbcode-colour" title="Colour" >Colour</span><span class = "GOwall" title="Send message to user\'s wall">Wall</span><div class="senddata" style="display:none;margin-top: 27px;"><input type="text" id="GOdata" placeholder="Nhập tên..."><input type="button" style = "margin-top: 15px;" class="buttonwall" value="OK"></div></div><br><div class = "buttonrep"><input type="submit" id= "sendrep" value="Send"></input>\n<input type="submit" id="preview" value="Preview"><input type="hidden" name="notify" value="1"></input><input type="hidden" name="t" value=""><input type="hidden" name="mode" value="reply"><input type="submit" name="preview" id="re-advance" value="Full Editor"></input><br><br><div class="golreply" style="display:none"><img src="http://i57.servimg.com/u/f57/15/64/85/86/ajax-l10.gif"/></div></div></form></div>');
// // // // // // STRUCTURE // // // // // //
// // // // // // BBCODE // // // // // //
var x = $(".GO-post textarea")[0];
var GOpost = $("[name='GOpost']").get(0);
$(".repbbcode").on("click", function () {
var a = $(this).attr("value");
insertBBcode(GOpost, a, a);
});
$(".repbbcode-smile").click(function () {
$(this).after('<div id ="repsmile"></div>');
$(this).before('<span class = "smiletoggle" title="Smiles">Smiles</span>').remove();
$("#repsmile").show();
$("#repsmile").load("/smilies.forum?mode=smilies_frame", function () {
$("#repsmile").contents().find("img").click(function () {
var c = $(this).attr("alt");
$("#gorep").focus();
$("#gorep").val($("#gorep").val() + c);
return false;
});
});
$(".smiletoggle").click(function () {
$("#repsmile").toggle();
})
});
$("#GO-quickrep input[name='t']").val(z.substring("8", z.lastIndexOf("&mode=reply")));
$("#repimg").click(function () {
var f = $(".go-bbcodeimg").css("display");
if (f == 'none') {
$(".go-bbcodeimg").css({
"left": $(this).position().left,
"top": $(this).position().top,
}).show();
} else {
$(".go-bbcodeimg").hide();
}
});
$(".buttonimg").click(function () {
var i = $(".go-bbcodeimg #bbcodeimg").val();
if (i.length > 0) {
$("#gorep").focus();
$("#gorep").val($("#gorep").val() + '[img]' + i + '[/img]');
} else {
insertBBcode(GOpost, 'img', 'img');
}
});
$(".GOwall").click(function () {
var f = $(".senddata").css("display");
if (f == 'none') {
$(".senddata").css({
"left": $(this).position().left,
"top": $(this).position().top,
}).show();
} else {
$(".senddata").hide();
}
});
$(".buttonwall").click(function () {
var g = $(".GOwall").css({
"background": "",
"border": "",
"color": ""
});
var s = $("#GOdata").val();
if (s.length > 0) {
$.get("/search?mode=searchuser&search_username=" + s + "&search=OK", function (e) {
if ($(e).find("form option").text().search(s) >= 0) {
$(".senddata").hide();
$(".GOwall").css({
"background": "#8fff57",
"border": "1px solid #006adb",
"color": "#000000"
});
} else {
alert("Tên người dùng không tồn tại");
$("#GOdata").val("");
g;
}
});
} else {
g;
$(".senddata").hide();
}
});
$(".repbbcode-colour").click(function () {
$(this).after('<div id ="repcolour"></div>');
$(this).before('<span class="colourtoggle" title="Colour">Colour</span>').remove();
$("#repcolour").show();
$("#repcolour").load("/chatbox/chatbox_selectcolor.htm", function () {
$("#repcolour").contents().find("td").click(function () {
var m = $(this).attr("bgcolor");
insertBBcode(GOpost, 'color=' + m, 'color');
});
});
$(".colourtoggle").click(function () {
$("#repcolour").toggle();
})
});
// // // // // // BBCODE // // // // // //
// // // // // // Quick Reply - Quick Preview // // // // // //
$("#preview").click(function (v) {
v.preventDefault();
var value = $("#gorep").val().replace(/\s/g, '').length;
if (10 <= value && value <= 1500) {
$(".golreply").show();
$.post(z, {
"message": $("#gorep").val(),
"preview": "Preview"
}, function (b) {
$(".GO-post").fadeOut(300);
$(".golreply").fadeOut(300);
$("#backpreview").fadeIn(1000);
$(".previewdata").fadeIn(1000);
$(".previewdata").html($(b).find(".post:first .postbody:first"));
$("#backpreview").click(function (t) {
t.preventDefault();
$(this).hide();
$(".previewdata").hide();
$(".GO-post").fadeIn(1500);
});
});
$(".repnotice").fadeOut(1000);
} else if (10 > value) {
$(".repnotice").fadeIn(500);
$(".repnotice").html("Lỗi!\nBạn phải nhập <font color='red'>" + (10 - value) + "</font> ký tự nữa")
} else if (1500 < value) {
$(".repnotice").fadeIn(500);
$(".repnotice").html("Lỗi! Bài viết quá dài \nBạn không được nhập quá 1500 ký tự")
}
});
$("#sendrep").click(function (v) {
v.preventDefault();
if ($("#GOdata").val().length < 1) {
var value = $("#gorep").val().replace(/\s/g, '').length;
if (10 <= value && value <= 1500) {
$(".golreply").show();
$.post(z, {
"message": $("#gorep").val(),
"post": "Send",
"attach_sig": "1"
}, function (t) {
if (t.indexOf("Flood") != -1 && $("html").attr("xml:lang") == "vi") {
$(".repnotice").fadeIn(500);
$(".repnotice").html("Lỗi!\nBạn phải chờ 5 giây mới có thể gửi bài");
$(".golreply").hide();
} else if ($(t).find(".message a").length) {
var f = $(t).find(".message a:first").attr('href');
location.href = f;
$.get(f, function (z) {
$(z).find(".post:last").hide().insertAfter(".post:last").slideDown(400);
});
$("#gorep").val("");
$(".golreply").hide();
$(".repnotice").fadeOut(1000);
}
});
} else if (10 > value) {
$(".repnotice").fadeIn(500);
$(".repnotice").html("Lỗi!\nBạn phải nhập <font color='red'>" + (10 - value) + "</font> ký tự nữa")
} else if (1500 < value) {
$(".repnotice").fadeIn(500);
$(".repnotice").html("Lỗi! Bài viết quá dài \nBạn không được nhập quá 1500 ký tự")
}
} else {
$(".golreply").show();
var u = $("#GOdata").val();
$.post("/privmsg?mode=post_profile", {
subject: "Tin nhắn",
message: $("#gorep").val(),
username: $("#GOdata").val(),
mode: "post_profile",
folder: "profile",
post: "Send"
}).done(function () {
$(".golreply").hide();
$("#gorep").val("");
$("#GOdata").val("");
$(".GOwall").css({
"background": "",
"border": "",
"color": ""
});
alert("Tin nhắn đã được gửi đến " + u);
});
}
});
}
// // // // // // Quick Reply - Quick Preview // // // // // //
// // // // // // // // // // // // // // // // // // // // GOeditor © Get Over - doannamthai // // // // // // // // // // // // // // // // // // // //
});
[Plugin] Quick Quote for GOeditor 1.5
JS :
- Spoiler:
- Code:
$(function () {
// [Plugin] Quick Quote for GOeditor 1.5 - Please don't remove this copyright ;
$('a[href*="mode=quote"]').click(function (v) {
v.preventDefault();
$.get($(this).attr('href') , function (a) {
var datatext = $(a).find('#text_editor_textarea[name="message"]').val();
$("#gorep").focus();
$("#gorep").val(datatext);
});
$('html,body').stop().animate({
scrollTop: $('#GOeditor').offset().top
}, 1500);
});
});
GOeditor © Get Over - doannamthai
