Link tooltips + in-kiwi web browser
authorDarren <darren@darrenwhitlen.com>
Sat, 27 Aug 2011 13:26:41 +0000 (14:26 +0100)
committerDarren <darren@darrenwhitlen.com>
Sat, 27 Aug 2011 13:26:41 +0000 (14:26 +0100)
css/default.css
css/ui.css
js/front.js
js/util.js
node/client/index.html.jade

index 541c68d74cd7c4f262b2843bc2f3a27b0f3e5a34..184cf3618a37cfd5e56747bde79ec4c37a5d0de3 100644 (file)
@@ -22,12 +22,12 @@ body, html {
 \r
 /* The main app container */\r
 #kiwi {\r
-       overflow:hidden;\r
-       position:relative; \r
+       overflow:hidden; position:relative; \r
        height:100%;\r
-       font-family:monospace; font-size:1em;\r
+       font-family:Arial, Helvetica, sans-serif; font-size:1em;\r
        background:#EBEBEB;\r
 }\r
+#kiwi .messages { font-family:monospace; }\r
 #kiwi.small_kiwi .userlist { right:-100px; }\r
 #kiwi.small_kiwi .messages { right:10px; }\r
 \r
@@ -160,6 +160,37 @@ body, html {
 }\r
 \r
 \r
+/*\r
+ * Link tooltips\r
+ */\r
+#kiwi .messages a { position: relative; }\r
+#kiwi .messages a .tt {\r
+       position: absolute; display:none;\r
+       padding: 1em 1.5em;\r
+       /*background-image: -webkit-gradient(\r
+           linear,\r
+           left bottom,\r
+           left top,\r
+           color-stop(0.04, rgb(164,200,126)),\r
+           color-stop(0.52, rgb(197,240,164))\r
+       );\r
+       background-image: -moz-linear-gradient(\r
+           center bottom,\r
+           rgb(164,200,126) 4%,\r
+           rgb(197,240,164) 52%\r
+       );\r
+       border: 1px solid #444;\r
+       border-radius:5px;\r
+       -moz-border-radius:5px;\r
+       -webkit-border-radius:5px;*/\r
+       font-size: 0.9em;\r
+}\r
+#kiwi .messages a:hover .tt { display:inline; cursor:default; }\r
+#kiwi .messages a:hover .tt a { cursor:pointer; color:inherit; }\r
+#kiwi .messages a:active .tt a { color:inherit; }\r
+\r
+\r
+\r
 \r
 #kiwi .control {\r
        position: absolute;\r
index 838cc40fdea329820bea2f69d5ceb21126b62328..4382d90460c5b09bb7fa94ed799e469540116d33 100644 (file)
@@ -68,7 +68,6 @@
 \r
 \r
 \r
-\r
 #kiwi .about {\r
        top: 100px;\r
        left: 200px;\r
@@ -79,6 +78,7 @@
 #kiwi .about button { float:right; }\r
 \r
 #kiwi .box {\r
+       color:#eee;\r
        min-width:150px;\r
        background: url(../img/trans_back.png) repeat;\r
        border-radius:5px;\r
 }\r
 \r
 .box .boxarea {\r
+       color:black;\r
        padding:15px !important;\r
        background-color:#D4D4D4;\r
        border-radius:3px;\r
index a90dc784fae0c5b2b9b3badf4809c7e7cb82fbde..5e7f3286e9fe4852c1cdf9d68adedc450bac3632 100644 (file)
@@ -146,9 +146,44 @@ var front = {
                 gateway.setTopic(chan, text);
             }
         });
+
+
+        $('#windows a.chan').live('click', function() {
+            front.joinChannel($(this).text());
+            return false;
+        });
+
+        $('#windows a.link_ext').live('mouseover', function () {
+            var a = $(this);
+            var tt = $('.tt', a);
+
+            if (tt.text() === '') {
+                var tooltip = $('<a class="link_ext_browser">Open in Kiwi..</a>');
+                tt.append(tooltip);
+            }
+
+            tt.css('top', -tt.outerHeight()+'px');
+            tt.css('left', (a.outerWidth() / 2) - (tt.outerWidth() / 2));
+        });
+        $('#windows a.link_ext').live('mouseout', function () {
+            var a = $(this);
+            var tt = $('.tt', a);
+        });
+        $('#windows a.link_ext').live('click', function (e) {
+            var a = $(this);
+            
+            switch (e.target.className) {
+            case 'link_ext':
+                return true;
+                break;
+            case 'link_ext_browser':
+                var t = new Utilityview('Browser', a.attr('href'));
+                t.show();
+                break;
+            }
+            return false;
+        });
         
-        //gateway.start();
-        //front.sync();
     },
     
     doLayoutSize: function () {
@@ -1298,6 +1333,8 @@ Tabview.prototype.addMsg = function (time, nick, msg, type, style) {
     });
 
     line_msg = $('<div class="msg ' + type + '"><div class="time">' + time + '</div><div class="nick">' + html_nick + '</div><div class="text" style="' + style + '">' + msg + ' </div></div>');
+    //$('a.link_ext', line_msg).tooltip({ tip : $('#tooltip_link'), effect : 'toggle', offset : [2, 0] });
+
     this.div.append(line_msg);
 
     if (!touchscreen) {
index b441fffee15404fc013e26aca71b298e4374aec0..a0906e7c52e1ed2d32d222ecfa74a355c2f034ea 100644 (file)
@@ -116,7 +116,7 @@ plugins.privmsg = [
                                        url = 'http://'+url;
                                }
                                
-                               return '<a target="_blank" rel="nofollow" href="'+ url +'">'+ nice +'</a>';
+                               return '<a class="link_ext" target="_blank" rel="nofollow" href="'+ url +'">'+ nice +'<div class="tt box"></div></a>';
                        });
                        
                        return text;
@@ -148,13 +148,6 @@ plugins.privmsg = [
 
 
 
-
-
-
-
-
-
-
 /*
  * jQuery Templates Plugin 1.0.0pre
  * http://github.com/jquery/jquery-tmpl
index fb87c5393afe1b04ecad3442199ff7cfe55b4e03..c27f4518b5be0498b147ea1a7100c60c6317baa8 100644 (file)
@@ -63,10 +63,6 @@ html(xmlns="http://www.w3.org/1999/xhtml", lang="en-gb")
                     return false;
                 });
                 $('a.connect').click(function(){ $('.formconnectwindow').submit(); return false; });
-                $('a.chan').live('click', function() {
-                    front.joinChannel($(this).text());
-                    return false;
-                });
             }