Merge pull request #21 from B-Translator/display-disqus-comments

Display Disqus comments. Fixes issue #5.

Author: dashohoxha

html/_html/disqus.html

@@ -0,0 +1,4 @@
+<div data-role="collapsible" data-inset="false" data-content-theme="false" data-mini="true" data-collapsed-icon="carat-l" data-expanded-icon="carat-d" data-iconpos="right">
+  <h4>Disqus</h4>
+  <div id="disqus_thread" class="disqus-wrap disqus-active"></div>
+</div>

html/_html/head.html

@@ -28,4 +28,5 @@
     <link rel="stylesheet" href="css/app.css">
     <script src="js/config.js"></script>
     <script src="js/user.js"></script>
+    <script src="js/disqus.js"></script>
     <script src="js/app.js"></script>

html/index.html

@@ -31,6 +31,8 @@ <h1>Fjalori ICT</h1>
 
         {% include _html/translation_details.html %}
 
+        {% include _html/disqus.html %}
+
       </div><!-- /content -->
 
       <!-- messages -->

index.html

@@ -31,6 +31,7 @@
     <link rel="stylesheet" href="css/app.css">
     <script src="js/config.js"></script>
     <script src="js/user.js"></script>
+    <script src="js/disqus.js"></script>
     <script src="js/app.js"></script>
 
   </head>
@@ -153,6 +154,12 @@ <h4>Voters ({{nr}})</h4>
 </script>
 
 
+        <div data-role="collapsible" data-inset="false" data-content-theme="false" data-mini="true" data-collapsed-icon="carat-l" data-expanded-icon="carat-d" data-iconpos="right">
+  <h4>Disqus</h4>
+  <div id="disqus_thread" class="disqus-wrap disqus-active"></div>
+</div>
+
+
       </div><!-- /content -->
 
       <!-- messages -->

js/app.js

@@ -264,8 +264,29 @@ var $app = (function () {
             // Sending a new translation to the server.
             $('#new-translation-form').on('submit', send_new_translation);
             $('#send-new-translation').on('click', send_new_translation);
+
+            // Get the disqus comments for this term.
+            reload_disqus(sguid, term);
         });
     };
+
+    var reload_disqus = function (sguid, term) {
+        //var term = $('#search-term')[0].value;
+        //var sguid = $('#new-translation').data('sguid');
+        if ($('.disqus-wrap').length == 1) {
+            $('.disqus-inactive').addClass('disqus-active').removeClass('disqus-inactive').attr('id','disqus_thread');
+        }
+        if (typeof(DISQUS) !== 'undefined'){
+            DISQUS.reset({
+                reload: true,
+                config: function () {
+                    this.page.identifier = 'translations/sq/' + sguid;
+                    this.page.url = 'http://fjalori.fs.al/#' + term;
+                    this.page.title = term;
+                }
+            });
+        }
+    };
 
     /**
      * When a translation from the list is clicked, display

js/disqus.js

@@ -0,0 +1,12 @@
+
+$(document).ready(function () {
+    var disqus_shortname = 'l10n-sq';
+
+    if (typeof(DISQUS) == 'undefined'){
+        (function() {
+            var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
+            dsq.src = 'http://' + disqus_shortname + '.disqus.com/embed.js';
+            (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
+        })();
+    }
+});