client: Reimplement post source functionality

6 files changed, 73 insertions, 5 deletions

diff --git a/client/html/post_edit_sidebar.tpl b/client/html/post_edit_sidebar.tpl
index a66a375..78e90aa 100644
--- a/client/html/post_edit_sidebar.tpl
+++ b/client/html/post_edit_sidebar.tpl
@@ -58,6 +58,16 @@
             </section>
         <% } %>
 
+        <% if (ctx.canEditPostSource) { %>
+            <section class='post-source'>
+                <%= ctx.makeTextInput({
+                    text: 'Source',
+                    name: 'source',
+                    value: ctx.post.source,
+                }) %>
+            </section>
+        <% } %>
+
         <% if (ctx.canEditPostTags) { %>
             <section class='tags'>
                 <%= ctx.makeTextInput({}) %>
diff --git a/client/html/post_readonly_sidebar.tpl b/client/html/post_readonly_sidebar.tpl
index 401ce20..78e92fb 100644
--- a/client/html/post_readonly_sidebar.tpl
+++ b/client/html/post_readonly_sidebar.tpl
@@ -38,6 +38,14 @@
             <a href class='fit-both'>both</a>
         </section>
 
+        <% if (ctx.post.source) { %>
+            <section class='source'>
+                Source: <a href='<%- ctx.post.source %>' title='<%- ctx.post.source %>'>
+                    <%- ctx.post.prettyPrintSource() %>
+                </a>
+            </section>
+        <% } %>
+
         <section class='search'>
             Search on
             <a href='http://iqdb.org/?url=<%- encodeURIComponent(ctx.post.fullContentUrl) %>'>IQDB</a> &middot;
diff --git a/client/js/controllers/post_main_controller.js b/client/js/controllers/post_main_controller.js
index a482b84..1914852 100644
--- a/client/js/controllers/post_main_controller.js
+++ b/client/js/controllers/post_main_controller.js
@@ -147,6 +147,9 @@ class PostMainController extends BasePostController {
         if (e.detail.thumbnail !== undefined) {
             post.newThumbnail = e.detail.thumbnail;
         }
+        if (e.detail.source !== undefined) {
+            post.source = e.detail.source;
+        }
         post.save()
             .then(() => {
                 this._view.sidebarControl.showSuccess('Post saved.');
diff --git a/client/js/controls/post_edit_sidebar_control.js b/client/js/controls/post_edit_sidebar_control.js
index a5af449..2180d4b 100644
--- a/client/js/controls/post_edit_sidebar_control.js
+++ b/client/js/controls/post_edit_sidebar_control.js
@@ -37,6 +37,7 @@ class PostEditSidebarControl extends events.EventTarget {
             canEditPostFlags: api.hasPrivilege('posts:edit:flags'),
             canEditPostContent: api.hasPrivilege('posts:edit:content'),
             canEditPostThumbnail: api.hasPrivilege('posts:edit:thumbnail'),
+            canEditPostSource : api.hasPrivilege('posts:edit:source'),
             canCreateAnonymousPosts: api.hasPrivilege('posts:create:anonymous'),
             canDeletePosts: api.hasPrivilege('posts:delete'),
             canFeaturePosts: api.hasPrivilege('posts:feature'),
@@ -46,7 +47,7 @@ class PostEditSidebarControl extends events.EventTarget {
         new ExpanderControl(
             'post-info',
             'Basic info',
-            this._hostNode.querySelectorAll('.safety, .relations, .flags'));
+            this._hostNode.querySelectorAll('.safety, .relations, .flags, .post-source'));
         this._tagsExpander = new ExpanderControl(
             'post-tags',
             `Tags (${this._post.tags.length})`,
@@ -349,6 +350,10 @@ class PostEditSidebarControl extends events.EventTarget {
                 thumbnail: this._newPostThumbnail !== undefined ?
                     this._newPostThumbnail :
                     undefined,
+
+                source: this._sourceInputNode ?
+                    this._sourceInputNode.value :
+                    undefined,
             },
         }));
     }
@@ -402,6 +407,10 @@ class PostEditSidebarControl extends events.EventTarget {
         return this._formNode.querySelector('.post-thumbnail a');
     }
 
+    get _sourceInputNode() {
+        return this._formNode.querySelector('.post-source input');
+    }
+
     get _featureLinkNode() {
         return this._formNode.querySelector('.management .feature');
     }
diff --git a/client/js/models/post.js b/client/js/models/post.js
index aea8c4c..90ff300 100644
--- a/client/js/models/post.js
+++ b/client/js/models/post.js
@@ -32,6 +32,7 @@ class Post extends events.EventTarget {
     get contentUrl()         { return this._contentUrl; }
     get fullContentUrl()     { return this._fullContentUrl; }
     get thumbnailUrl()       { return this._thumbnailUrl; }
+    get source()             { return this._source; }
     get canvasWidth()        { return this._canvasWidth || 800; }
     get canvasHeight()       { return this._canvasHeight || 450; }
     get fileSize()           { return this._fileSize || 0; }
@@ -57,6 +58,7 @@ class Post extends events.EventTarget {
     set relations(value)     { this._relations = value; }
     set newContent(value)    { this._newContent = value; }
     set newThumbnail(value)  { this._newThumbnail = value; }
+    set source(value)        { this._source = value; }
 
     static fromResponse(response) {
         const ret = new Post();
@@ -122,6 +124,9 @@ class Post extends events.EventTarget {
         if (this._newThumbnail !== undefined) {
             files.thumbnail = this._newThumbnail;
         }
+        if (this._source !== this._orig._source) {
+            detail.source = this._source;
+        }
 
         let apiPromise = this._id ?
             api.put(uri.formatApiLink('post', this.id), detail, files) :
@@ -266,6 +271,10 @@ class Post extends events.EventTarget {
             Math.round(Math.random() * 1000);
     }
 
+    prettyPrintSource() {
+        return uri.extractRootDomain(this._source);
+    }
+
     _updateFromResponse(response) {
         const map = () => ({
             _version:       response.version,
@@ -278,6 +287,7 @@ class Post extends events.EventTarget {
             _contentUrl:    response.contentUrl,
             _fullContentUrl: new URL(response.contentUrl, document.getElementsByTagName('base')[0].href).href,
             _thumbnailUrl:  response.thumbnailUrl,
+            _source:        response.source,
             _canvasWidth:   response.canvasWidth,
             _canvasHeight:  response.canvasHeight,
             _fileSize:      response.fileSize,
diff --git a/client/js/util/uri.js b/client/js/util/uri.js
index d1cba67..d1075ce 100644
--- a/client/js/util/uri.js
+++ b/client/js/util/uri.js
@@ -54,9 +54,37 @@ function formatClientLink(...values) {
     return parts.join('/');
 }
 
+function extractHostname(url) {
+    // https://stackoverflow.com/a/23945027
+    return url
+        .split('/')[url.indexOf("//") > -1 ? 2 : 0]
+        .split(':')[0]
+        .split('?')[0];
+}
+
+function extractRootDomain(url) {
+    // https://stackoverflow.com/a/23945027
+    let domain = extractHostname(url);
+    let splitArr = domain.split('.');
+    let arrLen = splitArr.length;
+
+    //if there is a subdomain 
+    if (arrLen > 2) {
+        domain = splitArr[arrLen - 2] + '.' + splitArr[arrLen - 1];
+        //check to see if it's using a Country Code Top Level Domain (ccTLD) (i.e. ".me.uk")
+        if (splitArr[arrLen - 2].length == 2 && splitArr[arrLen - 1].length == 2) {
+            //this is using a ccTLD
+            domain = splitArr[arrLen - 3] + '.' + domain;
+        }
+    }
+    return domain;
+}
+
 module.exports = {
-    formatClientLink: formatClientLink,
-    formatApiLink:    formatApiLink,
-    escapeParam:      escapeParam,
-    unescapeParam:    unescapeParam,
+    formatClientLink:  formatClientLink,
+    formatApiLink:     formatApiLink,
+    escapeParam:       escapeParam,
+    unescapeParam:     unescapeParam,
+    extractHostname:   extractHostname,
+    extractRootDomain: extractRootDomain,
 };