Ivan/commento
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

frontend: use commento namespace, event handlers, UI

Browse Source
This commit is contained in:
Adhityaa Chandrasekar 2018-12-20 00:48:43 -05:00
parent 9fcf67d667
commit 06c71f4e65
29 changed files with 193 additions and 187 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
api/router_static.go
View File

@ -53,8 +53,8 @@ func staticRouterInit(router *mux.Router) error {
prefix := "" prefix := ""
if dir == "/js" { if dir == "/js" {
prefix = "window.commentoOrigin='" + os.Getenv("ORIGIN") + "';\n" prefix = `window.commento = {origin: "` + os.Getenv("ORIGIN") + `", cdn: "` + os.Getenv("CDN_PREFIX") + `"};
prefix += "window.commentoCdn='" + os.Getenv("CDN_PREFIX") + "';\n" `
} }
gzip := (os.Getenv("GZIP_STATIC") == "true") gzip := (os.Getenv("GZIP_STATIC") == "true")

36
frontend/dashboard.html
View File

@ -21,10 +21,10 @@
<script> <script>
window.onload = function() { window.onload = function() {
window.selfGet(function() { window.commento.selfGet(function() {
window.vueConstruct(function() { window.commento.vueConstruct(function() {
window.navbarFill(); window.commento.navbarFill();
window.domainRefresh(); window.commento.domainRefresh();
$(document).ready(function(){ $(document).ready(function(){
$("ul.tabs li").click(function(){ $("ul.tabs li").click(function(){
var tab_id = $(this).attr("data-tab"); var tab_id = $(this).attr("data-tab");
@ -51,13 +51,13 @@
It's so quiet in here. It's so quiet in here.
</div> </div>
<div class="pane-setting" v-for="domain in domains" v-on:click="window.domainSelect(domain.domain)" id="{{domain.hex}}" v-bind:class="{selected: domain.selected}" v-if="domain.show"> <div class="pane-setting" v-for="domain in domains" v-on:click="window.commento.domainSelect(domain.domain)" id="{{domain.hex}}" v-bind:class="{selected: domain.selected}" v-if="domain.show">
<div class="pane-setting-inside"> <div class="pane-setting-inside">
<div class="setting-title">{{domain.name}}</div> <div class="setting-title">{{domain.name}}</div>
<div class="setting-subtitle">{{domain.domain}}</div> <div class="setting-subtitle">{{domain.domain}}</div>
</div> </div>
</div> </div>
<div class="pane-setting" id="domain-add" onclick="window.location.hash='#new-domain-modal'"> <div class="pane-setting" id="domain-add" onclick="document.location.hash='#new-domain-modal'">
<div class="pane-setting-inside super-setting"> <div class="pane-setting-inside super-setting">
<div class="super-setting-title">+</div> <div class="super-setting-title">+</div>
<div class="super-setting-text">New Domain</div> <div class="super-setting-text">New Domain</div>
@ -66,7 +66,7 @@
</div> </div>
<div class="pane-middle"> <div class="pane-middle">
<div v-if="showSettings" class="pane-setting" v-for="setting in settings" v-on:click="window.settingSelect(setting.id)" id="{{setting.id}}" v-bind:class="{selected: setting.selected}"> <div v-if="showSettings" class="pane-setting" v-for="setting in settings" v-on:click="window.commento.settingSelect(setting.id)" id="{{setting.id}}" v-bind:class="{selected: setting.selected}">
<div class="pane-setting-inside"> <div class="pane-setting-inside">
<div class="setting-title">{{setting.text}}</div> <div class="setting-title">{{setting.text}}</div>
<div class="setting-subtitle">{{setting.meaning}}</div> <div class="setting-subtitle">{{setting.meaning}}</div>
@ -156,14 +156,14 @@
<div class="commento-email-container"> <div class="commento-email-container">
<div class="commento-email"> <div class="commento-email">
<input class="commento-input" type="text" id="new-mod" placeholder="Email"> <input class="commento-input" type="text" id="new-mod" placeholder="Email">
<button id="new-mod-button" class="commento-email-button" onclick="window.moderatorNewHandler()">Add moderator</button> <button id="new-mod-button" class="commento-email-button" onclick="window.commento.moderatorNewHandler()">Add moderator</button>
</div> </div>
</div> </div>
<div class="mod-emails-container"> <div class="mod-emails-container">
<div class="content"> <div class="content">
<div class="mod-email" v-for="email in domains[cd].moderators" v-if="domains[cd].moderators.length > 0"> <div class="mod-email" v-for="email in domains[cd].moderators" v-if="domains[cd].moderators.length > 0">
<div class="email">{{email.email}}</div> <div class="email">{{email.email}}</div>
<div class="delete" v-on:click="window.moderatorDeleteHandler(email.email)">Delete</div> <div class="delete" v-on:click="window.commento.moderatorDeleteHandler(email.email)">Delete</div>
<div class="date">added {{email.timeAgo}}</div> <div class="date">added {{email.timeAgo}}</div>
</div> </div>
</div> </div>
@ -215,7 +215,7 @@
<div id="new-domain-error" class="modal-error-box"></div> <div id="new-domain-error" class="modal-error-box"></div>
</div> </div>
<div class="center"> <div class="center">
<button id="save-general-button" onclick="window.generalSaveHandler()" class="button">Save Changes</button> <button id="save-general-button" onclick="window.commento.generalSaveHandler()" class="button">Save Changes</button>
</div> </div>
</div> </div>
</div> </div>
@ -247,7 +247,7 @@
<div class="commento-email-container"> <div class="commento-email-container">
<div class="commento-email"> <div class="commento-email">
<input class="commento-input" type="text" id="disqus-url" placeholder="https://media.disqus.com/uploads/..."> <input class="commento-input" type="text" id="disqus-url" placeholder="https://media.disqus.com/uploads/...">
<button id="disqus-import-button" class="commento-email-button" onclick="importDisqus()">Import</button> <button id="disqus-import-button" class="commento-email-button" onclick="window.commento.importDisqus()">Import</button>
</div> </div>
</div> </div>
<div class="subtext-container"> <div class="subtext-container">
@ -286,7 +286,7 @@
If you desire to re-allow comments again on your website, you can do so. You can, of course, freeze the site again in the future. If you desire to re-allow comments again on your website, you can do so. You can, of course, freeze the site again in the future.
</div> </div>
<button onclick="window.location.hash='#unfreeze-domain-modal'" class="button green-button">Unfreeze Domain</button> <button onclick="document.location.hash='#unfreeze-domain-modal'" class="button green-button">Unfreeze Domain</button>
</div> </div>
<div class="box" v-if="domains[cd].state != 'frozen'"> <div class="box" v-if="domains[cd].state != 'frozen'">
@ -294,7 +294,7 @@
If you desire to temporarily freeze new comments (domain-wide), thereby making it read-only, you can do so. You can choose to unfreeze later; this is temporary. If you desire to temporarily freeze new comments (domain-wide), thereby making it read-only, you can do so. You can choose to unfreeze later; this is temporary.
</div> </div>
<button id="orange-button" onclick="window.location.hash='#freeze-domain-modal'" class="button orange-button">Freeze Domain</button> <button id="orange-button" onclick="document.location.hash='#freeze-domain-modal'" class="button orange-button">Freeze Domain</button>
</div> </div>
</div> </div>
</div> </div>
@ -305,7 +305,7 @@
Want to completely remove Commento from your website? This will permanently delete all comments and there is literally no way to retrieve your data once you do this. Want to completely remove Commento from your website? This will permanently delete all comments and there is literally no way to retrieve your data once you do this.
</div> </div>
<button id="big-red-button" class="button big-red-button" onclick="window.location.hash='#delete-domain-modal'">Delete Domain</button> <button id="big-red-button" class="button big-red-button" onclick="document.location.hash='#delete-domain-modal'">Delete Domain</button>
</div> </div>
</div> </div>
</div> </div>
@ -323,7 +323,7 @@
Are you absolutely sure you want to freeze your domain, thereby making it read-only? You can choose to unfreeze later; this is temporary. Are you absolutely sure you want to freeze your domain, thereby making it read-only? You can choose to unfreeze later; this is temporary.
</div> </div>
<div class="modal-contents"> <div class="modal-contents">
<button id="orange-button" class="button orange-button" onclick="window.domainFreezeHandler()">Freeze Domain</button> <button id="orange-button" class="button orange-button" onclick="window.commento.domainFreezeHandler()">Freeze Domain</button>
</div> </div>
</div> </div>
</div> </div>
@ -336,7 +336,7 @@
Are you absolutely sure you want to unfreeze your domain? This will re-allow new comments. You can choose to freeze again in the future. Are you absolutely sure you want to unfreeze your domain? This will re-allow new comments. You can choose to freeze again in the future.
</div> </div>
<div class="modal-contents"> <div class="modal-contents">
<button id="blue-button" class="button green-button" onclick="window.domainUnfreezeHandler()">Unfreeze Domain</button> <button id="blue-button" class="button green-button" onclick="window.commento.domainUnfreezeHandler()">Unfreeze Domain</button>
</div> </div>
</div> </div>
</div> </div>
@ -349,7 +349,7 @@
Are you absolutely sure? This will permanently delete all comments and there is literally no way to retrieve your data once you do this. Are you absolutely sure? This will permanently delete all comments and there is literally no way to retrieve your data once you do this.
</div> </div>
<div class="modal-contents"> <div class="modal-contents">
<button id="big-red-button" class="button big-red-button" onclick="window.domainDeleteHandler()">Delete Domain</button> <button id="big-red-button" class="button big-red-button" onclick="window.commento.domainDeleteHandler()">Delete Domain</button>
</div> </div>
</div> </div>
</div> </div>
@ -374,7 +374,7 @@
</div> </div>
<div id="new-domain-error" class="modal-error-box"></div> <div id="new-domain-error" class="modal-error-box"></div>
<div class="center"> <div class="center">
<button id="add-site-button" onclick="window.domainNewHandler()" class="button">Add Domain</button> <button id="add-site-button" onclick="window.commento.domainNewHandler()" class="button">Add Domain</button>
</div> </div>
</div> </div>
</div> </div>

2
frontend/forgot.html
View File

@ -25,7 +25,7 @@
</div> </div>
<div class="err" id="err"></div> <div class="err" id="err"></div>
<div class="msg" id="msg"></div> <div class="msg" id="msg"></div>
<button id="reset-button" class="button" onclick="sendResetHex()">Send Reset Password Link</button> <button id="reset-button" class="button" onclick="window.commento.sendResetHex()">Send Reset Password Link</button>
<a class="link" href="[[[.Origin]]]/login">Suddenly remembered your password? Login.</a> <a class="link" href="[[[.Origin]]]/login">Suddenly remembered your password? Login.</a>
</div> </div>
</div> </div>

4
frontend/js/auth-common.js
View File

@ -5,7 +5,7 @@
// cookie is deleted. // cookie is deleted.
global.loggedInRedirect = function() { global.loggedInRedirect = function() {
if (global.cookieGet("commentoOwnerToken") !== undefined) if (global.cookieGet("commentoOwnerToken") !== undefined)
document.location = global.commentoOrigin + "/dashboard"; document.location = global.origin + "/dashboard";
} }
@ -17,4 +17,4 @@
} }
}; };
} (window, document)); } (window.commento, document));

143
frontend/js/commento.js
View File

@ -1,6 +1,13 @@
(function(global, document) { (function(global, document) {
'use strict'; 'use strict';
if (global.commento === undefined) {
console.log("[commento] error: window.commento namespace not defined; maybe there's a mismatch in version between the backend and the frontend?");
return;
}
global = global.commento;
// Do not use other files like utils.js and http.js in the Makefile to build // Do not use other files like utils.js and http.js in the Makefile to build
// commento.js for the following reasons: // commento.js for the following reasons:
// - We don't use jQuery in the actual JavaScript payload because we need // - We don't use jQuery in the actual JavaScript payload because we need
@ -56,8 +63,8 @@
var ID_FOOTER = "commento-footer"; var ID_FOOTER = "commento-footer";
var origin = global.commentoOrigin; var origin = global.origin;
var cdn = global.commentoCdn; var cdn = global.cdn;
var root = null; var root = null;
var cssOverride = undefined; var cssOverride = undefined;
var autoInit = undefined; var autoInit = undefined;
@ -140,6 +147,13 @@
} }
function onclick(node, f, ...args) {
node.addEventListener("click", function() {
f(...args);
}, false);
}
function attrSet(node, a, value) { function attrSet(node, a, value) {
node.setAttribute(a, value); node.setAttribute(a, value);
} }
@ -254,13 +268,13 @@
name.innerText = resp.commenter.name; name.innerText = resp.commenter.name;
logout.innerText = "Logout"; logout.innerText = "Logout";
onclick(logout, global.logout);
attrSet(loggedContainer, "style", "display: none"); attrSet(loggedContainer, "style", "display: none");
attrSet(logout, "onclick", "logout()");
attrSet(name, "href", resp.commenter.link); attrSet(name, "href", resp.commenter.link);
if (resp.commenter.photo == "undefined") { if (resp.commenter.photo == "undefined") {
avatar = create("div"); avatar = create("div");
avatar.style["background"] = color; avatar.style["background"] = color;
avatar.style["boxShadow"] = "0px 0px 0px 2px " + color;
avatar.innerHTML = resp.commenter.name[0].toUpperCase(); avatar.innerHTML = resp.commenter.name[0].toUpperCase();
classAdd(avatar, "avatar"); classAdd(avatar, "avatar");
} else { } else {
@ -354,7 +368,7 @@
commenters = resp.commenters; commenters = resp.commenters;
configuredOauths = resp.configuredOauths; configuredOauths = resp.configuredOauths;
cssLoad(cdn + "/css/commento.css", "window.loadCssOverride()"); cssLoad(cdn + "/css/commento.css", "window.commento.loadCssOverride()");
call(callback); call(callback);
}); });
@ -418,9 +432,11 @@
classAdd(loginButton, "login-button"); classAdd(loginButton, "login-button");
classAdd(anonymousButton, "anonymous-button"); classAdd(anonymousButton, "anonymous-button");
attrSet(createButton, "onclick", "loginBoxShow()"); onclick(createButton, global.loginBoxShow);
attrSet(loginButton, "onclick", "loginBoxShow(); loginSwitch(true);"); onclick(loginButton, global.loginBoxShow);
attrSet(anonymousButton, "onclick", "anonymousChoose()"); onclick(loginButton, global.loginSwitch);
onclick(anonymousButton, global.anonymousChoose);
attrSet(textarea, "disabled", true); attrSet(textarea, "disabled", true);
createButton.innerText = "Create an Account"; createButton.innerText = "Create an Account";
@ -437,8 +453,9 @@
append(textareaContainer, buttonsContainer); append(textareaContainer, buttonsContainer);
} }
else { else {
onclick(textarea, global.showSubmitButton, id);
attrSet(textarea, "placeholder", "Join the discussion!"); attrSet(textarea, "placeholder", "Join the discussion!");
attrSet(textarea, "onclick", "showSubmitButton('" + id + "')");
} }
textarea.oninput = autoExpander(textarea); textarea.oninput = autoExpander(textarea);
@ -683,7 +700,6 @@
if (commenter.photo == "undefined") { if (commenter.photo == "undefined") {
avatar = create("div"); avatar = create("div");
avatar.style["background"] = color; avatar.style["background"] = color;
avatar.style["boxShadow"] = "0px 0px 0px 2px " + color;
avatar.innerHTML = commenter.name[0].toUpperCase(); avatar.innerHTML = commenter.name[0].toUpperCase();
classAdd(avatar, "avatar"); classAdd(avatar, "avatar");
} else { } else {
@ -735,35 +751,22 @@
classAdd(downvote, "downvoted"); classAdd(downvote, "downvoted");
} }
attrSet(edit, "onclick", "startEdit('" + comment.commentHex + "')"); onclick(collapse, global.commentCollapse, comment.commentHex);
attrSet(collapse, "onclick", "commentCollapse('" + comment.commentHex + "')"); onclick(approve, global.commentApprove, comment.commentHex);
attrSet(approve, "onclick", "commentApprove('" + comment.commentHex + "')"); onclick(remove, global.commentDelete, comment.commentHex);
attrSet(remove, "onclick", "commentDelete('" + comment.commentHex + "')"); onclick(sticky, global.commentSticky, comment.commentHex);
attrSet(sticky, "onclick", "commentSticky('" + comment.commentHex + "')");
if (isAuthenticated) { if (isAuthenticated)
if (comment.direction > 0) { upDownOnclickSet(upvote, downvote, comment.commentHex, comment.direction);
attrSet(upvote, "onclick", "vote('" + comment.commentHex + "', 1, 0)");
attrSet(downvote, "onclick", "vote('" + comment.commentHex + "', 1, -1)");
}
else if (comment.direction < 0) {
attrSet(upvote, "onclick", "vote('" + comment.commentHex + "', -1, 1)");
attrSet(downvote, "onclick", "vote('" + comment.commentHex + "', -1, 0)");
}
else {
attrSet(upvote, "onclick", "vote('" + comment.commentHex + "', 0, 1)");
attrSet(downvote, "onclick", "vote('" + comment.commentHex + "', 0, -1)");
}
}
else { else {
attrSet(upvote, "onclick", "loginBoxShow()"); onclick(upvote, global.loginBoxShow);
attrSet(downvote, "onclick", "loginBoxShow()"); onclick(downvote, global.loginBoxShow);
} }
if (isAuthenticated || chosenAnonymous) if (isAuthenticated || chosenAnonymous)
attrSet(reply, "onclick", "replyShow('" + comment.commentHex + "')"); onclick(reply, global.replyShow, comment.commentHex);
else else
attrSet(reply, "onclick", "loginBoxShow()"); onclick(reply, global.loginBoxShow);
if (commenter.link != "undefined" && commenter.link != "https://undefined" && commenter.link != "") if (commenter.link != "undefined" && commenter.link != "https://undefined" && commenter.link != "")
attrSet(name, "href", commenter.link); attrSet(name, "href", commenter.link);
@ -867,6 +870,22 @@
} }
function upDownOnclickSet(upvote, downvote, commentHex, direction) {
if (direction > 0) {
onclick(upvote, global.vote, commentHex, 1, 0);
onclick(downvote, global.vote, commentHex, 1, -1);
}
else if (direction < 0) {
onclick(upvote, global.vote, commentHex, -1, 1);
onclick(downvote, global.vote, commentHex, -1, 0);
}
else {
onclick(upvote, global.vote, commentHex, 0, 1);
onclick(downvote, global.vote, commentHex, 0, -1);
}
}
global.vote = function(commentHex, oldVote, direction) { global.vote = function(commentHex, oldVote, direction) {
var upvote = $(ID_UPVOTE + commentHex); var upvote = $(ID_UPVOTE + commentHex);
var downvote = $(ID_DOWNVOTE + commentHex); var downvote = $(ID_DOWNVOTE + commentHex);
@ -878,18 +897,7 @@
"direction": direction, "direction": direction,
}; };
if (direction > 0) { upDownOnclickSet(upvote, downvote, commentHex, direction);
attrSet(upvote, "onclick", "vote('" + commentHex + "', 1, 0)");
attrSet(downvote, "onclick", "vote('" + commentHex + "', 1, -1)");
}
else if (direction < 0) {
attrSet(upvote, "onclick", "vote('" + commentHex + "', -1, 1)");
attrSet(downvote, "onclick", "vote('" + commentHex + "', -1, 0)");
}
else {
attrSet(upvote, "onclick", "vote('" + commentHex + "', 0, 1)");
attrSet(downvote, "onclick", "vote('" + commentHex + "', 0, -1)");
}
classRemove(upvote, "upvoted"); classRemove(upvote, "upvoted");
classRemove(downvote, "downvoted"); classRemove(downvote, "downvoted");
@ -919,7 +927,7 @@
replyButton.title = "Cancel reply"; replyButton.title = "Cancel reply";
attrSet(replyButton, "onclick", "replyCollapse('" + id + "')") onclick(replyButton, global.replyCollapse, id);
}; };
@ -936,7 +944,7 @@
replyButton.title = "Reply to this comment"; replyButton.title = "Reply to this comment";
attrSet(replyButton, "onclick", "replyShow('" + id + "')") onclick(replyButton, global.replyShow, id)
} }
@ -951,7 +959,7 @@
button.title = "Expand"; button.title = "Expand";
attrSet(button, "onclick", "commentUncollapse('" + id + "')"); onclick(button, global.commentUncollapse, id);
} }
@ -966,7 +974,7 @@
button.title = "Collapse"; button.title = "Collapse";
attrSet(button, "onclick", "commentCollapse('" + id + "')"); onclick(button, global.commentCollapse, id);
} }
@ -1009,7 +1017,7 @@
classAdd(submit, "submit-button"); classAdd(submit, "submit-button");
classAdd(el, "button-margin"); classAdd(el, "button-margin");
attrSet(submit, "onclick", "commentNew('" + id + "')"); onclick(submit, global.commentNew, id);
append(el, submit); append(el, submit);
} }
@ -1048,7 +1056,7 @@
$(ID_ROOT).innerHTML = ""; $(ID_ROOT).innerHTML = "";
shownSubmitButton = {"root": false}; shownSubmitButton = {"root": false};
shownReply = {}; shownReply = {};
main(callback); global.main(callback);
} }
@ -1116,14 +1124,15 @@
oauthPretext.innerText = "Or proceed with social login."; oauthPretext.innerText = "Or proceed with social login.";
anonymousButton.innerText = "Comment anonymously"; anonymousButton.innerText = "Comment anonymously";
onclick(emailButton, global.passwordAsk);
onclick(loginLink, global.loginSwitch);
onclick(anonymousButton, global.anonymousChoose);
onclick(close, global.loginBoxClose);
attrSet(loginBoxContainer, "style", "display: none; opacity: 0;"); attrSet(loginBoxContainer, "style", "display: none; opacity: 0;");
attrSet(emailInput, "name", "email"); attrSet(emailInput, "name", "email");
attrSet(emailInput, "placeholder", "Email address"); attrSet(emailInput, "placeholder", "Email address");
attrSet(emailInput, "type", "text"); attrSet(emailInput, "type", "text");
attrSet(emailButton, "onclick", "passwordAsk()");
attrSet(loginLink, "onclick", "loginSwitch()");
attrSet(anonymousButton, "onclick", "anonymousChoose()");
attrSet(close, "onclick", "loginBoxClose()");
for (var i = 0; i < configuredOauths.length; i++) { for (var i = 0; i < configuredOauths.length; i++) {
var button = create("button"); var button = create("button");
@ -1133,7 +1142,7 @@
button.innerText = configuredOauths[i]; button.innerText = configuredOauths[i];
attrSet(button, "onclick", "commentoAuth('" + configuredOauths[i] + "')"); onclick(button, global.commentoAuth, configuredOauths[i]);
append(oauthButtons, button); append(oauthButtons, button);
} }
@ -1181,7 +1190,7 @@
loginLink.innerText = "Don't have an account? Sign up."; loginLink.innerText = "Don't have an account? Sign up.";
subtitle.innerText = "Enter your email address to start with."; subtitle.innerText = "Enter your email address to start with.";
attrSet(loginLink, "onclick", "signupSwitch()"); onclick(loginLink, global.signupSwitch);
loginBoxType = "login"; loginBoxType = "login";
@ -1195,8 +1204,8 @@
global.signupSwitch = function() { global.signupSwitch = function() {
loginBoxClose(); global.loginBoxClose();
loginBoxShow(); global.loginBoxShow();
} }
@ -1208,7 +1217,7 @@
post(origin + "/api/commenter/login", json, function(resp) { post(origin + "/api/commenter/login", json, function(resp) {
if (!resp.success) { if (!resp.success) {
loginBoxClose(); global.loginBoxClose();
errorShow(resp.message); errorShow(resp.message);
return return
} }
@ -1242,7 +1251,7 @@
post(origin + "/api/commenter/new", json, function(resp) { post(origin + "/api/commenter/new", json, function(resp) {
if (!resp.success) { if (!resp.success) {
loginBoxClose(); global.loginBoxClose();
errorShow(resp.message); errorShow(resp.message);
return return
} }
@ -1320,9 +1329,9 @@
fieldButton.innerText = loginBoxType; fieldButton.innerText = loginBoxType;
if (loginBoxType == "signup") if (loginBoxType == "signup")
attrSet(fieldButton, "onclick", "signup()"); onclick(fieldButton, global.signup);
else else
attrSet(fieldButton, "onclick", "login()"); onclick(fieldButton, global.login);
append(field, fieldButton); append(field, fieldButton);
} }
@ -1331,7 +1340,7 @@
} }
if (loginBoxType == "signup") if (loginBoxType == "signup")
$(ID_LOGIN_BOX_PASSWORD_NAME).focus(); $(ID_LOGIN_BOX_NAME_INPUT).focus();
else else
$(ID_LOGIN_BOX_PASSWORD_INPUT).focus(); $(ID_LOGIN_BOX_PASSWORD_INPUT).focus();
} }
@ -1424,15 +1433,15 @@
lock.id = ID_MOD_TOOLS_LOCK_BUTTON; lock.id = ID_MOD_TOOLS_LOCK_BUTTON;
classAdd(modTools, "mod-tools"); classAdd(modTools, "mod-tools");
classAdd(lock, "mod-tools-lock-button");
if (isLocked) if (isLocked)
lock.innerHTML = "Unlock Thread"; lock.innerHTML = "Unlock Thread";
else else
lock.innerHTML = "Lock Thread"; lock.innerHTML = "Lock Thread";
onclick(lock, global.threadLockToggle);
attrSet(modTools, "style", "display: none"); attrSet(modTools, "style", "display: none");
attrSet(lock, "onclick", "threadLockToggle()");
append(modTools, lock); append(modTools, lock);
append(root, modTools); append(root, modTools);
@ -1543,7 +1552,7 @@
dataTagsLoad(); dataTagsLoad();
if (autoInit == "true" || autoInit === undefined) if (autoInit == "true" || autoInit === undefined)
main(undefined); global.main(undefined);
else if (autoInit != "false") else if (autoInit != "false")
console.log("[commento] error: invalid value for data-auto-init; allowed values: true, false"); console.log("[commento] error: invalid value for data-auto-init; allowed values: true, false");
} }

10
frontend/js/dashboard-danger.js
View File

@ -11,9 +11,9 @@
global.domainDeleteHandler = function() { global.domainDeleteHandler = function() {
var data = global.dashboard.$data; var data = global.dashboard.$data;
domainDelete(data.domains[data.cd].domain, function(success) { global.domainDelete(data.domains[data.cd].domain, function(success) {
if (success) if (success)
document.location = global.commentoOrigin + '/dashboard'; document.location = global.origin + '/dashboard';
}); });
} }
@ -23,7 +23,7 @@
var data = global.dashboard.$data; var data = global.dashboard.$data;
data.domains[data.cd].state = "frozen" data.domains[data.cd].state = "frozen"
domainUpdate(data.domains[data.cd]) global.domainUpdate(data.domains[data.cd])
document.location.hash = "#modal-close"; document.location.hash = "#modal-close";
} }
@ -33,9 +33,9 @@
var data = global.dashboard.$data; var data = global.dashboard.$data;
data.domains[data.cd].state = "unfrozen" data.domains[data.cd].state = "unfrozen"
domainUpdate(data.domains[data.cd]) global.domainUpdate(data.domains[data.cd])
document.location.hash = "#modal-close"; document.location.hash = "#modal-close";
} }
} (window, document)); } (window.commento, document));

14
frontend/js/dashboard-domain.js
View File

@ -7,7 +7,7 @@
for (var i = 0; i < domains.length; i++) { for (var i = 0; i < domains.length; i++) {
if (domains[i].domain == domain) { if (domains[i].domain == domain) {
vs("frozen", domains[i].state == "frozen"); global.vs("frozen", domains[i].state == "frozen");
domains[i].selected = true; domains[i].selected = true;
data.cd = i; data.cd = i;
data.importedComments = domains[i].importedComments; data.importedComments = domains[i].importedComments;
@ -18,7 +18,7 @@
data.showSettings = true; data.showSettings = true;
settingDeselectAll(); global.settingDeselectAll();
$(".view").hide(); $(".view").hide();
}; };
@ -42,7 +42,7 @@
} }
global.buttonDisable("#add-site-button"); global.buttonDisable("#add-site-button");
global.post(global.commentoOrigin + "/api/domain/new", json, function(resp) { global.post(global.origin + "/api/domain/new", json, function(resp) {
global.buttonEnable("#add-site-button"); global.buttonEnable("#add-site-button");
$("#new-domain-name").val(""); $("#new-domain-name").val("");
@ -69,7 +69,7 @@
"ownerToken": global.cookieGet("commentoOwnerToken"), "ownerToken": global.cookieGet("commentoOwnerToken"),
}; };
global.post(global.commentoOrigin + "/api/domain/list", json, function(resp) { global.post(global.origin + "/api/domain/list", json, function(resp) {
if (!resp.success) { if (!resp.success) {
global.globalErrorShow(resp.message); global.globalErrorShow(resp.message);
return; return;
@ -111,7 +111,7 @@
"domain": domain, "domain": domain,
}; };
global.post(global.commentoOrigin + "/api/domain/update", json, function(resp) { global.post(global.origin + "/api/domain/update", json, function(resp) {
if (callback !== undefined) if (callback !== undefined)
callback(resp.success); callback(resp.success);
@ -130,7 +130,7 @@
"domain": domain, "domain": domain,
}; };
global.post(global.commentoOrigin + "/api/domain/delete", json, function(resp) { global.post(global.origin + "/api/domain/delete", json, function(resp) {
if (!resp.success) { if (!resp.success) {
global.globalErrorShow(resp.message); global.globalErrorShow(resp.message);
return; return;
@ -141,4 +141,4 @@
}); });
} }
} (window, document)); } (window.commento, document));

2
frontend/js/dashboard-general.js
View File

@ -16,4 +16,4 @@
}); });
}; };
} (window, document)); } (window.commento, document));

7
frontend/js/dashboard-import.js
View File

@ -6,7 +6,6 @@
$("#import-view").show(); $("#import-view").show();
} }
global.importDisqus = function() { global.importDisqus = function() {
var url = $("#disqus-url").val(); var url = $("#disqus-url").val();
var data = global.dashboard.$data; var data = global.dashboard.$data;
@ -18,7 +17,7 @@
} }
global.buttonDisable("#disqus-import-button"); global.buttonDisable("#disqus-import-button");
global.post(global.commentoOrigin + "/api/domain/import/disqus", json, function(resp) { global.post(global.origin + "/api/domain/import/disqus", json, function(resp) {
global.buttonEnable("#disqus-import-button"); global.buttonEnable("#disqus-import-button");
if (!resp.success) { if (!resp.success) {
@ -28,8 +27,8 @@
$("#disqus-import-button").hide(); $("#disqus-import-button").hide();
globalOKShow("Imported " + resp.numImported + " comments!"); global.globalOKShow("Imported " + resp.numImported + " comments!");
}); });
} }
} (window, document)); } (window.commento, document));

2
frontend/js/dashboard-installation.js
View File

@ -19,4 +19,4 @@
$("#installation-view").show(); $("#installation-view").show();
}; };
} (window, document)); } (window.commento, document));

8
frontend/js/dashboard-moderation.js
View File

@ -29,7 +29,7 @@
if (idx == -1) { if (idx == -1) {
data.domains[data.cd].moderators.push({"email": email, "timeAgo": "just now"}); data.domains[data.cd].moderators.push({"email": email, "timeAgo": "just now"});
global.buttonDisable("#new-mod-button"); global.buttonDisable("#new-mod-button");
global.post(global.commentoOrigin + "/api/domain/moderator/new", json, function(resp) { global.post(global.origin + "/api/domain/moderator/new", json, function(resp) {
global.buttonEnable("#new-mod-button"); global.buttonEnable("#new-mod-button");
if (!resp.success) { if (!resp.success) {
@ -68,15 +68,15 @@
if (idx != -1) { if (idx != -1) {
data.domains[data.cd].moderators.splice(idx, 1); data.domains[data.cd].moderators.splice(idx, 1);
global.post(global.commentoOrigin + "/api/domain/moderator/delete", json, function(resp) { global.post(global.origin + "/api/domain/moderator/delete", json, function(resp) {
if (!resp.success) { if (!resp.success) {
global.globalErrorShow(resp.message); global.globalErrorShow(resp.message);
return return
} }
globalOKShow("Removed!"); global.globalOKShow("Removed!");
}); });
} }
} }
} (window, document)); } (window.commento, document));

2
frontend/js/dashboard-setting.js
View File

@ -43,4 +43,4 @@
settings[i].selected = false; settings[i].selected = false;
} }
} (window, document)); } (window.commento, document));

12
frontend/js/dashboard-statistics.js
View File

@ -16,15 +16,15 @@
var res; var res;
if (x < 1000000) { if (x < 1000000) {
res = numberify((x/1000).toFixed(0)) res = global.numberify((x/1000).toFixed(0))
res.units = "K" res.units = "K"
} }
else if (x < 1000000000) { else if (x < 1000000000) {
res = numberify((x/1000000).toFixed(0)) res = global.numberify((x/1000000).toFixed(0))
res.units = "M" res.units = "M"
} }
else if (x < 1000000000000) { else if (x < 1000000000000) {
res = numberify((x/1000000000).toFixed(0)) res = global.numberify((x/1000000000).toFixed(0))
res.units = "B" res.units = "B"
} }
@ -43,11 +43,11 @@
} }
$(".view").hide(); $(".view").hide();
post(global.commentoOrigin + "/api/domain/statistics", json, function(resp) { global.post(global.origin + "/api/domain/statistics", json, function(resp) {
$("#statistics-view").show(); $("#statistics-view").show();
if (!resp.success) { if (!resp.success) {
globalErrorShow(resp.message); global.globalErrorShow(resp.message);
return; return;
} }
@ -97,4 +97,4 @@
}); });
} }
} (window, document)); } (window.commento, document));

14
frontend/js/dashboard.js
View File

@ -23,42 +23,42 @@
"text": "Installation", "text": "Installation",
"meaning": "Install Commento with HTML", "meaning": "Install Commento with HTML",
"selected": false, "selected": false,
"open": installationOpen, "open": global.installationOpen,
}, },
{ {
"id": "general", "id": "general",
"text": "Configure Domain", "text": "Configure Domain",
"meaning": "Names, domains and the rest", "meaning": "Names, domains and the rest",
"selected": false, "selected": false,
"open": generalOpen, "open": global.generalOpen,
}, },
{ {
"id": "moderation", "id": "moderation",
"text": "Moderation Settings", "text": "Moderation Settings",
"meaning": "Manage list of moderators", "meaning": "Manage list of moderators",
"selected": false, "selected": false,
"open": moderationOpen, "open": global.moderationOpen,
}, },
{ {
"id": "statistics", "id": "statistics",
"text": "View Activity", "text": "View Activity",
"meaning": "Usage and comment statistics", "meaning": "Usage and comment statistics",
"selected": false, "selected": false,
"open": statisticsOpen, "open": global.statisticsOpen,
}, },
{ {
"id": "import", "id": "import",
"text": "Import Comments", "text": "Import Comments",
"meaning": "Import from a different service", "meaning": "Import from a different service",
"selected": false, "selected": false,
"open": importOpen, "open": global.importOpen,
}, },
{ {
"id": "danger", "id": "danger",
"text": "Danger Zone", "text": "Danger Zone",
"meaning": "Delete or freeze domain", "meaning": "Delete or freeze domain",
"selected": false, "selected": false,
"open": dangerOpen, "open": global.dangerOpen,
}, },
]; ];
@ -86,4 +86,4 @@
callback(); callback();
}; };
} (window, document)); } (window.commento, document));

2
frontend/js/errors.js
View File

@ -28,4 +28,4 @@
global.showGlobalMessage("#global-ok", text); global.showGlobalMessage("#global-ok", text);
} }
} (window, document)); } (window.commento, document));

4
frontend/js/forgot.js
View File

@ -16,7 +16,7 @@
}; };
global.buttonDisable("#reset-button"); global.buttonDisable("#reset-button");
global.post(global.commentoOrigin + "/api/owner/send-reset-hex", json, function(resp) { global.post(global.origin + "/api/owner/send-reset-hex", json, function(resp) {
global.buttonEnable("#reset-button"); global.buttonEnable("#reset-button");
global.textSet("#err", ""); global.textSet("#err", "");
@ -30,4 +30,4 @@
}); });
} }
} (window, document)); } (window.commento, document));

2
frontend/js/http.js
View File

@ -28,4 +28,4 @@
}); });
} }
} (window, document)); } (window.commento, document));

10
frontend/js/login.js
View File

@ -15,7 +15,7 @@
// Shows messages produced from password reset attempts. // Shows messages produced from password reset attempts.
function displayChangedPassword() { function displayChangedPassword() {
var changed = paramGet("changed"); var changed = global.paramGet("changed");
if (changed == "true") { if (changed == "true") {
$("#msg").html("Password changed successfully! Login to continue.") $("#msg").html("Password changed successfully! Login to continue.")
@ -24,7 +24,7 @@
// Shows messages produced from completed signups. // Shows messages produced from completed signups.
function displaySignedUp() { function displaySignedUp() {
var signedUp = paramGet("signedUp"); var signedUp = global.paramGet("signedUp");
if (signedUp == "true") { if (signedUp == "true") {
$("#msg").html("Registration successful! Login to continue.") $("#msg").html("Registration successful! Login to continue.")
@ -57,7 +57,7 @@
}; };
global.buttonDisable("#login-button"); global.buttonDisable("#login-button");
global.post(global.commentoOrigin + "/api/owner/login", json, function(resp) { global.post(global.origin + "/api/owner/login", json, function(resp) {
global.buttonEnable("#login-button"); global.buttonEnable("#login-button");
if (!resp.success) { if (!resp.success) {
@ -66,8 +66,8 @@
} }
global.cookieSet("commentoOwnerToken", resp.ownerToken); global.cookieSet("commentoOwnerToken", resp.ownerToken);
document.location = global.commentoOrigin + "/dashboard"; document.location = global.origin + "/dashboard";
}); });
}; };
} (window, document)); } (window.commento, document));

4
frontend/js/logout.js
View File

@ -2,7 +2,7 @@
global.logout = function() { global.logout = function() {
global.cookieDelete("commentoOwnerToken"); global.cookieDelete("commentoOwnerToken");
document.location = global.commentoOrigin + "/login"; document.location = global.origin + "/login";
} }
} (window, document)); } (window.commento, document));

6
frontend/js/reset.js
View File

@ -21,7 +21,7 @@
}; };
global.buttonDisable("#reset-button"); global.buttonDisable("#reset-button");
global.post(global.commentoOrigin + "/api/owner/reset-password", json, function(resp) { global.post(global.origin + "/api/owner/reset-password", json, function(resp) {
global.buttonEnable("#reset-button"); global.buttonEnable("#reset-button");
global.textSet("#err", ""); global.textSet("#err", "");
@ -30,8 +30,8 @@
return return
} }
document.location = global.commentoOrigin + "/login?changed=true"; document.location = global.origin + "/login?changed=true";
}); });
} }
} (window, document)); } (window.commento, document));

8
frontend/js/self.js
View File

@ -7,14 +7,14 @@
}; };
if (json.ownerToken === undefined) { if (json.ownerToken === undefined) {
document.location = global.commentoOrigin + "/login"; document.location = global.origin + "/login";
return; return;
} }
global.post(global.commentoOrigin + "/api/owner/self", json, function(resp) { global.post(global.origin + "/api/owner/self", json, function(resp) {
if (!resp.success || !resp.loggedIn) { if (!resp.success || !resp.loggedIn) {
global.cookieDelete("commentoOwnerToken"); global.cookieDelete("commentoOwnerToken");
document.location = global.commentoOrigin + "/login"; document.location = global.origin + "/login";
return; return;
} }
@ -23,4 +23,4 @@
}); });
}; };
}(window, document)); }(window.commento, document));

10
frontend/js/signup.js
View File

@ -9,7 +9,7 @@
return; return;
} }
var all_ok = unfilledMark(["#email", "#name", "#password", "#password2"], function(el) { var all_ok = global.unfilledMark(["#email", "#name", "#password", "#password2"], function(el) {
el.css("border-bottom", "1px solid red"); el.css("border-bottom", "1px solid red");
}); });
@ -25,7 +25,7 @@
}; };
global.buttonDisable("#signup-button"); global.buttonDisable("#signup-button");
post(global.commentoOrigin + "/api/owner/new", json, function(resp) { global.post(global.origin + "/api/owner/new", json, function(resp) {
global.buttonEnable("#signup-button") global.buttonEnable("#signup-button")
if (!resp.success) { if (!resp.success) {
@ -34,10 +34,10 @@
} }
if (resp.confirmEmail) if (resp.confirmEmail)
document.location = global.commentoOrigin + "/confirm-email"; document.locatidocumenton = global.origin + "/confirm-email";
else else
document.location = global.commentoOrigin + "/login?signedUp=true"; document.location = global.origin + "/login?signedUp=true";
}); });
}; };
} (window, document)); } (window.commento, document));

4
frontend/js/utils.js
View File

@ -72,7 +72,7 @@
expires = "; expires=" + date.toUTCString(); expires = "; expires=" + date.toUTCString();
var cookieString = name + "=" + value + expires + "; path=/"; var cookieString = name + "=" + value + expires + "; path=/";
if (/^https:\/\//i.test(commentoOrigin)) if (/^https:\/\//i.test(origin))
cookieString += "; secure"; cookieString += "; secure";
document.cookie = cookieString; document.cookie = cookieString;
@ -115,4 +115,4 @@
return "just now"; return "just now";
} }
} (window, document)); } (window.commento, document));

8
frontend/login.html
View File

@ -16,9 +16,9 @@
<script> <script>
window.onload = function() { window.onload = function() {
window.loggedInRedirect(); window.commento.loggedInRedirect();
window.prefillEmail(); window.commento.prefillEmail();
window.displayMessages(); window.commento.displayMessages();
}; };
</script> </script>
@ -41,7 +41,7 @@
<div class="err" id="err"></div> <div class="err" id="err"></div>
<div class="msg" id="msg"></div> <div class="msg" id="msg"></div>
<button id="button" class="button" onclick="window.login()">Login</button> <button id="button" class="button" onclick="window.commento.login()">Login</button>
<a class="link" href="[[[.Origin]]]/forgot">Trouble logging in? Reset your password.</a> <a class="link" href="[[[.Origin]]]/forgot">Trouble logging in? Reset your password.</a>
<a class="link" href="[[[.Origin]]]/signup">Don't have an account yet? Sign up.</a> <a class="link" href="[[[.Origin]]]/signup">Don't have an account yet? Sign up.</a>

2
frontend/logout.html
View File

@ -5,6 +5,6 @@
</head> </head>
<script> <script>
window.onload = window.logout; window.onload = window.commento.logout;
</script> </script>
</html> </html>

2
frontend/reset-password.html
View File

@ -32,7 +32,7 @@
<div class="err" id="err"></div> <div class="err" id="err"></div>
<div class="msg" id="msg"></div> <div class="msg" id="msg"></div>
<button id="reset-button" class="button" onclick="resetPassword()">Reset Password</button> <button id="reset-button" class="button" onclick="window.commento.resetPassword()">Reset Password</button>
</div> </div>
</div> </div>

15
frontend/sass/commento-input.scss
View File

@ -188,18 +188,3 @@ textarea {
.commento-button-margin { .commento-button-margin {
padding-bottom: 60px; padding-bottom: 60px;
} }
.commento-mod-tools-lock-button {
color: $gray-6;
background: none;
border: none;
font-weight: bold;
font-size: 12px;
text-transform: uppercase;
margin-left: 12px;
padding: 2px;
}
.commento-mod-tools-lock-button:hover {
cursor: pointer;
}

37
frontend/sass/commento.scss
View File

@ -5,13 +5,16 @@
} }
.commento-root { .commento-root {
font-family: "Source Sans Pro", "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
font-size: 15px;
line-height: 1.5;
color: #50596c;
overflow-x: hidden; overflow-x: hidden;
text-rendering: optimizeLegibility; padding: 0px;
padding: 8px;
* {
font-family: "Source Sans Pro", "Segoe UI", "Roboto", "Helvetica Neue", sans-serif;
font-size: 15px;
line-height: 1.5;
color: #50596c;
text-rendering: optimizeLegibility;
}
@import "colors-main.scss"; @import "colors-main.scss";
@import "common-main.scss"; @import "common-main.scss";
@ -46,13 +49,24 @@
.commento-mod-tools { .commento-mod-tools {
margin-bottom: 16px; margin-bottom: 16px;
button {
text-transform: uppercase;
color: $gray-7;
font-size: 13px;
font-weight: 700;
cursor: pointer;
margin-left: 12px;
background: none;
border: none;
}
} }
.commento-mod-tools::before { .commento-mod-tools::before {
content: "Moderators"; content: "Moderator Tools";
text-transform: uppercase; text-transform: uppercase;
color: $indigo-8; color: $indigo-8;
font-size: 12px; font-size: 13px;
font-weight: 700; font-weight: 700;
} }
@ -71,8 +85,8 @@
} }
.commento-avatar { .commento-avatar {
width: 34px; width: 38px;
height: 34px; height: 38px;
border-radius: 50%; border-radius: 50%;
display: flex; display: flex;
justify-content: center; justify-content: center;
@ -81,8 +95,7 @@
font-size: 22px; font-size: 22px;
float: left; float: left;
margin-right: 10px; margin-right: 10px;
border: 1px solid #fff; border: 0px transparent;
box-shadow: 0px 0px 0px 2px #f00;
} }
.commento-avatar-img { .commento-avatar-img {

6
frontend/signup.html
View File

@ -16,8 +16,8 @@
<script> <script>
window.onload = function() { window.onload = function() {
window.loggedInRedirect(); window.commento.loggedInRedirect();
window.prefillEmail(); window.commento.prefillEmail();
}; };
</script> </script>
@ -54,7 +54,7 @@
<p class="cent"> <p class="cent">
</p> </p>
<button id="signup-button" class="button" onclick="window.signup()">Sign up</button> <button id="signup-button" class="button" onclick="window.commento.signup()">Sign up</button>
<a class="link" href="[[[.Origin]]]/login">Already have an account? Login instead.</a> <a class="link" href="[[[.Origin]]]/login">Already have an account? Login instead.</a>
</div> </div>