Changeset 26084


Ignore:
Timestamp:
Dec 22, 2013, 4:59:55 PM (10 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.