skins/default/nicetitle.js

   1 // from http://www.kryogenix.org\r
   2 // by Scott Andrew - http://scottandrew.com\r
   3 // add an eventlistener to browsers that can do it somehow.\r
   4 function addEvent(obj, evType, fn)\r
   5         {\r
   6         if (obj.addEventListener)\r
   7                 {\r
   8                 obj.addEventListener(evType, fn, false);\r
   9                 return true;\r
  10                 }\r
  11         else if (obj.attachEvent)\r
  12                 {\r
  13                 var r = obj.attachEvent('on'+evType, fn);\r
  14                 return r;\r
  15                 }\r
  16         else\r
  17                 {\r
  18                 return false;\r
  19                 }\r
  20         }\r
  21 \r
  22 function floatImages()\r
  23         {\r
  24         // adapted from http://www.dithered.com/javascript/browser_detect/\r
  25         //**************************************************************//\r
  26         // sniff user agent\r
  27         var userAgent = navigator.userAgent.toLowerCase();\r
  28 \r
  29         // if Mozilla 1.4 then quit\r
  30         if ((userAgent.indexOf('gecko') != -1) && (userAgent.indexOf('gecko/') + 14 == userAgent.length) && (parseFloat(userAgent.substring(userAgent.indexOf('rv:') + 3)) == '1.4')) return;\r
  31 \r
  32         // if Opera then quit\r
  33         if (document.all && window.Event) return;\r
  34         //**************************************************************//\r
  35 \r
  36         // check this browser can cope with what we want to do\r
  37         if (!document.getElementById) return;\r
  38         var blogDiv = document.getElementById('blog');\r
  39         if (!blogDiv) return;\r
  40         if (!blogDiv.offsetWidth) return;\r
  41 \r
  42         blogDiv.className = (blogDiv.offsetWidth >= 500) ? "float-images" : "block-images";\r
  43         }\r
  44 \r
  45 // Blockquote citations\r
  46 \r
  47 // Simon Willison's work:\r
  48 // http://simon.incutio.com/archive/2002/12/20/#blockquoteCitations\r
  49 \r
  50 // Also Dunstan Orchard's work:\r
  51 // http://1976design.com/blog/archive/2003/11/10/updates/\r
  52 function blockquoteCite()\r
  53         {\r
  54         if (!document.createElementNS)\r
  55                 {\r
  56                 document.createElementNS = function(ns, elt)\r
  57                         {\r
  58                         return document.createElement(elt);\r
  59                         }\r
  60                 }\r
  61         quotes = document.getElementsByTagName('blockquote');\r
  62         for (i = 0; i < quotes.length; i++)\r
  63                 {\r
  64                 var cite = quotes[i].getAttribute('cite');\r
  65                 // value of cite attribute should only contain URI, not any other\r
  66                 if ((cite) && (cite != ''))\r
  67                         {\r
  68                         newlink = document.createElementNS('http://www.w3.org/1999/xhtml', 'a');\r
  69                         newlink.setAttribute('href', cite);\r
  70                         newlink.className = 'cite-link';\r
  71                         newlink.appendChild(document.createTextNode(cite));\r
  72                         newdiv = document.createElementNS('http://www.w3.org/1999/xhtml', 'cite');\r
  73                         newdiv.className = 'blockquote-cite';\r
  74                         newdiv.appendChild(document.createTextNode('Source: '));\r
  75                         newdiv.appendChild(newlink);\r
  76                         quotes[i].appendChild(newdiv);\r
  77                         quotes[i].removeAttribute('cite');\r
  78                         }\r
  79                 }\r
  80         }\r
  81 \r
  82 // Ins and Del tags citations\r
  83 function insdelCite()\r
  84         {\r
  85         if (!document.createElementNS)\r
  86                 {\r
  87                 document.createElementNS = function(ns, elt)\r
  88                         {\r
  89                         return document.createElement(elt);\r
  90                         }\r
  91                 }\r
  92         var insdel = new Array(2);\r
  93         insdel[0] = document.getElementsByTagName('ins');\r
  94         insdel[1] = document.getElementsByTagName('del');\r
  95         for (var i=0; i<insdel.length; i++)\r
  96                 {\r
  97                 if (insdel[i])\r
  98                         {\r
  99                         for (var id=0; id<insdel[i].length; id++)\r
 100                                 {\r
 101                                 var isdl = insdel[i][id].getAttribute('cite');\r
 102                                 if ((isdl) && (isdl != ""))\r
 103                                         {\r
 104                                         idlink = document.createElementNS('http://www.w3.org/1999/xhtml', 'a');\r
 105                                         idlink.setAttribute('href', isdl);\r
 106                                         idlink.className = 'cite-link ' + (i == 0 ? 'ins-cite' : 'del-cite');\r
 107                                         idlink.setAttribute('title','citation of ' + (i == 0 ? 'added' : 'deleted') + ' text');\r
 108                                         idlink.appendChild(document.createTextNode('#'));\r
 109                                         insdel[i][id].appendChild(idlink);\r
 110                                         insdel[i][id].removeAttribute('cite');\r
 111                                         }\r
 112                                 }\r
 113                         }\r
 114                 }\r
 115         }\r
 116 \r
 117 // Force IE not to show alternate text as tooltip\r
 118 function noAltTooltip()\r
 119         {\r
 120         images = document.getElementsByTagName('img');\r
 121         for (var i = 0; i < images.length; i++)\r
 122                 {\r
 123                 var title = images[i].getAttribute('title');\r
 124                 var alt = images[i].getAttribute('alt');\r
 125                 if ((document.all) && (alt) && (!title))\r
 126                         {\r
 127                         images[i].setAttribute('title', '');\r
 128                         }\r
 129                 }\r
 130         }\r
 131 \r
 132 // Nice Titles\r
 133 \r
 134 // original code by Stuart Langridge 2003-11\r
 135 // with additions to the code by other good people\r
 136 // http://www.kryogenix.org/code/browser/nicetitle/\r
 137 // thank you, sir\r
 138 \r
 139 // modified by Peter Janes 2003-03-25\r
 140 // http://peterjanes.ca/blog/archives/2003/03/25/nicetitles-for-ins-and-del\r
 141 // added in ins and del tags\r
 142 \r
 143 // modified by Dunstan Orchard 2003-11-18\r
 144 // http://1976design.com/blog/\r
 145 // added in accesskey information\r
 146 // tried ever-so-hard, but couldn't work out how to do what Ethan did\r
 147 \r
 148 // final genius touch by by Ethan Marcotte 2003-11-18\r
 149 // http://www.sidesh0w.com/\r
 150 // worked out how to delay showing the popups to make them more like the browser's own\r
 151 \r
 152 // set the namespace\r
 153 var XHTMLNS = 'http://www.w3.org/1999/xhtml';\r
 154 var CURRENT_NICE_TITLE;\r
 155 \r
 156 // browser sniff\r
 157 var browser = new Browser();\r
 158 \r
 159 // determine browser and version.\r
 160 function Browser()\r
 161         {\r
 162         var ua, s, i;\r
 163 \r
 164         this.isIE = false;\r
 165         this.isNS = false;\r
 166         this.version = null;\r
 167 \r
 168         ua = navigator.userAgent;\r
 169 \r
 170         s = 'MSIE';\r
 171         if ((i = ua.indexOf(s)) >= 0)\r
 172                 {\r
 173                 this.isIE = true;\r
 174                 this.version = parseFloat(ua.substr(i + s.length));\r
 175                 return;\r
 176                 }\r
 177 \r
 178         s = 'Netscape6/';\r
 179         if ((i = ua.indexOf(s)) >= 0)\r
 180                 {\r
 181                 this.isNS = true;\r
 182                 this.version = parseFloat(ua.substr(i + s.length));\r
 183                 return;\r
 184                 }\r
 185 \r
 186         // treat any other 'Gecko' browser as NS 6.1.\r
 187         s = 'Gecko';\r
 188         if ((i = ua.indexOf(s)) >= 0)\r
 189                 {\r
 190                 this.isNS = true;\r
 191                 this.version = 6.1;\r
 192                 return;\r
 193                 }\r
 194         }\r
 195 \r
 196 // 2003-11-19 sidesh0w\r
 197 // set delay vars to emulate normal hover delay\r
 198 var delay;\r
 199 var interval = 0.60;\r
 200 \r
 201 // this function runs on window load\r
 202 // it runs through all the links on the page as starts listening for actions\r
 203 function makeNiceTitles()\r
 204         {\r
 205         if (!document.createElement || !document.getElementsByTagName) return;\r
 206         if (!document.createElementNS)\r
 207                 {\r
 208                 document.createElementNS = function(ns, elt)\r
 209                         {\r
 210                         return document.createElement(elt);\r
 211                         }\r
 212                 }\r
 213 \r
 214         // do regular links\r
 215         if (!document.links)\r
 216                 {\r
 217                 document.links = document.getElementsByTagName('a');\r
 218                 }\r
 219         for (var ti=0; ti<document.links.length; ti++)\r
 220                 {\r
 221                 var lnk = document.links[ti];\r
 222                 // * I added specific class names here..\r
 223                 if (lnk.title)\r
 224                         {\r
 225                         lnk.setAttribute('nicetitle', lnk.title);\r
 226                         lnk.removeAttribute('title');\r
 227                         addEvent(lnk, 'mouseover', showNiceTitle);\r
 228                         addEvent(lnk, 'mousemove', moveNiceTitle);\r
 229                         addEvent(lnk, 'mouseout', hideNiceTitle);\r
 230                         addEvent(lnk, 'focus', showNiceTitle);\r
 231                         addEvent(lnk, 'blur', hideNiceTitle);\r
 232                         }\r
 233                 }\r
 234 \r
 235         // 2003-03-25 Peter Janes\r
 236         // do ins and del tags\r
 237         var tags = new Array(2);\r
 238         tags[0] = document.getElementsByTagName('ins');\r
 239         tags[1] = document.getElementsByTagName('del');\r
 240         for (var tt=0; tt<tags.length; tt++)\r
 241                 {\r
 242                 if (tags[tt])\r
 243                         {\r
 244                         for (var ti=0; ti<tags[tt].length; ti++)\r
 245                                 {\r
 246                                 var tag = tags[tt][ti];\r
 247                                 if (tag.dateTime)\r
 248                                         {\r
 249                                         var strDate = tag.dateTime;\r
 250                                         // HTML/ISO8601 date: yyyy-mm-ddThh:mm:ssTZD (Z, -hh:mm, +hh:mm)\r
 251                                         var month = strDate.substring(5,7);\r
 252                                         var day = strDate.substring(8,10);\r
 253                                         if (month[0] == '0')\r
 254                                                 {\r
 255                                                 month = month[1];\r
 256                                                 }\r
 257                                         if (day[0] == '0')\r
 258                                                 {\r
 259                                                 day = day[1];\r
 260                                                 }\r
 261                                         var dtIns = new Date(strDate.substring(0,4), month-1, day, strDate.substring(11,13), strDate.substring(14,16), strDate.substring(17,19));\r
 262                                         tag.setAttribute('nicetitle', (tt == 0 ? 'Added' : 'Deleted') + ' on ' + dtIns.toString());\r
 263                                         addEvent(tag, 'mouseover', showNiceTitle);\r
 264                                         addEvent(tag, 'mousemove', moveNiceTitle);\r
 265                                         addEvent(tag, 'mouseout', hideNiceTitle);\r
 266                                         addEvent(tag, 'focus', showNiceTitle);\r
 267                                         addEvent(tag, 'blur', hideNiceTitle);\r
 268                                         }\r
 269                                 }\r
 270                         }\r
 271                 }\r
 272         }\r
 273 \r
 274 function findPosition(oLink)\r
 275         {\r
 276         if (oLink.offsetParent)\r
 277                 {\r
 278                 for (var posX = 0, posY = 0; oLink.offsetParent; oLink = oLink.offsetParent)\r
 279                         {\r
 280                         posX += oLink.offsetLeft;\r
 281                         posY += oLink.offsetTop;\r
 282                         }\r
 283                 return [posX, posY];\r
 284                 }\r
 285         else\r
 286                 {\r
 287                 return [oLink.x, oLink.y];\r
 288                 }\r
 289         }\r
 290 \r
 291 function getParent(el, pTagName)\r
 292         {\r
 293         if (el == null)\r
 294                 {\r
 295                 return null;\r
 296                 }\r
 297         // gecko bug, supposed to be uppercase\r
 298         else if (el.nodeType == 1 && el.tagName.toLowerCase() == pTagName.toLowerCase())\r
 299                 {\r
 300                 return el;\r
 301                 }\r
 302         else\r
 303                 {\r
 304                 return getParent(el.parentNode, pTagName);\r
 305                 }\r
 306         }\r
 307 \r
 308 // 2003-11-19 sidesh0w\r
 309 // trailerpark wrapper function\r
 310 function showDelay()\r
 311         {\r
 312         if (CURRENT_NICE_TITLE)\r
 313                 {\r
 314                 CURRENT_NICE_TITLE.style.display = '';\r
 315                 }\r
 316         }\r
 317 \r
 318 // build and show the nice titles\r
 319 function showNiceTitle(e)\r
 320         {\r
 321         if (CURRENT_NICE_TITLE) hideNiceTitle(CURRENT_NICE_TITLE);\r
 322         if (!document.getElementsByTagName) return;\r
 323 \r
 324         if (window.event && window.event.srcElement)\r
 325                 {\r
 326                 lnk = window.event.srcElement\r
 327                 }\r
 328         else if (e && e.target)\r
 329                 {\r
 330                 lnk = e.target\r
 331                 }\r
 332         if (!lnk) return;\r
 333 \r
 334         // lnk is a textnode or an elementnode that's not ins/del\r
 335         if (lnk.nodeType == 3 || (lnk.nodeType == 1 && lnk.tagName.toLowerCase() != 'ins' && lnk.tagName.toLowerCase() != 'del'))\r
 336                 {\r
 337                 // ascend parents until we hit a link\r
 338                 lnk = getParent(lnk, 'a');\r
 339                 }\r
 340 \r
 341          nicetitle = lnk.getAttribute('nicetitle');\r
 342 \r
 343         var d = document.createElementNS(XHTMLNS, 'div');\r
 344         d.className = 'nicetitle';\r
 345         var dc = document.createElementNS(XHTMLNS, 'div');\r
 346         dc.className = 'nicetitle-content';\r
 347         d.appendChild(dc);\r
 348         tnt = document.createTextNode(nicetitle);\r
 349         pat = document.createElementNS(XHTMLNS, 'p');\r
 350         pat.className = 'titletext';\r
 351         pat.appendChild(tnt);\r
 352 \r
 353         // 2003-11-18 Dunstan Orchard\r
 354         // added in accesskey info\r
 355         if (lnk.accessKey)\r
 356                 {\r
 357                 axs = document.createTextNode(' [' + lnk.accessKey + ']');\r
 358                 axsk = document.createElementNS(XHTMLNS, 'span');\r
 359                 axsk.className = 'accesskey';\r
 360                 axsk.appendChild(axs);\r
 361                 pat.appendChild(axsk);\r
 362                 }\r
 363         dc.appendChild(pat);\r
 364 \r
 365         if (lnk.href)\r
 366                 {\r
 367                 tnd = document.createTextNode(lnk.href);\r
 368                 pad = document.createElementNS(XHTMLNS, 'p');\r
 369                 pad.className = 'destination';\r
 370                 pad.appendChild(tnd);\r
 371                 dc.appendChild(pad);\r
 372                 }\r
 373 \r
 374         STD_WIDTH = 300;\r
 375 \r
 376         if (lnk.href)\r
 377                 {\r
 378                 h = lnk.href.length;\r
 379                 }\r
 380         else\r
 381                 {\r
 382                 h = nicetitle.length;\r
 383                 }\r
 384 \r
 385         if (nicetitle.length)\r
 386                 {\r
 387                 t = nicetitle.length;\r
 388                 }\r
 389 \r
 390         h_pixels = h*6;\r
 391         t_pixels = t*10;\r
 392 \r
 393         if (t_pixels > STD_WIDTH)\r
 394                 {\r
 395                 w = t_pixels;\r
 396                 }\r
 397         else if ((STD_WIDTH > t_pixels) && (t_pixels > h_pixels))\r
 398                 {\r
 399                 w = t_pixels;\r
 400                 }\r
 401         else if ((STD_WIDTH > h_pixels) && (h_pixels > t_pixels))\r
 402                 {\r
 403                 w = h_pixels;\r
 404                 }\r
 405         else\r
 406                 {\r
 407                 w = STD_WIDTH;\r
 408                 }\r
 409 \r
 410         d.style.width = w + 'px';\r
 411         d.style.display = 'none';\r
 412 \r
 413         document.getElementsByTagName('body')[0].appendChild(d);\r
 414 \r
 415         CURRENT_NICE_TITLE = d;\r
 416 \r
 417         moveNiceTitle(e);\r
 418 \r
 419         delay = setTimeout("showDelay()", interval * 1000);\r
 420         }\r
 421 \r
 422 function moveNiceTitle(e)\r
 423         {\r
 424         if (!document.getElementsByTagName) return;\r
 425         if (!CURRENT_NICE_TITLE) return;\r
 426 \r
 427         if (document.all)\r
 428                 {\r
 429                 X = document.body.scrollLeft + window.event.clientX;\r
 430                 }\r
 431         else if (document.layers || document.getElementById)\r
 432                 {\r
 433                 X = e.pageX;\r
 434                 }\r
 435         w_title = Number(CURRENT_NICE_TITLE.style.width.replace(/^(\d+).*$/, '$1'));\r
 436         if (w_title + X > (window.innerWidth + (document.documentElement.scrollLeft || window.pageXOffset) - 20))\r
 437                 {\r
 438                 X = (window.innerWidth + (document.documentElement.scrollLeft || window.pageXOffset) - 20) - w_title;\r
 439                 }\r
 440 \r
 441         if (document.all)\r
 442                 {\r
 443                 Y = document.body.scrollTop + window.event.clientY;\r
 444                 }\r
 445         else if (document.layers || document.getElementById)\r
 446                 {\r
 447                 Y = e.pageY;\r
 448                 }\r
 449         if (Y > (window.innerHeight + (document.documentElement.scrollTop || window.pageYOffset) - 60))\r
 450                 {\r
 451                 Y = Y - 25 - 60;\r
 452                 }\r
 453         \r
 454         CURRENT_NICE_TITLE.style.left = X + 'px';\r
 455         CURRENT_NICE_TITLE.style.top = (Y + 25) + 'px';\r
 456         }\r
 457 \r
 458 function hideNiceTitle(e)\r
 459         {\r
 460         // 2003-11-19 sidesh0w\r
 461         // clearTimeout\r
 462         if (delay) clearTimeout(delay);\r
 463         if (!document.getElementsByTagName) return;\r
 464         if (CURRENT_NICE_TITLE)\r
 465                 {\r
 466                 document.getElementsByTagName('body')[0].removeChild(CURRENT_NICE_TITLE);\r
 467                 CURRENT_NICE_TITLE = null;\r
 468                 }\r
 469         }\r
 470 \r
 471 addEvent(window, "load", floatImages);\r
 472 addEvent(window, "resize", floatImages);\r
 473 addEvent(window, "load", blockquoteCite);\r
 474 addEvent(window, "load", insdelCite);\r
 475 addEvent(window, "load", noAltTooltip);\r
 476 addEvent(window, "load", makeNiceTitles);\r
 477 \r
 478 // I'm very poor in JavaScript. Please correct me if I'm wrong.\r