Add the jquery-purr plugin
Patch by: "Mario Ferraro" <fadinlight@gmail.com>
Reviewed by: to-be-reviewed
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/app/jquery/jquery-purr.js Sat Mar 07 14:49:03 2009 +0000
@@ -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/soc/content/css/soc-090120.css Sat Mar 07 00:33:39 2009 +0000
+++ b/app/soc/content/css/soc-090120.css Sat Mar 07 14:49:03 2009 +0000
@@ -186,6 +186,11 @@
width: 200px;
}
+td.formfieldvalue input:focus {
+ background-color: #FFFF99;
+ font-weight: bold;
+}
+
td.formfieldvalue textarea {
width: 100%;
}
@@ -237,6 +242,45 @@
padding: 3px;
}
+/* TOOLTIPS */
+
+#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;
+}
+
+
#logo {
padding-right: 18px;
position: absolute;
Binary file app/soc/content/images/purrBottom.png has changed
Binary file app/soc/content/images/purrInfo.png has changed
Binary file app/soc/content/images/purrTop.png has changed
--- a/app/soc/templates/soc/base.html Sat Mar 07 00:33:39 2009 +0000
+++ b/app/soc/templates/soc/base.html Sat Mar 07 14:49:03 2009 +0000
@@ -47,6 +47,9 @@
{% if uses_menu %}
<script type='text/javascript' src="/soc/content/js/menu-081108.js"></script>
{% endif %}
+ {% if uses_jq_purr %}
+ <script type='text/javascript' src="/jquery/jquery-purr.js"></script>
+ {% endif %}
{% if uses_jq_bt %}
<script type='text/javascript' src="/soc/content/js/tips-081027.js"></script>
{% endif %}
@@ -207,6 +210,10 @@
<div id="body">
+ {% if uses_jq_purr %}
+ <div id="purr-container"></div>
+ {% endif %}
+
<div style="line-height: 140%;">
{% block body %}
{% if body_content %}
--- a/app/soc/views/helper/params.py Sat Mar 07 00:33:39 2009 +0000
+++ b/app/soc/views/helper/params.py Sat Mar 07 14:49:03 2009 +0000
@@ -55,6 +55,7 @@
'jq_autocomplete',
'jq_bgiframe',
'jq_bt',
+ 'jq_purr',
'jq_datetimepicker',
'jq_progressbar',
'jq_thickbox',
@@ -235,7 +236,7 @@
new_params['js_uses_list'] = ['jq', 'menu']
new_params['js_uses_show'] = ['jq', 'menu']
new_params['js_uses_edit'] = ['jq', 'menu', 'tinymce', 'jq_bt',
- 'jq_autocomplete']
+ 'jq_purr','jq_autocomplete']
new_params['error_public'] = 'soc/%(module_name)s/error.html' % params
new_params['error_export'] = new_params['error_public']