outline

static/css/side.css

@@ -50,6 +50,38 @@
 .side-right .tabs-panel > div {
     overflow: auto;
 }
+
+#outline .ico {
+    margin: 2px 2px 0 2px;
+}
+
+.ico-func {
+    background-position: -122px -21px;
+}
+
+.ico-interface {
+    background-position: -143px -21px;
+}
+
+.ico-const {
+    background-position: -103px -21px;
+}
+
+.ico-var {
+    background-position: -63px -21px;
+}
+
+.ico-struct {
+    background-position: -83px -21px;
+}
+
+.ico-type {
+    background-position: -163px -21px;
+}
+
+.ico-package {
+    background-position: -183px -21px;
+}
 /* end side right */
 
 /* start tree */

static/css/wide.css

@@ -344,8 +344,7 @@
     top: 1px;
 }
 
-.edit-panel .tabs .ico,
+.ico {
-#dialogGoFilePrompt .ico {
     background-image: url("../images/ico-file.png");
     float: left;
     height: 16px;
@@ -380,6 +379,10 @@
 .CodeMirror-hints {
 }
 
+.CodeMirror-hints .ico {
+    margin: -1px 2px 0 -1px;
+}
+
 .CodeMirror-focused .cm-matchhighlight {
     background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAFklEQVQI12NgYGBgkKzc8x9CMDAwAAAmhwSbidEoSQAAAABJRU5ErkJggg==);
     background-position: bottom;

static/js/editors.js

@@ -354,15 +354,27 @@ var editors = {
 
                             switch (autocompleteArray[i].class) {
                                 case "type":
+                                    displayText = '<span class="fn-clear"><span class="ico-type ico"></span>'// + autocompleteArray[i].class 
+                                            + '<b>' + autocompleteArray[i].name + '</b>    '
+                                            + autocompleteArray[i].type + '</span>';
+                                    break;
                                 case "const":
+                                    displayText = '<span class="fn-clear"><span class="ico-const ico"></span>'// + autocompleteArray[i].class 
+                                            + '<b>' + autocompleteArray[i].name + '</b>    '
+                                            + autocompleteArray[i].type + '</span>';
+                                    break;
                                 case "var":
+                                    displayText = '<span class="fn-clear"><span class="ico-var ico"></span>'// + autocompleteArray[i].class 
+                                            + '<b>' + autocompleteArray[i].name + '</b>    '
+                                            + autocompleteArray[i].type + '</span>';
+                                    break;
                                 case "package":
-                                    displayText = '<span class="fn-clear">'// + autocompleteArray[i].class 
+                                    displayText = '<span class="fn-clear"><span class="ico-package ico"></span>'// + autocompleteArray[i].class 
-                                            + '<b class="fn-left">' + autocompleteArray[i].name + '</b>    '
+                                            + '<b>' + autocompleteArray[i].name + '</b>    '
                                             + autocompleteArray[i].type + '</span>';
                                     break;
                                 case "func":
-                                    displayText = '<span>'// + autocompleteArray[i].class 
+                                    displayText = '<span><span class="ico-func ico"></span>'// + autocompleteArray[i].class 
                                             + '<b>' + autocompleteArray[i].name + '</b>'
                                             + autocompleteArray[i].type.substring(4) + '</span>';
                                     text += '()';

static/js/wide.js

@@ -37,7 +37,7 @@ var wide = {
                     return;
                 }
                 
-                var outlineHTML = '<ul>',
+                var outlineHTML = '<ul class="list">',
                         decls = ['funcDecls', 'interfaceDecls', 'structDecls', 
                     'constDecls', 'varDecls'];
                 
@@ -45,7 +45,8 @@ var wide = {
                     var key = decls[i];
                     for (var j = 0, maxj = data[key].length; j < maxj; j++) {
                         var name = data[key][j].Name;
-                        outlineHTML += '<li>' + name + '</li>';
+                        outlineHTML += '<li><span class="ico ico-'
+                                + key.replace('Decls', '') + '"></span> ' + name + '</li>';
                     }
                 }
                 $("#outline").html(outlineHTML + '</ul>');

views/index.html

@@ -476,9 +476,7 @@
                     </div>
                 </div> 
                 <div class="tabs-panel">
-                    <div id="outline" tabindex="-1"  data-index="outline">
+                    <div id="outline" tabindex="-1"  data-index="outline"></div>
-                        this is outline
-                    </div>
                 </div>
             </div>