1 files changed, 62 insertions, 10 deletions

diff --git a/client/js/controls/post_edit_sidebar_control.js b/client/js/controls/post_edit_sidebar_control.js
index 3b1c16e..a673495 100644
--- a/client/js/controls/post_edit_sidebar_control.js
+++ b/client/js/controls/post_edit_sidebar_control.js
@@ -3,6 +3,7 @@
 const api = require("../api.js");
 const events = require("../events.js");
 const misc = require("../util/misc.js");
+const keyboard = require('../util/keyboard.js');
 const views = require("../util/views.js");
 const Note = require("../models/note.js");
 const Point = require("../models/point.js");
@@ -10,14 +11,16 @@ const TagInputControl = require("./tag_input_control.js");
 const PoolInputControl = require("./pool_input_control.js");
 const ExpanderControl = require("../controls/expander_control.js");
 const FileDropperControl = require("../controls/file_dropper_control.js");
+const PostMetricInputControl = require("./post_metric_input_control.js");
 
 const template = views.getTemplate("post-edit-sidebar");
 
 class PostEditSidebarControl extends events.EventTarget {
-    constructor(hostNode, post, postContentControl, postNotesOverlayControl) {
+    constructor(hostNode, ctx, postContentControl, postNotesOverlayControl) {
         super();
         this._hostNode = hostNode;
-        this._post = post;
+        this._ctx = ctx;
+        this._post = ctx.post;
         this._postContentControl = postContentControl;
         this._postNotesOverlayControl = postNotesOverlayControl;
         this._newPostContent = null;
@@ -33,11 +36,12 @@ class PostEditSidebarControl extends events.EventTarget {
                 canEditPostSafety: api.hasPrivilege("posts:edit:safety"),
                 canEditPostSource: api.hasPrivilege("posts:edit:source"),
                 canEditPostTags: api.hasPrivilege("posts:edit:tags"),
+                canEditPostMetrics: api.hasPrivilege("metrics:edit:posts"),
                 canEditPostRelations: api.hasPrivilege("posts:edit:relations"),
                 canEditPostNotes:
                     api.hasPrivilege("posts:edit:notes") &&
-                    post.type !== "video" &&
-                    post.type !== "flash",
+                    this._post.type !== "video" &&
+                    this._post.type !== "flash",
                 canEditPostFlags: api.hasPrivilege("posts:edit:flags"),
                 canEditPostContent: api.hasPrivilege("posts:edit:content"),
                 canEditPostThumbnail: api.hasPrivilege("posts:edit:thumbnail"),
@@ -63,6 +67,11 @@ class PostEditSidebarControl extends events.EventTarget {
             `Tags (${this._post.tags.length})`,
             this._hostNode.querySelectorAll(".tags")
         );
+        this._metricsExpander = new ExpanderControl(
+            "post-metrics",
+            `Metrics (${this._post.tags.filterMetrics().length})`,
+            this._hostNode.querySelectorAll(".metrics")
+        );
         this._notesExpander = new ExpanderControl(
             "post-notes",
             "Notes",
@@ -95,14 +104,23 @@ class PostEditSidebarControl extends events.EventTarget {
         if (this._tagInputNode) {
             this._tagControl = new TagInputControl(
                 this._tagInputNode,
-                post.tags
+                this._post.tags,
+                null,
+                this._post,
             );
         }
 
         if (this._poolInputNode) {
             this._poolControl = new PoolInputControl(
                 this._poolInputNode,
-                post.pools
+                this._post.pools
+            );
+        }
+
+        if (this._metricInputNode) {
+            this._metricControl = new PostMetricInputControl(
+                this._metricInputNode,
+                this._ctx
             );
         }
 
@@ -224,10 +242,23 @@ class PostEditSidebarControl extends events.EventTarget {
             });
         }
 
-        this._tagControl.addEventListener("change", (e) => {
-            this.dispatchEvent(new CustomEvent("change"));
-            this._syncExpanderTitles();
-        });
+        if (this._tagControl) {
+            this._tagControl.addEventListener("change", (e) => {
+                this.dispatchEvent(new CustomEvent("change"));
+                this._syncExpanderTitles();
+                this._post.removeMetricsWithoutTag();
+                if (this._metricControl) {
+                    this._metricControl.refreshContent();
+                }
+            });
+        }
+
+        if (this._metricControl) {
+            this._metricControl.addEventListener("change", (e) => {
+                this.dispatchEvent(new CustomEvent("change"));
+                this._syncExpanderTitles();
+            });
+        }
 
         if (this._noteTextareaNode) {
             this._noteTextareaNode.addEventListener("change", (e) =>
@@ -241,12 +272,29 @@ class PostEditSidebarControl extends events.EventTarget {
                 this._syncExpanderTitles();
             });
         }
+
+        keyboard.bind(["command+s", "ctrl+s"], (e) => this._evtSubmit(e));
+        if (this._tagInputNode) {
+            const realTagInput = this._formNode.querySelector(".tag-input input");
+            keyboard.bindElement(realTagInput, ["command+s", "ctrl+s"], (e) => this._evtSubmit(e));
+            keyboard.bind('t', (e) => {
+                e.preventDefault();
+                realTagInput.focus();
+            });
+        }
     }
 
     _syncExpanderTitles() {
         this._notesExpander.title = `Notes (${this._post.notes.length})`;
         this._tagsExpander.title = `Tags (${this._post.tags.length})`;
         this._poolsExpander.title = `Pools (${this._post.pools.length})`;
+        let metricCount = this._post.tags.filterMetrics().length;
+        if (metricCount > 0) {
+            this._metricsExpander.containerNode.style.display = "block";
+            this._metricsExpander.title = `Metrics (${metricCount})`;
+        } else {
+            this._metricsExpander.containerNode.style.display = "none";
+        }
     }
 
     _evtPostContentChange(e) {
@@ -537,6 +585,10 @@ class PostEditSidebarControl extends events.EventTarget {
         return this._formNode.querySelector(".notes textarea");
     }
 
+    get _metricInputNode() {
+        return this._formNode.querySelector(".metrics input");
+    }
+
     enableForm() {
         views.enableForm(this._formNode);
     }