Add a 'quick view' for assigned tags to the entry editor

Basically replicates the same functionality as for categories. JS
only. Also revised the markup and JS of that for consistency. Too
lazy to make a generic function for it, we can do that later.

References #239

templates/2k11/admin/entries.tpl

@@ -15,12 +15,18 @@
         <input id="entryTitle" name="serendipity[title]" type="text" value="{$entry_vars.entry.title|escape}">
     </div>
 
-    <div id="category_list" class="clearfix">
+    <div id="cats_list" class="clearfix taxonomy">
         <h3>{$CONST.CATEGORIES}</h3>
 
         <ul class="plainList"></ul>
     </div>
 
+    <div id="tags_list" class="clearfix taxonomy">
+        <h3>Tags</h3>
+
+        <ul class="plainList"></ul>
+    </div>
+
     <div class="form_area">
         <label for="serendipity[body]">{$CONST.ENTRY_BODY}</label>
     {if NOT $entry_vars.wysiwyg}

templates/2k11/admin/serendipity_editor.js.tpl

@@ -626,9 +626,9 @@
         $(img).attr('src', $(img).attr('src')+'?'+Math.random());
     }
 
-    serendipity.categoryList = function() {
+    serendipity.catsList = function() {
         var $source = $('#edit_entry_category');
-        var $target = $('#category_list > ul');
+        var $target = $('#cats_list > ul');
         var $selected = $source.find('input:checkbox:checked');
 
         $target.empty();
@@ -636,7 +636,23 @@
         if ($selected.length > 0) {
             $selected.each(function() {
                 var catText = $(this).next('label').text();
-                $('<li class="category_selected">'+ catText +'</li>').appendTo($target);
+                $('<li class="cats_selected"><span>'+ catText +'</span></li>').appendTo($target);
+            });
+        } else {
+            $('<li>{$CONST.NO_CATEGORIES}</li>').appendTo($target);
+        }
+    }
+
+    serendipity.tagsList = function() {
+        var $source = $('#properties_freetag_tagList').val();
+        var $target = $('#tags_list > ul');
+        var tagged = $source.split(',');
+
+        $target.empty();
+
+        if (tagged.length > 0) {
+            $.each(tagged, function(key, tag) {
+                $('<li class="tags_selected"><span>'+ tag +'</span></li>').appendTo($target);
             });
         } else {
             $('<li>{$CONST.NO_CATEGORIES}</li>').appendTo($target);
@@ -813,7 +829,8 @@ $(function() {
 
     // Editor-area
     if($('#serendipityEntry').length > 0) {
-        serendipity.categoryList();
+        serendipity.catsList();
+        serendipity.tagsList();
         serendipity.toggle_category_selector('categoryselector');
         serendipity.toggle_extended();
     }
@@ -981,7 +998,7 @@ $(function() {
                     afterClose: function() {
                         // Accessibility helper
                         $('#edit_entry_category .form_check input[type="checkbox"]').attr('aria-hidden', 'false');
-                        serendipity.categoryList();
+                        serendipity.catsList();
                     }
                 }
             });
@@ -1030,7 +1047,9 @@ $(function() {
                 type: "inline",
                 closeMarkup: '<button title="%title%" class="mfp-close" type="button">'+ btnText +'</button>',
                 callbacks: {
-                    afterClose: function() {}
+                    afterClose: function() {
+                        serendipity.tagsList();
+                    }
                 }
             });
 

templates/2k11/admin/style.css

@@ -1076,7 +1076,7 @@ h4,
 }
 
 .toggle_headline,
-#category_list h3,
+.taxonomy h3,
 h5,
 h6 {
     font-size: 1em;
@@ -1783,23 +1783,22 @@ form > .button_link:first-of-type,
     padding-bottom: .583335em;
 }
 
-#category_list h3:hover,
-#category_list li:hover {
-    cursor: pointer;
-}
-
-#category_list h3 {
+.taxonomy h3 {
     float: left;
     line-height: 1.5em;
     margin: .375em 2em .375em 0;
 }
 
-#category_list ul {
+.taxonomy ul {
+    clear: left;
     margin: .375em 0;
     line-height: 1.5em;
+    padding: 0;
+    text-align: left;
+    width: 100%;
 }
 
-#category_list li {
+.taxonomy li {
     display: inline-block;
     margin: 0 1em 0 0;
 }
@@ -2305,7 +2304,7 @@ label .perm_name,
 .no-js .customfieldMedia,
 .no-js .toggle_links,
 .no-js .toggle_info,
-.no-js #category_list,
+.no-js .taxonomy,
 .no-js .comment_summary,
 .no-js .show_config_option .icon-right-dir,
 .no-js #keyword_list,
@@ -2925,6 +2924,12 @@ img.mfp-img {
         width: 48%;
     }
 
+    .taxonomy ul {
+        clear: none;
+        float: right;
+        width: 84%;
+    }
+
     #template_select .current_backend_template,
     #template_select li:nth-child(even) article,
     .media_pane .even,