From d185e8cc05d0b50b4f688e0e2bcba15f39b33f21 Mon Sep 17 00:00:00 2001 From: Eduardo Lundgren Date: Mon, 9 Jun 2008 06:20:15 +0000 Subject: - Added functional demo application - Removed datepicker folder from functional demo folder --- demos/functional/js/beautify.js | 533 +++++++++++++++++++++++ demos/functional/js/behaviour.functionaldemos.js | 13 + demos/functional/js/behaviour.js | 205 +++++++++ demos/functional/js/chili-recipes.js | 163 +++++++ demos/functional/js/functional.demo.js | 175 ++++++++ demos/functional/js/jquery.chili.pack.js | 12 + 6 files changed, 1101 insertions(+) create mode 100644 demos/functional/js/beautify.js create mode 100644 demos/functional/js/behaviour.functionaldemos.js create mode 100644 demos/functional/js/behaviour.js create mode 100644 demos/functional/js/chili-recipes.js create mode 100644 demos/functional/js/functional.demo.js create mode 100644 demos/functional/js/jquery.chili.pack.js (limited to 'demos/functional/js') diff --git a/demos/functional/js/beautify.js b/demos/functional/js/beautify.js new file mode 100644 index 000000000..6c6ef29b4 --- /dev/null +++ b/demos/functional/js/beautify.js @@ -0,0 +1,533 @@ +/* + + JS Beautifier +--------------- + $Date: 2008-04-21 16:13:36 +0300 (Mon, 21 Apr 2008) $ + $Revision: 53 $ + + + Written by Einars "elfz" Lielmanis, + http://elfz.laacz.lv/beautify/ + + Originally converted to javascript by Vital, + http://my.opera.com/Vital/blog/2007/11/21/javascript-beautify-on-javascript-translated + + + You are free to use this in any way you want, in case you find this useful or working for you. + + Usage: + js_beautify(js_source_text); + +*/ + + +function js_beautify(js_source_text, indent_size, indent_character) +{ + + var input, output, token_text, last_type, last_text, last_word, current_mode, modes, indent_level, indent_string; + var whitespace, wordchar, punct, parser_pos, line_starters, in_case; + var prefix, token_type; + + function print_newline(ignore_repeated) + { + ignore_repeated = typeof ignore_repeated === 'undefined' ? true: ignore_repeated; + + // remove trailing whitespace and indent + while (output.length && (output[output.length - 1] === ' ' || output[output.length - 1] === indent_string)) { + output.pop(); + } + + if (!output.length) { + return; // no newline on start of file + } + + if (output[output.length - 1] !== "\n" || !ignore_repeated) { + output.push("\n"); + } + for (var i = 0; i < indent_level; i++) { + output.push(indent_string); + } + } + + + + function print_space() + { + var last_output = output.length ? output[output.length - 1] : ' '; + if (last_output !== ' ' && last_output !== '\n' && last_output !== indent_string) { // prevent occassional duplicate space + output.push(' '); + } + } + + + function print_token() + { + output.push(token_text); + } + + function indent() + { + indent_level++; + } + + + function unindent() + { + if (indent_level) { + indent_level--; + } + } + + + function remove_indent() + { + if (output.length && output[output.length - 1] === indent_string) { + output.pop(); + } + } + + + function set_mode(mode) + { + modes.push(current_mode); + current_mode = mode; + } + + + function restore_mode() + { + current_mode = modes.pop(); + } + + + function in_array(what, arr) + { + for (var i = 0; i < arr.length; i++) + { + if (arr[i] === what) { + return true; + } + } + return false; + } + + + + function get_next_token() + { + var n_newlines = 0; + var c = ''; + + do { + if (parser_pos >= input.length) { + return ['', 'TK_EOF']; + } + c = input.charAt(parser_pos); + + parser_pos += 1; + if (c === "\n") { + n_newlines += 1; + } + } + while (in_array(c, whitespace)); + + if (n_newlines > 1) { + for (var i = 0; i < 2; i++) { + print_newline(i === 0); + } + } + var wanted_newline = (n_newlines === 1); + + + if (in_array(c, wordchar)) { + if (parser_pos < input.length) { + while (in_array(input.charAt(parser_pos), wordchar)) { + c += input.charAt(parser_pos); + parser_pos += 1; + if (parser_pos === input.length) { + break; + } + } + } + + // small and surprisingly unugly hack for 1E-10 representation + if (parser_pos !== input.length && c.match(/^[0-9]+[Ee]$/) && input.charAt(parser_pos) === '-') { + parser_pos += 1; + + var t = get_next_token(parser_pos); + c += '-' + t[0]; + return [c, 'TK_WORD']; + } + + if (c === 'in') { // hack for 'in' operator + return [c, 'TK_OPERATOR']; + } + return [c, 'TK_WORD']; + } + + if (c === '(' || c === '[') { + return [c, 'TK_START_EXPR']; + } + + if (c === ')' || c === ']') { + return [c, 'TK_END_EXPR']; + } + + if (c === '{') { + return [c, 'TK_START_BLOCK']; + } + + if (c === '}') { + return [c, 'TK_END_BLOCK']; + } + + if (c === ';') { + return [c, 'TK_END_COMMAND']; + } + + if (c === '/') { + var comment = ''; + // peek for comment /* ... */ + if (input.charAt(parser_pos) === '*') { + parser_pos += 1; + if (parser_pos < input.length) { + while (! (input.charAt(parser_pos) === '*' && input.charAt(parser_pos + 1) && input.charAt(parser_pos + 1) === '/') && parser_pos < input.length) { + comment += input.charAt(parser_pos); + parser_pos += 1; + if (parser_pos >= input.length) { + break; + } + } + } + parser_pos += 2; + return ['/*' + comment + '*/', 'TK_BLOCK_COMMENT']; + } + // peek for comment // ... + if (input.charAt(parser_pos) === '/') { + comment = c; + while (input.charAt(parser_pos) !== "\x0d" && input.charAt(parser_pos) !== "\x0a") { + comment += input.charAt(parser_pos); + parser_pos += 1; + if (parser_pos >= input.length) { + break; + } + } + parser_pos += 1; + if (wanted_newline) { + print_newline(); + } + return [comment, 'TK_COMMENT']; + } + + } + + if (c === "'" || // string + c === '"' || // string + (c === '/' && + ((last_type === 'TK_WORD' && last_text === 'return') || (last_type === 'TK_START_EXPR' || last_type === 'TK_END_BLOCK' || last_type === 'TK_OPERATOR' || last_type === 'TK_EOF' || last_type === 'TK_END_COMMAND')))) { // regexp + var sep = c; + var esc = false; + c = ''; + + if (parser_pos < input.length) { + + while (esc || input.charAt(parser_pos) !== sep) { + c += input.charAt(parser_pos); + if (!esc) { + esc = input.charAt(parser_pos) === '\\'; + } else { + esc = false; + } + parser_pos += 1; + if (parser_pos >= input.length) { + break; + } + } + + } + + parser_pos += 1; + if (last_type === 'TK_END_COMMAND') { + print_newline(); + } + return [sep + c + sep, 'TK_STRING']; + } + + if (in_array(c, punct)) { + while (parser_pos < input.length && in_array(c + input.charAt(parser_pos), punct)) { + c += input.charAt(parser_pos); + parser_pos += 1; + if (parser_pos >= input.length) { + break; + } + } + return [c, 'TK_OPERATOR']; + } + + return [c, 'TK_UNKNOWN']; + } + + + //---------------------------------- + + indent_character = indent_character || ' '; + indent_size = indent_size || 4; + + indent_string = ''; + while (indent_size--) { + indent_string += indent_character; + } + + input = js_source_text; + + last_word = ''; // last 'TK_WORD' passed + last_type = 'TK_START_EXPR'; // last token type + last_text = ''; // last token text + output = []; + + whitespace = "\n\r\t ".split(''); + wordchar = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789_$'.split(''); + punct = '+ - * / % & ++ -- = += -= *= /= %= == === != !== > < >= <= >> << >>> >>>= >>= <<= && &= | || ! !! , : ? ^ ^= |='.split(' '); + + // words which should always start on new line. + line_starters = 'continue,try,throw,return,var,if,switch,case,default,for,while,break,function'.split(','); + + // states showing if we are currently in expression (i.e. "if" case) - 'EXPRESSION', or in usual block (like, procedure), 'BLOCK'. + // some formatting depends on that. + current_mode = 'BLOCK'; + modes = [current_mode]; + + indent_level = 0; + parser_pos = 0; // parser position + in_case = false; // flag for parser that case/default has been processed, and next colon needs special attention + while (true) { + var t = get_next_token(parser_pos); + token_text = t[0]; + token_type = t[1]; + if (token_type === 'TK_EOF') { + break; + } + + switch (token_type) { + + case 'TK_START_EXPR': + + set_mode('EXPRESSION'); + if (last_type === 'TK_END_EXPR' || last_type === 'TK_START_EXPR') { + // do nothing on (( and )( and ][ and ]( .. + } else if (last_type !== 'TK_WORD' && last_type !== 'TK_OPERATOR') { + print_space(); + } else if (in_array(last_word, line_starters) && last_word !== 'function') { + print_space(); + } + print_token(); + break; + + case 'TK_END_EXPR': + + print_token(); + restore_mode(); + break; + + case 'TK_START_BLOCK': + + set_mode('BLOCK'); + if (last_type !== 'TK_OPERATOR' && last_type !== 'TK_START_EXPR') { + if (last_type === 'TK_START_BLOCK') { + print_newline(); + } else { + print_space(); + } + } + print_token(); + indent(); + break; + + case 'TK_END_BLOCK': + if (last_type === 'TK_START_BLOCK') { + // nothing + unindent(); + } else { + unindent(); + print_newline(); + } + print_token(); + restore_mode(); + break; + + case 'TK_WORD': + + if (token_text === 'case' || token_text === 'default') { + if (last_text === ':') { + // switch cases following one another + remove_indent(); + } else { + // case statement starts in the same line where switch + unindent(); + print_newline(); + indent(); + } + print_token(); + in_case = true; + break; + } + + prefix = 'NONE'; + if (last_type === 'TK_END_BLOCK') { + if (!in_array(token_text.toLowerCase(), ['else', 'catch', 'finally'])) { + prefix = 'NEWLINE'; + } else { + prefix = 'SPACE'; + print_space(); + } + } else if (last_type === 'TK_END_COMMAND' && current_mode === 'BLOCK') { + prefix = 'NEWLINE'; + } else if (last_type === 'TK_END_COMMAND' && current_mode === 'EXPRESSION') { + prefix = 'SPACE'; + } else if (last_type === 'TK_WORD') { + prefix = 'SPACE'; + } else if (last_type === 'TK_START_BLOCK') { + prefix = 'NEWLINE'; + } else if (last_type === 'TK_END_EXPR') { + print_space(); + prefix = 'NEWLINE'; + } + + if (in_array(token_text, line_starters) || prefix === 'NEWLINE') { + + if (last_text === 'else') { + // no need to force newline on else break + print_space(); + } else if ((last_type === 'TK_START_EXPR' || last_text === '=') && token_text === 'function') { + // no need to force newline on 'function': (function + // DONOTHING + } else if (last_type === 'TK_WORD' && (last_text === 'return' || last_text === 'throw')) { + // no newline between 'return nnn' + print_space(); + } else if (last_type !== 'TK_END_EXPR') { + if ((last_type !== 'TK_START_EXPR' || token_text !== 'var') && last_text !== ':') { + // no need to force newline on 'var': for (var x = 0...) + if (token_text === 'if' && last_type === 'TK_WORD' && last_word === 'else') { + // no newline for } else if { + print_space(); + } else { + print_newline(); + } + } + } + } else if (prefix === 'SPACE') { + print_space(); + } + print_token(); + last_word = token_text; + break; + + case 'TK_END_COMMAND': + + print_token(); + break; + + case 'TK_STRING': + + if (last_type === 'TK_START_BLOCK' || last_type === 'TK_END_BLOCK') { + print_newline(); + } else if (last_type === 'TK_WORD') { + print_space(); + } + print_token(); + break; + + case 'TK_OPERATOR': + + var start_delim = true; + var end_delim = true; + + if (token_text === ':' && in_case) { + print_token(); // colon really asks for separate treatment + print_newline(); + break; + } + + in_case = false; + + if (token_text === ',') { + if (last_type === 'TK_END_BLOCK') { + print_token(); + print_newline(); + } else { + if (current_mode === 'BLOCK') { + print_token(); + print_newline(); + } else { + print_token(); + print_space(); + } + } + break; + } else if (token_text === '--' || token_text === '++') { // unary operators special case + if (last_text === ';') { + // space for (;; ++i) + start_delim = true; + end_delim = false; + } else { + start_delim = false; + end_delim = false; + } + } else if (token_text === '!' && last_type === 'TK_START_EXPR') { + // special case handling: if (!a) + start_delim = false; + end_delim = false; + } else if (last_type === 'TK_OPERATOR') { + start_delim = false; + end_delim = false; + } else if (last_type === 'TK_END_EXPR') { + start_delim = true; + end_delim = true; + } else if (token_text === '.') { + // decimal digits or object.property + start_delim = false; + end_delim = false; + + } else if (token_text === ':') { + // zz: xx + // can't differentiate ternary op, so for now it's a ? b: c; without space before colon + start_delim = false; + } + if (start_delim) { + print_space(); + } + + print_token(); + + if (end_delim) { + print_space(); + } + break; + + case 'TK_BLOCK_COMMENT': + + print_newline(); + print_token(); + print_newline(); + break; + + case 'TK_COMMENT': + + // print_newline(); + print_space(); + print_token(); + print_newline(); + break; + + case 'TK_UNKNOWN': + print_token(); + break; + } + + last_type = token_type; + last_text = token_text; + } + + return output.join(''); + +} diff --git a/demos/functional/js/behaviour.functionaldemos.js b/demos/functional/js/behaviour.functionaldemos.js new file mode 100644 index 000000000..8e375db28 --- /dev/null +++ b/demos/functional/js/behaviour.functionaldemos.js @@ -0,0 +1,13 @@ +$(document).ready(function() { + + $('.component-links a').click(function() { + var comp = $(this).attr('href').replace(/^#/, ""); + loadDemo(comp); + }); + + // hash listener + if (location.hash) { + loadDemo(location.hash.replace(/^#/, "")); + } + +}); \ No newline at end of file diff --git a/demos/functional/js/behaviour.js b/demos/functional/js/behaviour.js new file mode 100644 index 000000000..2ac0305f7 --- /dev/null +++ b/demos/functional/js/behaviour.js @@ -0,0 +1,205 @@ +$(document).ready(function() { + + // link demos + + $(".demoflow div.wrapper").click(function() { + + var demo = $(this).children('img').attr('_demo'); + + if (demo) { + location.href = '/repository/real-world/' + demo; + }else { + //alert('Under construction!'); + } + + }); + + if ($("div.demoflow").size()) { + + var inst = new $.ui.carousel($("div.demoflow")[0], { height: 200, width: 310 }); + + $("div.demoflow-button-left, div.demoflow-button-right").bind("mousedown", function() { + var right = this.className.indexOf("right") == -1; + if(inst.autoRotator) window.clearInterval(inst.autoRotator); + inst.timer = window.setInterval(function() { inst.rotate(right ? "right" : null); }, 13); + }) + .bind("mouseup", function() { + window.clearInterval(inst.timer); + }); + + $('.demoflow div.shadow').hover(function() { + this._lastopacity = $(this).css('opacity'); + $(this).stop().animate({opacity: 0 }, 300); + }, function() { + $(this).stop().animate({opacity: this._lastopacity }, 300); + }); + + + window.setTimeout(function() { + inst.element.animate({ opacity: 1 },2000); inst.rotate(0,2000,0.45); + window.setTimeout(function() { + inst.autoRotator = window.setInterval(function() { inst.rotate(0,2000,0.45); },5000); + },3000); + },0); + + } + + $('a').click(function(){ + this.blur(); + }); + + // smooth hover effects by DragonInteractive + var hover = hoverEffects(); + hover.init(); + +}); + + $.ui.carousel = function(element, options) { + + this.element = $(element); + this.options = $.extend({}, options); + var self = this; + + $.extend(this, { + start: Math.PI/2, + step: 2*Math.PI/$("> *", this.element).length, + radiusX: 400, + radiusY: -45, + paddingX: this.element.outerWidth() / 2, + paddingY: this.element.outerHeight() / 2 + }); + + $("> *", this.element).css({ position: "absolute", top: 0, left: 0, zIndex: 1 }); + this.rotate(); + this.rotate("right"); + + this.element.parent().bind("mousewheel", function(e,delta) { + if(self.autoRotator) window.clearInterval(self.autoRotator); + self.rotate(delta < 0 ? "right" : "left"); + return false; + }); + + }; + + $.ui.carousel.prototype.rotate = function(d,ani,speed) { + + this.start = this.start + (d == "right" ? -(speed || 0.03) : (speed || 0.03)); + var o = this.options; + var self = this; + + setTimeout(function(){ + $("> *", self.element).each(function(i) { + var angle = self.start + i * self.step; + var x = self.radiusX * Math.cos(angle); + var y = self.radiusY * Math.sin(angle); + var _self = this; + + var width = o.width * ((self.radiusY+y) / (2 * self.radiusY)); + width = (width * width * width) / (o.width * o.width); //This makes the pieces smaller + var height = parseInt(width * o.height / o.width); + + //This is highly custom - it will hide the elements at the back + $(_self).css({ visibility: height < 30 ? "hidden" : "visible" }); + if(height < 30 && !ani) return; //This imrpoves the speed, but cannot be used with animation + + + if(ani) { + $(_self).animate({ + top: Math.round(self.paddingY + y - height/2) + "px", + left: Math.round(self.paddingX + x - width/2) + "px", + width: Math.round(width) + "px", + height: Math.round(height) + "px" + },{ duration: ani, easing: "easeOutQuad" }); + $(_self).css({ zIndex: Math.round(parseInt(100 * (self.radiusY+y) / (2 * self.radiusY))) }); + } else { + $(_self).css({ + top: self.paddingY + y - height/2 + "px", + left: self.paddingX + x - width/2 + "px", + width: width + "px", + height: height + "px", + zIndex: parseInt(100 * (self.radiusY+y) / (2 * self.radiusY)) + }); + } + + $("div.shadow",_self).css({ opacity: 1 - (width / o.width) }); + + }); + }, 0); + } + + +/** + * All credit here goes to DragonInteractive and Yuri Vishnevsky + */ +var hoverEffects = function() { + var me = this; + var args = arguments; + var self = { + c: { + navItems: '.download .click-to-download, #launch-pad .launch-pad-button, div.demoflow-button-left, div.demoflow-button-right', + navSpeed: ($.browser.safari ? 600: 350), + snOpeningSpeed: ($.browser.safari ? 400: 250), + snOpeningTimeout: 150, + snClosingSpeed: function() { + if (self.subnavHovered()) return 123450; + return 150 + }, + snClosingTimeout: 700 + }, + init: function() { + //$('.bg', this.c.navItems).css({ + // 'opacity': 0 + //}); + this.initHoverFades() + }, + subnavHovered: function() { + var hovered = false; + $(self.c.navItems).each(function() { + if (this.hovered) hovered = true + }); + return hovered + }, + initHoverFades: function() { + //$('#navigation .bg').css('opacity', 0); + $(self.c.navItems).hover(function() { + self.fadeNavIn.apply(this) + }, + function() { + var el = this; + setTimeout(function() { + if (!el.open) self.fadeNavOut.apply(el) + }, + 10) + }) + }, + fadeNavIn: function() { + $('.bg', this).stop().animate({ + 'opacity': 1 + }, + self.c.navSpeed) + }, + fadeNavOut: function() { + $('.bg', this).stop().animate({ + 'opacity': 0 + }, + self.c.navSpeed) + }, + initSubmenus: function() { + $(this.c.navItems).hover(function() { + $(self.c.navItems).not(this).each(function() { + self.fadeNavOut.apply(this); + }); + this.hovered = true; + var el = this; + self.fadeNavIn.apply(el); + }, + function() { + this.hovered = false; + var el = this; + if (!el.open) self.fadeNavOut.apply(el); + }) + } + }; + + return self; +}; \ No newline at end of file diff --git a/demos/functional/js/chili-recipes.js b/demos/functional/js/chili-recipes.js new file mode 100644 index 000000000..727ffa09c --- /dev/null +++ b/demos/functional/js/chili-recipes.js @@ -0,0 +1,163 @@ +/* +=============================================================================== +Chili is the jQuery code highlighter plugin +............................................................................... + Copyright 2007 / Andrea Ercolino +------------------------------------------------------------------------------- +LICENSE: http://www.opensource.org/licenses/mit-license.php +WEBSITE: http://noteslog.com/chili/ +=============================================================================== +*/ + +/* +this file shows how to configure a static setup +it must be linked from the head of a page like: + +*/ + +ChiliBook.recipeLoading = false; + +ChiliBook.recipes[ "jquery.js" ] = +{ + steps: + { + mlcom : { exp: /\/\*[^*]*\*+(?:[^\/][^*]*\*+)*\// } + , com : { exp: /\/\/.*/ } + , regexp : { exp: /\/[^\/\\\n]*(?:\\.[^\/\\\n]*)*\/[gim]*/ } + , string : { exp: /(?:\'[^\'\\\n]*(?:\\.[^\'\\\n]*)*\')|(?:\"[^\"\\\n]*(?:\\.[^\"\\\n]*)*\")/ } + , numbers : { exp: /\b[+-]?(?:\d*\.?\d+|\d+\.?\d*)(?:[eE][+-]?\d+)?\b/ } + , keywords: { exp: /\b(arguments|break|case|catch|continue|default|delete|do|else|false|for|function|if|in|instanceof|new|null|return|switch|this|true|try|typeof|var|void|while|with)\b/ } + , global : { exp: /\b(toString|valueOf|window|element|prototype|constructor|document|escape|unescape|parseInt|parseFloat|setTimeout|clearTimeout|setInterval|clearInterval|NaN|isNaN|Infinity)\b/ } + + , "jquery utilities" : { + exp : /(?:\$\.browser|\$\.each|\$\.extend|\$\.grep|\$\.map|\$\.merge|\$\.trim)\b/ + , replacement: '$$' + } + ,"jquery private" : { + exp : /(?:\$\.find|\$\.parents|\$\.sibling|\.domManip|\.eventTesting|\.extend|\.get|\.init|\.jquery|\.pushStack)\b/ + , replacement: '$$' + } + ,"jquery ajax" : { + exp : /(?:\$\.ajax|\$\.ajaxSetup|\$\.ajaxTimeout|\$\.get|\$\.getIfModified|\$\.getJSON|\$\.getScript|\$\.post|.ajaxComplete|.ajaxError|.ajaxSend|.ajaxStart|.ajaxStop|.ajaxSuccess|.load|.loadIfModified|.serialize)\b/ + , replacement: '$$' + } + , "jquery object" : { + exp : /jQuery|\$(?=\W)/ + , replacement: '$$' + } + ,"jquery core" : { + exp : /\$\.extend|\$\.noConflict|\.(?:each|eq|get|gt|index|lt|size)\b/ + , replacement: '$$' + } + ,"jquery css" : { + exp : /\.(?:css|height|width)\b/ + , replacement: '$$' + } + ,"jquery attributes" : { + exp : /\.(?:addClass|attr|html|removeAttr|removeClass|text|toggleClass|val)\b/ + , replacement: '$$' + } + ,"jquery traversing" : { + exp : /\.(?:add|children|contains|end|filter|find|is|next|not|parent|parents|prev|siblings)\b/ + , replacement: '$$' + } + ,"jquery manipulation": { + exp : /\.(?:after|append|appendTo|before|clone|empty|insertAfter|insertBefore|prepend|prependTo|remove|wrap)\b/ + , replacement: '$$' + } + ,"jquery effects" : { + exp : /\.(?:animate|fadeIn|fadeOut|fadeTo|hide|show|slideDown|slideToggle|slideUp|toggle)\b/ + , replacement: '$$' + } + ,"jquery events" : { + exp : /\.(?:bind|blur|change|click|dblclick|error|focus|hover|keydown|keypress|keyup|load|mousedown|mousemove|mouseout|mouseover|mouseup|one|ready|resize|scroll|select|submit|toggle|trigger|unbind|unload)\b/ + , replacement: '$$' + } + } +}; + +ChiliBook.recipes[ "html.js" ] = +{ + steps: { + mlcom : { exp: /\