Add liking feature

onionr/api.py

@@ -234,6 +234,16 @@ class API:
                 resp = Response('Goodbye')
             elif action == 'ping':
                 resp = Response('pong')
+            elif action == 'site':
+                block = data
+                siteData = self._core.getData(data)
+                response = 'not found'
+                if siteData != '' and siteData != False:
+                    self.mimeType = 'text/html'
+                    response = siteData.split(b'-', 2)[-1]
+                resp = Response(response)
+            elif action == 'info':
+                resp = Response(json.dumps({'pubkey' : self._core._crypto.pubKey, 'host' : self._core.hsAddress}))
             elif action == "insertBlock":
                 response = {'success' : False, 'reason' : 'An unknown error occurred'}
 

onionr/static-data/www/ui/common/onionr-timeline-post.html

@@ -22,7 +22,7 @@
                 </div>
 
                 <div class="onionr-post-controls pt-2">
-                    <a href="#!" onclick="toggleLike('$post-hash')" class="glyphicon glyphicon-heart mr-2"><$= LANG.POST_LIKE $></a>
+                    <a href="#!" onclick="toggleLike('$post-hash')" class="glyphicon glyphicon-heart mr-2">$liked</a>
                     <a href="#!" onclick="reply('$post-hash')" class="glyphicon glyphicon-comment mr-2"><$= LANG.POST_REPLY $></a>
                 </div>
             </div>

onionr/static-data/www/ui/dist/js/main.js

@@ -25,11 +25,22 @@ function getParameter(name) {
 /* usermap localStorage stuff */
 
 var usermap = JSON.parse(get('usermap', '{}'));
+var postmap = JSON.parse(get('postmap', '{}'))
 
 function getUserMap() {
     return usermap;
 }
 
+function getPostMap(hash) {
+    if(hash !== undefined) {
+        if(hash in postmap)
+            return postmap[hash];
+        return null;
+    }
+
+    return postmap;
+}
+
 function deserializeUser(id) {
     if(!(id in getUserMap()))
         return null;
@@ -287,7 +298,7 @@ class Post {
                 </div>\
 \
                 <div class="onionr-post-controls pt-2">\
-                    <a href="#!" onclick="toggleLike(\'$post-hash\')" class="glyphicon glyphicon-heart mr-2">like</a>\
+                    <a href="#!" onclick="toggleLike(\'$post-hash\')" class="glyphicon glyphicon-heart mr-2">$liked</a>\
                     <a href="#!" onclick="reply(\'$post-hash\')" class="glyphicon glyphicon-comment mr-2">reply</a>\
                 </div>\
             </div>\
@@ -313,6 +324,12 @@ class Post {
         postTemplate = postTemplate.replaceAll('$date-relative', timeSince(this.getPostDate(), device) + (device === 'desktop' ?  ' ago' : ''));
         postTemplate = postTemplate.replaceAll('$date', this.getPostDate().toLocaleString());
 
+        if(this.getHash() in getPostMap() && getPostMap()[this.getHash()]['liked']) {
+            postTemplate = postTemplate.replaceAll('$liked', 'unlike');
+        } else {
+            postTemplate = postTemplate.replaceAll('$liked', 'like');
+        }
+
         return postTemplate;
     }
 

onionr/static-data/www/ui/dist/js/timeline.js

@@ -32,6 +32,28 @@ Block.getBlocks({'type' : 'onionr-post', 'signed' : true, 'reverse' : true}, fun
     }
 });
 
+function toggleLike(hash) {
+    var post = getPostMap(hash);
+    if(post === null || !getPostMap()[hash]['liked']) {
+        console.log('Liking ' + hash + '...');
+
+        if(post === null)
+            getPostMap()[hash] = {};
+
+        getPostMap()[hash]['liked'] = true;
+
+        set('postmap', JSON.stringify(getPostMap()));
+
+        var block = new Block();
+
+        block.setType('onionr-post-like');
+        block.setContent(JSON.stringify({'hash' : hash}));
+        block.save(true, function(hash) {});
+    } else {
+        console.log('Unliking ' + hash + '...');
+    }
+}
+
 function postCreatorChange() {
     var content = document.getElementById('onionr-post-creator-content').value;
     var message = '';
@@ -55,9 +77,9 @@ function postCreatorChange() {
     var button = document.getElementById("onionr-post-creator-create");
 
     if(message === '')
-        element.style.display = 'none';
+        element.style.visibility = 'hidden';
     else {
-        element.style.display = 'block';
+        element.style.visibility = 'visible';
 
         element.innerHTML = message;
 
@@ -139,6 +161,7 @@ function makePost() {
         document.getElementById('onionr-timeline-posts').innerHTML = post.getHTML() + document.getElementById('onionr-timeline-posts').innerHTML;
 
         document.getElementById("onionr-post-creator-content").value = "";
+        postCreatorChange();
     } else {
         console.log('Not making empty post.');
     }
@@ -163,6 +186,8 @@ $('body').on('click', '[data-editable]', function() {
     input.one('blur', save).focus();
 });
 
+currentUser = getCurrentUser();
+
 document.getElementById("onionr-post-creator-user-name").innerHTML = Sanitize.html(currentUser.getName());
 document.getElementById("onionr-post-creator-user-id").innerHTML = "you";
 document.getElementById("onionr-post-creator-user-icon").src = "data:image/jpeg;base64," + Sanitize.html(currentUser.getIcon());

onionr/static-data/www/ui/lang.json

@@ -13,6 +13,7 @@
         "MODAL_MESSAGE" : "Onionr has begun performing a CPU-intensive operation. If this operation does not complete in the next 10 seconds, try reloading the page.",
 
         "POST_LIKE" : "like",
+        "POST_UNLIKE" : "unlike",
         "POST_REPLY" : "reply",
 
         "POST_CREATOR_YOU" : "you",

onionr/static-data/www/ui/src/js/main.js

@@ -25,11 +25,22 @@ function getParameter(name) {
 /* usermap localStorage stuff */
 
 var usermap = JSON.parse(get('usermap', '{}'));
+var postmap = JSON.parse(get('postmap', '{}'))
 
 function getUserMap() {
     return usermap;
 }
 
+function getPostMap(hash) {
+    if(hash !== undefined) {
+        if(hash in postmap)
+            return postmap[hash];
+        return null;
+    }
+
+    return postmap;
+}
+
 function deserializeUser(id) {
     if(!(id in getUserMap()))
         return null;
@@ -281,6 +292,12 @@ class Post {
         postTemplate = postTemplate.replaceAll('$date-relative', timeSince(this.getPostDate(), device) + (device === 'desktop' ?  ' ago' : ''));
         postTemplate = postTemplate.replaceAll('$date', this.getPostDate().toLocaleString());
 
+        if(this.getHash() in getPostMap() && getPostMap()[this.getHash()]['liked']) {
+            postTemplate = postTemplate.replaceAll('$liked', '<$= LANG.POST_UNLIKE $>');
+        } else {
+            postTemplate = postTemplate.replaceAll('$liked', '<$= LANG.POST_LIKE $>');
+        }
+
         return postTemplate;
     }
 

onionr/static-data/www/ui/src/js/timeline.js

@@ -32,6 +32,28 @@ Block.getBlocks({'type' : 'onionr-post', 'signed' : true, 'reverse' : true}, fun
     }
 });
 
+function toggleLike(hash) {
+    var post = getPostMap(hash);
+    if(post === null || !getPostMap()[hash]['liked']) {
+        console.log('Liking ' + hash + '...');
+
+        if(post === null)
+            getPostMap()[hash] = {};
+
+        getPostMap()[hash]['liked'] = true;
+
+        set('postmap', JSON.stringify(getPostMap()));
+
+        var block = new Block();
+
+        block.setType('onionr-post-like');
+        block.setContent(JSON.stringify({'hash' : hash}));
+        block.save(true, function(hash) {});
+    } else {
+        console.log('Unliking ' + hash + '...');
+    }
+}
+
 function postCreatorChange() {
     var content = document.getElementById('onionr-post-creator-content').value;
     var message = '';
@@ -55,9 +77,9 @@ function postCreatorChange() {
     var button = document.getElementById("onionr-post-creator-create");
 
     if(message === '')
-        element.style.display = 'none';
+        element.style.visibility = 'hidden';
     else {
-        element.style.display = 'block';
+        element.style.visibility = 'visible';
 
         element.innerHTML = message;
 
@@ -139,6 +161,7 @@ function makePost() {
         document.getElementById('onionr-timeline-posts').innerHTML = post.getHTML() + document.getElementById('onionr-timeline-posts').innerHTML;
 
         document.getElementById("onionr-post-creator-content").value = "";
+        postCreatorChange();
     } else {
         console.log('Not making empty post.');
     }
@@ -163,6 +186,8 @@ $('body').on('click', '[data-editable]', function() {
     input.one('blur', save).focus();
 });
 
+currentUser = getCurrentUser();
+
 document.getElementById("onionr-post-creator-user-name").innerHTML = Sanitize.html(currentUser.getName());
 document.getElementById("onionr-post-creator-user-id").innerHTML = "<$= LANG.POST_CREATOR_YOU $>";
 document.getElementById("onionr-post-creator-user-icon").src = "data:image/jpeg;base64," + Sanitize.html(currentUser.getIcon());