highlight使用して表示整形。テーブルレイアウトやめたんだけど列が揃ってないと嫌や！って人いたらごめんなさい。あとtagsAndCommentオプション不要になったので消した。

1 files changed, 17 insertions, 26 deletions

diff --git a/sbmcommentsviewer.js b/sbmcommentsviewer.js
index c7d10f6..139cd4c 100644
--- a/sbmcommentsviewer.js
+++ b/sbmcommentsviewer.js
@@ -3,7 +3,7 @@ var PLUGIN_INFO =
     <name>SBM Comments Viewer</name>
     <description>List show Social Bookmark Comments</description>
     <description lang="ja">ソーシャル・ブックマーク・コメントを表示します</description>
-    <version>0.2.2</version>
+    <version>0.2.3</version>
     <minVersion>2.0pre</minVersion>
     <maxVersion>3.0</maxVersion>
     <updateURL>https://github.com/vimpr/vimperator-plugins/raw/master/sbmcommentsviewer.js</updateURL>
@@ -25,7 +25,7 @@ viewSBMComments [url] [options]
 ||<
 
 == 指定可能フォーマット ==
-  id, timpstamp, tags, comment, tagsAndComment
+  id, timpstamp, tags, comment
 
 == SBMタイプ ==
 - h : hatena bookmark
@@ -76,26 +76,24 @@ SBMContainer.prototype = { //{{{
     },
     toHTML: function(format, countOnly){
         var label = <>
-            {this.faviconURL ? <img src={this.faviconURL} width="16" height="16"/> : <></>}
+            {this.faviconURL ? <img src={this.faviconURL} width="16" height="16" style="vertical-align: middle; margin-right: 5px;" /> : <></>}
             {manager.type[this.type] + ' ' + this.count + '(' + this.entries.length + ')'}
-            {this.pageURL ? <a href="#">{this.pageURL}</a> : <></>}
+            {this.pageURL ? <a href="#" highlight="URL" style="margin-left: 5px;">{this.pageURL}</a> : <></>}
         </>;
         if (countOnly){
             return label;
         } else {
-            let xml = <table id="liberator-sbmcommentsviewer">
-                <caption style="text-align:left" class="hl-Title">{label}</caption>
-            </table>;
+            let xml = <div highlight="CompGroup" class="liberator-sbmcommentsviewer" style="line-height: 1.6;">
+                <div highlight="Completions"><div highlight="CompTitle"><li highlight="CompResult">{label}</li><li highlight="CompDesc"></li></div></div>
+            </div>;
             let self = this;
             xml.* += (function(){
-                var thead = <tr/>;
-                format.forEach(function(colum){ thead.* += <th>{manager.format[colum] || '-'}</th>; });
-                var tbody = <></>;
+                var div = <></>;
                 self.entries.forEach(function(e){
                     if (isFilterNoComments && !e.comment) return;
-                    tbody += e.toHTML(format);
+                    div += e.toHTML(format);
                 });
-                return thead + tbody;
+                return div;
             })();
             return xml;
         }
@@ -142,28 +140,22 @@ SBMEntry.prototype = { //{{{
             return result;
         }
 
-        var xml = <tr/>;
+        var xml = <div highlight="Completions" style="margin: 0; padding: 3px 5px; border-bottom: 1px dotted;"/>;
         var self = this;
         format.forEach(function(colum){
             switch(colum){
                 case 'id':
-                    xml.* += <td class="liberator-sbmcommentsviewer-id">
-                                {self.userIcon ? <><img src={self.userIcon} width="16" height="16"/> {self.id}</> : <span>{self.id}</span>}
-                             </td>;
+                    xml.* += <span class="liberator-sbmcommentsviewer-id" style="margin-right: 10px;">{self.userIcon ? <><img src={self.userIcon} width="16" height="16" style="margin-right: 5px; vertical-align: middle;"/>{self.id}</> : <>{self.id}</>}</span>;
                     break;
                 case 'timestamp':
-     xml.* += <td class="liberator-sbmcommentsviewer-timestamp">{self.formatDate()}</td>; 
-     break;
+                    xml.* += <span class="liberator-sbmcommentsviewer-timestamp" style="margin-right: 10px;">{self.formatDate()}</span>;
+                    break;
                 case 'tags':
-                    xml.* += <td class="liberator-sbmcommentsviewer-tags">{self.tags.join(',')}</td>; break;
+                    xml.* += <span class="liberator-sbmcommentsviewer-tags" highlight="Tag" style="margin-right: 10px;">{self.tags.join(',')}</span>; break;
                 case 'comment':
-                    xml.* += <td class="liberator-sbmcommentsviewer-comment" style="white-space:normal;">{makeLink(self.comment)}</td>; break;
-                case 'tagsAndComment':
-                    var tagString = self.tags.length ? '[' + self.tags.join('][') + ']':'';
-                    xml.* += <td class="liberator-sbmcommentsviewer-tagsAndComment" style="white-space:normal;">{tagString + ' '}{makeLink(self.comment)}</td>;
-                    break;
+                    xml.* += <span class="liberator-sbmcommentsviewer-comment" style="margin-right: 10px; white-space: normal;">{makeLink(self.comment)}</span>; break;
                 default:
-                    xml.* += <td>-</td>;
+                    xml.* += <span>-</span>;
             }
         });
         return xml;
@@ -473,7 +465,6 @@ var manager = {
         comment: 'Comment',
         timestamp: 'TimeStamp',
         tags: 'Tags',
-        tagsAndComment: 'Tags&Comment'
     },
     // for debug
     convertMD5: function(str){