Changeset 26084


Ignore:
Timestamp:
12/22/13 16:59:55 (5 years ago)
Author:
mistic100
Message:

rewrite elegant javascript : use session storage instead of cookies, factorize jQuery variables, remove unecessary event handlers, wrap into anonymous function

File:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/themes/elegant/scripts_pp.js

    r23269 r26084  
    1 /** 
    2  * Cookie plugin 
    3  * Copyright (c) 2006 Klaus Hartl (stilbuero.de) 
    4  * Dual licensed under the MIT and GPL licenses: 
    5  */ 
    6 jQuery.cookie=function(name,value,options){if(typeof value!='undefined'){options=options||{};if(value===null){value='';options=jQuery.extend({},options);options.expires=-1;} 
    7 var expires='';if(options.expires&&(typeof options.expires=='number'||options.expires.toUTCString)){var date;if(typeof options.expires=='number'){date=new Date();date.setTime(date.getTime()+(options.expires*24*60*60*1000));}else{date=options.expires;} 
    8 expires='; expires='+date.toUTCString();} 
    9 var path=options.path?'; path='+(options.path):'';var domain=options.domain?'; domain='+(options.domain):'';var secure=options.secure?'; secure':'';document.cookie=[name,'=',encodeURIComponent(value),expires,path,domain,secure].join('');}else{var cookieValue=null;if(document.cookie&&document.cookie!=''){var cookies=document.cookie.split(';');for(var i=0;i<cookies.length;i++){var cookie=jQuery.trim(cookies[i]);if(cookie.substring(0,name.length+1)==(name+'=')){cookieValue=decodeURIComponent(cookie.substring(name.length+1));break;}}} 
    10 return cookieValue;}}; 
     1(function() { 
     2  var session_storage = window.sessionStorage || {}; 
    113 
    12 if (jQuery.cookie('picture-menu') == 'visible') { 
    13         jQuery("head").append("<style type=\"text/css\">#content.contentWithMenu, #the_page > .content {margin-left:240px;}</style>"); 
    14 } else { 
    15         jQuery("head").append("<style type=\"text/css\">#the_page #menubar {display:none;} #content.contentWithMenu, #the_page > .content {margin-left:35px;}</style>"); 
    16 } 
     4  var menubar=jQuery("#menubar"), 
     5      menuswitcher, 
     6      content=jQuery("#the_page > .content"), 
     7      pcontent=jQuery("#content"), 
     8      imageInfos=jQuery("#imageInfos"), 
     9      infoswitcher, 
     10      theImage=jQuery("#theImage"), 
     11      comments=jQuery("#thePicturePage #comments"), 
     12      comments_button, 
     13      commentsswitcher, 
     14      comments_add, 
     15      comments_top_offset = 0; 
    1716 
    18 function hideMenu(delay) { 
    19         var menubar=jQuery("#menubar"); 
    20         var menuswitcher=jQuery("#menuSwitcher"); 
    21         var content=jQuery("#the_page > .content"); 
    22         var pcontent=jQuery("#content"); 
    23          
    24         menubar.hide(delay); 
    25         menuswitcher.addClass("menuhidden").removeClass("menushown"); 
    26         content.addClass("menuhidden").removeClass("menushown"); 
    27         pcontent.addClass("menuhidden").removeClass("menushown"); 
    28         jQuery.cookie('picture-menu', 'hidden', {path: "/"}); 
    29          
    30 } 
     17  if (session_storage['picture-menu'] == 'visible') { 
     18    jQuery("head").append('<style>#content.contentWithMenu, #the_page > .content {margin-left:240px;}</style>'); 
     19  } 
     20  else { 
     21    jQuery("head").append('<style>#the_page #menubar {display:none;} #content.contentWithMenu, #the_page > .content {margin-left:35px;}</style>'); 
     22  } 
    3123 
    32 function showMenu(delay) { 
     24  function hideMenu(delay) { 
     25    menubar.hide(delay); 
     26    menuswitcher.addClass("menuhidden").removeClass("menushown"); 
     27    content.addClass("menuhidden").removeClass("menushown"); 
     28    pcontent.addClass("menuhidden").removeClass("menushown"); 
     29    session_storage['picture-menu'] = 'hidden'; 
     30  } 
    3331 
    34         var menubar=jQuery("#menubar"); 
    35         var menuswitcher=jQuery("#menuSwitcher"); 
    36         var content=jQuery("#the_page > .content"); 
    37         var pcontent=jQuery("#content"); 
     32  function showMenu(delay) { 
     33    menubar.show(delay); 
     34    menuswitcher.addClass("menushown").removeClass("menuhidden"); 
     35    content.addClass("menushown").removeClass("menuhidden"); 
     36    pcontent.addClass("menushown").removeClass("menuhidden"); 
     37    session_storage['picture-menu'] = 'visible'; 
     38  } 
    3839 
    39         menubar.show(delay); 
    40         menuswitcher.addClass("menushown").removeClass("menuhidden"); 
    41         content.addClass("menushown").removeClass("menuhidden"); 
    42         pcontent.addClass("menushown").removeClass("menuhidden"); 
    43         jQuery.cookie('picture-menu', 'visible', {path: "/"}); 
    44          
    45 } 
     40  function hideInfo(delay) { 
     41    imageInfos.hide(delay); 
     42    infoswitcher.addClass("infohidden").removeClass("infoshown"); 
     43    theImage.addClass("infohidden").removeClass("infoshown"); 
     44    session_storage['side-info'] = 'hidden'; 
     45  } 
    4646 
    47 function hideInfo(delay) { 
     47  function showInfo(delay) { 
     48    imageInfos.show(delay); 
     49    infoswitcher.addClass("infoshown").removeClass("infohidden"); 
     50    theImage.addClass("infoshown").removeClass("infohidden"); 
     51    session_storage['side-info'] = 'visible'; 
     52  } 
    4853 
    49         var imageInfos=jQuery("#imageInfos"); 
    50         var infoswitcher=jQuery("#infoSwitcher"); 
    51         var theImage=jQuery("#theImage"); 
    52          
    53         imageInfos.hide(delay); 
    54         infoswitcher.addClass("infohidden").removeClass("infoshown"); 
    55         theImage.addClass("infohidden").removeClass("infoshown"); 
    56         jQuery.cookie('side-info', 'hidden', {path: "/"}); 
     54  function commentsToggle() { 
     55    if (comments.hasClass("commentshidden")) { 
     56        comments.removeClass("commentshidden").addClass("commentsshown"); 
     57        comments_button.addClass("comments_toggle_off").removeClass("comments_toggle_on");; 
     58        session_storage['comments'] = 'visible'; 
    5759 
    58 } 
     60        comments_top_offset = comments_add.offset().top - parseFloat(comments_add.css('marginTop').replace(/auto/, 0)); 
     61      } 
     62      else { 
     63        comments.addClass("commentshidden").removeClass("commentsshown"); 
     64        comments_button.addClass("comments_toggle_on").removeClass("comments_toggle_off");; 
     65        session_storage['comments'] = 'hidden'; 
     66      } 
     67  } 
    5968 
    60 function showInfo(delay) { 
     69  jQuery(function(){ 
     70    // side-menu show/hide 
     71    if (menubar.length == 1 && p_main_menu!="disabled") { 
     72      menuswitcher=jQuery("#menuSwitcher"); 
    6173 
    62         var imageInfos=jQuery("#imageInfos"); 
    63         var infoswitcher=jQuery("#infoSwitcher"); 
    64         var theImage=jQuery("#theImage"); 
    65          
    66         imageInfos.show(delay); 
    67         infoswitcher.addClass("infoshown").removeClass("infohidden"); 
    68         theImage.addClass("infoshown").removeClass("infohidden"); 
    69         jQuery.cookie('side-info', 'visible', {path: "/"}); 
     74      menuswitcher.html('<div class="switchArrow">&nbsp;</div>'); 
    7075 
    71 } 
     76      if (session_storage['picture-menu'] == 'hidden' || p_main_menu == 'off') { 
     77        hideMenu(0); 
     78      } 
     79      else { 
     80        showMenu(0); 
     81      } 
    7282 
    73 jQuery("document").ready(function(jQuery){ 
    74          
    75         // side-menu show/hide 
     83      menuswitcher.click(function(e){ 
     84        if (menubar.is(":hidden")) { 
     85          showMenu(0); 
     86        } 
     87        else { 
     88          hideMenu(0); 
     89        } 
     90        e.preventDefault(); 
     91      }); 
     92    } 
    7693 
    77         var sidemenu = jQuery.cookie('picture-menu'); 
    78         var menubar=jQuery("#menubar"); 
     94    // info show/hide 
     95    if (imageInfos.length == 1 && p_pict_descr!="disabled") { 
     96      infoswitcher=jQuery("#infoSwitcher"); 
    7997 
    80         if (menubar.length == 1 && p_main_menu!="disabled") { 
     98      infoswitcher.html('<div class="switchArrow">&nbsp;</div>'); 
    8199 
    82                 jQuery("#menuSwitcher").html("<div class=\"switchArrow\">&nbsp;</div>"); 
     100      if (session_storage['side-info'] == 'hidden' || p_pict_descr == 'off') { 
     101        hideInfo(0); 
     102      } 
     103      else { 
     104        showInfo(0); 
     105      } 
    83106 
    84                 // if cookie says the menu is hiding, keep it hidden! 
    85                 if (sidemenu == 'hidden') { 
    86                         hideMenu(0); 
    87                 } else if (sidemenu == 'visible') { 
    88                         showMenu(0); 
    89                 } else if (p_main_menu == 'off') { 
    90                         hideMenu(0); 
    91                 }       else { 
    92                         showMenu(0); 
    93                 } 
    94          
    95                 jQuery("#menuSwitcher").click(function(){ 
    96                         if (jQuery("#menubar").is(":hidden")) { 
    97                                 showMenu(0); 
    98                                 return false; 
    99                         } else { 
    100                                 hideMenu(0); 
    101                                 return false; 
    102                         } 
    103                 }); 
    104          
    105         } 
     107      infoswitcher.click(function(e){ 
     108        if (imageInfos.is(":hidden")) { 
     109          showInfo(0); 
     110        } 
     111        else { 
     112          hideInfo(0); 
     113        } 
     114        e.preventDefault(); 
     115      }); 
     116    } 
    106117 
    107         // info show/hide 
    108          
    109         var sideinfo = jQuery.cookie('side-info'); 
    110         var imageInfos=jQuery("#imageInfos"); 
     118    // comments show/hide 
     119    if (comments.length == 1 && p_pict_comment!="disabled") { 
     120      commentsswitcher=jQuery("#commentsSwitcher"); 
     121      comments_button=jQuery("#comments h3"); 
     122      comments_add=jQuery('#commentAdd'); 
    111123 
    112         if (imageInfos.length == 1 && p_pict_descr!="disabled") { 
     124      commentsswitcher.html('<div class="switchArrow">&nbsp;</div>'); 
    113125 
    114                 jQuery("#infoSwitcher").html("<div class=\"switchArrow\">&nbsp;</div>"); 
     126      if (comments_button.length == 0) { 
     127        jQuery("#addComment").before("<h3>Comments</h3>"); 
     128        comments_button=jQuery("#comments h3"); 
     129      } 
    115130 
    116                 // if cookie says the menu is hiding, keep it hidden! 
    117                 if (sideinfo == 'hidden') { 
    118                         hideInfo(0); 
    119                 } else if (sideinfo == 'visible') { 
    120                         showInfo(0); 
    121                 } else if (p_pict_descr == 'off') { 
    122                         hideInfo(0); 
    123                 } else { 
    124                         showInfo(0); 
    125                 } 
    126          
    127                 jQuery("#infoSwitcher").click(function(){ 
    128                         if (jQuery("#imageInfos").is(":hidden")) { 
    129                                 showInfo(0); 
    130                                 return false; 
    131                         } else { 
    132                                 hideInfo(0); 
    133                                 return false; 
    134                         } 
    135                 }); 
    136          
    137         } 
     131      if (session_storage['comments'] == 'hidden' || p_pict_comment == 'off') { 
     132        comments.addClass("commentshidden"); 
     133        comments_button.addClass("comments_toggle comments_toggle_on"); 
     134      } 
     135      else { 
     136        comments.addClass("commentsshown"); 
     137        comments_button.addClass("comments_toggle comments_toggle_off"); 
     138      } 
    138139 
    139         // comments show/hide 
     140      comments_button.click(commentsToggle); 
     141      commentsswitcher.click(commentsToggle); 
    140142 
    141         var commentsswicther=jQuery("#commentsSwitcher"); 
    142         var comments=jQuery("#thePicturePage #comments"); 
    143          
    144         commentsswicther.html("<div class=\"switchArrow\">&nbsp;</div>"); 
    145          
    146         if (comments.length == 1 && p_pict_comment!="disabled") { 
    147                 var comments_button=jQuery("#comments h3"); 
     143      jQuery(window).scroll(function (event) { 
     144        if (comments_top_offset==0) return; 
    148145 
    149                 if (comments_button.length == 0) { 
    150                         jQuery("#addComment").before("<h3>Comments</h3>"); 
    151                         comments_button=jQuery("#comments h3"); 
    152                 } 
    153          
    154                 if (jQuery.cookie('comments') == 'hidden') { 
    155                         comments.addClass("commentshidden"); 
    156                         comments_button.addClass("comments_toggle").addClass("comments_toggle_on"); 
    157                 } else if (jQuery.cookie('comments') == 'visible') { 
    158                         comments.addClass("commentsshown"); 
    159                         comments_button.addClass("comments_toggle").addClass("comments_toggle_off"); 
    160                 } else if (p_pict_comment == 'off') { 
    161                         comments.addClass("commentshidden"); 
    162                         comments_button.addClass("comments_toggle").addClass("comments_toggle_on"); 
    163                 } else { 
    164                         comments.addClass("commentsshown"); 
    165                         comments_button.addClass("comments_toggle").addClass("comments_toggle_off"); 
    166                 } 
    167                  
    168                 comments_button.click(function() { commentsToggle() }); 
    169                 commentsswicther.click(function() { commentsToggle() }); 
    170  
    171     if (jQuery('#commentAdd').is(":visible")) { 
    172       var top = jQuery('#commentAdd').offset().top - parseFloat(jQuery('#commentAdd').css('marginTop').replace(/auto/, 0)); 
    173       jQuery(window).scroll(function (event) { 
    174146        // what the y position of the scroll is 
    175147        var y = jQuery(this).scrollTop(); 
    176        
     148 
    177149        // whether that's below the form 
    178         if (y >= top) { 
     150        if (y >= comments_top_offset) { 
    179151          // if so, ad the fixed class 
    180           jQuery('#commentAdd').addClass('fixed'); 
    181         } else { 
     152          comments_add.addClass('fixed'); 
     153        } 
     154        else { 
    182155          // otherwise remove it 
    183           jQuery('#commentAdd').removeClass('fixed'); 
    184         } 
    185       }); 
    186     } 
    187         } 
    188    
    189  
    190          
    191 }); 
    192  
    193 function commentsToggle() { 
    194         var comments=jQuery("#thePicturePage #comments"); 
    195         var comments_button=jQuery("#comments h3"); 
    196  
    197         if (comments.hasClass("commentshidden")) { 
    198                         comments.removeClass("commentshidden").addClass("commentsshown"); 
    199                         comments_button.addClass("comments_toggle_off").removeClass("comments_toggle_on");; 
    200                         jQuery.cookie('comments', 'visible', {path: "/"}); 
    201       var top = jQuery('#commentAdd').offset().top - parseFloat(jQuery('#commentAdd').css('marginTop').replace(/auto/, 0)); 
    202       jQuery(window).scroll(function (event) { 
    203         // what the y position of the scroll is 
    204         var y = jQuery(this).scrollTop(); 
    205        
    206         // whether that's below the form 
    207         if (y >= top) { 
    208           // if so, ad the fixed class 
    209           jQuery('#commentAdd').addClass('fixed'); 
    210         } else { 
    211           // otherwise remove it 
    212           jQuery('#commentAdd').removeClass('fixed'); 
     156          comments_add.removeClass('fixed'); 
    213157        } 
    214158      }); 
    215159 
    216                 } else { 
    217                         comments.addClass("commentshidden").removeClass("commentsshown"); 
    218                         comments_button.addClass("comments_toggle_on").removeClass("comments_toggle_off");; 
    219                         jQuery.cookie('comments', 'hidden', {path: "/"}); 
    220                 } 
    221  
    222 } 
     160      if (comments_add.is(":visible")) { 
     161        comments_top_offset = comments_add.offset().top - parseFloat(comments_add.css('marginTop').replace(/auto/, 0)); 
     162      } 
     163    } 
     164  }); 
     165}()); 
Note: See TracChangeset for help on using the changeset viewer.