client/posts: refactor bulk tag editor

Extract the state that controls mass tag form in the posts list header
to a separate class.

It's not exactly a 100% reusable control (the .tpl is shared), but it
should greatly simplify reading the JS.

1 files changed, 11 insertions, 12 deletions

diff --git a/client/html/posts_header.tpl b/client/html/posts_header.tpl
index f90de34..b85b784 100644
--- a/client/html/posts_header.tpl
+++ b/client/html/posts_header.tpl
@@ -1,5 +1,5 @@
 <div class='post-list-header'><%
-    %><form class='horizontal'><%
+    %><form class='horizontal search'><%
         %><%= ctx.makeTextInput({text: 'Search query', id: 'search-text', name: 'search-text', value: ctx.parameters.query}) %><%
         %><wbr/><%
         %><input class='mousetrap' type='submit' value='Search'/><%
@@ -9,16 +9,15 @@
         %><input data-safety=unsafe type='button' class='mousetrap safety safety-unsafe <%- ctx.settings.listPosts.unsafe ? '' : 'disabled' %>'/><%
         %><wbr/><%
         %><a class='mousetrap button append' href='<%- ctx.formatClientLink('help', 'search', 'posts') %>'>Syntax help</a><%
-        %><% if (ctx.canBulkEditTags) { %><%
-            %><wbr/><%
-            %><span class='bulk-edit-tags'><%
-                %><span class='append hint'>Tagging with:</span><%
-                %><a href class='mousetrap button append open'>Mass tag</a><%
-                %><wbr/><%
-                %><%= ctx.makeTextInput({name: 'tag', value: ctx.parameters.tag}) %><%
-                %><input class='mousetrap start-tagging' type='submit' value='Start tagging'/><%
-                %><a href class='mousetrap button append stop-tagging'>Stop tagging</a><%
-            %></span><%
-        %><% } %><%
     %></form><%
+    %><% if (ctx.canBulkEditTags) { %><%
+        %><form class='horizontal bulk-edit-tags'><%
+            %><span class='append hint'>Tagging with:</span><%
+            %><a href class='mousetrap button append open'>Mass tag</a><%
+            %><wbr/><%
+            %><%= ctx.makeTextInput({name: 'tag', value: ctx.parameters.tag}) %><%
+            %><input class='mousetrap start' type='submit' value='Start tagging'/><%
+            %><a href class='mousetrap button append close'>Stop tagging</a><%
+        %></form><%
+    %><% } %><%
 %></div>