client/tags: improve copying tag list

- Don't copy tag count
- Don't copy × button
- Copy spaces between tags

client/css/forms.styl

@@ -1,3 +1,4 @@
+@import mixins
 @import colors
 
 form
@@ -252,7 +253,7 @@ div.tag-input
             color: $inactive-link-color
             margin-left: 0.7em
             font-size: 90%
-
+            unselectable()
 
 ul.compact-tags
     line-height: 130%
@@ -265,6 +266,7 @@ ul.compact-tags
         color: $inactive-link-color
         margin-left: 0.7em
         font-size: 90%
+        unselectable()
 
 div.tag-relations
     font-size: 80%

client/css/main.styl

@@ -1,4 +1,5 @@
 @import colors
+@import mixins
 
 /* latin */
 @font-face
@@ -214,3 +215,8 @@ a .access-key
                 background: white
                 padding: 0 1em
                 z-index: 2
+
+/* hack to prevent text from being copied */
+[data-pseudo-content]:before {
+    content: attr(data-pseudo-content)
+}

client/css/mixins.styl

@@ -0,0 +1,6 @@
+unselectable()
+    -webkit-user-select: none
+    -moz-user-select: none
+    -ms-user-select: none
+    -o-user-select: none
+    user-select: none

client/html/post_readonly_sidebar.tpl

@@ -76,11 +76,11 @@
                         --><% if (ctx.canListPosts) { %><!--
                             --><a href='/posts/query=<%- encodeURIComponent(tag) %>' class='<%= ctx.makeCssName(ctx.getTagCategory(tag), 'tag') %>'><!--
                         --><% } %><!--
-                            --><%- tag %><!--
+                            --><%- tag %>&#32;<!--
                         --><% if (ctx.canListPosts) { %><!--
                             --></a><!--
                         --><% } %><!--
-                        --><span class='append'><%- ctx.getTagUsages(tag) %></span><!--
+                        --><span class='append' data-pseudo-content='<%- ctx.getTagUsages(tag) %>'></span><!--
                     --></li><!--
                 --><% } %><!--
             --></ul>

client/js/controls/tag_input_control.js

@@ -296,7 +296,7 @@ class TagInputControl extends events.EventTarget {
         }
         searchLinkNode.setAttribute(
             'href', '/posts/query=' + encodeURIComponent(tagName));
-        searchLinkNode.textContent = tagName;
+        searchLinkNode.textContent = tagName + ' ';
         searchLinkNode.addEventListener('click', e => {
             e.preventDefault();
             if (actualTag) {
@@ -307,17 +307,15 @@ class TagInputControl extends events.EventTarget {
             }
         });
 
-        const usagesNode = views.htmlToDom(
+        const usagesNode = document.createElement('span');
-            views.makeNonVoidElement(
+        usagesNode.classList.add('append');
-                'span',
+        usagesNode.setAttribute(
-                {class: 'append'},
+            'data-pseudo-content', actualTag ? actualTag.usages : 0);
-                actualTag ? actualTag.usages : 0));
 
-        const removalLinkNode = views.htmlToDom(
+        const removalLinkNode = document.createElement('a');
-            views.makeNonVoidElement(
+        removalLinkNode.classList.add('append');
-                'a',
+        removalLinkNode.setAttribute('href', '#');
-                {href: '#', class: 'append'},
+        removalLinkNode.setAttribute('data-pseudo-content', '×');
-                '×'));
         removalLinkNode.addEventListener('click', e => {
             e.preventDefault();
             this.deleteTag(tagName);
@@ -390,12 +388,12 @@ class TagInputControl extends events.EventTarget {
             const weightNode = document.createElement('span');
             weightNode.classList.add('tag-weight');
             weightNode.classList.add('append');
-            weightNode.textContent = weight;
+            weightNode.setAttribute('data-pseudo-content', weight);
 
             const removeLinkNode = document.createElement('a');
             removeLinkNode.classList.add('remove-tag');
             removeLinkNode.classList.add('append');
-            removeLinkNode.textContent = '×';
+            removeLinkNode.setAttribute('data-pseudo-content', '×');
             removeLinkNode.setAttribute('href', '#');
             removeLinkNode.addEventListener('click', e => {
                 e.preventDefault();