/* http://www.JSON.org/json2.js 2008-11-19 Public Domain. NO WARRANTY EXPRESSED OR IMPLIED. USE AT YOUR OWN RISK. See http://www.JSON.org/js.html This file creates a global JSON object containing two methods: stringify and parse. JSON.stringify(value, replacer, space) value any JavaScript value, usually an object or array. replacer an optional parameter that determines how object values are stringified for objects. It can be a function or an array of strings. space an optional parameter that specifies the indentation of nested structures. If it is omitted, the text will be packed without extra whitespace. If it is a number, it will specify the number of spaces to indent at each level. If it is a string (such as '\t' or ' '), it contains the characters used to indent at each level. This method produces a JSON text from a JavaScript value. When an object value is found, if the object contains a toJSON method, its toJSON method will be called and the result will be stringified. A toJSON method does not serialize: it returns the value represented by the name/value pair that should be serialized, or undefined if nothing should be serialized. The toJSON method will be passed the key associated with the value, and this will be bound to the object holding the key. For example, this would serialize Dates as ISO strings. Date.prototype.toJSON = function (key) { function f(n) { // Format integers to have at least two digits. return n < 10 ? '0' + n : n; } return this.getUTCFullYear() + '-' + f(this.getUTCMonth() + 1) + '-' + f(this.getUTCDate()) + 'T' + f(this.getUTCHours()) + ':' + f(this.getUTCMinutes()) + ':' + f(this.getUTCSeconds()) + 'Z'; }; You can provide an optional replacer method. It will be passed the key and value of each member, with this bound to the containing object. The value that is returned from your method will be serialized. If your method returns undefined, then the member will be excluded from the serialization. If the replacer parameter is an array of strings, then it will be used to select the members to be serialized. It filters the results such that only members with keys listed in the replacer array are stringified. Values that do not have JSON representations, such as undefined or functions, will not be serialized. Such values in objects will be dropped; in arrays they will be replaced with null. You can use a replacer function to replace those with JSON values. JSON.stringify(undefined) returns undefined. The optional space parameter produces a stringification of the value that is filled with line breaks and indentation to make it easier to read. If the space parameter is a non-empty string, then that string will be used for indentation. If the space parameter is a number, then the indentation will be that many spaces. Example: text = JSON.stringify(['e', {pluribus: 'unum'}]); // text is '["e",{"pluribus":"unum"}]' text = JSON.stringify(['e', {pluribus: 'unum'}], null, '\t'); // text is '[\n\t"e",\n\t{\n\t\t"pluribus": "unum"\n\t}\n]' text = JSON.stringify([new Date()], function (key, value) { return this[key] instanceof Date ? 'Date(' + this[key] + ')' : value; }); // text is '["Date(---current time---)"]' JSON.parse(text, reviver) This method parses a JSON text to produce an object or array. It can throw a SyntaxError exception. The optional reviver parameter is a function that can filter and transform the results. It receives each of the keys and values, and its return value is used instead of the original value. If it returns what it received, then the structure is not modified. If it returns undefined then the member is deleted. Example: // Parse the text. Values that look like ISO date strings will // be converted to Date objects. myData = JSON.parse(text, function (key, value) { var a; if (typeof value === 'string') { a = /^(\d{4})-(\d{2})-(\d{2})T(\d{2}):(\d{2}):(\d{2}(?:\.\d*)?)Z$/.exec(value); if (a) { return new Date(Date.UTC(+a[1], +a[2] - 1, +a[3], +a[4], +a[5], +a[6])); } } return value; }); myData = JSON.parse('["Date(09/09/2001)"]', function (key, value) { var d; if (typeof value === 'string' && value.slice(0, 5) === 'Date(' && value.slice(-1) === ')') { d = new Date(value.slice(5, -1)); if (d) { return d; } } return value; }); This is a reference implementation. You are free to copy, modify, or redistribute. This code should be minified before deployment. See http://javascript.crockford.com/jsmin.html USE YOUR OWN COPY. IT IS EXTREMELY UNWISE TO LOAD CODE FROM SERVERS YOU DO NOT CONTROL. */ /*jslint evil: true */ /*global JSON */ /*members "", "\b", "\t", "\n", "\f", "\r", "\"", JSON, "\\", apply, call, charCodeAt, getUTCDate, getUTCFullYear, getUTCHours, getUTCMinutes, getUTCMonth, getUTCSeconds, hasOwnProperty, join, lastIndex, length, parse, prototype, push, replace, slice, stringify, test, toJSON, toString, valueOf */ // Create a JSON object only if one does not already exist. We create the // methods in a closure to avoid creating global variables. if (!this.JSON) { JSON = {}; } (function () { function f(n) { // Format integers to have at least two digits. return n < 10 ? '0' + n : n; } if (typeof Date.prototype.toJSON !== 'function') { Date.prototype.toJSON = function (key) { return this.getUTCFullYear() + '-' + f(this.getUTCMonth() + 1) + '-' + f(this.getUTCDate()) + 'T' + f(this.getUTCHours()) + ':' + f(this.getUTCMinutes()) + ':' + f(this.getUTCSeconds()) + 'Z'; }; String.prototype.toJSON = Number.prototype.toJSON = Boolean.prototype.toJSON = function (key) { return this.valueOf(); }; } var cx = /[\u0000\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g, escapable = /[\\\"\x00-\x1f\x7f-\x9f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g, gap, indent, meta = { // table of character substitutions '\b': '\\b', '\t': '\\t', '\n': '\\n', '\f': '\\f', '\r': '\\r', '"' : '\\"', '\\': '\\\\' }, rep; function quote(string) { // If the string contains no control characters, no quote characters, and no // backslash characters, then we can safely slap some quotes around it. // Otherwise we must also replace the offending characters with safe escape // sequences. escapable.lastIndex = 0; return escapable.test(string) ? '"' + string.replace(escapable, function (a) { var c = meta[a]; return typeof c === 'string' ? c : '\\u' + ('0000' + a.charCodeAt(0).toString(16)).slice(-4); }) + '"' : '"' + string + '"'; } function str(key, holder) { // Produce a string from holder[key]. var i, // The loop counter. k, // The member key. v, // The member value. length, mind = gap, partial, value = holder[key]; // If the value has a toJSON method, call it to obtain a replacement value. if (value && typeof value === 'object' && typeof value.toJSON === 'function') { value = value.toJSON(key); } // If we were called with a replacer function, then call the replacer to // obtain a replacement value. if (typeof rep === 'function') { value = rep.call(holder, key, value); } // What happens next depends on the value's type. switch (typeof value) { case 'string': return quote(value); case 'number': // JSON numbers must be finite. Encode non-finite numbers as null. return isFinite(value) ? String(value) : 'null'; case 'boolean': case 'null': // If the value is a boolean or null, convert it to a string. Note: // typeof null does not produce 'null'. The case is included here in // the remote chance that this gets fixed someday. return String(value); // If the type is 'object', we might be dealing with an object or an array or // null. case 'object': // Due to a specification blunder in ECMAScript, typeof null is 'object', // so watch out for that case. if (!value) { return 'null'; } // Make an array to hold the partial results of stringifying this object value. gap += indent; partial = []; // Is the value an array? if (Object.prototype.toString.apply(value) === '[object Array]') { // The value is an array. Stringify every element. Use null as a placeholder // for non-JSON values. length = value.length; for (i = 0; i < length; i += 1) { partial[i] = str(i, value) || 'null'; } // Join all of the elements together, separated with commas, and wrap them in // brackets. v = partial.length === 0 ? '[]' : gap ? '[\n' + gap + partial.join(',\n' + gap) + '\n' + mind + ']' : '[' + partial.join(',') + ']'; gap = mind; return v; } // If the replacer is an array, use it to select the members to be stringified. if (rep && typeof rep === 'object') { length = rep.length; for (i = 0; i < length; i += 1) { k = rep[i]; if (typeof k === 'string') { v = str(k, value); if (v) { partial.push(quote(k) + (gap ? ': ' : ':') + v); } } } } else { // Otherwise, iterate through all of the keys in the object. for (k in value) { if (Object.hasOwnProperty.call(value, k)) { v = str(k, value); if (v) { partial.push(quote(k) + (gap ? ': ' : ':') + v); } } } } // Join all of the member texts together, separated with commas, // and wrap them in braces. v = partial.length === 0 ? '{}' : gap ? '{\n' + gap + partial.join(',\n' + gap) + '\n' + mind + '}' : '{' + partial.join(',') + '}'; gap = mind; return v; } } // If the JSON object does not yet have a stringify method, give it one. if (typeof JSON.stringify !== 'function') { JSON.stringify = function (value, replacer, space) { // The stringify method takes a value and an optional replacer, and an optional // space parameter, and returns a JSON text. The replacer can be a function // that can replace values, or an array of strings that will select the keys. // A default replacer method can be provided. Use of the space parameter can // produce text that is more easily readable. var i; gap = ''; indent = ''; // If the space parameter is a number, make an indent string containing that // many spaces. if (typeof space === 'number') { for (i = 0; i < space; i += 1) { indent += ' '; } // If the space parameter is a string, it will be used as the indent string. } else if (typeof space === 'string') { indent = space; } // If there is a replacer, it must be a function or an array. // Otherwise, throw an error. rep = replacer; if (replacer && typeof replacer !== 'function' && (typeof replacer !== 'object' || typeof replacer.length !== 'number')) { throw new Error('JSON.stringify'); } // Make a fake root object containing our value under the key of ''. // Return the result of stringifying the value. return str('', {'': value}); }; } // If the JSON object does not yet have a parse method, give it one. if (typeof JSON.parse !== 'function') { JSON.parse = function (text, reviver) { // The parse method takes a text and an optional reviver function, and returns // a JavaScript value if the text is a valid JSON text. var j; function walk(holder, key) { // The walk method is used to recursively walk the resulting structure so // that modifications can be made. var k, v, value = holder[key]; if (value && typeof value === 'object') { for (k in value) { if (Object.hasOwnProperty.call(value, k)) { v = walk(value, k); if (v !== undefined) { value[k] = v; } else { delete value[k]; } } } } return reviver.call(holder, key, value); } // Parsing happens in four stages. In the first stage, we replace certain // Unicode characters with escape sequences. JavaScript handles many characters // incorrectly, either silently deleting them, or treating them as line endings. cx.lastIndex = 0; if (cx.test(text)) { text = text.replace(cx, function (a) { return '\\u' + ('0000' + a.charCodeAt(0).toString(16)).slice(-4); }); } // In the second stage, we run the text against regular expressions that look // for non-JSON patterns. We are especially concerned with '()' and 'new' // because they can cause invocation, and '=' because it can cause mutation. // But just to be safe, we want to reject all unexpected forms. // We split the second stage into 4 regexp operations in order to work around // crippling inefficiencies in IE's and Safari's regexp engines. First we // replace the JSON backslash pairs with '@' (a non-JSON character). Second, we // replace all simple value tokens with ']' characters. Third, we delete all // open brackets that follow a colon or comma or that begin the text. Finally, // we look to see that the remaining characters are only whitespace or ']' or // ',' or ':' or '{' or '}'. If that is so, then the text is safe for eval. if (/^[\],:{}\s]*$/. test(text.replace(/\\(?:["\\\/bfnrt]|u[0-9a-fA-F]{4})/g, '@'). replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g, ']'). replace(/(?:^|:|,)(?:\s*\[)+/g, ''))) { // In the third stage we use the eval function to compile the text into a // JavaScript structure. The '{' operator is subject to a syntactic ambiguity // in JavaScript: it can begin a block or an object literal. We wrap the text // in parens to eliminate the ambiguity. j = eval('(' + text + ')'); // In the optional fourth stage, we recursively walk the new structure, passing // each name/value pair to a reviver function for possible transformation. return typeof reviver === 'function' ? walk({'': j}, '') : j; } // If the text is not JSON parseable, then a SyntaxError is thrown. throw new SyntaxError('JSON.parse'); }; } })(); AJS.clone = function (o) { function F() {} F.prototype = o; return new F(); }; /*global AJS, document, setTimeout */ if (!console.error) { console.log = console.warn = console.error = console.time = console.timeEnd = function () {}; } // Library from http://blog.stevenlevithan.com/archives/parseuri AJS.parseUri = function (uri, strict) { function parseUri (str) { var o = parseUri.options, m = o.parser[o.strictMode ? "strict" : "loose"].exec(str), uri = {}, i = 14; while (i--) uri[o.key[i]] = m[i] || ""; uri[o.q.name] = {}; uri[o.key[12]].replace(o.q.parser, function ($0, $1, $2) { if ($1) uri[o.q.name][$1] = $2; }); return uri; }; parseUri.options = { strictMode: !!strict, key: ["source","protocol","authority","userInfo","user","password","host","port","relative","path","directory","file","query","anchor"], q: { name: "queryKey", parser: /(?:^|&)([^&=]*)=?([^&]*)/g }, parser: { strict: /^(?:([^:\/?#]+):)?(?:\/\/((?:(([^:@]*)(?::([^:@]*))?)?@)?([^:\/?#]*)(?::(\d*))?))?((((?:[^?#\/]*\/)*)([^?#]*))(?:\?([^#]*))?(?:#(.*))?)/, loose: /^(?:(?![^:@]+:[^:@\/]*@)([^:\/?#.]+):)?(?:\/\/)?((?:(([^:@]*)(?::([^:@]*))?)?@)?([^:\/?#]*)(?::(\d*))?)(((\/(?:[^?#](?![^?#\/]*\.[^?#\/.]+(?:[?#]|$)))*\/?)?([^?#\/]*))(?:\?([^#]*))?(?:#(.*))?)/ } }; uri = parseUri(uri); uri.toString = function () { var params = []; AJS.$.each(uri.queryKey, function (name, value) { params.push(name + "=" + value); }); return uri.protocol + "://" + uri.authority + uri.path + "?" + params.join("&") + "#" + uri.anchor; }; return uri; }; /** * ZParse - Javascript Library for Template Parsing * @author Rizqi Ahmad * * Copyright (c) 2007 Rizqi Ahmad * * Permission is hereby granted, free of charge, to any person obtaining a copy * of this software and associated documentation files (the "Software"), to deal * in the Software without restriction, including without limitation the rights * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell * copies of the Software, and to permit persons to whom the Software is * furnished to do so, subject to the following conditions: * * The above copyright notice and this permission notice shall be included in * all copies or substantial portions of the Software. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN * THE SOFTWARE. */ ///////////////////////////////////////////////////////////////////////////////////////////////////// /** * Main Object of ZParse. Acting as a class and a namespace at the same time * @param {Object} implementation * @example * * var parser1 = new ZParse(); * var parser2 = new ZParse(customImplementation); * * parser1.parse(templateString1); * parser2.parse(templateString2); * * var result1 = parser1.process(data); * var result2 = parser2.process(data); * */ var ZParse = function(implementation) { /* * @type {Object} Rule Object */ this.implementation = implementation; /* * @type {String} Function-Header for the template */ this.header = [ 'var $text = [];', 'var _write = function(text) {', '$text.push((typeof text == "number")?text:(text||""));', '};', 'var top = $data;', 'with($data){ ' ].join(''); /* * @type {String} Function-Footer for the template */ this.footer = '}return $text.join("");'; /* * @type {Array} Characters to be escaped */ this.escapeChars = ['\\', '\'', '"', ['\n','\\n'], ['\t','\\t'], ['\r', '\\r']]; }; ///////////////////////////////////////////////////////////////////////////////////////////////////// /* * @type {Object} Default rule object to be used */ ZParse.implementation = {}; ///////////////////////////////////////////////////////////////////////////////////////////////////// /** * Parse template string to template function * @param {String} Template string to be parsed * @return {Boolean} Parsing status, false if failed, true if succeeded * @example * * var parser = new ZParse; * parser.parse(myTemplateString); * */ ZParse.prototype.parse = function(source) { this.sourceArray = ZParse.parseToArray(source, this.implementation); this.sourceTree = ZParse.parseToTree(this.sourceArray.all, this.implementation); this.functionText = ZParse.parseToScript(this.sourceTree, this.escapeChars, this.implementation, this); try { this.functionScript = new Function('$data', this.header + this.functionText + this.footer); return true; } catch(e){ this.error = e; return false; } }; ZParse.clean = function (str) { return str.replace(/[\n\r\t](?!.*?<)/gmi,"").replace(/(<\w+?|\"+?)\s{2,}/g,"$1 "); }; ///////////////////////////////////////////////////////////////////////////////////////////////////// /** * Process created Template with data * @param {Object} data that will be used when executing function. You can access data within template * @param {Object} 'this'-object to be binded in template * @return {String} text result * @example * * var parser = new ZParse; * var string = 'my name ist <$name>. Im <$age> years old.' * * parser.parse(string); * var result = parser.process({name:'Rizqi', age:17}); * // result: "my name is Rizqi. Im 17 years old." * */ ZParse.prototype.process = function(data, bind) { if(bind) return ZParse.clean(this.functionScript.apply(bind, [data])); else return ZParse.clean(this.functionScript(data)); }; ///////////////////////////////////////////////////////////////////////////////////////////////////// ///////////////////////////////// ZParse Global Functions //////////////////////////////////// ///////////////////////////////////////////////////////////////////////////////////////////////////// /** * Escape characters. Needed for parsing template. * @param {String} string containing characters to be escaped * @param {Array} escape characters list * @return {String} parsed string * @example * * var escaped = ZParse.escape("lesser < more >", ['<','>']); * // produce: 'lesser \< more \>' * */ ZParse.escape = function(source, list) { for(var i=0; i source.indexOf(imp[i].opener)) delimiter = i; } opener = source.indexOf(imp[delimiter].opener); closer = source.indexOf(imp[delimiter].closer) + imp[delimiter].closer.length; if(opener != -1) { text.push(source.substring(0,opener)); tags.push(source.substring(opener,closer)); source = source.substring(closer); } else { text.push(source); source = ''; } } for(var i=0; i', '*', '$', '@']); for(var i=0; i', tags: { 'foreach': { arguments: '{element} in {object}', type: 'block', handler: function(tree, content, caller) { var element = tree.arguments.element; var object = tree.arguments.object; //Check whether there are else tag after this tag, if yes, (if) tag will be included var cond = (tree.parent.children[tree.nr+1] && tree.parent.children[tree.nr+1].tagname == 'else'); var iff = ['if( (',object,' instanceof Array && ',object,'.length > 0) || ', '(!(',object,' instanceof Array) && ',object,') ) {'].join(''); return [ cond?iff:'', 'var ',element,';', 'if(',object,' instanceof Array) {', 'for(var ',element,'_index=0; ',element,'_index<',object,'.length; ',element,'_index++) {', element,' = ',object,'[',element,'_index];', content, '}', '} else {', 'for (var ',element,'_index in ',object,') {', element,' = ',object,'[',element,'_index];', content, '}', '}', cond?'}':'' ].join(''); } }, 'for': { arguments: '{element} in {object}', type: 'block', handler: function(tree, content, caller) { var element = tree.arguments.element; var object = tree.arguments.object; //Check whether there are else tag after this tag, if yes, (if) tag will be included var cond = (tree.parent.children[tree.nr+1] && tree.parent.children[tree.nr+1].tagname == 'else'); var iff = ['if( (',object,' instanceof Array && ',object,'.length > 0) || ', '(!(',object,' instanceof Array) && ',object,') ) {'].join(''); return [ cond?iff:'', 'if(',object,' instanceof Array) {', 'for(var ',element,'=0; ',element,'<',object,'.length; ',element,'++) {', content, '}', '} else {', 'for(var ',element,' in ',object,') {', content, '}', '}', cond?'}':'' ].join(''); } }, 'if': { type: 'block', handler: function(tree, content, caller) { var condition = tree.argSource; return [ 'if(',condition,') {', content, '}' ].join(''); } }, 'elseif': { type: 'block', noTextBefore: true, handler: function(tree, content, caller) { var condition = tree.argSource; return [ 'else if(',condition,') {', content, '}' ].join(''); } }, 'else': { type: 'block', noTextBefore: true, handler: function(tree, content, caller) { return [ 'else {', content, '}' ].join(''); } }, 'macro': { arguments: '{name}({args})', type: 'block', handler: function(tree, content, caller) { var name = tree.arguments.name; var args = tree.arguments.args; var point = (name.indexOf('.') > 0); return [ point?'':'var ', name,' = function(',args,') {', 'var top = ' + args + ";", 'with (' + args + ') {', 'var $text = [];', 'var _write = function(text) {', '$text.push((typeof text == "number")?text:(text||""));', '};', content, '}', 'return $text.join("");', '};' ].join(''); } }, 'cdata': { type: 'block', handler: function(tree, content, caller) { return '_write(\''+ZParse.escape(tree.innerSource, caller.escapeChars)+'\');'; } } } }, print: { opener: '${', closer: '}', handler: function(tree, content, caller) { return '_write('+tree.argSource+');'; } }, alternatePrint: { opener: '<$', closer: ':>', handler: function(tree, content, caller) { return '_write('+tree.argSource+');'; } }, script: { opener: '<%', closer: '%\>', handler: function(tree, content, caller) { return tree.argSource; } } }; /** * Manages dashboard. Besides rendering the dashboard menu, this singleton is responsible for delegating actions to * layoutManagers. * * @module dashboard * @class DashboardManager * @constructor * @namespace AG */ /*global AJS, console, document*/ /*jslint bitwise: true, eqeqeq: true, immed: true, newcap: true, nomen: true, onevar: true, plusplus: true, regexp: true, undef: true, white: true, indent: 4 */ AG = {}; // set namespace AG.DashboardManager = (function () { var dashboard, /** * Data store of AG.LayoutMangers * * @property layouts * @private * @type {Array} */ layouts = [], /** * Creates dashboard menu * * @method createMenu * @private */ createMenu = function (json) { var // local variable declarations editButton, /* {jQuery} jQuery wrapped html element, the edit button */ descriptor; /* {Object} contains dashboard menu properites. Used by templater to render html */ // Gets attributes to assign event handlers descriptor = AG.render.getDescriptor("dashboardMenu", json); // Appends rendered html to dashboard. HTML produced by rendering engine, AG.render. dashboard.contents.append(AG.render(descriptor)); // Gets the edit button using the id set in descriptor 'dashboardMenu'. editButton = AJS.$("#layout-changer"); editButton.click(function (e) { // stop default link action (do not follow link) e.preventDefault(); // opens edit layout dialog AG.DashboardManager.editLayout(); }); AJS.$("#dashboard-tools-dropdown").dropDown("standard", { trigger: ".aui-dd-link" }); }; return { /** * Gets dashboard container. The <div> that serves as the container for all other dashboard HTML. * * @method getDashboard * @return {jQuery} dashboard htmlElement */ getDashboard: function () { return dashboard; }, /** * Creates a new instance of AG.LayoutManger. On construction the Layout Manager will build the html for the * columns, and if descriptors provided, gadgets also. If gadget descriptors are provided, layout will be set to * active. * *
*
Usage
*
* 
         *
         *      // This will create a layout. It will set it to active because you have specified gadgets
         *      AG.DashboardManager.addLayout({
         *           title: "Dashboard for Scott Harwood",
         *           type: "layout-aaa",
         *           gadgets: [
         *               {
         *                   "height": "300",
         *                   "id":"1",
         *                   "title":"All Hidden Prefs test",
         *                   "gadgetSpecUrl":"http://gadgetspeclocation.com",
         *                   "color":"color4",
         *                   "isMaximizable":false,
         *                   "userPrefs":null,
         *                   "renderedGadgetUrl":"http://gadgetlocationrenderlocation.com"
         *               },
         *               {
         *                   "height": "300",
         *                   "id":"1",
         *                   "title":"All Hidden Prefs test",
         *                   "gadgetSpecUrl":"http://gadgetspeclocation.com",
         *                   "color":"color4",
         *                   "isMaximizable":false,
         *                   "userPrefs":null,
         *                   "renderedGadgetUrl":"http://gadgetlocationrenderlocation.com"
         *               }
         *           ]
         *       });
         *
*
*
* 
         *
         *      // This will create a layout. It will be inactive as you have specifed a url of which to retrieve gadget descriptors from, when selected.
         *      AG.DashboardManager.addLayout({
         *           title: "Dashboard for Scott Harwood",
         *           type: "layout-aaa",
         *           gadgets: "http://gadget-decriptor-url-for-this-layout/
         *      });
         *
* *
*
* * @method addLayout * @param {Object} descriptor - JSON describing layout type, title, & gadgets. * Gadgets can be an array of gadget descriptors or a url that can be requested to retreive them. */ addLayout: function (descriptor) { var // local variable declarations /* {AG.LayoutManager} Instance of AG.LayoutManager */ layout = AG.LayoutManager(descriptor); // add instance to collection so we can refer to it later layouts.push(layout); if (descriptor.active !== false) { // make this layout (tab) the active one this.setLayout(layout); } layout.init(); }, showShims: function () { if (!AJS.$("body").hasClass("propagation-blocker")) { AJS.$("body").addClass("propagation-blocker"); this.getDashboard().shim.height(this.getDashboard().outerHeight()); } }, hideShims: function () { if (AJS.$("body").hasClass("propagation-blocker")) { AJS.$("body").removeClass("propagation-blocker"); } }, /** * Displays edit layout dialog. This function evolves. First time it is called will constuct the html and * show layout dialog. Subsequent times it will simply toggle it's visibility. * * @method editLayout */ editLayout: function () { var // local variable declarations descriptor, /* {Object} contains edit layout dialog properites. Used by templater to render html */ popup; /* {AJS.popup} instance of AJS.popup */ // get properties for layo ut dialog descriptor = AG.render.getDescriptor("layoutDialog", { layoutType: AG.DashboardManager.getLayout().getLayout() }); // create instance of AJS.popup. This does NOT show popup. popup = AJS.popup(507, 150, "layout-dialog"); // Appends rendered html to popup element. HTML produced by rendering engine AG.render. Properties used by // rendering engine are gatherd from a call to AG.render.getDescriptor("layoutDialog"). popup.element .html(AG.render(descriptor)) .addClass(AG.LayoutManager.getLayoutAttrName(descriptor.layoutType)); // adds close button & close behaviour AJS.$("#" + descriptor.closeId, popup.element).click(function (e) { popup.hide(); // don't follow link e.preventDefault(); }); // Find all the layout representations in dialog. Assign a click handler to them that will change the // current layout. AJS.$.each(AG.LayoutManager.layouts, function () { var layout = this, layoutAttrName = AG.LayoutManager.getLayoutAttrName(layout); AJS.$("#" + layoutAttrName).click(function (e) { // Find the layout we are going to affect. var activeLayout = AG.DashboardManager.getLayout(); // Set the highlighted layout for this dialog. So next time we open the dialog, the correct one is // highlighted. popup.element .removeClass(AG.LayoutManager.getLayoutAttrName(activeLayout.getLayout())) .addClass(layoutAttrName); // Finally display the selected layout. activeLayout.setLayout(layout); popup.hide(); AG.Sortable.update(); // Don't follow link. e.preventDefault(); }); }); // Re-define this method (thankyou javascript), so that the next time we call editActive layout we do not // constuct the html everytime. All we do is toggle it's visibility with a call to the show method. this.editLayout = (function () { popup.show(); AJS.$(document).keyup(function (e) { if (e.keyCode === 27) { popup.hide(); AJS.$(document).unbind("keyup", arguments.callee); e.preventDefault(); } }); return arguments.callee; }()); // call myself straight away. Don't worry! I will be restored by returning myself (arguments.callee) }, /** * Gets active layout manager * * @method getLayout * @return {AG.LayoutManager} */ getLayout: function () { return this.activeLayout; }, markReadOnlyLayouts: function () { AJS.$.each(layouts, function () { if (!this.isWritable()) { this.markReadOnlyLayout(); } }); }, unmarkReadOnlyLayouts: function () { AJS.$.each(layouts, function () { if (!this.isWritable()) { this.unmarkReadOnlyLayout(); } }); }, /** * Sets active layout manager * @method setLayout * @param {AG.LayoutManager} layout */ setLayout: function (layout) { // if (this.activeLayout) { // this.activeLayout.deactivate(); // this.activeLayout.tab.removeClass("active"); // layout.activate(); // } // layout.tab.addClass("active"); this.activeLayout = layout; }, /** * Creates gadget using the provided gadgetDesriptor and appends it to the specified column of the * active layout/tab. If column is not specified, will be added as first gadget in the first column. * *
*
Usage
*
* 
         *      AG.DashboardManager.addGadget({
         *          "height": "300",
         *          "id":"1",
         *          "title":"All Hidden Prefs test",
         *          "gadgetSpecUrl":"http://gadgetspeclocation.com",
         *          "color":"color4",
         *          "isMaximizable":false,
         *          "userPrefs":null,
         *          "renderedGadgetUrl":"http://gadgetlocationrenderlocation.com"
         *       }, 1);
         *
*
* * * @method addGadget * @param {Object} gadgetDescriptor - JSON with gadget properites * @param {Number} column - Column to append gadget to. (optional) */ addGadget: function (gadget, column) { this.activeLayout.addGadget(gadget, column); }, /** * Creates furniture & layouts, sets params & il8n strings. * * @method setup * @param options */ setup: function (options) { var that = this; /* {AG.DashboardManager} 'this' reference for inside of inner functions */ // add a point cut to the setHeight service so that it refreshes the positioning of our gadgets. They are // absolute positioned so a change of height affects their offset. AJS.$.aop.after({target: gadgets.IfrGadgetService.prototype, method: "setHeight"}, function () { that.getLayout().onInit(function () { that.getLayout().refresh(); }); }); // adds all the il8n and param strings to data store AG.param.set(options.params); AG.render.ready(function () { AJS.$(function () { // creates shim that sits over dashboard to prevent propagation of events during actions like dragging AG.Sortable.init(); dashboard = AJS.$("#dashboard"); dashboard.header = AJS.$("
").appendTo(dashboard); //if there's only one tab, hide the tabs. if (options.layouts.length > 1) { that.getDashboard().addClass("v-tabs"); dashboard.tabContainer = AJS.$("
    ").appendTo(dashboard); } dashboard.contents = AJS.$("
    ").appendTo(dashboard); if(options.menu.items && options.menu.items.length > 0) { dashboard.menu = createMenu(options.menu); } dashboard.shim = AJS.$('
    ').appendTo(dashboard.contents); AJS.$.each(options.layouts, function () { // creates layout instance and appends gadgets, if provided. that.addLayout(this); }); dashboard.removeClass("initializing"); // Refresh the page after an hour to prevent gadget security tokens from expiring // and breaking AJAX in gadgets (see AG-661) window.setTimeout(function() { window.location.reload(); }, 1000 * 60 * 60); }); }); AG.render.initialize(); } }; }()); /** * Manages Dashboard layout. This includes organising of gadgets and drag and drop functionality. Dashboard specific * methods, NOT gadget specific. * * @module dashboard * @class LayoutManager * @constructor * @namespace AG */ /*jslint bitwise: true, eqeqeq: true, immed: true, newcap: true, nomen: true, onevar: true, plusplus: true, regexp: true, undef: true, white: true, indent: 4 */ /*global AG, AJS, alert, console */ (function () { if (typeof Object.create !== 'function') { Object.create = function (o) { function F() {} F.prototype = o; return new F(); }; } var LayoutManager = { /** * Sends request to server to persist current layout, including gadget ordering and column layout. * * @method saveLayout * @private */ saveLayout: function () { var that = this; function getData() { return AJS.$.extend({ method: "put", layout: that.layout }, AG.Sortable.serialize()); } AJS.$.ajax({ type: "post", url: AG.param.get("layoutAction"), // Self executing function that firstly sets the layout type & method of storge (put). Secondly sets // gadget positioning in layout, by looping through, sequentially, all columns and their gadgets, // binding gadget id's to column id's. data: getData(), /* debug */ success: function () { console.log("AG.LayoutManager.saveLayout: Layout (" + that.layout + ") saved successfully"); }, /* debug end */ // In the case of an error. This can be caused by a timeout (if specified), http error or parseError error: function (request) { if (request.status == 403 || request.status == 401) { alert(AG.param.get("dashboardErrorDashboardPermissions")); } else { alert(AG.param.get("dashboardErrorCouldNotSave")); } /* debug */ console.log("AG.LayoutManager.saveLayout: Request failed! Printing response object..."); console.log(request); /* debug end */ } }); }, getColumn: function (idx) { var that = this, i = parseInt(idx, 16); if (arguments.length) { return that.columns; } else if (!isNaN(i) || !that.columns[i]) { return that.columns.eq(i); } /* debug */ else { console.error("AG.LayoutManager.getColumn: The column index you provided is invalid. " + "Expected a number in the range of 0-" + that.columns.length - 1 + " but recieved " + idx); } /* debug end */ }, /** * Sets the type of layout. * * @method setLayout * @param {String} layout - valid layout code * @param {Boolean} save (optional) - Flag to presist layout by sending request to server. */ setLayout: function (layout, save) { layout = AJS.$.trim(layout); // checking if the layout is not the same as current if (this.layout === layout) { /* debug */ console.warn("AG.LayoutManager.setLayout: Ignoring! The layout supplied is the same as the current " + "layout (" + layout + ")"); /* debug end */ return; } // checking if valid layout if (AJS.$.inArray(layout, AG.LayoutManager.layouts) === -1) { /* debug */ console.error("AG.LayoutManager.setLayout: Invalid layout! Was given " + layout + ", but expected " + "either of '" + AG.LayoutManager.layouts.toString() + "'"); /* debug end */ } this.container.addClass("layout-" + layout.toLowerCase()); // cannot set layout if it is not writable if (!this.isWritable()) { /* debug */ console.log("AG.LayoutManager.setLayout: Can't manipulate layout. Layout is not writable"); /* debug end */ return; } // toggle class that defines column visibility and width's if (this.layout) { this.container.removeClass("layout-" + this.layout.toLowerCase()); } // move any gadgets in this layout, that are hidden due to layout changes, into the closest visible column. AJS.$.each(this.gadgets, function () { var layoutRep = this.getElement().layoutRep, /* Gadget representaion in column layout */ prevColumn = layoutRep.parent().prev(); /* Column preceeding gadget's current column */ if (!layoutRep.is(":visible")) { if (prevColumn.is(":visible")) { prevColumn.append(layoutRep); } else { prevColumn.prev().append(layoutRep); } } }); // Add "sortable" classes to columns. AG.Sortable uses these classes to find columns to apply sortable // functionality to. if (layout === "AB" || layout === "BA" || layout === "AA") { this.columns.eq(0).addClass("sortable"); this.columns.eq(1).addClass("sortable"); this.columns.eq(2).removeClass("sortable"); } else if (layout === "A") { this.columns.eq(0).addClass("sortable"); this.columns.eq(1).removeClass("sortable"); this.columns.eq(2).removeClass("sortable"); } else if (layout === "AAA") { this.columns.eq(0).addClass("sortable"); this.columns.eq(1).addClass("sortable"); this.columns.eq(2).addClass("sortable"); } this.layout = layout; this.refresh(); if (save !== false) { this.saveLayout(); } /* debug */ else { console.log("AG.LayoutManager.setLayout: Layout successfully set to '" + this.layout + "'"); } /* debug end */ }, getGadgets: function () { return this.gadgets; }, removeGadget: function (gadget) { var that = this; AJS.$.each(this.gadgets, function (idx) { if (this === gadget) { that.gadgets.splice(idx, 1); return false; } }); }, deactivate: function () { this.container.hide(); AJS.$.each(this.gadgets, function () { if (this.getElement().layoutRep.css("display") === "list-item") { this.getElement().hide(); } }); }, activate: function () { this.container.show(); AJS.$.each(this.gadgets, function () { this.getElement().show(); }); this.refresh(); }, refresh: function () { var that = this, isIE6OrBelow = !!(AJS.$.browser.msie && parseInt(jQuery.browser.version) <= 6); function appendEmptyMsgElem(col, idx) { var message = AG.param.get("dragHere", "", ""); return AJS.$("
  • " + message + "
    • ").appendTo(col); } if (!this.initialized) { return; } if (!AG.DashboardManager.getDashboard().hasClass("dragging")) { this.columns.css(isIE6OrBelow ? "height" : "minHeight", ""); this.columns.filter(":visible").each(function (idx) { var column = AJS.$(this); if (AJS.$("li:visible:not(.empty-text)", column).length === 0) { column.addClass("empty"); if (that.isWritable()) { if (!this.msgElem) { this.msgElem = appendEmptyMsgElem(column, idx); } else if (this.msgElem) { this.msgElem.show(); } } } else if (column.hasClass("empty")) { column.removeClass("empty"); if (this.msgElem) { this.msgElem.hide(); } } }); } AJS.$("li.gadget", this.container).each(function () { this.getGadgetInstance().updatePosition(); }); if (!AG.DashboardManager.getDashboard().hasClass("dragging")) { this.columns.each(function () { var column = AJS.$(this); column.css(isIE6OrBelow ? "height" : "minHeight", column.parent().height()); }); } }, /** * Adds the gadget to specified column. If the column is not specified then the gadget is added to the first column. * * @method addGadget * @param {AG.Gadget, Object} gadget - Gadget instance to add * @param {Number} column - Column in current layout (optionial) */ addGadget: function (gadget, column) { var that = this; function hideGadget () { gadget.getElement().layoutRep.addClass("hidden"); gadget.getElement().hide(); gadget.getLayoutManager().refresh(); } function showGadget () { delete gadget.hasBeenDropped; gadget.getElement().layoutRep.removeClass("hidden"); gadget.getElement().show(); gadget.getLayoutManager().refresh(); } function validateAdd (numGadgets) { if (parseInt(numGadgets) >= AG.param.get("maxGadgets")) { showGadget(); alert(AG.param.get("dashboardErrorTooManyGadgets")); } else { gadget.move(that.options.resourceUrl); } } function appendToColumn () { if (!that.initialized) { that.columns.eq(column).append(gadget.getElement().layoutRep); } else { that.columns.eq(column).prepend(gadget.getElement().layoutRep); } } function isFromDifferentLayout () { return AJS.$.isFunction(gadget.getLayoutManager); } function ensureIframeDoesntCache () { AJS.$("iframe", gadget.getElement()).attr("src", AJS.$("iframe", gadget.getElement()).attr("src")); } if (!isFromDifferentLayout()) { column = column || gadget.column || 0; gadget = gadget.loaded ? gadget : AG.Gadget.getNullGadgetRepresentation(gadget); // extend gadget descriptor with layout descriptor. gadget.layout = this.options; // constructs gadget object & methods. gadget = AG.Gadget(gadget); appendToColumn(); AG.DashboardManager.getDashboard().contents.append(gadget.getElement()); gadget.updatePosition(); if (AJS.$.browser.mozilla) { ensureIframeDoesntCache(); } // adds to sortable control AG.Sortable.update(); } else { hideGadget(); AJS.$.get(this.options.resourceUrl + "/numGadgets", function (numGadgets) { validateAdd(numGadgets); }); }; // note: only refreshes after all gadgets are appended. this.refresh(); // store reference to instance this.gadgets.push(gadget); return gadget; }, markReadOnlyLayout: function () { if (!this.isWritable()) { this.tab.addClass("inactive"); } }, onInit: function (callback) { if (!this.initialized) { this.onInit.callbacks = this.onInit.callbacks || []; this.onInit.callbacks.push(callback); } else { callback(); } }, unmarkReadOnlyLayout: function () { if (!this.isWritable() && this.tab.hasClass("inactive")) { this.tab.removeClass("inactive"); } }, isWritable: function () { return this.options.writable; }, getPublicInstance: function () { var that = this; if (!this.publicInterface) { this.publicInterface = { unmarkReadOnlyLayout: function () { return that.unmarkReadOnlyLayout.apply(that, arguments); }, markReadOnlyLayout: function () { return that.markReadOnlyLayout.apply(that, arguments); }, isWritable: function () { return that.isWritable.apply(that, arguments); }, activate: function () { return that.activate.apply(that, arguments); }, deactivate: function () { return that.deactivate.apply(that, arguments); }, getGadgets: function () { return that.getGadgets.apply(that, arguments); }, getLayout: function () { return that.layout; }, getContainer: function () { return that.container; }, getColumn: function () { return that.columns; }, setLayout: function () { return that.setLayout.apply(that, arguments); }, addGadget: function () { return that.addGadget.apply(that, arguments); }, removeGadget: function () { return that.removeGadget.apply(that, arguments); }, refresh: function () { return that.refresh.apply(that, arguments); }, init: function () { return that.init.apply(that, arguments); }, saveLayout: function () { return that.saveLayout.apply(that, arguments); }, getId: function () { return that.options.id; }, onInit: function () { return that.onInit.apply(that, arguments); } }; } return this.publicInterface; }, init: function () { var that = this, canvasGadget; this.gadgets = []; this.options.gadgets = this.options.gadgets || []; function getCanvasGadgetRepresentation (gadgets) { var canvasGadget; AJS.$.each(that.options.gadgets, function () { if (AG.Gadget.isCanvasView(this.id)) { canvasGadget = this; return false; } }); return canvasGadget; } /** * Auto-adjust the number of characters to truncate in the tab label * to fit the capacity of the tab. * * @param label The jQuery object of the tab label in a "span". * @param capacity The width of the tab avaiable for rendering a tab (pixel). */ function fitTab(label, capacity) { var labelText = label.text(); /* * HtmlUnit doesn't seem to update the element width while executing this, which results in an infinite * loop when running the integration tests against a page with tabs if we don't have a second condition * that terminates the loop. So, as a failsafe, don't let the label text go below three characters. * (AG-882) */ while (label.width() >= capacity && labelText.length >= 3) { labelText = labelText.slice(0, labelText.length - 1); label.text(labelText + '...'); } } function appendTab () { var unescapedTitle = AJS.$("
    " + that.options.title + "
    ").text(), labelSpan = AJS.$('').text(unescapedTitle).attr("title", unescapedTitle), labelStrong = AJS.$("").append(labelSpan), capacity; that.tab = AJS.$("
  • "); if (that.options.uri) { that.tab.append(AJS.$("").append(labelStrong)); } else { that.tab.append(labelStrong); that.tab.addClass("active"); } that.tab.get(0).getLayoutInstance = function () { return that.getPublicInstance(); }; that.tab.appendTo(AG.DashboardManager.getDashboard().tabContainer); capacity = AG.DashboardManager.getDashboard().tabContainer.innerWidth() - parseInt(labelStrong.css('padding-left')) - parseInt(labelStrong.css('padding-right')); fitTab(labelSpan, capacity); AJS.$("li:first", AG.DashboardManager.getDashboard().tabContainer).addClass("first"); if(that.isWritable() && that.options.active === false) { AG.Sortable.addHotSpot(that.tab, function (gadget) { that.addGadget(gadget); }); } } function appendColumns () { that.container = AJS.$("
    ").appendTo(AG.DashboardManager.getDashboard().contents); that.columns = AJS.$("
      ").addClass("column first") .add(AJS.$("
        ").addClass("column second")) .add(AJS.$("
          ").addClass("column third")) .appendTo(that.container); } function appendGadgets () { AJS.$.each(that.options.gadgets, function () { that.addGadget(this); }); } function setInitialized () { that.initialized = true; if (that.onInit.callbacks) { AJS.$.each(that.onInit.callbacks, function () { this(); }); } that.refresh(); } if (AG.DashboardManager.getDashboard().tabContainer) { appendTab(); } if (this.options.active !== false) { appendColumns(); this.setLayout(this.options.layout, false); canvasGadget = getCanvasGadgetRepresentation(this.options.gadgets); if (canvasGadget) { canvasGadget = this.addGadget(canvasGadget); canvasGadget.setView("canvas"); canvasGadget.updatePosition(); AJS.$.aop.after({target: canvasGadget, method: "setView"}, function () { canvasGadget.remove(); that.removeGadget(canvasGadget); appendGadgets(); setInitialized(); }); } else { appendGadgets(); setInitialized(); } } } }; AG.LayoutManager = function (options) { // Using prototype as there could be many gadgets on the page. This is most memory efficient. var layoutManager = Object.create(LayoutManager); layoutManager.options = options; // define public interface return layoutManager.getPublicInstance(); }; /** * @property layouts * @type Array * @static */ AG.LayoutManager.layouts = ["A", "AA", "BA", "AB", "AAA"]; /** * @method getLayoutAttrName * @static * @param layout */ AG.LayoutManager.getLayoutAttrName = function (layout) { return "layout-" + layout.toLowerCase(); }; }()); /** * Gadget implementation. * * @module dashboard * @class Gadget * @constructor * @namespace AG */ (function(){ function FauxList (listContainer) { var that = this, ENTER_KEY = 13; this.container = AJS.$(listContainer); this.values = AJS.$("input.list", this.container).val().split("|"); this.originalValues = this.values.join("|").split("|"); // creating a separate array - ugly but it works. // Create fake form elements and add to container this.container.append("" + ""); // Add list items to list individually this.container.children(".submit-to-list").click(function(e) { that.addToList(); e.preventDefault(); }); AJS.$("input[name=add-to-list]", this.container).keydown(function(e) { if (e.keyCode == ENTER_KEY) { that.addToList(); e.preventDefault(); } }); // Hide original form elements but leave them available for hijacking. Cannot use comma seperated selector because // safari 3 was freaking out and throwing exception. AJS.$("input", this.container).addClass("hidden"); AJS.$("span", this.container).addClass("hidden"); this.create(this.values); } FauxList.prototype = { reset: function () { this.create(this.originalValues); }, create: function (values) { var ul, listItem, that = this; // If the list is empty, skip all of this. if (values) { // Strip empty values AJS.$.each(values, function() { if (this == "") { values.splice(values.indexOf(this), 1); } }); // Create UL to hold visible list ul = AJS.$("
            "); // Create list for any list items // Else, remove if none if (values.length > 0) { for (var i = 0, ii = values.length; i < ii; i++) { // Make LI element with delete functionality listItem = AJS.$("
          • " + values[i] + "x
            • "); // Remove list items from list individually AJS.$("a", listItem).click(function(e) { // Grab the value to be removed from the array var removeValue = AJS.$(this).parent("li").attr("class").split("-")[1]; // Find the index of the value and remove it values.splice(removeValue, 1); if (values.length > 0) { that.create(values); } else { AJS.$("input.list", this.container).val(""); } // Remove LI from visible list listItem.remove(); e.preventDefault(); }); // Add new list items to ul.faux-list ul.append(listItem); } // If no values existed, add ul.faux-list before the old input // Else, replace old .faux-list with new version if (AJS.$("ul.faux-list", this.container).length == 0) { AJS.$("input.list", this.container).before(ul); } else { AJS.$("ul.faux-list", this.container).replaceWith(ul); } } else { AJS.$("ul.faux-list", this.container).remove(); } // Rewrite the old input value with current array AJS.$("input.list", this.container).val(values.join("|")); AG.DashboardManager.getLayout().refresh(); } }, addToList: function () { // Stripping pipes from our pipe-delimited input var newValue = AJS.$("input[name=add-to-list]", this.container).val().replace(/\|+/g, '%7C'); //Grab value from new input and add to array this.values.push(newValue); // Clear new input AJS.$("input[name=add-to-list]", this.container).val(""); // Remake the list this.create(this.values); } }; var Gadget = { /** * Draws gadget, preference form and furniture * * @method draw */ draw: function (json) { var that = this; function createElement () { json.minimized = that.minimized; json.view = that.view; that.$ = AJS.$(AG.render("gadget", json)); that.$.updateShadow = function () { var attrs = { width: that.$.width() + 32, height: that.$.height() + 29 }; that.$.shadow.sides.css("height", attrs.height - 46); that.$.shadow.bottom.css("width", attrs.width - 58); that.$.shadow.css(attrs); }; } function setElementShortcuts () { that.$.layoutRep = AJS.$("
          • ").height(that.$.height()); that.$.shadow = AJS.$("div.shadow", that.$); that.$.shadow.bottom = AJS.$("div.b", that.$.shadow); that.$.shadow.sides = AJS.$("div.l", that.$.shadow).add(AJS.$("div.r", that.$.shadow)); that.$.layoutRep.get(0).getGadgetInstance = that.$.get(0).getGadgetInstance = function () { return that.getPublicInstance(); }; } function applyDropdownControls () { var ACTIVE_CLASS = "dropdown-active", ddParent = AJS.$("li.aui-dd-parent", that.$); ddParent.mousedown(function (e) { e.stopPropagation(); }); that.$.dropdown = ddParent.dropDown("standard", { selectionHandler: function (e) { e.preventDefault(); }, item: "> li" })[0]; that.$.dropdown.addCallback("show", function () { that.$.addClass(ACTIVE_CLASS); that.$.updateShadow(); // using shadow as shim. AG.DashboardManager.showShims(); }); that.$.dropdown.addCallback("hide", function () { that.$.removeClass(ACTIVE_CLASS); // if we are not dragging AG.DashboardManager.hideShims(); }); that.$.hover(function () {}, function () { if (that.$.dropdown.$.is(":visible")) { that.$.dropdown.hide(); } }); } function applyGadgetHoverControls () { var HOVER_CLASS = "gadget-hover"; that.$.hover(function() { AJS.$(".gadget-container", that.$).addClass(HOVER_CLASS); }, function () { AJS.$(".gadget-container", that.$).removeClass(HOVER_CLASS); }); } function applyColorControls () { AJS.$(".gadget-colors a", that.$).click(function (e) { that.setColor(this.parentNode.className); e.preventDefault(); }); } function applyMinimizeControls () { var menuElem = AJS.$("a.minimization, a.maximization", that.$), titleElem = AJS.$(".dashboard-item-title", that.$), maxMinToggle = function (e) { if (that.minimized) that.maximize(); else that.minimize(); AJS.$(this).one(e.type, function (e) { if (that.minimized) that.maximize(); else that.minimize(); AJS.$(this).one(e.type, maxMinToggle); }); }; titleElem.one("dblclick", maxMinToggle); menuElem.one("click", maxMinToggle); /* AJS.$.browser is deprecated, for the preferred feature detection. However feature detection cannot detect safari. */ if (AJS.$.browser.safari) { /* stops double click from selecting title text */ titleElem.get(0).onselectstart = function () { return false; }; } } function applyFocusControls () { var column; AJS.$(".dashboard-item-header", that.$).mousedown(function (e) { if (!that.$.hasClass("maximized")) { if (!column) { column = that.$.layoutRep.parent(); } // hide dropdown if it is visible that.$.dropdown.hide(); that.$.focusTimeout = setTimeout(function() { that.$.updateShadow(); that.$.shadow.show(); delete that.$.focusTimeout; }, 150); that.$.layoutRep.trigger(e); } }); that.$.mouseup(function () { if (that.$.focusTimeout) { clearTimeout(that.$.focusTimeout); } else if (that.$.layoutRep.is(":visible")) { that.$.stop(true, true); that.$.shadow.hide(); } }); } function applyUserPrefControls () { var fauxLists = [], prefForm = AJS.$(".userpref-form", that.$), prefsChanged = false, savePrefForm = function(success) { var submittedState = prefForm.serializeArray(); AJS.$(":checkbox:not(:checked)", prefForm).each(function () { submittedState.push({name: this.name, value: false}); }); AJS.$.ajax({ url: prefForm.attr("action"), type: "POST", data: submittedState, success: success }); }; if (that.isEditable()) { // Creates a neater form element for adding multiple values AJS.$(".list-container", that.$).each(function() { fauxLists.push(new FauxList(this)); }); AJS.$(".edit", that.$).click(function (e) { if (!prefForm.is(":visible")) { if (that.minimized) { that.maximize(); } prefForm.show(); that.getLayoutManager().refresh(); } else { prefForm.hide(); that.getLayoutManager().refresh(); } e.preventDefault(); }); prefForm.submit(function (e) { savePrefForm(function () { window.location.reload(); }); e.preventDefault(); }); AJS.$(":reset", prefForm).click(function () { AJS.$.each(fauxLists, function () { this.reset(); }); prefForm.hide(); that.getLayoutManager().refresh(); }); } /* * Event handler for a customed event "setUserPref". This event * is triggered inside gadgets-dashboard.js -> setUserPref(). * It acts like a buffer for all the setPref() calls. * The results are flushed to the server using ajax later. * arguments e is something like [name1, value1, name2, value2] */ AJS.$("iframe.gadget-iframe", that.$).bind("setUserPref", function (e) { // update the preference form with the given name value pairs for (var i = 1, j = arguments.length; i < j; i += 2) { if (pref_name = arguments[i]) { var pref_value = arguments[i+1]; var input = AJS.$(":input[name='up_" + pref_name + "']", prefForm); // checkbox needs a default value of false if (input.attr("type") == "checkbox") { input.attr("checked", pref_value); } else { input.val(pref_value); } } } // flag for whether a flush is scheduled if(!prefsChanged) { setTimeout(function () { savePrefForm(function () {} ); prefsChanged = false; }, 100); prefsChanged = true; } }); } function applyDeleteControls () { AJS.$("a.delete", that.$).bind("click", function (e) { that.destroy(); e.preventDefault(); }); } function applyViewToggleControls () { AJS.$("a.maximize", that.$).click(function (e) { if (!AG.Gadget.isCanvasView(that.id)) { that.getPublicInstance().setView("canvas"); e.preventDefault(); } else { that.getPublicInstance().setView("default"); e.preventDefault(); } }); } function applyErrorMessage () { AJS.$("iframe.gadget-iframe", that.$).load(function() { AJS.$("#error-gadget-message", AJS.$(this).contents()).html(that.errorMessage); }); } createElement(); setElementShortcuts(); applyDropdownControls(); applyGadgetHoverControls(); applyMinimizeControls(); if (this.isMaximizable) { applyViewToggleControls(); } if (!this.loaded) { applyErrorMessage(); } if (this.getLayoutManager().isWritable()) { applyDeleteControls(); applyFocusControls(); applyColorControls(); applyUserPrefControls(); } }, isEditable: function () { return !!(this.getLayoutManager().isWritable() && this.hasNonHiddenUserPrefs); }, setLayoutManager: function (layoutManager) { if (layoutManager) { this.layoutManager = layoutManager; } else { this.layoutManager = AG.DashboardManager.getLayout(); } }, /** * * Provides access to gadget's Layout manager. When the gadget * needs to know how it's owner is. Such as in the method destroy * where we need to also remove it from the layout. * * @method getLayoutManager */ getLayoutManager: function () { if (!this.layoutManager) { this.setLayoutManager(); } return this.layoutManager; }, /** * Sets gadget chrome colour. Gets chrome and applies associated class and * sends preference back to server to persist. * * @method setColor */ setColor: function (color) { var that = this; that.$.removeClass(that.color).addClass(color); that.color = color; AJS.$.ajax({ type: "post", url: that.colorUrl, data: {method: "put", color: color}, error: function(request) { if (request.status == 403 || request.status == 401) { alert(AG.param.get("dashboardErrorDashboardPermissions")); } else { alert(AG.param.get("dashboardErrorCouldNotSave")); } } }); }, updatePosition: function () { var gadgetCSSToUpdate, layoutCSSToUpdate, that = this; function isGadgetBeingDragged () { return that.$.hasClass("dragging"); } function getCurrentGadgetCSS () { var LAYOUT_REP_OFFSET, dashboard = AG.DashboardManager.getDashboard().contents, DASHBOARD_OFFSET = dashboard.offset(); if (!getCurrentGadgetCSS.cache) { LAYOUT_REP_OFFSET = that.$.layoutRep.offset(); getCurrentGadgetCSS.cache = { left: (LAYOUT_REP_OFFSET.left - DASHBOARD_OFFSET.left) / dashboard.width() * 100 + "%", top: LAYOUT_REP_OFFSET.top - DASHBOARD_OFFSET.top, width: that.$.layoutRep.width() / dashboard.width() * 100 + "%" }; } return getCurrentGadgetCSS.cache; } function getCurrentLayoutRepCSS () { if (!getCurrentLayoutRepCSS.cache) { getCurrentLayoutRepCSS.cache = { height: that.$.height() }; } return getCurrentLayoutRepCSS.cache; } function filterModifiedCSS (lastRecordedCSS, currentCSS) { if (lastRecordedCSS) { AJS.$.each(lastRecordedCSS, function(property){ if (this === currentCSS[property]) { delete currentCSS[property]; } }); } return currentCSS; } if (!isGadgetBeingDragged()) { layoutCSSToUpdate = filterModifiedCSS(this.$.layoutRep.lastRecordedCSS, getCurrentLayoutRepCSS()); this.$.layoutRep.css(layoutCSSToUpdate); this.$.layoutRep.lastRecordedCSS = layoutCSSToUpdate; gadgetCSSToUpdate = filterModifiedCSS(this.$.lastRecordedCSS, getCurrentGadgetCSS()); this.$.css(gadgetCSSToUpdate); this.$.lastRecordedCSS = gadgetCSSToUpdate; if (this.$.hasClass("hidden")) { this.$.removeClass("hidden"); } } }, /** * Minimises gadget. Hides everything but title bar. * * @method maximize */ maximize: function () { var MIN_CLASS = "minimization", MAX_CLASS = "maximization", MIN_TEXT = AG.param.get("minimize"), menuElem = AJS.$("a.minimization, a.maximization", this.$); menuElem.removeClass(MAX_CLASS).addClass(MIN_CLASS).text(MIN_TEXT); // need to reset height to auto because sortable control sets an explicit pixel height this.$.css({height: "auto"}); AJS.$(".dashboard-item-content", this.$).removeClass(MIN_CLASS); // updates positioning of gadgets & their layout references this.getLayoutManager().refresh(); /* erase cookie */ AG.Cookie.erase(this.COOKIE_MINIMIZE); this.minimized = false; }, minimize: function () { var MIN_CLASS = "minimization", MAX_CLASS = "maximization", MAX_TEXT = AG.param.get("expand"), menuElem = AJS.$("a.minimization, a.maximization", this.$); menuElem.removeClass(MIN_CLASS).addClass(MAX_CLASS).text(MAX_TEXT); // need to reset height to auto because sortable control sets an explicit pixel height this.$.css({height: "auto"}); AJS.$(".dashboard-item-content", this.$).addClass(MIN_CLASS); this.getLayoutManager().refresh(); AG.Cookie.save(this.COOKIE_MINIMIZE, "true"); this.minimized = true; }, remove: function () { var that = this; window.setTimeout(function () { that.$.layoutRep.remove(); that.$.remove(); that.getLayoutManager().removeGadget(that.getPublicInstance()); that.getLayoutManager().refresh(); // remove from memory AJS.$.each(this, function (name, property) { property = null; }); }, 10); }, /** * Moves gadget from the dashboard it's currently on to a new dashboard specified * by the target resource URL */ move: function (targetResourceUrl) { this.remove(); AJS.$(AJS.$.ajax({ type: "post", data: {method: "put", id : this.id, title : this.title, titleUrl : this.titleUrl, gadgetSpecUrl : this.gadgetSpecUrl, height : this.$.height(), width : this.$.width(), color : this.color, isMaximizable : this.isMaximizable, userPrefs : this.userPrefs, renderedGadgetUrl : this.renderedGadgetUrl, colorUrl : this.colorUrl, gadgetUrl : this.gadgetUrl, hasNonHiddenUserPrefs : this.hasNonHiddenUserPrefs, column : this.column, loaded : this.loaded }, contentType: "application/json", url: targetResourceUrl + "/gadget/" + this.id })).throbber({target: AJS.$("#dash-throbber")}); }, /** * Removes gadget from dashboard and deletes object references * * @method destroy */ destroy: function () { var that = this; if (confirm(AG.param.get("areYouSure") + " " + that.title + " " + AG.param.get("gadget"))) { AJS.$.ajax({ type: "POST", url: this.gadgetUrl, data: { method: "delete" }, success: function() { that.$.fadeOut(function () { that.remove(); if (that.view === "canvas") { that.setView("default"); } }); }, error: function(request) { if (request.status == 403 || request.status == 401) { alert(AG.param.get("dashboardErrorDashboardPermissions")); } else { alert(AG.param.get("dashboardErrorCouldNotSave")); } } }); } }, /** * Sets the layout of the gadget to either canvas or dashboard. Does * so by delegating layout actions to LayoutManager. * * @method setView * @param {String} view - Accepts either "canvas" or "dashboard" */ setView: function (view) { var MAXIMIZED_CLASS = "maximized", uri, that = this, anchor = this.title.replace(/\s/g,"-") + "/" + this.id, layoutManager = this.getLayoutManager(); function toDefaultViewHandler () { that.getPublicInstance().setView("default"); } if (this.view === view) { return; } if (view === "canvas" || view === "default") { uri = AJS.parseUri(AJS.$("iframe.gadget-iframe", this.$).attr("src")); // for AG-907 / AG- 913 set userprefs in url based on server's userpref values AJS.$.ajax({ async: false, type: "GET", url: this.gadgetUrl, dataType: "json", success: function(rep){ var params = {}; AJS.$(rep.userPrefs.fields).each(function() { params["up_"+this.name] = this.value; }); AJS.$.extend(uri.queryKey, params); } }); AJS.$(".operations li", AG.DashboardManager.getDashboard()).toggleClass("hidden"); if (view === "canvas") { AJS.$.extend(uri.queryKey, { view: "canvas" }); AJS.$("iframe.gadget-iframe", this.$).attr("src", uri.toString()); layoutManager.getContainer().addClass(MAXIMIZED_CLASS); AJS.$(".gadget-container", this.$).addClass(MAXIMIZED_CLASS); AJS.$(".aui-icon",this.$).attr("title", AG.param.get("restoreFromCanvasMode")); this.$.layoutRep.addClass(MAXIMIZED_CLASS); this.$.layoutRep.parent().addClass(MAXIMIZED_CLASS); // Not really sure about this, would prefer to add a class to the body tag. Problem is I can't as I // do not want every gadget to be hidden, in the case of multiple tabs this would cause problems. AJS.$.each(this.getLayoutManager().getGadgets(), function () { if (that.getPublicInstance() !== this) { this.getElement().hide(); } }); AJS.$.extend(uri.queryKey, { view: "canvas" }); AJS.$("iframe.gadget-iframe", this.$).attr("src", uri.toString()); this.maximize(); // add bookmarking capabilities window.location.href = window.location.href.replace(/#.*/, "") + "#" + anchor; AJS.$(".minimize", AG.DashboardManager.getDashboard()).click(toDefaultViewHandler); this.view = "canvas"; } else { layoutManager.getContainer().removeClass(MAXIMIZED_CLASS); AJS.$(".gadget-container", this.$).removeClass(MAXIMIZED_CLASS); AJS.$(".aui-icon",this.$).attr("title", AG.param.get("maximize")); this.$.layoutRep.removeClass(MAXIMIZED_CLASS); this.$.layoutRep.parent().removeClass(MAXIMIZED_CLASS); // Not really sure about this, would prefer to add a class to the body tag. Problem is I can't as I // do not want every gadget to be hidden, in the case of multiple tabs this would cause problems. AJS.$.each(this.getLayoutManager().getGadgets(), function () { if (that.getPublicInstance() !== this) { // seems to be a bug so need to recreate jQuery object to be able to toggle classa this.getElement().show(); } }); AJS.$.extend(uri.queryKey, { view: "default" }); AJS.$("iframe.gadget-iframe", this.$).attr("src", uri.toString()); this.getLayoutManager().refresh(); window.location.href = window.location.href.replace(anchor, ""); AJS.$("a.minimize", AG.DashboardManager.getDashboard()).unbind("click", toDefaultViewHandler); this.view = "default"; } } /* debug */ else { console.warn("AG.Gadget.setView: Ignored! not a valid view. Was supplied '" + view + "' but expected " + "either 'default' or 'canvas'"); } /* debug end */ }, /** * Displays edit preferences form * * @method editPrefs */ editPrefs: function () {}, getPublicInstance: function () { var gadget = this; if (!this.publicInterface) { this.publicInterface = { updatePosition: function () { return gadget.updatePosition.apply(gadget, arguments); }, getLayoutManager: function () { return gadget.getLayoutManager.apply(gadget, arguments); }, setLayoutManager: function () { return gadget.setLayoutManager.apply(gadget, arguments); }, getElement: function () { return gadget.$; }, move: function (targetUrl) { return gadget.move(targetUrl); }, remove: function () { return gadget.remove.apply(gadget, arguments); }, getId: function () { return gadget.id; }, showShim: function () { return gadget.showShim.apply(gadget, arguments); }, hideShim: function () { return gadget.hideShim.apply(gadget, arguments); }, minimize: function () { return gadget.minimize.apply(gadget, arguments); }, maximize: function () { return gadget.minimize.apply(gadget, arguments); } }; if (this.isMaximizable) { this.publicInterface.setView = function () { return gadget.setView.apply(gadget, arguments); }; } } return this.publicInterface; }, init: function (options) { this.COOKIE_MINIMIZE = options.id + ":minimized"; this.minimized = AG.Cookie.read(this.COOKIE_MINIMIZE) === "true"; this.title = options.title; this.color = options.color; this.colorUrl = options.colorUrl; this.gadgetUrl = options.gadgetUrl; this.id = options.id; this.hasNonHiddenUserPrefs = options.hasNonHiddenUserPrefs; this.isMaximizable = options.isMaximizable; this.titleUrl = options.titleUrl; this.gadgetSpecUrl = options.gadgetSpecUrl; this.userPrefs = options.userPrefs; this.renderedGadgetUrl = options.renderedGadgetUrl; this.column = options.column; this.loaded = options.loaded; this.errorMessage = options.errorMessage; this.draw(options); } }; AG.Gadget = function (options) { // Using prototype as there could be many gadgets on the page. This is most memory efficient. var gadget = AJS.clone(Gadget); gadget.init(options); return gadget.getPublicInstance(); }; AG.Gadget.COLORS = [1, 2, 3, 4, 5, 6, 7, 8]; AG.Gadget.getColorAttrName = function (color) { return "color" + color; }; AG.Gadget.isCanvasView = function (gadgetId) { var uri = AJS.parseUri(window.location.href); return new RegExp(gadgetId).test(uri.anchor); }; AG.Gadget.getNullGadgetRepresentation = function (errorGadget) { return AJS.$.extend(errorGadget, { title: AG.param.get("errorGadgetTitle"), renderedGadgetUrl : AG.param.get("errorGadgetUrl"), color: errorGadget.color || "color7" }); }; })(); AG.render = function () { var TEMPLATES_IFRAME_ID = "templates", parsers = {}, setParser = function (template, parser) { parsers[template] = parser; }, getParser = function (template) { return parsers[template]; }, setContext = function () { AG.render.ctx = "body"; /* debug */ if (AG.render.ctx.length === 0) { console.error("AG.render: Rendering Failed!