2018-06-04 00:06:17 +08:00
< html >
< head >
2018-06-22 22:09:58 +08:00
< script src = "[[[.CdnPrefix]]]/js/jquery.js" > < / script >
< script src = "[[[.CdnPrefix]]]/js/vue.js" > < / script >
< script src = "[[[.CdnPrefix]]]/js/highlight.js" > < / script >
< script src = "[[[.CdnPrefix]]]/js/chartist.js" > < / script >
< script src = "[[[.CdnPrefix]]]/js/dashboard.js" > < / script >
2019-01-31 09:13:08 +08:00
< link rel = "icon" href = "[[[.CdnPrefix]]]/images/120x120.png" >
2018-06-22 22:09:58 +08:00
< link rel = "stylesheet" href = "[[[.CdnPrefix]]]/css/chartist.css" >
< link rel = "stylesheet" href = "[[[.CdnPrefix]]]/css/dashboard.css" >
2018-06-04 00:06:17 +08:00
< link href = "https://fonts.googleapis.com/css?family=Source+Code+Pro:400,700|Source+Sans+Pro:200,300,400,700" rel = "stylesheet" >
< title > Commento: Dashboard< / title >
< / head >
< div id = "navbar" class = "navbar" >
2018-08-08 14:46:27 +08:00
< a href = "[[[.Origin]]]/" class = "navbar-item navbar-logo-text" > < img src = "[[[.CdnPrefix]]]/images/logo.svg" class = "navbar-logo" > Commento< / a >
2018-06-05 16:52:53 +08:00
< div class = "navbar-item" >
2018-08-08 14:46:27 +08:00
< a href = "[[[.Origin]]]/logout" class = "navbar-item" > Logout< / a >
2018-06-05 16:52:53 +08:00
< div class = "float-right" > < b > < div id = "owner-name" > < / div > < / b > < / div >
2018-06-04 00:06:17 +08:00
< / div >
< / div >
< script >
window.onload = function() {
2018-12-20 13:48:43 +08:00
window.commento.selfGet(function() {
window.commento.vueConstruct(function() {
window.commento.navbarFill();
window.commento.domainRefresh();
2018-06-04 00:06:17 +08:00
$(document).ready(function(){
$("ul.tabs li").click(function(){
var tab_id = $(this).attr("data-tab");
$("ul.tabs li").removeClass("current");
$(".content").removeClass("current");
$(this).addClass("current");
$("#"+tab_id).addClass("current");
});
});
});
});
};
< / script >
< div class = "global-error" id = "global-error" > < / div >
< div class = "global-ok" id = "global-ok" > < / div >
< div id = "dashboard" class = "dashboard-container" >
< div class = "pane-left" >
< div class = "tree" v-if = "domains.length == 0 || domains[0].show == false" >
2018-07-04 20:51:31 +08:00
< img class = "tree-svg" src = "[[[.CdnPrefix]]]/images/tree.svg" >
2018-06-04 00:06:17 +08:00
It's so quiet in here.
< / div >
2018-12-20 13:48:43 +08:00
< 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" >
2018-06-04 00:06:17 +08:00
< div class = "pane-setting-inside" >
< div class = "setting-title" > {{domain.name}}< / div >
< div class = "setting-subtitle" > {{domain.domain}}< / div >
< / div >
< / div >
2018-12-20 13:48:43 +08:00
< div class = "pane-setting" id = "domain-add" onclick = "document.location.hash='#new-domain-modal'" >
2018-06-04 00:06:17 +08:00
< div class = "pane-setting-inside super-setting" >
< div class = "super-setting-title" > +< / div >
< div class = "super-setting-text" > New Domain< / div >
< / div >
< / div >
< / div >
< div class = "pane-middle" >
2018-12-20 13:48:43 +08:00
< 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}" >
2018-06-04 00:06:17 +08:00
< div class = "pane-setting-inside" >
< div class = "setting-title" > {{setting.text}}< / div >
< div class = "setting-subtitle" > {{setting.meaning}}< / div >
< / div >
< / div >
< div class = "select-a-domain" v-if = "!showSettings" >
Select a website on the left.
< / div >
< / div >
< div class = "pane-right" >
<!-- Installation -->
< div id = "installation-view" class = "view hidden" >
< div class = "view-inside" >
2019-01-31 15:06:11 +08:00
< div class = "mid-view" >
2018-06-04 00:06:17 +08:00
< div class = "tabs-container" >
< div class = "tab" >
< ul class = "tabs" >
2019-01-31 15:06:11 +08:00
< li class = "tab-link original current" data-tab = "installation-tab-1" > Universal Snippet< / li >
2018-06-04 00:06:17 +08:00
< / ul >
2019-01-31 15:06:11 +08:00
< div id = "installation-tab-1" class = "content original current" >
< div class = "normal-text" >
2018-06-04 00:06:17 +08:00
Copy the following piece of HTML code and paste it where you'd like Commento to load.
< / div >
< pre > < code id = "code-div" class = "html" > < / code > < / pre >
2019-01-31 15:06:11 +08:00
< div class = "normal-text" >
2018-06-04 00:06:17 +08:00
And that's it. All your settings, themes, and comments would be automagically loaded. Commento is mobile-responsive too, as it simply fills the container it is put in.
< / div >
2019-01-31 11:44:36 +08:00
< br >
2019-01-31 15:06:11 +08:00
< div class = "normal-text" >
2019-01-31 11:44:36 +08:00
Read the Commento documentation < a href = "https://docs.commento.io/configuration/" > on configuration< / a > .
< / div >
2018-06-04 00:06:17 +08:00
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
<!-- Stats -->
< div id = "statistics-view" class = "view hidden" >
< div class = "view-inside" >
< div class = "mid-view center" >
< div class = "center center-title" >
Analytics
< / div >
2019-01-31 12:47:29 +08:00
2019-01-31 15:06:11 +08:00
< div class = "normal-text" >
2019-01-31 12:47:29 +08:00
Anonymous statistics such as monthly pageviews and number of comments
< / div >
2018-06-04 00:06:17 +08:00
< div class = "stat" >
< div class = "number" >
< div class = "digits gray-digits" > {{domains[cd].viewsLast30Days.zeros}}< / div >
< div class = "digits" > {{domains[cd].viewsLast30Days.num}}< / div >
< div class = "digits dark-gray-digits" > {{domains[cd].viewsLast30Days.units}}< / div >
< / div >
< div class = "text" >
views in the last 30 days
< / div >
< div class = "graph" id = "views-graph" > < / div >
< / div >
< div class = "stat" >
< div class = "number" >
< div class = "digits gray-digits" > {{domains[cd].commentsLast30Days.zeros}}< / div >
< div class = "digits" > {{domains[cd].commentsLast30Days.num}}< / div >
< div class = "digits dark-gray-digits" > {{domains[cd].commentsLast30Days.units}}< / div >
< / div >
< div class = "text" >
comments in the last 30 days
< / div >
< div class = "graph" id = "comments-graph" > < / div >
< / div >
< / div >
< / div >
< / div >
<!-- moderation -->
< div id = "moderation-view" class = "view hidden" >
< div class = "view-inside" >
2019-01-31 15:06:11 +08:00
< div class = "mid-view" >
2018-06-04 00:06:17 +08:00
< div class = "tabs-container" >
< div class = "tab" >
< ul class = "tabs" >
2019-01-31 12:47:29 +08:00
< li class = "tab-link original current" data-tab = "mod-tab-1" > General< / li >
< li class = "tab-link" data-tab = "mod-tab-2" > Add/Remove Moderators< / li >
2018-06-04 00:06:17 +08:00
< / ul >
< div id = "mod-tab-1" class = "content original current" >
2019-04-20 07:12:44 +08:00
< div class = "question" >
< div class = "title" >
Comment Filtering
2019-01-31 12:47:29 +08:00
< / div >
2019-04-20 07:12:44 +08:00
< div class = "answer" >
< div class = "row no-border commento-round-check" >
< input type = "checkbox" v-model = "domains[cd].autoSpamFilter" id = "spam-filtering" >
< label for = "spam-filtering" > Automatic spam filtering< / label >
< / div >
2019-01-31 12:47:29 +08:00
2019-04-20 07:12:44 +08:00
< div class = "row no-border commento-round-check" >
< input type = "checkbox" v-model = "domains[cd].requireModeration" id = "require-moderation" >
< label for = "require-moderation" > Require all comments to be approved manually< / label >
< / div >
< div class = "row no-border commento-round-check" >
< input type = "checkbox" v-model = "domains[cd].moderateAllAnonymous" id = "moderate-all-anonymous" >
< label for = "moderate-all-anonymous" > Require anonymous comments to be approved manually< / label >
< / div >
2019-01-31 12:47:29 +08:00
< / div >
< / div >
2019-04-20 07:12:44 +08:00
< div class = "question" >
< div class = "title" >
Email Schedule
< / div >
< div class = "answer" >
< div class = "row no-border commento-round-check" >
< input type = "radio" id = "email-all" value = "all" v-model = "domains[cd].emailNotificationPolicy" >
< label for = "email-all" > Whenever a new comment is created< / label >
< / div >
< div class = "row no-border commento-round-check" >
< input type = "radio" id = "email-pending-moderation" value = "pending-moderation" v-model = "domains[cd].emailNotificationPolicy" >
< label for = "email-pending-moderation" > Only for comments pending moderation< / label >
< / div >
< div class = "row no-border commento-round-check" >
< input type = "radio" id = "email-none" value = "none" v-model = "domains[cd].emailNotificationPolicy" >
< label for = "email-none" > Do not email moderators< / label >
< / div >
2019-01-31 12:47:29 +08:00
< / div >
< / div >
< div class = "center" >
< button id = "save-general-button" onclick = "window.commento.generalSaveHandler()" class = "button" > Save Changes< / button >
< / div >
< / div >
< div id = "mod-tab-2" class = "content" >
2019-02-19 00:23:44 +08:00
< div class = "normal-text" >
2019-01-31 12:47:29 +08:00
Moderators have the power to approve/delete comments and lock threads. Once you add an user as a moderator, shiny new buttons will appear on each comment on each page when they log in.< br > < br >
2019-01-31 11:49:25 +08:00
2019-01-31 12:47:29 +08:00
You're still the only administrator and the only person who can add and remove moderators. Moderators do not have access to this dashboard. Their access is restricted to pages on your website.
2018-06-04 00:06:17 +08:00
< / div >
2018-06-11 01:15:56 +08:00
< div class = "commento-email-container" >
< div class = "commento-email" >
< input class = "commento-input" type = "text" id = "new-mod" placeholder = "Email" >
2018-12-20 13:48:43 +08:00
< button id = "new-mod-button" class = "commento-email-button" onclick = "window.commento.moderatorNewHandler()" > Add moderator< / button >
2018-06-04 00:06:17 +08:00
< / div >
< / div >
< div class = "mod-emails-container" >
< div class = "content" >
< div class = "mod-email" v-for = "email in domains[cd].moderators" v-if = "domains[cd].moderators.length > 0" >
< div class = "email" > {{email.email}}< / div >
2018-12-20 13:48:43 +08:00
< div class = "delete" v-on:click = "window.commento.moderatorDeleteHandler(email.email)" > Delete< / div >
2018-06-04 00:06:17 +08:00
< div class = "date" > added {{email.timeAgo}}< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
2018-09-23 12:59:14 +08:00
<!-- Configure Domain -->
2018-06-04 00:06:17 +08:00
< div id = "general-view" class = "view hidden" >
< div class = "view-inside" >
2019-01-31 15:06:11 +08:00
< div class = "mid-view" >
< div class = "tabs-container" >
< div class = "tab" >
< ul class = "tabs" >
< li class = "tab-link original current" data-tab = "configure-tab-1" > General< / li >
2019-02-19 00:23:44 +08:00
< li class = "tab-link" data-tab = "configure-tab-2" > Export Data< / li >
2019-01-31 15:06:11 +08:00
< / ul >
2018-06-04 00:06:17 +08:00
2019-01-31 15:06:11 +08:00
< div id = "configure-tab-1" class = "content original current" >
< div class = "box" >
< div class = "row" >
< div class = "label" > Website Name< / div >
< input class = "input gray-input" id = "cur-domain-name" type = "text" :placeholder = "domains[cd].origName" v-model = "domains[cd].name" >
< / div >
< / div >
2019-04-20 07:03:34 +08:00
< div class = "question" >
< div class = "title" >
Authentication Options
< / div >
< div class = "answer" >
< div class = "row no-border commento-round-check" >
< input type = "checkbox" v-model = "domains[cd].allowAnonymous" id = "allow-anonymous" >
< label for = "allow-anonymous" > Anonymous comments< / label >
< / div >
< div class = "row no-border commento-round-check" >
< input type = "checkbox" v-model = "domains[cd].commentoProvider" id = "commento-provider" >
< label for = "commento-provider" > Email address login< / label >
< / div >
< div class = "row no-border commento-round-check" v-if = "configuredOauths.google" >
< input type = "checkbox" v-model = "domains[cd].googleProvider" id = "google-provider" >
< label for = "google-provider" > Google login< / label >
< / div >
< div class = "row no-border commento-round-check" v-if = "configuredOauths.twitter" >
< input type = "checkbox" v-model = "domains[cd].twitterProvider" id = "twitter-provider" >
< label for = "twitter-provider" > Twitter login< / label >
< / div >
< div class = "row no-border commento-round-check" v-if = "configuredOauths.github" >
< input type = "checkbox" v-model = "domains[cd].githubProvider" id = "github-provider" >
< label for = "github-provider" > GitHub login< / label >
< / div >
< div class = "row no-border commento-round-check" v-if = "configuredOauths.gitlab" >
< input type = "checkbox" v-model = "domains[cd].gitlabProvider" id = "gitlab-provider" >
< label for = "gitlab-provider" > GitLab login< / label >
< / div >
< div class = "warning" v-if = "!domains[cd].allowAnonymous && !domains[cd].commentoProvider && !domains[cd].googleProvider && !domains[cd].twitterProvider && !domains[cd].githubProvider && !domains[cd].gitlabProvider" >
You have disabled all authentication options. Your readers will not be able to login, create comments, or vote.
< / div >
< / div >
< / div >
2019-01-31 15:06:11 +08:00
< div class = "center" >
< button id = "save-general-button" onclick = "window.commento.generalSaveHandler()" class = "button" > Save Changes< / button >
< / div >
< / div >
< div id = "configure-tab-2" class = "content" >
< div class = "normal-text" >
You can export an archive of this domain's data (which includes all comments and commenters) in the JSON format. To initiate and queue an archive request, click the button below. You will receive an email containing the archive once it's ready.< br > < br >
Please note that this requires valid SMTP settings in order to send emails.< br > < br >
< div class = "center" >
< button id = "domain-export-button" onclick = "window.commento.domainExportBegin()" class = "button" > Initiate Data Export< / button >
< / div >
< / div >
< / div >
< / div >
2018-06-04 00:06:17 +08:00
< / div >
< / div >
< / div >
< / div >
<!-- Import Comments -->
< div id = "import-view" class = "view hidden" >
< div class = "view-inside" >
2019-01-31 15:06:11 +08:00
< div class = "mid-view" >
2018-06-04 00:06:17 +08:00
< div class = "tabs-container" >
< div class = "tab" >
< ul class = "tabs" >
< li class = "tab-link original current" data-tab = "install-tab-1" > Disqus< / li >
< / ul >
< div id = "install-tab-1" class = "content original current" >
2019-01-31 15:06:11 +08:00
< div class = "normal-text" >
2019-01-31 12:47:29 +08:00
If you're currently using Disqus, you can import all comments into Commento:
2018-06-04 00:06:17 +08:00
< ul >
< li >
2019-01-31 12:47:29 +08:00
Go to < a href = "http://disqus.com/admin/discussions/export/" > the admin export section< / a > in Disqus and click on < b > Export Comments< / b > . This should start the process of exporting your comments in the background.
2018-06-04 00:06:17 +08:00
< / li >
< li >
2019-01-31 12:47:29 +08:00
You'll receive an email from Disqus with a link to a compressed archive of all comments and associated data. Copy and paste that link here to start the import process:
2018-06-04 00:06:17 +08:00
< br > < br >
2018-06-11 01:15:56 +08:00
< div class = "commento-email-container" >
< div class = "commento-email" >
2018-06-14 16:58:11 +08:00
< input class = "commento-input" type = "text" id = "disqus-url" placeholder = "https://media.disqus.com/uploads/..." >
2018-12-20 13:48:43 +08:00
< button id = "disqus-import-button" class = "commento-email-button" onclick = "window.commento.importDisqus()" > Import< / button >
2018-06-04 00:06:17 +08:00
< / div >
< / div >
2019-01-31 12:47:29 +08:00
<!--
2018-06-04 00:06:17 +08:00
< div class = "subtext-container" >
< div class = "subtext" >
2019-01-31 12:47:29 +08:00
< div > By using this service, you grant Commento the permission to download and process your Disqus information.< / div >
2018-06-04 00:06:17 +08:00
< / div >
< / div >
2019-01-31 12:47:29 +08:00
-->
< br >
< / li >
< li >
Commento will automatically download this file, extract it, parse it and import comments into Commento. URL information, comment authors, text formatting, and nested replies will be preserved.
2018-06-04 00:06:17 +08:00
< / li >
2019-01-31 12:47:29 +08:00
2018-06-04 00:06:17 +08:00
< li >
2019-01-31 12:47:29 +08:00
It is strongly recommended you do this only once. Importing multiple times may have unintended effects.
2018-06-04 00:06:17 +08:00
< / li >
< / ul >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
<!-- Danger Zone -->
< div id = "danger-view" class = "view hidden" >
< div class = "view-inside" >
< div class = "mid-view" >
2019-04-13 08:21:46 +08:00
< div class = "center center-title" >
Danger Zone
< / div >
2018-06-04 00:06:17 +08:00
2019-04-13 08:21:46 +08:00
< div class = "action-buttons-container" >
< div class = "action-buttons" >
< div class = "action-button" v-if = "domains[cd].state != 'frozen'" >
< div class = "left" >
< div class = "title" >
Freeze Domain
< / div >
< div class = "subtitle" >
Freezing your domain will disable new comments and voting temporarily. You may unfreeze the domain later.
2018-06-04 00:06:17 +08:00
< / div >
< / div >
2019-04-13 08:21:46 +08:00
< div class = "right" >
< button onclick = "document.location.hash='#freeze-domain-modal'"
class="button orange-button">Freeze< / button >
< / div >
< / div >
< div class = "action-button" v-if = "domains[cd].state == 'frozen'" >
< div class = "left" >
< div class = "title" >
Unfreeze Domain
< / div >
< div class = "subtitle" >
Unfreezing your domain will allow readers to create new comments and vote on comments again. You may re-freeze the domain later.
2018-06-04 00:06:17 +08:00
< / div >
2019-04-13 08:21:46 +08:00
< / div >
< div class = "right" >
< button onclick = "document.location.hash='#unfreeze-domain-modal'"
class="button green-button">Unfreeze< / button >
2018-06-04 00:06:17 +08:00
< / div >
< / div >
2019-04-14 09:02:40 +08:00
< div class = "action-button" >
< div class = "left" >
< div class = "title" >
Clear All Comments
< / div >
< div class = "subtitle" >
This will permanently delete all comments without affecting your settings. This may be useful if you want to clear all comments after testing Commento. Cannot be reversed.
< / div >
< / div >
< div class = "right" >
< button onclick = "document.location.hash='#clear-comments-modal'"
class="button big-red-button">Clear< / button >
< / div >
< / div >
2019-04-13 08:21:46 +08:00
< div class = "action-button" >
< div class = "left" >
< div class = "title" >
Delete Domain
< / div >
< div class = "subtitle" >
This will permanently delete all comments and all data associated with your domain. There is literally no way to retrieve your data once you do this. Please be certain.
< / div >
< / div >
< div class = "right" >
< button onclick = "document.location.hash='#delete-domain-modal'"
class="button big-red-button">Delete< / button >
2018-06-04 00:06:17 +08:00
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< div id = "freeze-domain-modal" class = "modal-window" >
< div class = "inside" >
< a href = "#modal-close" title = "Close" class = "modal-close" > < / a >
< div class = "modal-title" > Freeze Domain< / div >
< div class = "modal-subtitle" >
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 >
2019-04-14 09:02:40 +08:00
< div class = "modal-contents center" >
< button class = "button orange-button" onclick = "window.commento.domainFreezeHandler()" > Freeze Domain< / button >
2018-06-04 00:06:17 +08:00
< / div >
< / div >
< / div >
< div id = "unfreeze-domain-modal" class = "modal-window" >
< div class = "inside" >
< a href = "#modal-close" title = "Close" class = "modal-close" > < / a >
< div class = "modal-title" > Unfreeze Domain< / div >
< div class = "modal-subtitle" >
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 >
2019-04-14 09:02:40 +08:00
< div class = "modal-contents center" >
< button class = "button green-button" onclick = "window.commento.domainUnfreezeHandler()" > Unfreeze Domain< / button >
< / div >
< / div >
< / div >
< div id = "clear-comments-modal" class = "modal-window" >
< div class = "inside" >
< a href = "#modal-close" title = "Close" class = "modal-close" > < / a >
< div class = "modal-title" > Clear Comments< / div >
< div class = "modal-subtitle" >
Are you absolutely sure you want to clear all comments data? This is not reversible, so please be certain.
< / div >
< div class = "modal-contents center" >
< button class = "button big-red-button" onclick = "window.commento.domainClearHandler()" > Clear< / button >
2018-06-04 00:06:17 +08:00
< / div >
< / div >
< / div >
< div id = "delete-domain-modal" class = "modal-window" >
< div class = "inside" >
< a href = "#modal-close" title = "Close" class = "modal-close" > < / a >
< div class = "modal-title" > Delete Domain< / div >
< div class = "modal-subtitle" >
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 >
2019-04-14 09:02:40 +08:00
< div class = "modal-contents center" >
< button class = "button big-red-button" onclick = "window.commento.domainDeleteHandler()" > Delete Domain< / button >
2018-06-04 00:06:17 +08:00
< / div >
< / div >
< / div >
< div id = "new-domain-modal" class = "modal-window" >
< div class = "inside" >
< a href = "#modal-close" title = "Close" class = "modal-close" > < / a >
< div class = "modal-title" > Add a New Domain< / div >
< div class = "modal-contents" >
< div class = "box" >
< div class = "box-subtitle" >
Remember to double-check the domain, as only connections from this domain will be accepted. You < b > cannot< / b > change this in the future. You can change the name, however.
< / div >
< div class = "row" >
< div class = "label" > Website Name< / div >
2018-09-23 14:30:59 +08:00
< input class = "input gray-input" id = "new-domain-name" type = "text" placeholder = "My Blog" >
2018-06-04 00:06:17 +08:00
< / div >
< div class = "row" >
< div class = "label" > Website Domain< / div >
< input class = "input gray-input" id = "new-domain-domain" type = "text" placeholder = "https://blog.billie.com" >
< / div >
< / div >
< div id = "new-domain-error" class = "modal-error-box" > < / div >
< div class = "center" >
2018-12-20 13:48:43 +08:00
< button id = "add-site-button" onclick = "window.commento.domainNewHandler()" class = "button" > Add Domain< / button >
2018-06-04 00:06:17 +08:00
< / div >
< / div >
< / div >
< / div >
< / html >
