diff --git a/www/conservancy/static/css/jquery.ui.multiprogressbar.css b/www/conservancy/static/css/jquery.ui.multiprogressbar.css new file mode 100644 index 0000000000000000000000000000000000000000..1570e48c20e30f59f3baa6c09a6cb64a2f8b2734 --- /dev/null +++ b/www/conservancy/static/css/jquery.ui.multiprogressbar.css @@ -0,0 +1,18 @@ +@CHARSET "UTF-8"; + +/* + * jQuery UI Multi-Progress Bar 1.1.0 + * http://github.com/j-ulrich/jquery-ui-multiprogressbar + * + * Copyright (c) 2012 Jochen Ulrich + * Licensed under the MIT license (MIT-LICENSE.txt). + */ + +.ju-multiprogressbar .ui-progressbar-value { + float: left; +} + +.ju-multiprogressbar .ju-multiprogressbar-valuetext { + margin-top: 0.3em; + text-align: center; +} \ No newline at end of file diff --git a/www/conservancy/static/js/jquery.outerhtml.js b/www/conservancy/static/js/jquery.outerhtml.js new file mode 100644 index 0000000000000000000000000000000000000000..1aed405acd7a3504d6e1b24fecdf67f370d52d17 --- /dev/null +++ b/www/conservancy/static/js/jquery.outerhtml.js @@ -0,0 +1,20 @@ +/* + * jQuery outerHTML + * + * Copyright (c) 2008 Ca-Phun Ung + * Dual licensed under the MIT (MIT-LICENSE.txt) + * and GPL (GPL-LICENSE.txt) licenses. + * + * http://yelotofu.com/labs/jquery/snippets/outerhtml/ + * + * outerHTML is based on the outerHTML work done by Brandon Aaron + * But adds the ability to replace an element. + */ + +(function($) { + $.fn.outerHTML = function(s) { + return (s) + ? this.before(s).remove() + : $('

').append(this.eq(0).clone()).html(); + } +})(jQuery); diff --git a/www/conservancy/static/js/jquery.ui.multiprogressbar.js b/www/conservancy/static/js/jquery.ui.multiprogressbar.js new file mode 100644 index 0000000000000000000000000000000000000000..f675b2ec15a7569378460df93e63bff4ed75bd50 --- /dev/null +++ b/www/conservancy/static/js/jquery.ui.multiprogressbar.js @@ -0,0 +1,188 @@ +/*jslint white: true vars: true browser: true todo: true */ +/*jshint camelcase:true, plusplus:true, forin:true, noarg:true, noempty:true, eqeqeq:true, bitwise:true, strict:true, undef:true, unused:true, curly:true, browser:true, devel:true, maxerr:100, white:false, onevar:false */ +/*global jQuery:true $:true */ + +/* jQuery UI Multi-Progress Bar 1.1.0 + * http://github.com/j-ulrich/jquery-ui-multiprogressbar + * + * Copyright (c) 2012 Jochen Ulrich + * Licensed under the MIT license (MIT-LICENSE.txt). + */ + +/** + * @file jQuery UI Multi-Progress Bar + * @version 1.0 + * @copyright 2012 Jochen Ulrich + * @license MIT (MIT-LICENSE.txt) + */ + +(function($) { + "use strict"; + + /** + * Constructs a multiprogressbar. + * @name multiprogressbar + * @public + * @function + * @memberOf jQuery.ju + */ + $.widget("ju.multiprogressbar", + + /** + * @lends jQuery.ju.multiprogressbar.prototype + */ + { + + // Options + /** + * Default values of the options. + * @since 1.0 + */ + options: { + parts: [{value: 0, barClass: "", text: false, textClass: ""}] + }, + + /** + * Constructor for multiprogressbars. + * @private + * @author julrich + * @since 1.0 + */ + _create: function() { + var self = this; + self.element.progressbar({value: 0, disabled: self.options.disabled}); // Creates one part with width 0% + self.element.addClass("ju-multiprogressbar"); + + // Use the part generated by jQuery UI progressbar as template for the other parts + self._partTemplate = self._getPartElements().outerHTML(); + self._createParts(self.options.parts); + $.extend(self,{ + created: true + }); + }, + + /** + * @returns {Object} a jQuery object containing all part elements. + * @private + * @author julrich + * @since 1.0 + */ + _getPartElements: function() { + return this.element.children(".ui-progressbar-value"); + }, + + /** + * (Re)creates the markup of the parts. + * @param {Array} parts - Array of part objects defining the properties of the parts to be created. + * @fires multiprogressbar#change when the function is called after the creation of the multiprogressbar + * (i.e. the event is not fired during the creation). + * @fires multiprogressbar#complete when the total progress reaches or exceeds 100%. + * @private + * @author julrich + * @since 1.0 + */ + _createParts: function(parts) { + var self = this; + + self._getPartElements().remove(); // Remove all existing parts and then rebuild them + var first = true; + var lastVisibleElement = null; + var totalValue = 0; + $.each(parts, function(i, part) { + var partElement = $(self._partTemplate).appendTo(self.element); + + if (first === false) { + partElement.removeClass("ui-corner-left"); + } + if (part.value > 0 && totalValue < 100) { + first = false; + // Check if the part would exceed the 100% and cut it at 100% + part.value = totalValue+part.value > 100 ? 100-totalValue : part.value; + partElement.css('width', part.value+"%").show(); + lastVisibleElement = partElement; + totalValue += part.value; + } + else { + // Hide part if the progress is <= 0 or if we exceeded 100% already + part.value = 0; + partElement.hide(); + } + + partElement.addClass(part.barClass); + + if (part.text !== undefined && part.text !== null && part.text !== false) { + var textForPart; + if (part.text === true) { + textForPart = Math.round(part.value)+"%"; + } + else if ($.trim(part.text) !== "") { + textForPart = part.text; + } + $('

').addClass("ju-multiprogressbar-valuetext").text(textForPart).addClass(part.textClass).appendTo(partElement); + } + }); + if (self.created === true) { // Don't trigger "change" when we are creating the progressbar for the first time + self._trigger("change", null, {parts: parts}); + } + if (totalValue >= 99.9) { + lastVisibleElement.addClass("ui-corner-right"); + // Trigger complete + self._trigger("complete"); + } + }, + + /** + * Restores the element to it's original state. + * @public + * @author julrich + * @since 1.0 + */ + destroy: function() { + var self = this; + self._getPartElements().remove(); + self.element.progressbar("destroy"); + }, + + /** + * Changes an option. + * @param {String} option - name of the option to be set. + * @param value - new value for the option. + * @private + * @author julrich + * @since 1.0 + */ + _setOption: function(option, value) { + var self = this; + $.Widget.prototype._setOption.apply( self, arguments ); + + switch(option) { + case "parts": + self._createParts(value); + break; + case "dummy": + break; + default: + break; + } + }, + + /** + * @return {Numeric} the sum of the progress of all visible parts. + * Note: When the sum of the progress of the parts exceeds 100, the progress + * will be truncated at 100 and the value of successive parts will be set to 0. This means + * that this function will always return a value in the range [0,100]. + * @public + * @author julrich + * @since 1.0 + */ + total: function() { + var self = this; + var totalValue = 0; + $.each(self.options.parts, function(i, part) { + totalValue += part.value; + }); + + return totalValue; + } + }); +}(jQuery)); \ No newline at end of file diff --git a/www/conservancy/templates/base_conservancy.html b/www/conservancy/templates/base_conservancy.html index 3f4968bc31fdd6aa5a3b8e574446e4af9185cbe8..50bf9ad22b1d7319da8d0487e7f73f92c5227126 100644 --- a/www/conservancy/templates/base_conservancy.html +++ b/www/conservancy/templates/base_conservancy.html @@ -10,8 +10,11 @@ + + + {% block head %}{% endblock %}