Changeset 334

Show
Ignore:
Timestamp:
05/16/06 13:15:05
Author:
piv
Message:

realise 0.4

Files:

Legend:

Unmodified
Added
Removed
Modified
Copied
Moved
  • qPloneTiles/trunk/HISTORY.txt

    r333 r334  
     12006-05-16 - version 0.4.0 
     2 
     3  * some code optimization) 
     4 
     5  * provided the same functionality on IE6 
     6 
     7  * corect functionality with nested tile elements 
     8 
     9  * added some visual link imitation effects for tile elements: 
     10 
     11     - mouse pointer over tile elements 
     12 
     13     - tile elements can be accessed via tabbing 
     14 
     15     - window status line changed while mouse is over tile elements 
     16 
     17  * added functions doc strings 
     18 
     19  * added 'Usage' section to README.txt file 
     20 
    1212006-04-20 - version 0.2.0 
    222 
     
    525  * fixed bug (onclick evaluation) 
    626   
    7   * 'pimary' class functionality 
     27  * 'primary' class functionality 
    828   
    929  * added TODO.txt 
  • qPloneTiles/trunk/README.txt

    r333 r334  
    22 
    33 
     4Usage 
     5 
     6  Plone Product for creating "Tile" links. 
     7   
     8  Provide class 'tile' for html element you want to  
     9  have link behaviour. Then select one of the anchor  
     10  elements inside that tile by adding it class = 
     11  = 'primary'. Thus, our tile element will redirect 
     12  you to primary anchor target. So all tile area, 
     13  except anchors within it, is linkable and behave  
     14  like a link! If you define your tile element, but 
     15  not select your primary link inside tile, href  
     16  attribute of the first anchor will be taken by  
     17  default. 
     18   
     19  Example 1: 
     20     
     21    <div class="tile"> 
     22      <a href="www.example1.com">First link</a> 
     23      <a href="www.example2.com">Second link</a> 
     24    </div> 
     25  Here we have div element with class 'tile'. But any 
     26  element inside div haven't class 'primary'. So by 
     27  default will be used href of the first link. And  
     28  when you click in scopes div element and outside a 
     29  element you'll be redirected to www.example1.com. 
     30       
     31  Example 2: 
     32   
     33    <div class="tile"> 
     34      <a href="www.example1.com">First link</a> 
     35      <a class="primary" 
     36         href="www.example2.com">Second link</a> 
     37    </div> 
     38  In this case we have (in addition all we have in previous 
     39  example) second link with primary class. So div element 
     40  have "www.example2.com" location. 
     41   
     42  Example 3: 
     43   
     44    <div class="tile"> 
     45      <a href="www.example1.com">First link</a> 
     46      <div class="tile"> 
     47        <a href="www.example1.com">First link</a> 
     48        <a class="primary" 
     49           href="www.example2.com">Second link</a> 
     50      </div> 
     51    </div> 
     52  This last example show us that we could have nested 
     53  tile elements. In practice, everything works like in 
     54  previous examples except one. Tile element look for 
     55  primary link. In this example primary element is  
     56  inside both tiles. But if you want to have for outer 
     57  div first link as primary, you could simply add  
     58  class 'primary' to 'First link'. In this case tile'll 
     59  search only to first primary link. And it won't 
     60  affect inner div element. 
     61  So remember that tile element could inherite href 
     62  attribute only from inner anchors. 
     63   
     64   
    465Inspiration 
    566 
  • qPloneTiles/trunk/TODO.txt

    r333 r334  
    11 
    2  * realise 0.3 
     2// * realise 0.3 
    33  
    4  * realise 0.4 
     4// * realise 0.4 
     5 
     6 *  
  • qPloneTiles/trunk/skins/qPloneTiles/tiles.js

    r333 r334  
    77        list = (parentElement || window.document.body).getElementsByTagName('*'); 
    88    if(list.length == 0) list = (parentElement || window.document.body).all; 
    9     for(var i = 0; i < list.length; i++) { 
    10 //        if(DEBUG) message += '\n' + list[i].className; 
    11         if(list[i].className.match(new RegExp('(^|\\s)' + className + '(\\s|$)'))) result[result.length] = list[i]; 
    12     } 
    13     return result 
     9    var class_re = new RegExp('(^|\\s)' + className + '(\\s|$)'); 
     10    for(var i = 0; i < list.length; i++) if(list[i].className.match(class_re)) result[result.length] = list[i]; 
     11    return result; 
    1412}; 
    1513 
    16 function getNeededHref(a_list) { 
    17     var result, classname_re = new RegExp('(^|\\s)' + 'primary' + '(\\s|$)'); 
    18     if(a_list.length == 0) return false; 
    19     for(var i = 0; i < a_list.length; i++) { 
    20         if(classname_re.exec(a_list[i].className)) return a_list[i].href; 
    21     } 
    22     return a_list[0].href 
     14// browser compatibility functions 
     15function add_Event(obj, evt, listener, captured) { 
     16    if (!obj.addEventListener) obj.attachEvent('on'+evt, listener); 
     17    else obj.addEventListener(evt, listener, captured); 
    2318} 
    2419 
    25 function setTiles(){ 
    26     var tiles_elms = getElementsByClassName("tile", window.document) 
    27     for(var i = 0; i < tiles_elms.length; i++) { 
    28         var tiles_a = tiles_elms[i].getElementsByTagName('A'); 
    29         if(tiles_a.length > 0) { 
    30             var Href = getNeededHref(tiles_a); 
    31             if(Href != false) tiles_elms[i].onclick = new Function("window.location = '"+Href+"'; return false;") 
    32             } 
    33         if(DEBUG) message += '\n' + tiles_elms[i].onclick + ' - ' + Href; 
    34     } 
    35     if(DEBUG) window.alert(message); 
     20function stopBubbling(e) { 
     21    if(!e) window.event.cancelBubble=true; 
     22    else (e.stopPropagation) ? e.stopPropagation() : e.cancelBubble=true; 
    3623} 
    3724 
    38 registerPloneFunction(setTiles); 
     25function getPrimaryLink(list) { 
     26    // get first a.primary element from the list 
     27    // or just first element if no primary anchor is marked 
     28    if(list.length == 0) return false; 
     29    var primary = new RegExp('(^|\\s)' + 'primary' + '(\\s|$)'); 
     30    for(var i = 0; i < list.length; i++) if(primary.exec(list[i].className)) return list[i]; 
     31    return list[0]; 
     32
     33 
     34function initTiles(){ 
     35    var tiles = getElementsByClassName("tile", window.document) 
     36    for(var i = 0; i < tiles.length; i++) { 
     37        var tile = tiles[i], 
     38            hrefs = tile.getElementsByTagName('A'); 
     39        var a = getPrimaryLink(hrefs); 
     40        if (a) { 
     41            // adding styling for tiles 
     42            tile.style.cursor='pointer'; 
     43            tile.tabIndex = 0; 
     44            // adding event handling 
     45            add_Event(tile, 'click',     new Function("e", "window.location='"+a.href+"';stopBubbling(e)"), false); 
     46            add_Event(tile, 'mouseover', new Function("e", "window.status=  '"+a.href+"';stopBubbling(e)"), false); 
     47            add_Event(tile, 'mouseout',      function( e ){ window.status=  '';          stopBubbling(e) }, false); 
     48        } 
     49    } 
     50
     51 
     52registerPloneFunction(initTiles); 
  • qPloneTiles/trunk/version.txt

    r333 r334  
    1 0.2.0 
     10.4.0