Add jqeury purr plugin for help text.
--- a/app/projrev/models.py Sun Aug 09 22:52:45 2009 +0530
+++ b/app/projrev/models.py Sun Aug 09 23:24:48 2009 +0530
@@ -678,6 +678,7 @@
# Field containing the Line Item to which the project belongs to.
line_item = models.CharField(max_length=256,
choices=sort_dict(LINE_ITEM_CHOICES))
+ line_item.help_text = "Select from one of the Line Items."
# Field containing the name of the institution working on the
# project.
--- a/app/projrev/views/proposal.py Sun Aug 09 22:52:45 2009 +0530
+++ b/app/projrev/views/proposal.py Sun Aug 09 23:24:48 2009 +0530
@@ -8,6 +8,7 @@
]
+import json
import os
import time
@@ -366,23 +367,26 @@
def getDistrictsForState(request):
"""View function that sends the districts for the given state code via AJAXy.
"""
- import json
+
get_params = request.GET
- st_code = get_params['_value']
- dt_dict = Project.DISTRICT_CHOICES
+ if get_params:
+ st_code = get_params['_value']
+ dt_dict = Project.DISTRICT_CHOICES
- # Get the Districts corresponding to the given State code.
- dt_names = {}
- count = 1
- for dt_code in dt_dict:
- if dt_code[:2] == st_code:
- dt_names[dt_code] = dt_dict[dt_code]
- count += 1
+ # Get the Districts corresponding to the given State code.
+ dt_names = {}
+ count = 1
+ for dt_code in dt_dict:
+ if dt_code[:2] == st_code:
+ dt_names[dt_code] = dt_dict[dt_code]
+ count += 1
- # Sort the List based on District Name.
- dt_send = [{'': "---------" }]
- dt_names_sorted = sorted(dt_names.items(), key=lambda (k,v): (v,k))
- for dt_code, dt_name in dt_names_sorted:
- dt_send.append({dt_code: dt_name})
-
- return HttpResponse(json.dumps(dt_send))
\ No newline at end of file
+ # Sort the List based on District Name.
+ dt_send = [{'': "---------" }]
+ dt_names_sorted = sorted(dt_names.items(), key=lambda (k,v): (v,k))
+ for dt_code, dt_name in dt_names_sorted:
+ dt_send.append({dt_code: dt_name})
+
+ return HttpResponse(json.dumps(dt_send))
+
+ return HttpResponse(None)
\ No newline at end of file
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/app/site-content/css/jquery-purr.css Sun Aug 09 23:24:48 2009 +0530
@@ -0,0 +1,52 @@
+/* jquery purr */
+
+#purr-container {
+ position:fixed;
+ bottom:0;
+ right:0;
+}
+
+.tooltip {
+ position: relative;
+ width: 300px;
+}
+
+.tooltip .close {
+ position: absolute;
+ top: 12px;
+ right: 12px;
+ display: block;
+ width: 18px;
+ height: 17px;
+ text-indent: -9999px;
+ background: url('/soc/content/images/purrClose.png') no-repeat 0 10px;
+}
+
+.tooltip-body {
+ min-height: 50px;
+ padding: 22px 22px 0 22px;
+ background: url('/soc/content/images/purrTop.png') no-repeat left top;
+ color: #f9f9f9;
+}
+
+.tooltip-body img {
+ width: 50px;
+ margin: 0 10px 0 0;
+ float: left;
+}
+
+.tooltip-body h3 {
+ margin: 0;
+ font-size: 1.1em;
+}
+
+.tooltip-body p {
+ margin: 5px 0 0 60px;
+ font-size: 0.8em;
+ line-height: 1.4em;
+}
+
+.tooltip-bottom {
+ height: 22px;
+ background: url('/soc/content/images/purrBottom.png') no-repeat left top;
+}
\ No newline at end of file
Binary file app/site-content/images/info.png has changed
Binary file app/site-content/images/purrBottom.png has changed
Binary file app/site-content/images/purrClose.png has changed
Binary file app/site-content/images/purrTop.png has changed
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/app/site-content/js/jquery.purr.js Sun Aug 09 23:24:48 2009 +0530
@@ -0,0 +1,180 @@
+/**
+ * jquery.purr.js
+ * Copyright (c) 2008 Net Perspective (net-perspective.com)
+ * Licensed under the MIT License (http://www.opensource.org/licenses/mit-license.php)
+ *
+ * @author R.A. Ray
+ * @projectDescription jQuery plugin for dynamically displaying unobtrusive messages in the browser. Mimics the behavior of the MacOS program "Growl."
+ * @version 0.1.0
+ *
+ * @requires jquery.js (tested with 1.2.6)
+ *
+ * @param fadeInSpeed int - Duration of fade in animation in miliseconds
+ * default: 500
+ * @param fadeOutSpeed int - Duration of fade out animationin miliseconds
+ default: 500
+ * @param removeTimer int - Timeout, in miliseconds, before notice is removed once it is the top non-sticky notice in the list
+ default: 4000
+ * @param isSticky bool - Whether the notice should fade out on its own or wait to be manually closed
+ default: false
+ * @param usingTransparentPNG bool - Whether or not the notice is using transparent .png images in its styling
+ default: false
+ */
+
+( function( $ ) {
+
+ $.purr = function ( notice, options )
+ {
+ // Convert notice to a jQuery object
+ notice = $( notice );
+
+ // Add a class to denote the notice as not sticky
+ if ( !options.isSticky )
+ {
+ notice.addClass( 'not-sticky' );
+ };
+
+ // Get the container element from the page
+ var cont = document.getElementById( 'purr-container' );
+
+ // If the container doesn't yet exist, we need to create it
+ if ( !cont )
+ {
+ cont = '<div id="purr-container"></div>';
+ }
+
+ // Convert cont to a jQuery object
+ cont = $( cont );
+
+ // Add the container to the page
+ $( 'body' ).append( cont );
+
+ notify();
+
+ function notify ()
+ {
+ // Set up the close button
+ var close = document.createElement( 'a' );
+ $( close ).attr(
+ {
+ className: 'close',
+ href: '#close',
+ innerHTML: 'Close'
+ }
+ )
+ .appendTo( notice )
+ .click( function ()
+ {
+ removeNotice();
+
+ return false;
+ }
+ );
+
+ // Add the notice to the page and keep it hidden initially
+ notice.appendTo( cont )
+ .hide();
+
+ if ( jQuery.browser.msie && options.usingTransparentPNG )
+ {
+ // IE7 and earlier can't handle the combination of opacity and transparent pngs, so if we're using transparent pngs in our
+ // notice style, we'll just skip the fading in.
+ notice.show();
+ }
+ else
+ {
+ //Fade in the notice we just added
+ notice.fadeIn( options.fadeInSpeed );
+ }
+
+ // Set up the removal interval for the added notice if that notice is not a sticky
+ if ( !options.isSticky )
+ {
+ var topSpotInt = setInterval( function ()
+ {
+ // Check to see if our notice is the first non-sticky notice in the list
+ if ( notice.prevAll( '.not-sticky' ).length == 0 )
+ {
+ // Stop checking once the condition is met
+ clearInterval( topSpotInt );
+
+ // Call the close action after the timeout set in options
+ setTimeout( function ()
+ {
+ removeNotice();
+ }, options.removeTimer
+ );
+ }
+ }, 200 );
+ }
+ }
+
+ function removeNotice ()
+ {
+ // IE7 and earlier can't handle the combination of opacity and transparent pngs, so if we're using transparent pngs in our
+ // notice style, we'll just skip the fading out.
+ if ( jQuery.browser.msie && options.usingTransparentPNG )
+ {
+ notice.css( { opacity: 0 } )
+ .animate(
+ {
+ height: '0px'
+ },
+ {
+ duration: options.fadeOutSpeed,
+ complete: function ()
+ {
+ notice.remove();
+ }
+ }
+ );
+ }
+ else
+ {
+ // Fade the object out before reducing its height to produce the sliding effect
+ notice.animate(
+ {
+ opacity: '0'
+ },
+ {
+ duration: options.fadeOutSpeed,
+ complete: function ()
+ {
+ notice.animate(
+ {
+ height: '0px'
+ },
+ {
+ duration: options.fadeOutSpeed,
+ complete: function ()
+ {
+ notice.remove();
+ }
+ }
+ );
+ }
+ }
+ );
+ }
+ };
+ };
+
+ $.fn.purr = function ( options )
+ {
+ options = options || {};
+ options.fadeInSpeed = options.fadeInSpeed || 500;
+ options.fadeOutSpeed = options.fadeOutSpeed || 500;
+ options.removeTimer = options.removeTimer || 4000;
+ options.isSticky = options.isSticky || false;
+ options.usingTransparentPNG = options.usingTransparentPNG || false;
+
+ this.each( function()
+ {
+ new $.purr( this, options );
+ }
+ );
+
+ return this;
+ };
+})( jQuery );
+
--- a/app/templates/projrev/base.html Sun Aug 09 22:52:45 2009 +0530
+++ b/app/templates/projrev/base.html Sun Aug 09 23:24:48 2009 +0530
@@ -12,6 +12,7 @@
{% block stylesheets %}
<link rel="stylesheet" href="/site-content/css/projrev.css" type="text/css"/>
<link type="text/css" rel="stylesheet" href="/site-content/css/colorbox.css" />
+<link type="text/css" rel="stylesheet" href="/site-content/css/jquery-purr.css" />
{% endblock stylesheets %}
{% block scripts %}
@@ -20,6 +21,8 @@
</script>
<script type="text/javascript" src="/site-content/js/jquery.colorbox-min.js">
</script>
+ <script language="JavaScript" type="text/javascript" src="/site-content/js/jquery.purr.js">
+ </script>
{% endblock scripts %}
<title>National Mission on Education through ICT</title>
--- a/app/templates/projrev/proposal/submit.html Sun Aug 09 22:52:45 2009 +0530
+++ b/app/templates/projrev/proposal/submit.html Sun Aug 09 23:24:48 2009 +0530
@@ -3,10 +3,15 @@
{{ block.super }}
<script language="JavaScript" type="text/javascript" src="/site-content/js/jquery.chainedSelects.js"></script>
<script language="JavaScript" type="text/javascript">
-$(function()
-{
- $('#id_state').chainSelect('#id_district','/proposal/submit/get_dfors');
-});
+ $(function()
+ {
+ $('#id_state').chainSelect('#id_district','/proposal/submit/get_dfors');
+ });
+ $(document).ready(function() {
+ $.get('/proposal/submit/get_dfors', function() {
+ $('#id_district').html('<option value="">---------</option>');
+ });
+ });
</script>
{% endblock scripts %}
{% block content %}
@@ -27,8 +32,57 @@
<p>
{% for field in form %}
<p>
+ {% if field.help_text %}
+ <script type="text/javascript">
+ $(document).ready( function() {
+ var tooltip = [
+ "<div class='tooltip'>",
+ " <div class='tooltip-body'>",
+ " <img src='/site-content/images/purrInfo.png' alt='' />",
+ " <h3>Info</h3>",
+ " <p>",
+ " {% autoescape off %}",
+ " {{ help_text|linebreaksbr|escapejs }}",
+ " {% endautoescape %}",
+ " </p>",
+ " </div>",
+ " <div class='tooltip-bottom'></div>",
+ "</div>"
+ ].join("");
+ var tooltip_object=null;
+ var documented = $("#{{ field_id }}");
+ var not_fieldset = documented.attr('tagName') !== 'FIELDSET';
+ if (not_fieldset) {
+ documented.focus(function() {
+ if (tooltip_object==null) {
+ tooltip_object = $(tooltip).purr({usingTransparentPNG: true,removeTimer: 10000});
+ }
+ });
+ documented.blur(function() {
+ if (tooltip_object!==null) {
+ tooltip_object.remove();
+ tooltip_object=null;
+ }
+ });
+ }
+ else {
+ documented.find("input").hover(function() {
+ if (tooltip_object==null) {
+ tooltip_object = $(tooltip).purr({usingTransparentPNG: true,removeTimer: 10000});
+ }
+ },
+ function() {
+ if (tooltip_object!==null) {
+ tooltip_object.remove();
+ tooltip_object=null;
+ }
+ });
+ }
+ });
+ </script>
+ {% endif %}
{{ field.errors }}
- {{ field.label_tag }}{% if field.field.required %}<span class="special_class">(*)</span>{% endif %}:{{ field }}
+ {{ field.label_tag }}:{{ field }}{% if field.field.required %}<span class="special_class"> (required)</span>{% endif %}
</p>
{% endfor %}
