# HG changeset patch # User Madhusudan.C.S # Date 1295555998 -19800 # Node ID a05fde6309e1f27258f88b1303aa04971a098afe # Parent 3b78ea899168a954be2bd4c4c7b9f613e8181854 Add support for sticky bar top bar. diff -r 3b78ea899168 -r a05fde6309e1 pytask/static/css/base.css --- a/pytask/static/css/base.css Fri Jan 21 00:27:33 2011 +0530 +++ b/pytask/static/css/base.css Fri Jan 21 02:09:58 2011 +0530 @@ -16,7 +16,7 @@ } #header { - margin-bottom: 30px; + margin-bottom: 30px; padding: 5px 0px 5px 0px; height: auto; width: auto; @@ -304,3 +304,17 @@ font-weight: bold; text-decoration: none; } + +/* Uberbar is the sticky bar at the top of the page */ +/* Code taken from http://davidwalsh.name/persistent-header-opacity#bottom */ +#uberbar { + border-bottom:1px solid #eb7429; + background:#fc9453; + padding:10px 20px 0px 10px; + position:fixed; + top:0; + left:0; + z-index:2000; + width:98%; + text-align: center; +} diff -r 3b78ea899168 -r a05fde6309e1 pytask/static/js/uberbar.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/pytask/static/js/uberbar.js Fri Jan 21 02:09:58 2011 +0530 @@ -0,0 +1,40 @@ +/* Original code from http://davidwalsh.name/persistent-header-opacity#bottom */ +var create_uberbar = function () { +$(document).ready(function() { + $("#header").css("position", "relative"); + $("#header").css("top", "40px"); + $("#header").css("margin-bottom", "70px"); + + //settings + var fadeSpeed = 200; + var fadeTo = 0.5; + var topDistance = 30; + + var topbarME = function() { + $('#uberbar').fadeTo(fadeSpeed,1); + }; + + var topbarML = function() { + $('#uberbar').fadeTo(fadeSpeed,fadeTo); + }; + + var inside = false; + //do + $(window).scroll(function() { + position = $(window).scrollTop(); + if(position > topDistance && !inside) { + //add events + topbarML(); + $('#uberbar').bind('mouseenter',topbarME); + $('#uberbar').bind('mouseleave',topbarML); + inside = true; + } + else if (position < topDistance){ + topbarME(); + $('#uberbar').unbind('mouseenter',topbarME); + $('#uberbar').unbind('mouseleave',topbarML); + inside = false; + } + }); + }); +} diff -r 3b78ea899168 -r a05fde6309e1 pytask/templates/base.html --- a/pytask/templates/base.html Fri Jan 21 00:27:33 2011 +0530 +++ b/pytask/templates/base.html Fri Jan 21 02:09:58 2011 +0530 @@ -1,3 +1,5 @@ +{% load browse_helpers %} + @@ -48,6 +50,13 @@ layout trick in CSS. --> <div id="container1"> <div id="container2"> + + <!-- Generate Uberbar if the uberbar_message is present --> + {% if uberbar_message %} + {% as_uberbar uberbar_message %} + {% endif %} + + <div id="left"> {% include '_left_sidebar.html' %} diff -r 3b78ea899168 -r a05fde6309e1 pytask/templates/templatetags/_as_uberbar.html --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/pytask/templates/templatetags/_as_uberbar.html Fri Jan 21 02:09:58 2011 +0530 @@ -0,0 +1,9 @@ +<script type="text/javascript" + src="/pytask/static/js/uberbar.js"> +</script> +<script type="text/javascript"> + create_uberbar(); +</script> +<div id="uberbar"> + {{ message }} +</div> \ No newline at end of file diff -r 3b78ea899168 -r a05fde6309e1 pytask/templatetags/browse_helpers.py --- a/pytask/templatetags/browse_helpers.py Fri Jan 21 00:27:33 2011 +0530 +++ b/pytask/templatetags/browse_helpers.py Fri Jan 21 02:09:58 2011 +0530 @@ -36,3 +36,14 @@ 'user': user, 'modification_datetime': creation_datatime, } + + +@register.inclusion_tag('templatetags/_as_uberbar.html') +def as_uberbar(message): + """Returns a context dictionary containing the fields necessary + to render the uberbar. + """ + + return { + 'message': message, + }