fix/feat: 0.1.0-alpha-8

dist/disqusjs.css

@@ -3,4 +3,4 @@
  * Author: SukkaW
  * Link: https://github.com/SukkaW/DisqusJS
  * License: GPL-3.0
- */#dsqjs .dsqjs-container *{margin:0;padding:0}#dsqjs .dsqjs-container{margin:20px 0 0}#dsqjs ul.dsqjs-list{list-style:none;list-style-type:none}#dsqjs .dsqjs-item-container{position:relative;margin-bottom:24px;-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out}#dsqjs .dsqjs-item-container:after,#dsqjs .dsqjs-item-container:before{display:table;content:"";line-height:0;clear:both}#dsqjs .dsqjs-avater{margin-right:12px;float:left;position:relative;z-index:100;padding:0}#dsqjs a{text-decoration:none;color:#076dd0}#dsqjs .dsqjs-avater img{width:42px;height:42px;display:block;border-radius:4px}#dsqjs .dsqjs-body{overflow:hidden}#dsqjs .dsqjs-header{line-height:1;font-size:13px}#dsqjs .dsqjs-bullet{line-height:1.4;margin:0 4px}#dsqjs .dsqjs-bullet::after{color:#c2c6cc;content:"•"}#dsqjs .dsqjs-author{line-height:1;color:#2479cc;font-weight:700}#dsqjs .dsqjs-author .dsqjs-admin-badge{color:#fff;background:#687a86;padding:1px 3px;margin-left:4px;font-size:12px;line-height:1.1;font-weight:700;border-radius:3px;display:inline-block;position:relative;top:-1px;left:1px}#dsqjs .dsqjs-meta{font-size:12px;color:#656c7a}#dsqjs .dsqjs-content p:last-child{margin:0}#dsqjs .dsqjs-content p{font-size:15px;line-height:21px;margin:0 0 12px;word-wrap:break-word}#dsqjs .dsqjs-children>.dsqjs-item{margin-left:60px}#dsqjs .dsqjs-children .dsqjs-avater img{width:38px;height:38px}#dsqjs .dsqjs-message{text-align:center;margin-top:4px;margin-bottom:4px;font-size:14px}#dsqjs .dsqjs-no-comment{text-align:center;margin-top:8px;margin-bottom:4px;font-size:18px;font-weight:700}#dsqjs .dsqjs-message a{margin-left:2px;margin-right:2px}.dsqjs-hide{display:none!important}
+ */#dsqjs>*{margin:0;padding:0}#dsqjs .dsqjs-container *{margin:0;padding:0}#dsqjs .dsqjs-container{margin:20px 0 0}#dsqjs ul.dsqjs-list{list-style:none;list-style-type:none}#dsqjs .dsqjs-item-container{position:relative;margin-bottom:24px;-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out}#dsqjs .dsqjs-item-container:after,#dsqjs .dsqjs-item-container:before{display:table;content:"";line-height:0;clear:both}#dsqjs .dsqjs-avater{margin-right:12px;float:left;position:relative;z-index:100;padding:0}#dsqjs a{text-decoration:none;color:#076dd0}#dsqjs .dsqjs-avater img{width:42px;height:42px;display:block;border-radius:4px}#dsqjs .dsqjs-body{overflow:hidden}#dsqjs .dsqjs-header{line-height:1;font-size:13px}#dsqjs .dsqjs-bullet{line-height:1.4;margin:0 4px}#dsqjs .dsqjs-bullet::after{color:#c2c6cc;content:"•"}#dsqjs .dsqjs-author{line-height:1;color:#2479cc;font-weight:700}#dsqjs .dsqjs-author .dsqjs-admin-badge{color:#fff;background:#687a86;padding:1px 3px;margin-left:4px;font-size:12px;line-height:1.1;font-weight:700;border-radius:3px;display:inline-block;position:relative;top:-1px;left:1px}#dsqjs .dsqjs-meta{font-size:12px;color:#656c7a}#dsqjs .dsqjs-content p:last-child{margin:0}#dsqjs .dsqjs-content p{font-size:15px;line-height:21px;margin:0 0 12px;word-wrap:break-word}#dsqjs .dsqjs-children>.dsqjs-item{margin-left:60px}#dsqjs .dsqjs-children .dsqjs-avater img{width:38px;height:38px}#dsqjs .dsqjs-message{text-align:center;margin-top:4px;margin-bottom:4px;font-size:14px}#dsqjs .dsqjs-no-comment{text-align:center;margin-top:8px;margin-bottom:4px;font-size:18px;font-weight:700}#dsqjs .dsqjs-message a{margin-left:2px;margin-right:2px}.dsqjs-hide{display:none!important}

gulpfile.js

@@ -31,7 +31,7 @@ gulp.task('minify-js', () => {
             output: {
                 comments: /^!/
             },
-            keep_fnames: true
+            keep_fnames: false
         }))
         .pipe(gulp.dest('dist'));
 });

package.json

@@ -1,6 +1,6 @@
 {
   "name": "disqusjs",
-  "version": "0.1.0-alpha-5",
+  "version": "0.1.0-alpha-8",
   "description": "Show comments list from Disqus API",
   "main": "dist/disqus.js",
   "scripts": {

src/disqus.js

@@ -248,28 +248,29 @@
  * disqusjs.page.lenfth - How many comment in this thread
  */
 
-disqusjs.page = [];
+(function () {
+    disqusjs.page = [];
 
-window.disqus_config = function () {
+    window.disqus_config = function () {
         this.page.url = disqusjs.config.url;
         this.page.identifier = disqusjs.config.identifier;
-};
+    };
 
-var xhr = new XMLHttpRequest();
+    var xhr = new XMLHttpRequest();
 
-setLS = (key, value) => {
+    let setLS = (key, value) => {
         try {
             localStorage.setItem(key, value)
         } catch (o) {
             console.log(o), console.log("Failed to set localStorage item")
         }
-}
+    },
 
-getLS = (key) => {
+        getLS = (key) => {
             return localStorage.getItem(key);
-}
+        }
 
-/*
+    /*
      * Name: Date.Format()
      *
      * Usage:
@@ -285,7 +286,7 @@ getLS = (key) => {
      * Example: (new Date()).Format("yyyy-MM-dd hh:mm:ss.S")
      */
 
-Date.prototype.Format = function (fmt) {
+    Date.prototype.Format = function (fmt) {
         var o = {
             "M+": this.getMonth() + 1, // Minth
             "d+": this.getDate(), // Date
@@ -299,14 +300,14 @@ Date.prototype.Format = function (fmt) {
         for (var k in o)
             if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
         return fmt;
-}
+    }
 
-/*
+    /*
      * Name: loadDisqus()
      * Descriptin: load disqus as it should be.
      */
 
-loadDisqus = () => {
+    let loadDisqus = () => {
         var d = document;
         d.getElementById('dsqjs-load-disqus').classList.remove('dsqjs-hide');
         d.getElementById('dsqjs-force-dsqjs').addEventListener('click', forceDsqjs);
@@ -314,15 +315,15 @@ loadDisqus = () => {
         s.src = 'https://' + disqusjs.config.shortname + '.disqus.com/embed.js';
         s.setAttribute('data-timestamp', + new Date());
         (d.head || d.body).appendChild(s);
-}
+    }
 
-/*
+    /*
      * Name: checkDisqus()
      * Description: Check disqus is avaliable for visitor or not
      * How it works: check favicons under 2 domains can be loaded or not.
      */
 
-checkDisqus = () => {
+    let checkDisqus = () => {
         var img = new Image;
         let check1 = setTimeout(() => {
             img.onerror = img.onload = null;
@@ -357,41 +358,41 @@ checkDisqus = () => {
         };
 
         img.src = 'https://disqus.com/favicon.ico?' + +(new Date);
-}
+    }
 
-/*
+    /*
      * Name: forceDsqjs() forceDisqus()
      */
 
-forceDsqjs = () => {
+    let forceDsqjs = () => {
         setLS('disqusjs_mode', 'dsqjs');
         main();
-}
+    }
 
-forceDisqus = () => {
+    let forceDisqus = () => {
         setLS('disqusjs_mode', 'disqus');
         main();
-}
+    }
 
-/*
+    /*
      * Name: loadError()
      * Description: When dsqjs mode load error
      */
 
-loadError = () => {
+    let loadError = () => {
         document.getElementById('dsqjs-load-error').classList.remove('dsqjs-hide');
         document.getElementById('dsqjs-loading-dsqjs').classList.add('dsqjs-hide');
         document.getElementById('dsqjs-reload').addEventListener('click', getThreadInfo);
-}
+    }
 
-/*
+    /*
      * Name: getThreadInfo()
      * Description: Disqus API only support get thread list by ID, not identifter. So get Thread ID before get thread list.
      * API Docs: https://disqus.com/api/docs/threads/list/
      * API URI: /3.0/threads/list.json?forum=[disqus_shortname]&thread=ident:[identifier]&api_key=[apikey]
-*/
+    */
 
-getThreadInfo = () => {
+    let getThreadInfo = () => {
         document.getElementById('dsqjs-loading-dsqjs').classList.remove('dsqjs-hide');
         document.getElementById('dsqjs-force-disqus').addEventListener('click', forceDisqus);
         document.getElementById('dsqjs-reload-disqus').addEventListener('click', checkDisqus);
@@ -417,15 +418,15 @@ getThreadInfo = () => {
         xhr.onerror = (e) => {
             loadError();
         };
-}
+    }
 
-/*
+    /*
      * Name: getComment()
      * Description: get the comment content
      * API URI: /3.0/posts/list.json?forum=[shortname]&thread=[thread id]&api_key=[apikey]
      */
 
-getComment = () => {
+    let getComment = () => {
         let url = disqusjs.config.api + '3.0/posts/list.json?forum=' + disqusjs.config.shortname + '&thread=' + disqusjs.page.id + '&api_key=' + disqusjs.config.apikey;
         xhr.open('GET', url, true);
         xhr.timeout = 4000;
@@ -450,14 +451,14 @@ getComment = () => {
             // Have error when get comments.
             loadError();
         };
-}
+    }
 
-/*
+    /*
      * Name: getCommentList(data)
      * Description: Render JSON to comment list components
      */
 
-getCommentList = (data) => {
+    let getCommentList = (data) => {
         var topLevelComments = [];
         var childComments = [];
 
@@ -497,9 +498,9 @@ getCommentList = (data) => {
         }
 
         renderComment(commentLists)
-}
+    }
 
-renderComment = (data) => {
+    let renderComment = (data) => {
         /*
         <div class="dsqjs-item-container">
             <div class="dsqjs-avater">
@@ -518,7 +519,7 @@ renderComment = (data) => {
         var commentBodyTpl = `<div class="dsqjs-item-container"><div class="dsqjs-avater"><%- avatarEl %></div><div class="dsqjs-body"><header class="dsqjs-header"><span class="dsqjs-author"><%- authorEl %></span><span class="dsqjs-bullet"></span><span class="dsqjs-meta"><time><%- (new Date(createdAt)).Format("yyyy-MM-dd hh:mm:ss") %></time></span></header><div class="dsqjs-content"><%- message %></div></div></div>`
 
         data.map(s => {
-        childrenComments = (s) => {
+            let childrenComments = (s) => {
                 var nesting = s.nesting
 
                 var children = (s.children || []);
@@ -598,9 +599,9 @@ renderComment = (data) => {
 
             document.getElementById('dsqjs-list').insertAdjacentHTML('beforeend', html);
         })
-}
+    }
 
-main = () => {
+    let main = () => {
         // Add dsqjs container element to #disqus_thread
 
         /*
@@ -630,6 +631,8 @@ main = () => {
             checkDisqus();
         }
 
-}
+    }
+
+    main();
 
-main();
+})();