From fbe5fd9783f4bba229a192e79eecc98b5279039c Mon Sep 17 00:00:00 2001 From: Sylvester Johansson Date: Wed, 27 May 2009 04:57:44 +0200 Subject: added (buggy) hint styling --- examples/data/style.css | 3 +++ examples/scripts/linkfollow.js | 37 ++++++++++++++++++++++++++----------- 2 files changed, 29 insertions(+), 11 deletions(-) create mode 100644 examples/data/style.css diff --git a/examples/data/style.css b/examples/data/style.css new file mode 100644 index 0000000..81bb6df --- /dev/null +++ b/examples/data/style.css @@ -0,0 +1,3 @@ +.uzbl_hint_class { background-color: yellow;} +.uzbl_hint_first { background-color: lightgreen;} + diff --git a/examples/scripts/linkfollow.js b/examples/scripts/linkfollow.js index 769f127..327b82c 100644 --- a/examples/scripts/linkfollow.js +++ b/examples/scripts/linkfollow.js @@ -11,22 +11,27 @@ // bind f* = js hints.set("%s") // bind f_ = js hints.follow("%s") // +// To enable hint highlighting, add: +// set stylesheet_uri = /usr/share/uzbl/examples/data/style.css +// // based on follow_Numbers.js // -// TODO: set CSS styles +// TODO: set CSS styles (done, but not working properly) // TODO: load the script as soon as the DOM is ready + function Hints(){ var uzblid = 'uzbl_hint'; - var uzblclass = 'uzbl_hint_class'; + var uzblclass = "uzbl_hint_class"; + var uzblclassfirst = "uzbl_hint_first"; var doc = document; this.set = setHints; this.follow = followHint; this.keyPressHandler = keyPressHandler; function hasClass(ele,cls) { - return ele.className.match(new RegExp('(\\s|^)'+cls+'(\\s|$)')); + return ele.className.split(/ /).some(function (n) { return n == cls }); }   function addClass(ele,cls) { @@ -34,10 +39,7 @@ function Hints(){ }   function removeClass(ele,cls) { - if (hasClass(ele,cls)) { - var reg = new RegExp('(\\s|^)'+cls+'(\\s|$)'); - ele.className=ele.className.replace(reg,' '); - } + ele.className = ele.className.split(/ /).filter(function (n) { n != cls}).join(" "); } function elementPosition(el) { @@ -140,7 +142,12 @@ function Hints(){ var h = generateHint(pos,c); h.href = function () {return item}; hintdiv.appendChild(h); - addClass(item,uzblclass); + if(c==1){ + addClass(item,uzblclassfirst); + // addClass(item,uzblclass); + } else { + addClass(item,uzblclass); + } c++; } } @@ -154,10 +161,15 @@ function Hints(){ if(hintdiv){ hintdiv.parentNode.removeChild(hintdiv); } + var first = doc.getElementsByClassName(uzblclassfirst)[0]; + if(first){ + removeClass(first,uzblclassfirst); + } + // TODO: not all class attributes get removed var items = doc.getElementsByClassName(uzblclass); - for (var i = 0; i