Fixed-positioned left sidebar bug fix
authorOlga Brani <olgabrani@grnet.gr>
Mon, 16 Dec 2013 13:27:37 +0000 (15:27 +0200)
committerKostas Papadimitriou <kpap@grnet.gr>
Tue, 4 Feb 2014 10:46:50 +0000 (12:46 +0200)
cloudcms/static/cloudcms/js/common.js

index ec562b1..5eedd03 100644 (file)
-function isIpadIphone(){\r
-  var flag = false;\r
-    var isiPhone = navigator.userAgent.toLowerCase().indexOf("iphone");\r
-    var isiPad = navigator.userAgent.toLowerCase().indexOf("ipad");\r
-    if(isiPhone > -1) { flag = true; }\r
-    if(isiPad > -1) { flag = true; }\r
-    return flag;\r
-}\r
-\r
-function setContainerMinHeight( applicableDiv){\r
-       \r
-    if ( $(applicableDiv).length > 0 ) {\r
-        //var h = $('.header').height(); div.header is not found \r
-        var f = $('.footer').height();\r
-        var w = $(window).height();\r
-        var pTop = parseInt (($(applicableDiv).css('padding-top').replace("px", "")) );\r
-        var pBottom = parseInt (($(applicableDiv).css('padding-bottom').replace("px", "")));\r
-\r
-        var c = w - ( f+pTop+pBottom+36);//36 is header's height.\r
-        $(applicableDiv).css('min-height', c);\r
-    }    \r
-\r
-}\r
-\r
-function tableFixedCols(table, firstColWidth ){\r
-       ColsNum = $('table th').size();\r
-       var ColWidth = parseFloat( (100 - firstColWidth)/ColsNum ).toFixed(0);\r
-       var ColWidthPercentage = ColWidth+'%';\r
-       var firstColWidthPercentage = firstColWidth+'%';\r
-       $('.projects table th, .projects  table td').attr('width',ColWidthPercentage ); \r
-       $('.projects table tr td:first-child,.projects  table tr th:first-child').attr('width',firstColWidthPercentage );\r
-       \r
-}\r
-\r
-function addClassHover(hoverEl, applicableEl){ \r
-       $(hoverEl).hover(\r
-      function () {\r
-        \r
-         $(applicableEl).addClass('red-border')\r
-      }, \r
-      function () {\r
-       $(applicableEl).removeClass('red-border');\r
-    \r
-    });\r
-}\r
-//equal heights\r
\r
-(function($) {\r
-       $.fn.equalHeights = function(minHeight, maxHeight) {\r
-               tallest = (minHeight) ? minHeight : 0;\r
-               this.each(function() {\r
-                       if($(this).height() > tallest) {\r
-                               tallest = $(this).height();\r
-                       }\r
-               });\r
-               if((maxHeight) && tallest > maxHeight) tallest = maxHeight;\r
-               return this.each(function() {\r
-                       $(this).height(tallest);\r
-               });\r
-       }\r
-})(jQuery);\r
-\r
-\r
-\r
-// fix for iPhone - iPad orientation bug \r
-var metas = document.getElementsByTagName('meta');\r
-function resetViewport() {\r
-    var i;\r
-    if (navigator.userAgent.match(/iPhone/i)) {\r
-               for (i=0; i<metas.length; i++) {\r
-               if (metas[i].name == "viewport") {\r
-                       metas[i].content = "width=device-width, minimum-scale=1.0, maximum-scale=1.0";\r
-               }\r
-               }\r
-       }\r
-}\r
-resetViewport();\r
-    \r
-window.onorientationchange = function() {\r
-    resetViewport();\r
-};\r
-    \r
-function gestureStart() {\r
-  for (i=0; i<metas.length; i++) {\r
-    if (metas[i].name == "viewport") {\r
-      metas[i].content = "width=device-width, minimum-scale=0.25, maximum-scale=1.6";\r
-    }\r
-  }\r
-}\r
-\r
-if (navigator.userAgent.match(/iPhone/i)) {\r
-       document.addEventListener("gesturestart", gestureStart, false);\r
-}\r
-//end of fix\r
-\r
-  \r
-$(document).ready(function() {\r
-   \r
-\r
-\r
-    setContainerMinHeight('.container .wrapper');\r
-    tableFixedCols('my-projects', 25);\r
-       \r
-    $('.show-extra').click(function(e) {\r
-        e.preventDefault();\r
-        $(this).parents('.bg-wrap').find('.extra').slideToggle(600);\r
-    });\r
-    $('.hide-extra').click(function(e) {\r
-        e.preventDefault();\r
-        $(this).parents('.bg-wrap').find('.extra').slideUp(600);\r
-    });\r
-    \r
-    $('.box-more p').click(function(e) {\r
-        $(this).siblings('.clearfix').toggle('slow');\r
-        $(this).parents('.box-more').toggleClass('border');\r
-    });\r
-       \r
-       var fixTopMessageHeight = function() {\r
-               var topMargin = parseInt($('.mainlogo img').height())+parseInt($('.top-msg').css('marginBottom'));\r
-               $('.mainlogo').css('marginTop','-'+topMargin+'px');\r
-       }\r
-       \r
-  // Uncomment to hide logo upon top message appearance\r
-\r
-       // if ($('.mainlogo img').length > 0) {\r
-       //      $('.mainlogo img').bind('load', fixTopMessageHeight)\r
-       // } else {\r
-       //      fixTopMessageHeight();\r
-       // }\r
-       \r
-       $('.top-msg a.close').click(function(e) {\r
-               e.preventDefault();\r
-        $('.top-msg').animate({\r
-            paddingTop:'0',\r
-            paddingBottom:'0',\r
-            height:'0'\r
-        }, 1000, function (){\r
-             $('.top-msg').removeClass('active')\r
-        });\r
-        $('.mainlogo').animate({\r
-            marginTop:'0'\r
-        }, 1000, function (){\r
-             //todo\r
-        });\r
-    });        \r
-    \r
-     \r
-       $('select.dropkicked').dropkick({\r
-               change: function (value, label) {\r
-                   $(this).parents('form').submit();\r
-                   \r
-               }\r
-       });\r
-       \r
-       $('.with-info select').attr('tabindex','1');\r
-    $('.with-info select').dropkick();\r
-    \r
-    $('.top-msg .success').parents('.top-msg').addClass('success');\r
-    $('.top-msg .error').parents('.top-msg').addClass('error');\r
-    $('.top-msg .warning').parents('.top-msg').addClass('warning');\r
-    $('.top-msg .info').parents('.top-msg').addClass('info');\r
-    \r
-    // clouds homepage animation\r
-    $('#animation a').hover(\r
-      function () {\r
-       \r
-        $(this).animate({\r
-           top: '+=-5'   \r
-           }, 300, function() {\r
-               if ($(this).find('img').attr('src').indexOf("_top") == -1) {\r
-                       var src = $(this).find('img').attr('src').replace('.png', '_top.png')\r
-                       $(this).find('img').attr("src", src);\r
-               }\r
-\r
-               });\r
-        $(this).siblings('p').find('img').animate({\r
-          width: '60%'       \r
-        }, 300);\r
-      }, \r
-      function () {\r
-\r
-        $(this).animate({top: '0'}, 300, function() {\r
-               var src = $(this).find('img').attr('src').replace('_top.png', '.png')\r
-                       $(this).find('img').attr("src", src);\r
-               });\r
-        $(this).siblings('p').find('img').animate({\r
-          width: '65%'       \r
-        },300);\r
-      }\r
-    );\r
-    \r
-    \r
-    \r
-    \r
-    $(function() {              \r
-               $( "#id_start_date" ).datepicker({\r
-                       minDate: 0,\r
-                       defaultDate: "+0", \r
-            dateFormat: "yy-mm-dd",\r
-            onSelect: function( selectedDate ) {\r
-                $( "#id_end_date" ).datepicker( "option", "minDate", selectedDate );\r
-            }\r
-        });\r
-        \r
-        $( "#id_end_date" ).datepicker({\r
-               defaultDate: "+3w", \r
-            dateFormat: "yy-mm-dd",\r
-            onSelect: function( selectedDate ) {\r
-                $( "#id_start_date" ).datepicker( "option", "maxDate", selectedDate );\r
-            }\r
-        });\r
-       });\r
-       \r
-        \r
-       \r
-       $('table .more-info').click(function(e){\r
-               e.preventDefault();\r
-               $(this).toggleClass('open');\r
-               if ($(this).hasClass('open')){\r
-                       $(this).html('- less info ')\r
-               } else {\r
-                       $(this).html('+ more info ')\r
-               }\r
-               $(this).parents('tr').next('tr').toggle();\r
-                \r
-       });\r
-       \r
-       $('.projects .details .edit').click( function(e){\r
-               e.preventDefault();\r
-               $(this).parents('.details').children('.data').hide();\r
-               $(this).parents('.details').children('.editable').slideDown(500, 'linear');\r
-               $(this).hide();\r
-       });\r
-       \r
-       $('.editable .form-row').each(function() {\r
-                       if ( $(this).hasClass('with-errors') ){\r
-                               $('.editable').show();\r
-                               $('.projects .details a.edit, .projects .details .data').hide();\r
-                               \r
-                       }\r
-               });\r
-       \r
\r
-       $("input.leave, input.join").click(function () {\r
-               $('dialog').hide();\r
-               $(this).parents('.msg-wrap').find('.dialog').show();\r
-               return false;      \r
-               \r
-    });\r
-    \r
-     $('.msg-wrap .no').click( function(e){\r
-               e.preventDefault();\r
-               $(this).parents('.dialog').hide();\r
-       })\r
-    \r
-    $('.msg-wrap .yes').click( function(e){\r
-               e.preventDefault();\r
-               $(this).parents('.dialog').siblings('form').submit();\r
-       })\r
-    \r
-    $('.hidden-submit input[readonly!="True"]').focus(function () {\r
-         $('.hidden-submit .form-row.submit').slideDown(500);\r
-    });\r
-    \r
-    \r
-    \r
-   \r
-      \r
-    \r
-    setTimeout(function() {\r
-      if ($('input#id_username').val()){ \r
-       $('input#id_username').siblings('label').css('opacity','0');\r
-      };\r
-      if ($('input#id_password').val()){ \r
-       $('input#id_password').siblings('label').css('opacity','0');\r
-      }\r
-       }, 100);\r
-       \r
-       \r
-       \r
-       \r
-       $('.landing-page .cms').hover(\r
-      function () {\r
-        el = $('.cloudbar ul.services li').first();\r
-        var offset = el.offset();\r
-        positionX = offset.left;\r
-        $('#hand').css('left',positionX);               \r
-         $('#hand').show();\r
-      }, \r
-      function () {\r
-       $('#hand').hide();\r
-    \r
-    });  \r
-    \r
-    $('.landing-page .pithos').hover(\r
-      function () {\r
-        el = $('.cloudbar ul.services li:nth-child(3)');\r
-        var offset = el.offset();\r
-        positionX = offset.left;\r
-        left = parseInt(positionX) +20;\r
-        $('#hand').css('left',left+'px');               \r
-         $('#hand').show();\r
-      }, \r
-      function () {\r
-       $('#hand').hide();\r
-    \r
-    });  \r
-    \r
-    $('.landing-page .cyclades').hover(\r
-      function () {\r
-        el = $('.cloudbar ul.services li:nth-child(2)').first();\r
-        var offset = el.offset();\r
-        positionX = offset.left;\r
-        left = parseInt(positionX) +20;\r
-        $('#hand').css('left',left+'px');               \r
-         $('#hand').show();\r
-      }, \r
-      function () {\r
-       $('#hand').hide();\r
-    \r
-    });  \r
-    \r
-    \r
-    $('.landing-page .dashboard').hover(\r
-      function () {\r
-        el = $('.cloudbar .profile');\r
-        var offset = el.offset();\r
-        positionX = offset.left +50;\r
-        $('#hand').css('left',positionX);               \r
-         $('#hand').show();\r
-      }, \r
-      function () {\r
-       $('#hand').hide();\r
-    \r
-    });  \r
-    \r
-    $('.pagination a.disabled').click(function(e){\r
-       e.preventDefault();\r
-    });\r
-         \r
-       // fix for recaptcha fields\r
-       $('#okeanos_recaptcha').parents('.form-row').find('.extra-img').hide();\r
-\r
-  fixEl = $('.details .lt');\r
-  if (fixEl.length){ window.fixEloffsetTop = fixEl.offset().top;} \r
-  \r
-\r
-  $(".stats-block li em").equalHeights();\r
-\r
\r
-});\r
-       \r
-$(window).resize(function() {\r
-    \r
-   setContainerMinHeight('.container .wrapper'); \r
-   $(".stats-block li em").equalHeights();\r
-    \r
-\r
-});\r
-\r
-\r
-/* js for fixed faq/userguide side nav */\r
-$(window).scroll(function () {\r
-\r
-  if ( $('.details .lt').height() < $('.details .rt').height() ) {\r
-    if ($(window).scrollTop() > window.fixEloffsetTop){ \r
-      fixEl.addClass('fixed');\r
-    } else {\r
-      fixEl.removeClass('fixed');\r
-    }\r
-  }\r
-\r
-\r
-\r
-});\r
+function isIpadIphone(){
+  var flag = false;
+    var isiPhone = navigator.userAgent.toLowerCase().indexOf("iphone");
+    var isiPad = navigator.userAgent.toLowerCase().indexOf("ipad");
+    if(isiPhone > -1) { flag = true; }
+    if(isiPad > -1) { flag = true; }
+    return flag;
+}
+
+function setContainerMinHeight( applicableDiv){
+
+  if ( $(applicableDiv).length > 0 ) {
+    //var h = $('.header').height(); div.header is not found
+    var f = $('.footer').height();
+    var w = $(window).height();
+    var pTop = parseInt (($(applicableDiv).css('padding-top').replace("px", "")) );
+    var pBottom = parseInt (($(applicableDiv).css('padding-bottom').replace("px", "")));
+    var c = w - ( f+pTop+pBottom+36);//36 is header's height.
+    $(applicableDiv).css('min-height', c);
+  }
+}
+
+function tableFixedCols(table, firstColWidth ){
+       ColsNum = $('table th').size();
+       var ColWidth = parseFloat( (100 - firstColWidth)/ColsNum ).toFixed(0);
+       var ColWidthPercentage = ColWidth+'%';
+       var firstColWidthPercentage = firstColWidth+'%';
+       $('.projects table th, .projects  table td').attr('width',ColWidthPercentage );
+       $('.projects table tr td:first-child,.projects  table tr th:first-child').attr('width',firstColWidthPercentage );
+}
+
+function addClassHover(hoverEl, applicableEl){
+       $(hoverEl).hover(
+      function () {
+        $(applicableEl).addClass('red-border')
+      },
+      function () {
+        $(applicableEl).removeClass('red-border');
+    });
+}
+
+//equal heights
+(function($) {
+       $.fn.equalHeights = function(minHeight, maxHeight) {
+               tallest = (minHeight) ? minHeight : 0;
+               this.each(function() {
+                       if($(this).height() > tallest) {
+                               tallest = $(this).height();
+                       }
+               });
+               if((maxHeight) && tallest > maxHeight) tallest = maxHeight;
+               return this.each(function() {
+                       $(this).height(tallest);
+               });
+       }
+})(jQuery);
+
+
+
+// fix for iPhone - iPad orientation bug
+var metas = document.getElementsByTagName('meta');
+function resetViewport() {
+  var i;
+  if (navigator.userAgent.match(/iPhone/i)) {
+    for (i=0; i<metas.length; i++) {
+      if (metas[i].name == "viewport") {
+        metas[i].content = "width=device-width, minimum-scale=1.0, maximum-scale=1.0";
+      }
+    }
+  }
+}
+resetViewport();
+
+window.onorientationchange = function() {
+    resetViewport();
+};
+
+function gestureStart() {
+  for (i=0; i<metas.length; i++) {
+    if (metas[i].name == "viewport") {
+      metas[i].content = "width=device-width, minimum-scale=0.25, maximum-scale=1.6";
+    }
+  }
+}
+
+if (navigator.userAgent.match(/iPhone/i)) {
+       document.addEventListener("gesturestart", gestureStart, false);
+}
+//end of fix
+
+function setFixedLtBar(){
+  var diff = ( $(window).height() - $('.footer').outerHeight() ) - $('.details .lt').height();
+  if ( $('.details .lt').height() < $('.details .rt').height() ) {
+    if ( ($(window).scrollTop() > window.fixEloffsetTop) && diff>0 ) {
+      fixEl.addClass('fixed');
+    } else {
+      fixEl.removeClass('fixed');
+    }
+  }
+  console.log(diff,'diff');
+}
+
+$(document).ready(function() {
+
+
+  setContainerMinHeight('.container .wrapper');
+  tableFixedCols('my-projects', 25);
+
+  $('.show-extra').click(function(e) {
+      e.preventDefault();
+      $(this).parents('.bg-wrap').find('.extra').slideToggle(600);
+  });
+  $('.hide-extra').click(function(e) {
+      e.preventDefault();
+      $(this).parents('.bg-wrap').find('.extra').slideUp(600);
+  });
+
+  $('.box-more p').click(function(e) {
+      $(this).siblings('.clearfix').toggle('slow');
+      $(this).parents('.box-more').toggleClass('border');
+  });
+
+       var fixTopMessageHeight = function() {
+               var topMargin = parseInt($('.mainlogo img').height())+parseInt($('.top-msg').css('marginBottom'));
+               $('.mainlogo').css('marginTop','-'+topMargin+'px');
+       }
+
+  // Uncomment to hide logo upon top message appearance
+
+       // if ($('.mainlogo img').length > 0) {
+       //      $('.mainlogo img').bind('load', fixTopMessageHeight)
+       // } else {
+       //      fixTopMessageHeight();
+       // }
+
+       $('.top-msg a.close').click(function(e) {
+               e.preventDefault();
+        $('.top-msg').animate({
+            paddingTop:'0',
+            paddingBottom:'0',
+            height:'0'
+        }, 1000, function (){
+             $('.top-msg').removeClass('active')
+        });
+        $('.mainlogo').animate({
+            marginTop:'0'
+        }, 1000, function (){
+             //todo
+        });
+    });
+
+       $('select.dropkicked').dropkick({
+               change: function (value, label) {
+                   $(this).parents('form').submit();
+               }
+       });
+
+  $('.with-info select').attr('tabindex','1');
+  $('.with-info select').dropkick();
+  $('.top-msg .success').parents('.top-msg').addClass('success');
+  $('.top-msg .error').parents('.top-msg').addClass('error');
+  $('.top-msg .warning').parents('.top-msg').addClass('warning');
+  $('.top-msg .info').parents('.top-msg').addClass('info');
+
+  // clouds homepage animation
+  $('#animation a').hover(
+    function () {
+      $(this).animate({
+        top: '+=-5'
+      }, 300, function() {
+        if ($(this).find('img').attr('src').indexOf("_top") == -1) {
+          var src = $(this).find('img').attr('src').replace('.png', '_top.png')
+          $(this).find('img').attr("src", src);
+        }
+      });
+      $(this).siblings('p').find('img').animate({
+        width: '60%'
+      }, 300);
+    },
+    function () {
+      $(this).animate({top: '0'}, 300, function() {
+        var src = $(this).find('img').attr('src').replace('_top.png', '.png')
+        $(this).find('img').attr("src", src);
+      });
+      $(this).siblings('p').find('img').animate({
+        width: '65%'
+      },300);
+    }
+  );
+
+  $(function() {
+    $( "#id_start_date" ).datepicker({
+      minDate: 0,
+      defaultDate: "+0",
+      dateFormat: "yy-mm-dd",
+      onSelect: function( selectedDate ) {
+        $( "#id_end_date" ).datepicker( "option", "minDate", selectedDate );
+      }
+    });
+    $( "#id_end_date" ).datepicker({
+      defaultDate: "+3w",
+      dateFormat: "yy-mm-dd",
+      onSelect: function( selectedDate ) {
+        $( "#id_start_date" ).datepicker( "option", "maxDate", selectedDate );
+      }
+    });
+  });
+
+       $('table .more-info').click(function(e){
+               e.preventDefault();
+               $(this).toggleClass('open');
+               if ($(this).hasClass('open')){
+                       $(this).html('- less info ')
+               } else {
+                       $(this).html('+ more info ')
+               }
+               $(this).parents('tr').next('tr').toggle();
+       });
+
+       $('.projects .details .edit').click( function(e){
+               e.preventDefault();
+               $(this).parents('.details').children('.data').hide();
+               $(this).parents('.details').children('.editable').slideDown(500, 'linear');
+               $(this).hide();
+       });
+
+       $('.editable .form-row').each(function() {
+               if ( $(this).hasClass('with-errors') ){
+                       $('.editable').show();
+                       $('.projects .details a.edit, .projects .details .data').hide();
+               }
+       });
+
+       $("input.leave, input.join").click(function () {
+               $('dialog').hide();
+               $(this).parents('.msg-wrap').find('.dialog').show();
+               return false;
+  });
+
+  $('.msg-wrap .no').click( function(e){
+    e.preventDefault();
+    $(this).parents('.dialog').hide();
+  });
+
+  $('.msg-wrap .yes').click( function(e){
+    e.preventDefault();
+    $(this).parents('.dialog').siblings('form').submit();
+       });
+
+  $('.hidden-submit input[readonly!="True"]').focus(function () {
+    $('.hidden-submit .form-row.submit').slideDown(500);
+  });
+
+  setTimeout(function() {
+    if ($('input#id_username').val()){
+      $('input#id_username').siblings('label').css('opacity','0');
+    };
+    if ($('input#id_password').val()){
+      $('input#id_password').siblings('label').css('opacity','0');
+    }
+  }, 100);
+
+       $('.landing-page .cms').hover(
+    function () {
+      el = $('.cloudbar ul.services li').first();
+      var offset = el.offset();
+      positionX = offset.left;
+      $('#hand').css('left',positionX);
+      $('#hand').show();
+    },
+    function () {
+      $('#hand').hide();
+    }
+  );
+
+  $('.landing-page .pithos').hover(
+    function () {
+      el = $('.cloudbar ul.services li:nth-child(3)');
+      var offset = el.offset();
+      positionX = offset.left;
+      left = parseInt(positionX) +20;
+      $('#hand').css('left',left+'px');
+      $('#hand').show();
+    }, 
+    function () {
+      $('#hand').hide();
+    }
+  );
+
+  $('.landing-page .cyclades').hover(
+    function () {
+      el = $('.cloudbar ul.services li:nth-child(2)').first();
+      var offset = el.offset();
+      positionX = offset.left;
+      left = parseInt(positionX) +20;
+      $('#hand').css('left',left+'px');
+      $('#hand').show();
+    },
+    function () {
+      $('#hand').hide();
+    }
+  );
+  $('.landing-page .dashboard').hover(
+    function () {
+      el = $('.cloudbar .profile');
+      var offset = el.offset();
+      positionX = offset.left +50;
+      $('#hand').css('left',positionX);
+      $('#hand').show();
+    },
+    function () {
+      $('#hand').hide();
+    }
+  );
+  $('.pagination a.disabled').click(function(e){
+    e.preventDefault();
+  });
+
+       // fix for recaptcha fields
+       $('#okeanos_recaptcha').parents('.form-row').find('.extra-img').hide();
+
+  fixEl = $('.details .lt');
+  if (fixEl.length){ window.fixEloffsetTop = fixEl.offset().top;}
+
+  $(".stats-block li em").equalHeights();
+
+});
+
+$(window).resize(function() {
+  setContainerMinHeight('.container .wrapper');
+  $(".stats-block li em").equalHeights();
+});
+
+/* js for fixed faq/userguide side nav */
+$(window).scroll(function () {
+  setFixedLtBar();
+});
\ No newline at end of file