Add support for sticky bar top bar.
--- 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;
+}
--- /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;
+ }
+ });
+ });
+}
--- 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 %}
+
<html>
<head>
<title>
@@ -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' %}
--- /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
--- 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,
+ }