/* Minification failed. Returning unminified contents.
(32938,3,32940,4): run-time error JS1314: Implicit property name must be identifier: _formatPrice(prices) {
return !this.showPrices || prices[0] === 0 ? '' : '$' + parseFloat(prices[0].value).toFixed(2);
}
(32943,5,32965,6): run-time error JS1314: Implicit property name must be identifier: _formatMenu(menus) {
for (var m = 0; m < menus.length; m++) {
var menu = menus[m];
// update featured items
for (var i = 0; i < menu.featuredItems.length; i++) {
var item = menu.featuredItems[i];
item.price = this._formatPrice(item.prices);
item.imageHtml = this.showImages && item.imagePath
? '
' : '';
}
for (var s = 0; s < menu.sections.length; s++) {
var section = menu.sections[s];
// update menu items
for (var i = 0; i < section.menuItems.length; i++) {
var item = section.menuItems[i];
item.price = this._formatPrice(item.prices);
item.imageHtml = this.showImages && item.thumbPath
? '
' : '';
}
}
}
return menus;
}
(32967,5,32973,6): run-time error JS1314: Implicit property name must be identifier: _findMenu(menuId) {
for (var m = 0; m < this.menus.length; m++) {
if (this.menus[m].id === menuId) {
return this.menus[m];
}
}
}
(32975,5,32984,6): run-time error JS1314: Implicit property name must be identifier: _findSection(sectionId) {
for (var m = 0; m < this.menus.length; m++) {
var menu = this.menus[m];
for (var s = 0; s < menu.sections.length; s++) {
if (menu.sections[s].id === sectionId) {
return menu.sections[s];
}
}
}
}
*/
/*
Copyright(c) 2011 Sencha Inc.
licensing@sencha.com
http://www.sencha.com/touchlicense
*/
if (typeof Ext === "undefined") {
Ext = {};
}
Ext.apply = (function() {
for(var key in {valueOf:1}) {
return function(object, config, defaults) {
if (defaults) {
Ext.apply(object, defaults);
}
if (object && config && typeof config === 'object') {
for (var key in config) {
object[key] = config[key];
}
}
return object;
};
}
return function(object, config, defaults) {
if (defaults) {
Ext.apply(object, defaults);
}
if (object && config && typeof config === 'object') {
for (var key in config) {
object[key] = config[key];
}
if (config.toString !== Object.prototype.toString) {
object.toString = config.toString;
}
if (config.valueOf !== Object.prototype.valueOf) {
object.valueOf = config.valueOf;
}
}
return object;
};
})();
Ext.apply(Ext, {
platformVersion: '1.0',
platformVersionDetail: {
major: 1,
minor: 0,
patch: 3
},
userAgent: navigator.userAgent.toLowerCase(),
cache: {},
idSeed: 1000,
BLANK_IMAGE_URL : 'data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==',
isStrict: document.compatMode == "CSS1Compat",
windowId: 'ext-window',
documentId: 'ext-document',
emptyFn : function() {},
isSecure : /^https/i.test(window.location.protocol),
isReady : false,
enableGarbageCollector : true,
enableListenerCollection : true,
applyIf : function(object, config) {
var property, undefined;
if (object) {
for (property in config) {
if (object[property] === undefined) {
object[property] = config[property];
}
}
}
return object;
},
repaint : function() {
var mask = Ext.getBody().createChild({
cls: 'x-mask x-mask-transparent'
});
setTimeout(function() {
mask.remove();
}, 0);
},
id : function(el, prefix) {
el = Ext.getDom(el) || {};
if (el === document) {
el.id = this.documentId;
}
else if (el === window) {
el.id = this.windowId;
}
el.id = el.id || ((prefix || 'ext-gen') + (++Ext.idSeed));
return el.id;
},
extend : function() {
var inlineOverrides = function(o){
for (var m in o) {
if (!o.hasOwnProperty(m)) {
continue;
}
this[m] = o[m];
}
};
var objectConstructor = Object.prototype.constructor;
return function(subclass, superclass, overrides){
if (Ext.isObject(superclass)) {
overrides = superclass;
superclass = subclass;
subclass = overrides.constructor != objectConstructor
? overrides.constructor
: function(){ superclass.apply(this, arguments); };
}
if (!superclass) {
throw "Attempting to extend from a class which has not been loaded on the page.";
}
var F = function(){},
subclassProto,
superclassProto = superclass.prototype;
F.prototype = superclassProto;
subclassProto = subclass.prototype = new F();
subclassProto.constructor = subclass;
subclass.superclass = superclassProto;
if(superclassProto.constructor == objectConstructor){
superclassProto.constructor = superclass;
}
subclass.override = function(overrides){
Ext.override(subclass, overrides);
};
subclassProto.superclass = subclassProto.supr = (function(){
return superclassProto;
});
subclassProto.override = inlineOverrides;
subclassProto.proto = subclassProto;
subclass.override(overrides);
subclass.extend = function(o) {
return Ext.extend(subclass, o);
};
return subclass;
};
}(),
override : function(origclass, overrides) {
Ext.apply(origclass.prototype, overrides);
},
namespace : function() {
var ln = arguments.length,
i, value, split, x, xln, parts, object;
for (i = 0; i < ln; i++) {
value = arguments[i];
parts = value.split(".");
if (window.Ext) {
object = window[parts[0]] = Object(window[parts[0]]);
} else {
object = arguments.callee.caller.arguments[0];
}
for (x = 1, xln = parts.length; x < xln; x++) {
object = object[parts[x]] = Object(object[parts[x]]);
}
}
return object;
},
urlEncode : function(o, pre) {
var empty,
buf = [],
e = encodeURIComponent;
Ext.iterate(o, function(key, item){
empty = Ext.isEmpty(item);
Ext.each(empty ? key : item, function(val){
buf.push('&', e(key), '=', (!Ext.isEmpty(val) && (val != key || !empty)) ? (Ext.isDate(val) ? Ext.encode(val).replace(/"/g, '') : e(val)) : '');
});
});
if(!pre){
buf.shift();
pre = '';
}
return pre + buf.join('');
},
urlDecode : function(string, overwrite) {
if (Ext.isEmpty(string)) {
return {};
}
var obj = {},
pairs = string.split('&'),
d = decodeURIComponent,
name,
value;
Ext.each(pairs, function(pair) {
pair = pair.split('=');
name = d(pair[0]);
value = d(pair[1]);
obj[name] = overwrite || !obj[name] ? value : [].concat(obj[name]).concat(value);
});
return obj;
},
htmlEncode : function(value) {
return Ext.util.Format.htmlEncode(value);
},
htmlDecode : function(value) {
return Ext.util.Format.htmlDecode(value);
},
urlAppend : function(url, s) {
if (!Ext.isEmpty(s)) {
return url + (url.indexOf('?') === -1 ? '?' : '&') + s;
}
return url;
},
toArray : function(array, start, end) {
return Array.prototype.slice.call(array, start || 0, end || array.length);
},
each : function(array, fn, scope) {
if (Ext.isEmpty(array, true)) {
return 0;
}
if (!Ext.isIterable(array) || Ext.isPrimitive(array)) {
array = [array];
}
for (var i = 0, len = array.length; i < len; i++) {
if (fn.call(scope || array[i], array[i], i, array) === false) {
return i;
}
}
return true;
},
iterate : function(obj, fn, scope) {
if (Ext.isEmpty(obj)) {
return;
}
if (Ext.isIterable(obj)) {
Ext.each(obj, fn, scope);
return;
}
else if (Ext.isObject(obj)) {
for (var prop in obj) {
if (obj.hasOwnProperty(prop)) {
if (fn.call(scope || obj, prop, obj[prop], obj) === false) {
return;
}
}
}
}
},
pluck : function(arr, prop) {
var ret = [];
Ext.each(arr, function(v) {
ret.push(v[prop]);
});
return ret;
},
getBody : function() {
return Ext.get(document.body || false);
},
getHead : function() {
var head;
return function() {
if (head == undefined) {
head = Ext.get(DOC.getElementsByTagName("head")[0]);
}
return head;
};
}(),
getDoc : function() {
return Ext.get(document);
},
getCmp : function(id) {
return Ext.ComponentMgr.get(id);
},
getOrientation: function() {
return window.innerHeight > window.innerWidth ? 'portrait' : 'landscape';
},
isIterable : function(v) {
if (!v) {
return false;
}
if (Ext.isArray(v) || v.callee) {
return true;
}
if (/NodeList|HTMLCollection/.test(Object.prototype.toString.call(v))) {
return true;
}
return ((typeof v.nextNode != 'undefined' || v.item) && Ext.isNumber(v.length)) || false;
},
num : function(v, defaultValue) {
v = Number(Ext.isEmpty(v) || Ext.isArray(v) || typeof v == 'boolean' || (typeof v == 'string' && Ext.util.Format.trim(v).length == 0) ? NaN : v);
return isNaN(v) ? defaultValue : v;
},
isEmpty : function(value, allowBlank) {
var isNull = value == null,
emptyArray = (Ext.isArray(value) && !value.length),
blankAllowed = !allowBlank ? value === '' : false;
return isNull || emptyArray || blankAllowed;
},
isArray : function(v) {
return Object.prototype.toString.apply(v) === '[object Array]';
},
isDate : function(v) {
return Object.prototype.toString.apply(v) === '[object Date]';
},
isObject : function(v) {
return !!v && !v.tagName && Object.prototype.toString.call(v) === '[object Object]';
},
isPrimitive : function(v) {
return Ext.isString(v) || Ext.isNumber(v) || Ext.isBoolean(v);
},
isFunction : function(v) {
return Object.prototype.toString.apply(v) === '[object Function]';
},
isNumber : function(v) {
return Object.prototype.toString.apply(v) === '[object Number]' && isFinite(v);
},
isString : function(v) {
return typeof v === 'string';
},
isBoolean : function(v) {
return Object.prototype.toString.apply(v) === '[object Boolean]';
},
isElement : function(v) {
return v ? !!v.tagName : false;
},
isDefined : function(v){
return typeof v !== 'undefined';
},
destroy : function() {
var ln = arguments.length,
i, arg;
for (i = 0; i < ln; i++) {
arg = arguments[i];
if (arg) {
if (Ext.isArray(arg)) {
this.destroy.apply(this, arg);
}
else if (Ext.isFunction(arg.destroy)) {
arg.destroy();
}
else if (arg.dom) {
arg.remove();
}
}
}
}
});
Ext.SSL_SECURE_URL = Ext.isSecure && 'about:blank';
Ext.ns = Ext.namespace;
Ext.ns(
'Ext.util',
'Ext.data',
'Ext.list',
'Ext.form',
'Ext.menu',
'Ext.state',
'Ext.layout',
'Ext.app',
'Ext.ux',
'Ext.plugins',
'Ext.direct',
'Ext.lib',
'Ext.gesture'
);
Ext.util.Observable = Ext.extend(Object, {
isObservable: true,
constructor: function(config) {
var me = this;
Ext.apply(me, config);
if (me.listeners) {
me.on(me.listeners);
delete me.listeners;
}
me.events = me.events || {};
if (this.bubbleEvents) {
this.enableBubble(this.bubbleEvents);
}
},
eventOptionsRe : /^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate|element|vertical|horizontal)$/,
addManagedListener : function(item, ename, fn, scope, options) {
var me = this,
managedListeners = me.managedListeners = me.managedListeners || [],
config;
if (Ext.isObject(ename)) {
options = ename;
for (ename in options) {
if (!options.hasOwnProperty(ename)) {
continue;
}
config = options[ename];
if (!me.eventOptionsRe.test(ename)) {
me.addManagedListener(item, ename, config.fn || config, config.scope || options.scope, config.fn ? config : options);
}
}
}
else {
managedListeners.push({
item: item,
ename: ename,
fn: fn,
scope: scope,
options: options
});
item.on(ename, fn, scope, options);
}
},
removeManagedListener : function(item, ename, fn, scope) {
var me = this,
o,
config,
managedListeners,
managedListener,
length,
i;
if (Ext.isObject(ename)) {
o = ename;
for (ename in o) {
if (!o.hasOwnProperty(ename)) {
continue;
}
config = o[ename];
if (!me.eventOptionsRe.test(ename)) {
me.removeManagedListener(item, ename, config.fn || config, config.scope || o.scope);
}
}
}
managedListeners = this.managedListeners ? this.managedListeners.slice() : [];
length = managedListeners.length;
for (i = 0; i < length; i++) {
managedListener = managedListeners[i];
if (managedListener.item === item && managedListener.ename === ename && (!fn || managedListener.fn === fn) && (!scope || managedListener.scope === scope)) {
this.managedListeners.remove(managedListener);
item.un(managedListener.ename, managedListener.fn, managedListener.scope);
}
}
},
fireEvent: function() {
var me = this,
a = Ext.toArray(arguments),
ename = a[0].toLowerCase(),
ret = true,
ev = me.events[ename],
queue = me.eventQueue,
parent;
if (me.eventsSuspended === true) {
if (queue) {
queue.push(a);
}
return false;
}
else if (ev && Ext.isObject(ev) && ev.bubble) {
if (ev.fire.apply(ev, a.slice(1)) === false) {
return false;
}
parent = me.getBubbleTarget && me.getBubbleTarget();
if (parent && parent.isObservable) {
if (!parent.events[ename] || !Ext.isObject(parent.events[ename]) || !parent.events[ename].bubble) {
parent.enableBubble(ename);
}
return parent.fireEvent.apply(parent, a);
}
}
else if (ev && Ext.isObject(ev)) {
a.shift();
ret = ev.fire.apply(ev, a);
}
return ret;
},
addListener: function(ename, fn, scope, o) {
var me = this,
config,
ev;
if (Ext.isObject(ename)) {
o = ename;
for (ename in o) {
if (!o.hasOwnProperty(ename)) {
continue;
}
config = o[ename];
if (!me.eventOptionsRe.test(ename)) {
me.addListener(ename, config.fn || config, config.scope || o.scope, config.fn ? config : o);
}
}
}
else {
ename = ename.toLowerCase();
me.events[ename] = me.events[ename] || true;
ev = me.events[ename] || true;
if (Ext.isBoolean(ev)) {
me.events[ename] = ev = new Ext.util.Event(me, ename);
}
ev.addListener(fn, scope, Ext.isObject(o) ? o: {});
}
},
removeListener: function(ename, fn, scope) {
var me = this,
config,
ev;
if (Ext.isObject(ename)) {
var o = ename;
for (ename in o) {
if (!o.hasOwnProperty(ename)) {
continue;
}
config = o[ename];
if (!me.eventOptionsRe.test(ename)) {
me.removeListener(ename, config.fn || config, config.scope || o.scope);
}
}
}
else {
ename = ename.toLowerCase();
ev = me.events[ename];
if (ev.isEvent) {
ev.removeListener(fn, scope);
}
}
},
clearListeners: function() {
var events = this.events,
ev,
key;
for (key in events) {
if (!events.hasOwnProperty(key)) {
continue;
}
ev = events[key];
if (ev.isEvent) {
ev.clearListeners();
}
}
this.clearManagedListeners();
},
purgeListeners : function() {
console.warn('MixedCollection: purgeListeners has been deprecated. Please use clearListeners.');
return this.clearListeners.apply(this, arguments);
},
clearManagedListeners : function() {
var managedListeners = this.managedListeners || [],
ln = managedListeners.length,
i, managedListener;
for (i = 0; i < ln; i++) {
managedListener = managedListeners[i];
managedListener.item.un(managedListener.ename, managedListener.fn, managedListener.scope);
}
this.managedListener = [];
},
purgeManagedListeners : function() {
console.warn('MixedCollection: purgeManagedListeners has been deprecated. Please use clearManagedListeners.');
return this.clearManagedListeners.apply(this, arguments);
},
addEvents: function(o) {
var me = this;
me.events = me.events || {};
if (Ext.isString(o)) {
var a = arguments,
i = a.length;
while (i--) {
me.events[a[i]] = me.events[a[i]] || true;
}
} else {
Ext.applyIf(me.events, o);
}
},
hasListener: function(ename) {
var e = this.events[ename];
return e.isEvent === true && e.listeners.length > 0;
},
suspendEvents: function(queueSuspended) {
this.eventsSuspended = true;
if (queueSuspended && !this.eventQueue) {
this.eventQueue = [];
}
},
resumeEvents: function() {
var me = this,
queued = me.eventQueue || [];
me.eventsSuspended = false;
delete me.eventQueue;
Ext.each(queued,
function(e) {
me.fireEvent.apply(me, e);
});
},
relayEvents : function(origin, events, prefix) {
prefix = prefix || '';
var me = this,
len = events.length,
i, ename;
function createHandler(ename){
return function(){
return me.fireEvent.apply(me, [prefix + ename].concat(Array.prototype.slice.call(arguments, 0, -1)));
};
}
for(i = 0, len = events.length; i < len; i++){
ename = events[i].substr(prefix.length);
me.events[ename] = me.events[ename] || true;
origin.on(ename, createHandler(ename), me);
}
},
enableBubble: function(events) {
var me = this;
if (!Ext.isEmpty(events)) {
events = Ext.isArray(events) ? events: Ext.toArray(arguments);
Ext.each(events,
function(ename) {
ename = ename.toLowerCase();
var ce = me.events[ename] || true;
if (Ext.isBoolean(ce)) {
ce = new Ext.util.Event(me, ename);
me.events[ename] = ce;
}
ce.bubble = true;
});
}
}
});
Ext.override(Ext.util.Observable, {
on: Ext.util.Observable.prototype.addListener,
un: Ext.util.Observable.prototype.removeListener,
mon: Ext.util.Observable.prototype.addManagedListener,
mun: Ext.util.Observable.prototype.removeManagedListener
});
Ext.util.Observable.releaseCapture = function(o) {
o.fireEvent = Ext.util.Observable.prototype.fireEvent;
};
Ext.util.Observable.capture = function(o, fn, scope) {
o.fireEvent = Ext.createInterceptor(o.fireEvent, fn, scope);
};
Ext.util.Observable.observe = function(cls, listeners) {
if (cls) {
if (!cls.isObservable) {
Ext.applyIf(cls, new Ext.util.Observable());
Ext.util.Observable.capture(cls.prototype, cls.fireEvent, cls);
}
if (typeof listeners == 'object') {
cls.on(listeners);
}
return cls;
}
};
Ext.util.Observable.observeClass = Ext.util.Observable.observe;
Ext.util.Event = Ext.extend(Object, (function() {
function createBuffered(handler, listener, o, scope) {
listener.task = new Ext.util.DelayedTask();
return function() {
listener.task.delay(o.buffer, handler, scope, Ext.toArray(arguments));
};
};
function createDelayed(handler, listener, o, scope) {
return function() {
var task = new Ext.util.DelayedTask();
if (!listener.tasks) {
listener.tasks = [];
}
listener.tasks.push(task);
task.delay(o.delay || 10, handler, scope, Ext.toArray(arguments));
};
};
function createSingle(handler, listener, o, scope) {
return function() {
listener.ev.removeListener(listener.fn, scope);
return handler.apply(scope, arguments);
};
};
return {
isEvent: true,
constructor: function(observable, name) {
this.name = name;
this.observable = observable;
this.listeners = [];
},
addListener: function(fn, scope, options) {
var me = this,
listener;
scope = scope || me.observable;
if (!me.isListening(fn, scope)) {
listener = me.createListener(fn, scope, options);
if (me.firing) {
me.listeners = me.listeners.slice(0);
}
me.listeners.push(listener);
}
},
createListener: function(fn, scope, o) {
o = o || {};
scope = scope || this.observable;
var listener = {
fn: fn,
scope: scope,
o: o,
ev: this
},
handler = fn;
if (o.delay) {
handler = createDelayed(handler, listener, o, scope);
}
if (o.buffer) {
handler = createBuffered(handler, listener, o, scope);
}
if (o.single) {
handler = createSingle(handler, listener, o, scope);
}
listener.fireFn = handler;
return listener;
},
findListener: function(fn, scope) {
var listeners = this.listeners,
i = listeners.length,
listener,
s;
while (i--) {
listener = listeners[i];
if (listener) {
s = listener.scope;
if (listener.fn == fn && (s == scope || s == this.observable)) {
return i;
}
}
}
return - 1;
},
isListening: function(fn, scope) {
return this.findListener(fn, scope) !== -1;
},
removeListener: function(fn, scope) {
var me = this,
index,
listener,
k;
index = me.findListener(fn, scope);
if (index != -1) {
listener = me.listeners[index];
if (me.firing) {
me.listeners = me.listeners.slice(0);
}
if (listener.task) {
listener.task.cancel();
delete listener.task;
}
k = listener.tasks && listener.tasks.length;
if (k) {
while (k--) {
listener.tasks[k].cancel();
}
delete listener.tasks;
}
me.listeners.splice(index, 1);
return true;
}
return false;
},
clearListeners: function() {
var listeners = this.listeners,
i = listeners.length;
while (i--) {
this.removeListener(listeners[i].fn, listeners[i].scope);
}
},
fire: function() {
var me = this,
listeners = me.listeners,
count = listeners.length,
i,
args,
listener;
if (count > 0) {
me.firing = true;
for (i = 0; i < count; i++) {
listener = listeners[i];
args = arguments.length ? Array.prototype.slice.call(arguments, 0) : [];
if (listener.o) {
args.push(listener.o);
}
if (listener && listener.fireFn.apply(listener.scope || me.observable, args) === false) {
return (me.firing = false);
}
}
}
me.firing = false;
return true;
}
};
})());
Ext.util.Stateful = Ext.extend(Ext.util.Observable, {
editing : false,
dirty : false,
persistanceProperty: 'data',
constructor: function(config) {
Ext.applyIf(this, {
data: {}
});
this.modified = {};
this[this.persistanceProperty] = {};
Ext.util.Stateful.superclass.constructor.call(this, config);
},
get: function(field) {
return this[this.persistanceProperty][field];
},
set: function(fieldName, value) {
var me = this,
fields = me.fields,
modified = me.modified,
convertFields = [],
field, key, i;
if (arguments.length == 1 && Ext.isObject(fieldName)) {
for (key in fieldName) {
if (!fieldName.hasOwnProperty(key)) {
continue;
}
field = fields.get(key);
if (field && field.convert !== field.type.convert) {
convertFields.push(key);
continue;
}
me.set(key, fieldName[key]);
}
for (i = 0; i < convertFields.length; i++) {
field = convertFields[i];
me.set(field, fieldName[field]);
}
} else {
if (fields) {
field = fields.get(fieldName);
if (field && field.convert) {
value = field.convert(value, me);
}
}
me[me.persistanceProperty][fieldName] = value;
if (field && field.persist && !me.isEqual(currentValue, value)) {
if (me.isModified(fieldName)) {
if (me.isEqual(modified[fieldName], value)) {
delete modified[fieldName];
me.dirty = false;
for (key in modified) {
if (modified.hasOwnProperty(key)){
me.dirty = true;
break;
}
}
}
} else {
me.dirty = true;
modified[fieldName] = currentValue;
}
}
if (!me.editing) {
me.afterEdit();
}
}
},
getChanges : function(){
var modified = this.modified,
changes = {},
field;
for (field in modified) {
if (modified.hasOwnProperty(field)){
changes[field] = this[this.persistanceProperty][field];
}
}
return changes;
},
isModified : function(fieldName) {
return !!(this.modified && this.modified.hasOwnProperty(fieldName));
},
setDirty : function() {
this.dirty = true;
if (!this.modified) {
this.modified = {};
}
this.fields.each(function(field) {
this.modified[field.name] = this[this.persistanceProperty][field.name];
}, this);
},
markDirty : function() {
throw new Error("Stateful: markDirty has been deprecated. Please use setDirty.");
},
reject : function(silent) {
var modified = this.modified,
field;
for (field in modified) {
if (!modified.hasOwnProperty(field)) {
continue;
}
if (typeof modified[field] != "function") {
this[this.persistanceProperty][field] = modified[field];
}
}
this.dirty = false;
this.editing = false;
delete this.modified;
if (silent !== true) {
this.afterReject();
}
},
commit : function(silent) {
this.dirty = false;
this.editing = false;
delete this.modified;
if (silent !== true) {
this.afterCommit();
}
},
copy : function(newId) {
return new this.constructor(Ext.apply({}, this[this.persistanceProperty]), newId || this.internalId);
}
});
Ext.util.HashMap = Ext.extend(Ext.util.Observable, {
constructor: function(config) {
this.addEvents(
'add',
'clear',
'remove',
'replace'
);
Ext.util.HashMap.superclass.constructor.call(this, config);
this.clear(true);
},
getCount: function() {
return this.length;
},
getData: function(key, value) {
if (value === undefined) {
value = key;
key = this.getKey(value);
}
return [key, value];
},
getKey: function(o) {
return o.id;
},
add: function(key, value) {
var me = this,
data;
if (me.containsKey(key)) {
throw new Error('This key already exists in the HashMap');
}
data = this.getData(key, value);
key = data[0];
value = data[1];
me.map[key] = value;
++me.length;
me.fireEvent('add', me, key, value);
return value;
},
replace: function(key, value) {
var me = this,
map = me.map,
old;
if (!me.containsKey(key)) {
me.add(key, value);
}
old = map[key];
map[key] = value;
me.fireEvent('replace', me, key, value, old);
return value;
},
remove: function(o) {
var key = this.findKey(o);
if (key !== undefined) {
return this.removeByKey(key);
}
return false;
},
removeByKey: function(key) {
var me = this,
value;
if (me.containsKey(key)) {
value = me.map[key];
delete me.map[key];
--me.length;
me.fireEvent('remove', me, key, value);
return true;
}
return false;
},
get: function(key) {
return this.map[key];
},
clear: function( initial) {
var me = this;
me.map = {};
me.length = 0;
if (initial !== true) {
me.fireEvent('clear', me);
}
return me;
},
containsKey: function(key) {
return this.map[key] !== undefined;
},
contains: function(value) {
return this.containsKey(this.findKey(value));
},
getKeys: function() {
return this.getArray(true);
},
getValues: function() {
return this.getArray(false);
},
getArray: function(isKey) {
var arr = [],
key,
map = this.map;
for (key in map) {
if (map.hasOwnProperty(key)) {
arr.push(isKey ? key: map[key]);
}
}
return arr;
},
each: function(fn, scope) {
var items = Ext.apply({}, this.map),
key,
length = this.length;
scope = scope || this;
for (key in items) {
if (items.hasOwnProperty(key)) {
if (fn.call(scope, key, items[key], length) === false) {
break;
}
}
}
return this;
},
clone: function() {
var hash = new Ext.util.HashMap(),
map = this.map,
key;
hash.suspendEvents();
for (key in map) {
if (map.hasOwnProperty(key)) {
hash.add(key, map[key]);
}
}
hash.resumeEvents();
return hash;
},
findKey: function(value) {
var key,
map = this.map;
for (key in map) {
if (map.hasOwnProperty(key) && map[key] === value) {
return key;
}
}
return undefined;
}
});
Ext.util.MixedCollection = function(allowFunctions, keyFn) {
this.items = [];
this.map = {};
this.keys = [];
this.length = 0;
this.addEvents(
'clear',
'add',
'replace',
'remove',
'sort'
);
this.allowFunctions = allowFunctions === true;
if (keyFn) {
this.getKey = keyFn;
}
Ext.util.MixedCollection.superclass.constructor.call(this);
};
Ext.extend(Ext.util.MixedCollection, Ext.util.Observable, {
allowFunctions : false,
add : function(key, obj){
var myObj = obj, myKey = key;
if(arguments.length == 1){
myObj = myKey;
myKey = this.getKey(myObj);
}
if(typeof myKey != 'undefined' && myKey !== null){
var old = this.map[myKey];
if(typeof old != 'undefined'){
return this.replace(myKey, myObj);
}
this.map[myKey] = myObj;
}
this.length++;
this.items.push(myObj);
this.keys.push(myKey);
this.fireEvent('add', this.length-1, myObj, myKey);
return myObj;
},
getKey : function(o){
return o.id;
},
replace : function(key, o){
if(arguments.length == 1){
o = arguments[0];
key = this.getKey(o);
}
var old = this.map[key];
if(typeof key == 'undefined' || key === null || typeof old == 'undefined'){
return this.add(key, o);
}
var index = this.indexOfKey(key);
this.items[index] = o;
this.map[key] = o;
this.fireEvent('replace', key, old, o);
return o;
},
addAll : function(objs){
if(arguments.length > 1 || Ext.isArray(objs)){
var args = arguments.length > 1 ? arguments : objs;
for(var i = 0, len = args.length; i < len; i++){
this.add(args[i]);
}
}else{
for(var key in objs){
if (!objs.hasOwnProperty(key)) {
continue;
}
if(this.allowFunctions || typeof objs[key] != 'function'){
this.add(key, objs[key]);
}
}
}
},
each : function(fn, scope){
var items = [].concat(this.items);
for(var i = 0, len = items.length; i < len; i++){
if(fn.call(scope || items[i], items[i], i, len) === false){
break;
}
}
},
eachKey : function(fn, scope){
for(var i = 0, len = this.keys.length; i < len; i++){
fn.call(scope || window, this.keys[i], this.items[i], i, len);
}
},
findBy : function(fn, scope) {
for(var i = 0, len = this.items.length; i < len; i++){
if(fn.call(scope || window, this.items[i], this.keys[i])){
return this.items[i];
}
}
return null;
},
insert : function(index, key, obj){
var myKey = key, myObj = obj;
if(arguments.length == 2){
myObj = myKey;
myKey = this.getKey(myObj);
}
if(this.containsKey(myKey)){
this.suspendEvents();
this.removeByKey(myKey);
this.resumeEvents();
}
if(index >= this.length){
return this.add(myKey, myObj);
}
this.length++;
this.items.splice(index, 0, myObj);
if(typeof myKey != 'undefined' && myKey !== null){
this.map[myKey] = myObj;
}
this.keys.splice(index, 0, myKey);
this.fireEvent('add', index, myObj, myKey);
return myObj;
},
remove : function(o){
return this.removeAt(this.indexOf(o));
},
removeAll : function(items){
Ext.each(items || [], function(item) {
this.remove(item);
}, this);
return this;
},
removeAt : function(index){
if(index < this.length && index >= 0){
this.length--;
var o = this.items[index];
this.items.splice(index, 1);
var key = this.keys[index];
if(typeof key != 'undefined'){
delete this.map[key];
}
this.keys.splice(index, 1);
this.fireEvent('remove', o, key);
return o;
}
return false;
},
removeByKey : function(key){
return this.removeAt(this.indexOfKey(key));
},
removeKey : function() {
console.warn('MixedCollection: removeKey has been deprecated. Please use removeByKey.');
return this.removeByKey.apply(this, arguments);
},
getCount : function(){
return this.length;
},
indexOf : function(o){
return this.items.indexOf(o);
},
indexOfKey : function(key){
return this.keys.indexOf(key);
},
get : function(key) {
var mk = this.map[key],
item = mk !== undefined ? mk : (typeof key == 'number') ? this.items[key] : undefined;
return typeof item != 'function' || this.allowFunctions ? item : null;
},
item : function() {
console.warn('MixedCollection: item has been deprecated. Please use get.');
return this.get.apply(this, arguments);
},
getAt : function(index) {
return this.items[index];
},
itemAt : function() {
console.warn('MixedCollection: itemAt has been deprecated. Please use getAt.');
return this.getAt.apply(this, arguments);
},
getByKey : function(key) {
return this.map[key];
},
key : function() {
console.warn('MixedCollection: key has been deprecated. Please use getByKey.');
return this.getByKey.apply(this, arguments);
},
contains : function(o){
return this.indexOf(o) != -1;
},
containsKey : function(key){
return typeof this.map[key] != 'undefined';
},
clear : function(){
this.length = 0;
this.items = [];
this.keys = [];
this.map = {};
this.fireEvent('clear');
},
first : function() {
return this.items[0];
},
last : function() {
return this.items[this.length-1];
},
_sort : function(property, dir, fn){
var i, len,
dsc = String(dir).toUpperCase() == 'DESC' ? -1 : 1,
c = [],
keys = this.keys,
items = this.items;
fn = fn || function(a, b) {
return a - b;
};
for(i = 0, len = items.length; i < len; i++){
c[c.length] = {
key : keys[i],
value: items[i],
index: i
};
}
c.sort(function(a, b){
var v = fn(a[property], b[property]) * dsc;
if(v === 0){
v = (a.index < b.index ? -1 : 1);
}
return v;
});
for(i = 0, len = c.length; i < len; i++){
items[i] = c[i].value;
keys[i] = c[i].key;
}
this.fireEvent('sort', this);
},
sort : function(property, direction) {
var sorters = property;
if (Ext.isString(property)) {
sorters = [new Ext.util.Sorter({
property : property,
direction: direction || "ASC"
})];
} else if (property instanceof Ext.util.Sorter) {
sorters = [property];
} else if (Ext.isObject(property)) {
sorters = [new Ext.util.Sorter(property)];
}
var length = sorters.length;
if (length == 0) {
return;
}
var sorterFn = function(r1, r2) {
var result = sorters[0].sort(r1, r2),
length = sorters.length,
i;
for (i = 1; i < length; i++) {
result = result || sorters[i].sort.call(this, r1, r2);
}
return result;
};
this.sortBy(sorterFn);
},
sortBy: function(sorterFn) {
var items = this.items,
keys = this.keys,
length = items.length,
temp = [],
i;
for (i = 0; i < length; i++) {
temp[i] = {
key : keys[i],
value: items[i],
index: i
};
}
temp.sort(function(a, b) {
var v = sorterFn(a.value, b.value);
if (v === 0) {
v = (a.index < b.index ? -1 : 1);
}
return v;
});
for (i = 0; i < length; i++) {
items[i] = temp[i].value;
keys[i] = temp[i].key;
}
this.fireEvent('sort', this);
},
reorder: function(mapping) {
this.suspendEvents();
var items = this.items,
index = 0,
length = items.length,
order = [],
remaining = [],
oldIndex;
for (oldIndex in mapping) {
order[mapping[oldIndex]] = items[oldIndex];
}
for (index = 0; index < length; index++) {
if (mapping[index] == undefined) {
remaining.push(items[index]);
}
}
for (index = 0; index < length; index++) {
if (order[index] == undefined) {
order[index] = remaining.shift();
}
}
this.clear();
this.addAll(order);
this.resumeEvents();
this.fireEvent('sort', this);
},
sortByKey : function(dir, fn){
this._sort('key', dir, fn || function(a, b){
var v1 = String(a).toUpperCase(), v2 = String(b).toUpperCase();
return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
});
},
keySort : function() {
console.warn('MixedCollection: keySort has been deprecated. Please use sortByKey.');
return this.sortByKey.apply(this, arguments);
},
getRange : function(start, end){
var items = this.items;
if(items.length < 1){
return [];
}
start = start || 0;
end = Math.min(typeof end == 'undefined' ? this.length-1 : end, this.length-1);
var i, r = [];
if(start <= end){
for(i = start; i <= end; i++) {
r[r.length] = items[i];
}
}else{
for(i = start; i >= end; i--) {
r[r.length] = items[i];
}
}
return r;
},
filter : function(property, value, anyMatch, caseSensitive) {
var filters = [];
if (Ext.isString(property)) {
filters.push(new Ext.util.Filter({
property : property,
value : value,
anyMatch : anyMatch,
caseSensitive: caseSensitive
}));
} else if (Ext.isArray(property) || property instanceof Ext.util.Filter) {
filters = filters.concat(property);
}
var filterFn = function(record) {
var isMatch = true,
length = filters.length,
i;
for (i = 0; i < length; i++) {
var filter = filters[i],
fn = filter.filterFn,
scope = filter.scope;
isMatch = isMatch && fn.call(scope, record);
}
return isMatch;
};
return this.filterBy(filterFn);
},
filterBy : function(fn, scope) {
var newMC = new Ext.util.MixedCollection(),
keys = this.keys,
items = this.items,
length = items.length,
i;
newMC.getKey = this.getKey;
for (i = 0; i < length; i++) {
if (fn.call(scope||this, items[i], keys[i])) {
newMC.add(keys[i], items[i]);
}
}
return newMC;
},
findIndex : function(property, value, start, anyMatch, caseSensitive){
if(Ext.isEmpty(value, false)){
return -1;
}
value = this.createValueMatcher(value, anyMatch, caseSensitive);
return this.findIndexBy(function(o){
return o && value.test(o[property]);
}, null, start);
},
findIndexBy : function(fn, scope, start){
var k = this.keys, it = this.items;
for(var i = (start||0), len = it.length; i < len; i++){
if(fn.call(scope||this, it[i], k[i])){
return i;
}
}
return -1;
},
createValueMatcher : function(value, anyMatch, caseSensitive, exactMatch) {
if (!value.exec) {
var er = Ext.util.Format.escapeRegex;
value = String(value);
if (anyMatch === true) {
value = er(value);
} else {
value = '^' + er(value);
if (exactMatch === true) {
value += '$';
}
}
value = new RegExp(value, caseSensitive ? '' : 'i');
}
return value;
},
clone : function(){
var r = new Ext.util.MixedCollection();
var k = this.keys, it = this.items;
for(var i = 0, len = it.length; i < len; i++){
r.add(k[i], it[i]);
}
r.getKey = this.getKey;
return r;
}
});
Ext.AbstractManager = Ext.extend(Object, {
typeName: 'type',
constructor: function(config) {
Ext.apply(this, config || {});
this.all = new Ext.util.HashMap();
this.types = {};
},
get : function(id) {
return this.all.get(id);
},
register: function(item) {
this.all.add(item);
},
unregister: function(item) {
this.all.remove(item);
},
registerType : function(type, cls) {
this.types[type] = cls;
cls[this.typeName] = type;
},
isRegistered : function(type){
return this.types[type] !== undefined;
},
create: function(config, defaultType) {
var type = config[this.typeName] || config.type || defaultType,
Constructor = this.types[type];
if (Constructor == undefined) {
throw new Error(Ext.util.Format.format("The '{0}' type has not been registered with this manager", type));
}
return new Constructor(config);
},
onAvailable : function(id, fn, scope){
var all = this.all;
all.on("add", function(index, o){
if (o.id == id) {
fn.call(scope || o, o);
all.un("add", fn, scope);
}
});
},
each: function(fn, scope){
this.all.each(fn, scope || this);
},
getCount: function(){
return this.all.getCount();
}
});
Ext.util.DelayedTask = function(fn, scope, args) {
var me = this,
id,
call = function() {
clearInterval(id);
id = null;
fn.apply(scope, args || []);
};
this.delay = function(delay, newFn, newScope, newArgs) {
me.cancel();
fn = newFn || fn;
scope = newScope || scope;
args = newArgs || args;
id = setInterval(call, delay);
};
this.cancel = function(){
if (id) {
clearInterval(id);
id = null;
}
};
};
Ext.util.GeoLocation = Ext.extend(Ext.util.Observable, {
autoUpdate: true,
latitude: null,
longitude: null,
accuracy: null,
altitude: null,
altitudeAccuracy: null,
heading: null,
speed: null,
timestamp: null,
allowHighAccuracy: false,
timeout: Infinity,
maximumAge: 0,
setMaximumAge: function(maximumAge) {
this.maximumAge = maximumAge;
this.setAutoUpdate(this.autoUpdate);
},
setTimeout: function(timeout) {
this.timeout = timeout;
this.setAutoUpdate(this.autoUpdate);
},
setAllowHighAccuracy: function(allowHighAccuracy) {
this.allowHighAccuracy = allowHighAccuracy;
this.setAutoUpdate(this.autoUpdate);
},
provider : null,
watchOperation : null,
constructor : function(config) {
Ext.apply(this, config);
this.coords = this; //@deprecated
if (Ext.supports.GeoLocation) {
this.provider = this.provider ||
(navigator.geolocation ? navigator.geolocation :
(window.google || {}).gears ? google.gears.factory.create('beta.geolocation') : null);
}
this.addEvents(
'update',
'locationerror',
'locationupdate'
);
Ext.util.GeoLocation.superclass.constructor.call(this);
if(this.autoUpdate){
var me = this;
setTimeout(function(){
me.setAutoUpdate(me.autoUpdate);
}, 0);
}
},
setAutoUpdate : function(autoUpdate) {
if (this.watchOperation !== null) {
this.provider.clearWatch(this.watchOperation);
this.watchOperation = null;
}
if (!autoUpdate) {
return true;
}
if (!Ext.supports.GeoLocation) {
this.fireEvent('locationerror', this, false, false, true, null);
return false;
}
try{
this.watchOperation = this.provider.watchPosition(
Ext.createDelegate(this.fireUpdate, this),
Ext.createDelegate(this.fireError, this),
this.parseOptions());
}
catch(e){
this.autoUpdate = false;
this.fireEvent('locationerror', this, false, false, true, e.message);
return false;
}
return true;
},
updateLocation : function(callback, scope, positionOptions) {
var me = this;
var failFunction = function(message, error){
if(error){
me.fireError(error);
}
else{
me.fireEvent('locationerror', me, false, false, true, message);
}
if(callback){
callback.call(scope || me, null, me);
}
me.fireEvent('update', false, me);
};
if (!Ext.supports.GeoLocation) {
setTimeout(function() {
failFunction(null);
}, 0);
return;
}
try{
this.provider.getCurrentPosition(
function(position){
me.fireUpdate(position);
if(callback){
callback.call(scope || me, me, me);
}
me.fireEvent('update', me, me);
},
function(error){
failFunction(null, error);
},
positionOptions ? positionOptions : this.parseOptions());
}
catch(e){
setTimeout(function(){
failFunction(e.message);
}, 0);
}
},
fireUpdate: function(position){
this.timestamp = position.timestamp;
this.latitude = position.coords.latitude;
this.longitude = position.coords.longitude;
this.accuracy = position.coords.accuracy;
this.altitude = position.coords.altitude;
this.altitudeAccuracy = position.coords.altitudeAccuracy;
this.heading = typeof position.coords.heading == 'undefined' ? null : position.coords.heading;
this.speed = typeof position.coords.speed == 'undefined' ? null : position.coords.speed;
this.fireEvent('locationupdate', this);
},
fireError: function(error){
this.fireEvent('locationerror', this,
error.code == error.TIMEOUT,
error.code == error.PERMISSION_DENIED,
error.code == error.POSITION_UNAVAILABLE,
error.message == undefined ? null : error.message);
},
parseOptions: function(){
var ret = {
maximumAge: this.maximumAge,
allowHighAccuracy: this.allowHighAccuracy
};
if(this.timeout !== Infinity){
ret.timeout = this.timeout;
}
return ret;
},
getLocation : function(callback, scope) {
var me = this;
if(this.latitude !== null){
callback.call(scope || me, me, me);
}
else {
me.updateLocation(callback, scope);
}
}
});
Ext.util.Region = Ext.extend(Object, {
constructor : function(t, r, b, l) {
var me = this;
me.top = t;
me[1] = t;
me.right = r;
me.bottom = b;
me.left = l;
me[0] = l;
},
contains : function(region) {
var me = this;
return (region.left >= me.left &&
region.right <= me.right &&
region.top >= me.top &&
region.bottom <= me.bottom);
},
intersect : function(region) {
var me = this,
t = Math.max(me.top, region.top),
r = Math.min(me.right, region.right),
b = Math.min(me.bottom, region.bottom),
l = Math.max(me.left, region.left);
if (b > t && r > l) {
return new Ext.util.Region(t, r, b, l);
}
else {
return false;
}
},
union : function(region) {
var me = this,
t = Math.min(me.top, region.top),
r = Math.max(me.right, region.right),
b = Math.max(me.bottom, region.bottom),
l = Math.min(me.left, region.left);
return new Ext.util.Region(t, r, b, l);
},
constrainTo : function(r) {
var me = this,
constrain = Ext.util.Numbers.constrain;
me.top = constrain(me.top, r.top, r.bottom);
me.bottom = constrain(me.bottom, r.top, r.bottom);
me.left = constrain(me.left, r.left, r.right);
me.right = constrain(me.right, r.left, r.right);
return me;
},
adjust : function(t, r, b, l) {
var me = this;
me.top += t;
me.left += l;
me.right += r;
me.bottom += b;
return me;
},
getOutOfBoundOffset: function(axis, p) {
if (!Ext.isObject(axis)) {
if (axis == 'x') {
return this.getOutOfBoundOffsetX(p);
} else {
return this.getOutOfBoundOffsetY(p);
}
} else {
p = axis;
var d = new Ext.util.Offset();
d.x = this.getOutOfBoundOffsetX(p.x);
d.y = this.getOutOfBoundOffsetY(p.y);
return d;
}
},
getOutOfBoundOffsetX: function(p) {
if (p <= this.left) {
return this.left - p;
} else if (p >= this.right) {
return this.right - p;
}
return 0;
},
getOutOfBoundOffsetY: function(p) {
if (p <= this.top) {
return this.top - p;
} else if (p >= this.bottom) {
return this.bottom - p;
}
return 0;
},
isOutOfBound: function(axis, p) {
if (!Ext.isObject(axis)) {
if (axis == 'x') {
return this.isOutOfBoundX(p);
} else {
return this.isOutOfBoundY(p);
}
} else {
p = axis;
return (this.isOutOfBoundX(p.x) || this.isOutOfBoundY(p.y));
}
},
isOutOfBoundX: function(p) {
return (p < this.left || p > this.right);
},
isOutOfBoundY: function(p) {
return (p < this.top || p > this.bottom);
},
restrict: function(axis, p, factor) {
if (Ext.isObject(axis)) {
var newP;
factor = p;
p = axis;
if (p.copy) {
newP = p.copy();
}
else {
newP = {
x: p.x,
y: p.y
};
}
newP.x = this.restrictX(p.x, factor);
newP.y = this.restrictY(p.y, factor);
return newP;
} else {
if (axis == 'x') {
return this.restrictX(p, factor);
} else {
return this.restrictY(p, factor);
}
}
},
restrictX : function(p, factor) {
if (!factor) {
factor = 1;
}
if (p <= this.left) {
p -= (p - this.left) * factor;
}
else if (p >= this.right) {
p -= (p - this.right) * factor;
}
return p;
},
restrictY : function(p, factor) {
if (!factor) {
factor = 1;
}
if (p <= this.top) {
p -= (p - this.top) * factor;
}
else if (p >= this.bottom) {
p -= (p - this.bottom) * factor;
}
return p;
},
getSize: function() {
return {
width: this.right - this.left,
height: this.bottom - this.top
};
},
copy: function() {
return new Ext.util.Region(this.top, this.right, this.bottom, this.left);
},
toString: function() {
return "Region[" + this.top + "," + this.right + "," + this.bottom + "," + this.left + "]";
},
translateBy: function(offset) {
this.left += offset.x;
this.right += offset.x;
this.top += offset.y;
this.bottom += offset.y;
return this;
},
round: function() {
this.top = Math.round(this.top);
this.right = Math.round(this.right);
this.bottom = Math.round(this.bottom);
this.left = Math.round(this.left);
return this;
},
equals: function(region) {
return (this.top == region.top && this.right == region.right && this.bottom == region.bottom && this.left == region.left)
}
});
Ext.util.Region.getRegion = function(el) {
return Ext.fly(el).getPageBox(true);
};
Ext.util.Region.from = function(o) {
return new Ext.util.Region(o.top, o.right, o.bottom, o.left);
};
Ext.util.Point = Ext.extend(Object, {
constructor: function(x, y) {
this.x = (x != null && !isNaN(x)) ? x : 0;
this.y = (y != null && !isNaN(y)) ? y : 0;
return this;
},
copy: function() {
return new Ext.util.Point(this.x, this.y);
},
copyFrom: function(p) {
this.x = p.x;
this.y = p.y;
return this;
},
toString: function() {
return "Point[" + this.x + "," + this.y + "]";
},
equals: function(p) {
return (this.x == p.x && this.y == p.y);
},
isWithin: function(p, threshold) {
if (!Ext.isObject(threshold)) {
threshold = {x: threshold};
threshold.y = threshold.x;
}
return (this.x <= p.x + threshold.x && this.x >= p.x - threshold.x &&
this.y <= p.y + threshold.y && this.y >= p.y - threshold.y);
},
translate: function(x, y) {
if (x != null && !isNaN(x))
this.x += x;
if (y != null && !isNaN(y))
this.y += y;
},
roundedEquals: function(p) {
return (Math.round(this.x) == Math.round(p.x) && Math.round(this.y) == Math.round(p.y));
}
});
Ext.util.Point.fromEvent = function(e) {
var a = (e.changedTouches && e.changedTouches.length > 0) ? e.changedTouches[0] : e;
return new Ext.util.Point(a.pageX, a.pageY);
};
Ext.util.Offset = Ext.extend(Object, {
constructor: function(x, y) {
this.x = (x != null && !isNaN(x)) ? x : 0;
this.y = (y != null && !isNaN(y)) ? y : 0;
return this;
},
copy: function() {
return new Ext.util.Offset(this.x, this.y);
},
copyFrom: function(p) {
this.x = p.x;
this.y = p.y;
},
toString: function() {
return "Offset[" + this.x + "," + this.y + "]";
},
equals: function(offset) {
if(!(offset instanceof Ext.util.Offset))
throw new Error('offset must be an instance of Ext.util.Offset');
return (this.x == offset.x && this.y == offset.y);
},
round: function(to) {
if (!isNaN(to)) {
var factor = Math.pow(10, to);
this.x = Math.round(this.x * factor) / factor;
this.y = Math.round(this.y * factor) / factor;
} else {
this.x = Math.round(this.x);
this.y = Math.round(this.y);
}
},
isZero: function() {
return this.x == 0 && this.y == 0;
}
});
Ext.util.Offset.fromObject = function(obj) {
return new Ext.util.Offset(obj.x, obj.y);
};
Ext.Template = Ext.extend(Object, {
constructor: function(html) {
var me = this,
args = arguments,
buffer = [],
value, i, length;
me.initialConfig = {};
if (Ext.isArray(html)) {
html = html.join("");
}
else if (args.length > 1) {
for (i = 0, length = args.length; i < length; i++) {
value = args[i];
if (typeof value == 'object') {
Ext.apply(me.initialConfig, value);
Ext.apply(me, value);
} else {
buffer.push(value);
}
}
html = buffer.join('');
}
me.html = html;
if (me.compiled) {
me.compile();
}
},
isTemplate: true,
disableFormats: false,
re: /\{([\w-]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?\}/g,
applyTemplate: function(values) {
var me = this,
useFormat = me.disableFormats !== true,
fm = Ext.util.Format,
tpl = me;
if (me.compiled) {
return me.compiled(values);
}
function fn(m, name, format, args) {
if (format && useFormat) {
if (args) {
args = [values[name]].concat(new Function('return ['+ args +'];')());
} else {
args = [values[name]];
}
if (format.substr(0, 5) == "this.") {
return tpl[format.substr(5)].apply(tpl, args);
}
else {
return fm[format].apply(fm, args);
}
}
else {
return values[name] !== undefined ? values[name] : "";
}
}
return me.html.replace(me.re, fn);
},
set: function(html, compile) {
var me = this;
me.html = html;
me.compiled = null;
return compile ? me.compile() : me;
},
compileARe: /\\/g,
compileBRe: /(\r\n|\n)/g,
compileCRe: /'/g,
/**
* Compiles the template into an internal function, eliminating the RegEx overhead.
* @return {Ext.Template} this
* @hide repeat doc
*/
compile: function() {
var me = this,
fm = Ext.util.Format,
useFormat = me.disableFormats !== true,
body, bodyReturn;
function fn(m, name, format, args) {
if (format && useFormat) {
args = args ? ',' + args: "";
if (format.substr(0, 5) != "this.") {
format = "fm." + format + '(';
}
else {
format = 'this.' + format.substr(5) + '(';
}
}
else {
args = '';
format = "(values['" + name + "'] == undefined ? '' : ";
}
return "'," + format + "values['" + name + "']" + args + ") ,'";
}
bodyReturn = me.html.replace(me.compileARe, '\\\\').replace(me.compileBRe, '\\n').replace(me.compileCRe, "\\'").replace(me.re, fn);
body = "this.compiled = function(values){ return ['" + bodyReturn + "'].join('');};";
eval(body);
return me;
},
/**
* Applies the supplied values to the template and inserts the new node(s) as the first child of el.
* @param {Mixed} el The context element
* @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
* @param {Boolean} returnElement (optional) true to return a Ext.Element (defaults to undefined)
* @return {HTMLElement/Ext.Element} The new node or Element
*/
insertFirst: function(el, values, returnElement) {
return this.doInsert('afterBegin', el, values, returnElement);
},
/**
* Applies the supplied values to the template and inserts the new node(s) before el.
* @param {Mixed} el The context element
* @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
* @param {Boolean} returnElement (optional) true to return a Ext.Element (defaults to undefined)
* @return {HTMLElement/Ext.Element} The new node or Element
*/
insertBefore: function(el, values, returnElement) {
return this.doInsert('beforeBegin', el, values, returnElement);
},
/**
* Applies the supplied values to the template and inserts the new node(s) after el.
* @param {Mixed} el The context element
* @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
* @param {Boolean} returnElement (optional) true to return a Ext.Element (defaults to undefined)
* @return {HTMLElement/Ext.Element} The new node or Element
*/
insertAfter: function(el, values, returnElement) {
return this.doInsert('afterEnd', el, values, returnElement);
},
/**
* Applies the supplied values to the template and appends
* the new node(s) to the specified el.
*
For example usage {@link #Template see the constructor}.
* @param {Mixed} el The context element
* @param {Object/Array} values
* The template values. Can be an array if the params are numeric (i.e. {0})
* or an object (i.e. {foo: 'bar'}).
* @param {Boolean} returnElement (optional) true to return an Ext.Element (defaults to undefined)
* @return {HTMLElement/Ext.Element} The new node or Element
*/
append: function(el, values, returnElement) {
return this.doInsert('beforeEnd', el, values, returnElement);
},
doInsert: function(where, el, values, returnEl) {
el = Ext.getDom(el);
var newNode = Ext.DomHelper.insertHtml(where, el, this.applyTemplate(values));
return returnEl ? Ext.get(newNode, true) : newNode;
},
/**
* Applies the supplied values to the template and overwrites the content of el with the new node(s).
* @param {Mixed} el The context element
* @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
* @param {Boolean} returnElement (optional) true to return a Ext.Element (defaults to undefined)
* @return {HTMLElement/Ext.Element} The new node or Element
*/
overwrite: function(el, values, returnElement) {
el = Ext.getDom(el);
el.innerHTML = this.applyTemplate(values);
return returnElement ? Ext.get(el.firstChild, true) : el.firstChild;
}
});
/**
* Alias for {@link #applyTemplate}
* Returns an HTML fragment of this template with the specified values applied.
* @param {Object/Array} values
* The template values. Can be an array if the params are numeric (i.e. {0})
* or an object (i.e. {foo: 'bar'}).
* @return {String} The HTML fragment
* @member Ext.Template
* @method apply
*/
Ext.Template.prototype.apply = Ext.Template.prototype.applyTemplate;
/**
* Creates a template from the passed element's value (display:none textarea, preferred) or innerHTML.
* @param {String/HTMLElement} el A DOM element or its id
* @param {Object} config A configuration object
* @return {Ext.Template} The created template
* @static
*/
Ext.Template.from = function(el, config) {
el = Ext.getDom(el);
return new Ext.Template(el.value || el.innerHTML, config || '');
};
/**
* @class Ext.XTemplate
* @extends Ext.Template
*
A template class that supports advanced functionality like:
*
Autofilling arrays using templates and sub-templates
*
Conditional processing with basic comparison operators
*
Basic math function support
*
Execute arbitrary inline code with special built-in template variables
*
Custom member functions
*
Many special tags and built-in operators that aren't defined as part of
* the API, but are supported in the templates that can be created
*
*
XTemplate provides the templating mechanism built into:
*
{@link Ext.DataView}
*
*
* The {@link Ext.Template} describes
* the acceptable parameters to pass to the constructor. The following
* examples demonstrate all of the supported features.
*
*
*
*
Sample Data
*
*
This is the data object used for reference in each code example:
The tpl tag and the for operator are used
* to process the provided data object:
*
*
If the value specified in for is an array, it will auto-fill,
* repeating the template block inside the tpl tag for each item in the
* array.
*
If for="." is specified, the data object provided is examined.
*
While processing an array, the special variable {#}
* will provide the current array index + 1 (starts at 1, not 0).
*
*
*
<tpl for=".">...</tpl> // loop through array at root node
<tpl for="foo">...</tpl> // loop through array at foo node
<tpl for="foo.bar">...</tpl> // loop through array at foo.bar node
* Using the sample data above:
*
var tpl = new Ext.XTemplate(
'<p>Kids: ',
'<tpl for=".">', // process the data.kids node
'<p>{#}. {name}</p>', // use current array index to autonumber
'</tpl></p>'
);
tpl.overwrite(panel.body, data.kids); // pass the kids property of the data object
*
An example illustrating how the for property can be leveraged
* to access specified members of the provided data object to populate the template:
*
var tpl = new Ext.XTemplate(
'<p>Name: {name}</p>',
'<p>Title: {title}</p>',
'<p>Company: {company}</p>',
'<p>Kids: ',
'<tpl for="kids">', // interrogate the kids property within the data
'<p>{name}</p>',
'</tpl></p>'
);
tpl.overwrite(panel.body, data); // pass the root node of the data object
*
Flat arrays that contain values (and not objects) can be auto-rendered
* using the special {.} variable inside a loop. This variable
* will represent the value of the array at the current index:
*
var tpl = new Ext.XTemplate(
'<p>{name}\'s favorite beverages:</p>',
'<tpl for="drinks">',
'<div> - {.}</div>',
'</tpl>'
);
tpl.overwrite(panel.body, data);
*
When processing a sub-template, for example while looping through a child array,
* you can access the parent object's members via the parent object:
Conditional processing with basic comparison operators
*
*
The tpl tag and the if operator are used
* to provide conditional checks for deciding whether or not to render specific
* parts of the template. Notes:
*
Double quotes must be encoded if used within the conditional
*
There is no else operator — if needed, two opposite
* if statements should be used.
*
*
<tpl if="age > 1 && age < 10">Child</tpl>
<tpl if="age >= 10 && age < 18">Teenager</tpl>
<tpl if="this.isGirl(name)">...</tpl>
<tpl if="id==\'download\'">...</tpl>
<tpl if="needsIcon"><img src="{icon}" class="{iconCls}"/></tpl>
// no good:
<tpl if="name == "Tommy"">Hello</tpl>
// encode " if it is part of the condition, e.g.
<tpl if="name == "Tommy"">Hello</tpl>
*
The following basic math operators may be applied directly on numeric
* data values:
* + - * /
*
* For example:
*
var tpl = new Ext.XTemplate(
'<p>Name: {name}</p>',
'<p>Kids: ',
'<tpl for="kids">',
'<tpl if="age > 1">', // <-- Note that the > is encoded
'<p>{#}: {name}</p>', // <-- Auto-number each item
'<p>In 5 Years: {age+5}</p>', // <-- Basic math
'<p>Dad: {parent.name}</p>',
'</tpl>',
'</tpl></p>'
);
tpl.overwrite(panel.body, data);
*
*
*
*
*
Execute arbitrary inline code with special built-in template variables
*
*
Anything between {[ ... ]} is considered code to be executed
* in the scope of the template. There are some special variables available in that code:
*
*
values: The values in the current scope. If you are using
* scope changing sub-templates, you can change what values is.
*
parent: The scope (values) of the ancestor template.
*
xindex: If you are in a looping template, the index of the
* loop you are in (1-based).
*
xcount: If you are in a looping template, the total length
* of the array you are looping.
*
* This example demonstrates basic row striping using an inline code block and the
* xindex variable:
*
'],
initComponent : function() {
this.addEvents(
'bodyresize'
);
Ext.applyIf(this.renderSelectors, {
body: '.' + this.baseCls + '-body'
});
Ext.lib.Panel.superclass.initComponent.call(this);
},
initItems : function() {
Ext.lib.Panel.superclass.initItems.call(this);
var items = this.dockedItems;
this.dockedItems = new Ext.util.MixedCollection(false, this.getComponentId);
if (items) {
this.addDocked(items);
}
},
getDockedComponent: function(comp) {
if (Ext.isObject(comp)) {
comp = comp.getItemId();
}
return this.dockedItems.get(comp);
},
getComponent: function(comp) {
var component = Ext.lib.Panel.superclass.getComponent.call(this, comp);
if (component == undefined) {
component = this.getDockedComponent(comp);
}
return component;
},
initBodyStyles: function() {
var bodyStyle = Ext.isString(this.bodyStyle) ? this.bodyStyle.split(';') : [],
Element = Ext.Element;
if (this.bodyPadding != undefined) {
bodyStyle.push('padding: ' + Element.unitizeBox((this.bodyPadding === true) ? 5 : this.bodyPadding));
}
if (this.bodyMargin != undefined) {
bodyStyle.push('margin: ' + Element.unitizeBox((this.bodyMargin === true) ? 5 : this.bodyMargin));
}
if (this.bodyBorder != undefined) {
bodyStyle.push('border-width: ' + Element.unitizeBox((this.bodyBorder === true) ? 1 : this.bodyBorder));
}
delete this.bodyStyle;
return bodyStyle.length ? bodyStyle.join(';') : undefined;
},
initRenderData: function() {
return Ext.applyIf(Ext.lib.Panel.superclass.initRenderData.call(this), {
bodyStyle: this.initBodyStyles(),
bodyCls: this.bodyCls
});
},
addDocked : function(items, pos) {
items = this.prepareItems(items);
var item, i, ln;
for (i = 0, ln = items.length; i < ln; i++) {
item = items[i];
item.dock = item.dock || 'top';
if (pos !== undefined) {
this.dockedItems.insert(pos+i, item);
}
else {
this.dockedItems.add(item);
}
item.onAdded(this, i);
this.onDockedAdd(item);
}
if (this.rendered) {
this.doComponentLayout();
}
},
onDockedAdd : Ext.emptyFn,
onDockedRemove : Ext.emptyFn,
insertDocked : function(pos, items) {
this.addDocked(items, pos);
},
removeDocked : function(item, autoDestroy) {
if (!this.dockedItems.contains(item)) {
return item;
}
var layout = this.componentLayout,
hasLayout = layout && this.rendered;
if (hasLayout) {
layout.onRemove(item);
}
this.dockedItems.remove(item);
item.onRemoved();
this.onDockedRemove(item);
if (autoDestroy === true || (autoDestroy !== false && this.autoDestroy)) {
item.destroy();
}
if (hasLayout && !autoDestroy) {
layout.afterRemove(item);
}
this.doComponentLayout();
return item;
},
getDockedItems : function() {
if (this.dockedItems && this.dockedItems.items.length) {
return this.dockedItems.items.slice();
}
return [];
},
getTargetEl : function() {
return this.body;
},
getRefItems: function(deep) {
var refItems = Ext.lib.Panel.superclass.getRefItems.call(this, deep),
dockedItems = this.getDockedItems(),
ln = dockedItems.length,
i = 0,
item;
refItems = refItems.concat(dockedItems);
if (deep) {
for (; i < ln; i++) {
item = dockedItems[i];
if (item.getRefItems) {
refItems = refItems.concat(item.getRefItems(true));
}
}
}
return refItems;
},
beforeDestroy: function(){
var docked = this.dockedItems,
c;
if (docked) {
while ((c = docked.first())) {
this.removeDocked(c, true);
}
}
Ext.lib.Panel.superclass.beforeDestroy.call(this);
}
});
Ext.Panel = Ext.extend(Ext.lib.Panel, {});
Ext.reg('panel', Ext.Panel);
Ext.Panel = Ext.extend(Ext.lib.Panel, {
scroll: false
});
Ext.reg('panel', Ext.Panel);
Ext.Button = Ext.extend(Ext.Component, {
initComponent: function(){
this.addEvents(
'tap',
'beforetap'
);
Ext.Button.superclass.initComponent.call(this);
this.createAutoHandler();
},
iconAlign: 'left',
baseCls: 'x-button',
pressedCls: 'x-button-pressed',
badgeText: '',
badgeCls: 'x-badge',
hasBadgeCls: 'x-hasbadge',
labelCls: 'x-button-label',
ui: 'normal',
isButton: true,
pressedDelay: 0,
iconMaskCls: 'x-icon-mask',
iconMask: false,
afterRender : function(ct, position) {
var me = this;
Ext.Button.superclass.afterRender.call(me, ct, position);
var text = me.text,
icon = me.icon,
iconCls = me.iconCls,
badgeText = me.badgeText;
me.text = me.icon = me.iconCls = me.badgeText = null;
me.setText(text);
me.setIcon(icon);
me.setIconClass(iconCls);
if (me.iconMask && me.iconEl) {
me.iconEl.addCls(me.iconMaskCls);
}
me.setBadge(badgeText);
},
initEvents : function() {
var me = this;
Ext.Button.superclass.initEvents.call(me);
me.mon(me.el, {
scope: me,
tap : me.onPress,
tapstart : me.onTapStart,
tapcancel: me.onTapCancel
});
},
onTapStart : function() {
var me = this;
if (!me.disabled) {
if (me.pressedDelay) {
me.pressedTimeout = setTimeout(function() {
me.el.addCls(me.pressedCls);
}, Ext.isNumber(me.pressedDelay) ? me.pressedDelay : 100);
}
else {
me.el.addCls(me.pressedCls);
}
}
},
onTapCancel : function() {
var me = this;
if (me.pressedTimeout) {
clearTimeout(me.pressedTimeout);
delete me.pressedTimeout;
}
me.el.removeCls(me.pressedCls);
},
setHandler : function(handler, scope) {
this.handler = handler;
this.scope = scope;
return this;
},
setText: function(text) {
var me = this;
if (me.rendered) {
if (!me.textEl && text) {
me.textEl = me.el.createChild({
tag: 'span',
html: text,
cls: this.labelCls
});
}
else if (me.textEl && text != me.text) {
if (text) {
me.textEl.setHTML(text);
}
else {
me.textEl.remove();
me.textEl = null;
}
}
}
me.text = text;
return me;
},
setIcon: function(icon) {
var me = this;
if (me.rendered) {
if (!me.iconEl && icon) {
me.iconEl = me.el.createChild({
tag: 'img',
src: Ext.BLANK_IMAGE_URL,
style: 'background-image: ' + (icon ? 'url(' + icon + ')' : '')
});
me.setIconAlign(me.iconAlign);
}
else if (me.iconEl && icon != me.icon) {
if (icon) {
me.iconEl.setStyle('background-image', icon ? 'url(' + icon + ')' : '');
me.setIconAlign(me.iconAlign);
}
else {
me.setIconAlign(false);
me.iconEl.remove();
me.iconEl = null;
}
}
}
me.icon = icon;
return me;
},
setIconClass: function(cls) {
var me = this;
if (me.rendered) {
if (!me.iconEl && cls) {
me.iconEl = me.el.createChild({
tag: 'img',
src: Ext.BLANK_IMAGE_URL,
cls: cls
});
me.setIconAlign(me.iconAlign);
}
else if (me.iconEl && cls != me.iconCls) {
if (cls) {
if (me.iconCls) {
me.iconEl.removeCls(me.iconCls);
}
me.iconEl.addCls(cls);
me.setIconAlign(me.iconAlign);
}
else {
me.setIconAlign(false);
me.iconEl.remove();
me.iconEl = null;
}
}
}
me.iconCls = cls;
return me;
},
setIconAlign: function(alignment) {
var me = this,
alignments = ['top', 'right', 'bottom', 'left'],
alignment = ((alignments.indexOf(alignment) == -1 || !alignment) && alignment !== false) ? me.iconAlign : alignment,
i;
if (me.rendered && me.iconEl) {
me.el.removeCls('x-iconalign-' + me.iconAlign);
if (alignment) me.el.addCls('x-iconalign-' + alignment);
}
me.iconAlign = (alignment === false) ? me.iconAlign : alignment;
return me;
},
setBadge : function(text) {
var me = this;
if (me.rendered) {
if (!me.badgeEl && text) {
me.badgeEl = me.el.createChild({
tag: 'span',
cls: me.badgeCls,
html: text
});
me.el.addCls(me.hasBadgeCls);
}
else if (me.badgeEl && text != me.badgeText) {
if (text) {
me.badgeEl.setHTML(text);
me.el.addCls(me.hasBadgeCls);
}
else {
me.badgeEl.remove();
me.badgeEl = null;
me.el.removeCls(me.hasBadgeCls);
}
}
}
me.badgeText = text;
return me;
},
getText : function() {
return this.text;
},
getBadgeText : function() {
return this.badgeText;
},
onDisable : function() {
this.onDisableChange(true);
},
onEnable : function() {
this.onDisableChange(false);
},
onDisableChange : function(disabled) {
var me = this;
if (me.el) {
me.el[disabled ? 'addCls' : 'removeCls'](me.disabledCls);
me.el.dom.disabled = disabled;
}
me.disabled = disabled;
},
onPress : function(e) {
var me = this;
if (!me.disabled && this.fireEvent('beforetap') !== false) {
setTimeout(function() {
if (!me.preventCancel) {
me.onTapCancel();
}
me.callHandler(e);
me.fireEvent('tap', me, e);
}, 10);
}
},
callHandler: function(e) {
var me = this;
if (me.handler) {
me.handler.call(me.scope || me, me, e);
}
},
createAutoHandler: function() {
var me = this,
autoEvent = me.autoEvent;
if (autoEvent) {
if (typeof autoEvent == 'string') {
autoEvent = {
name: autoEvent,
scope: me.scope || me
};
}
me.addEvents(autoEvent.name);
me.setHandler(function() {
autoEvent.scope.fireEvent(autoEvent.name, autoEvent.scope, me);
}, autoEvent.scope);
}
}
});
Ext.reg('button', Ext.Button);
Ext.SegmentedButton = Ext.extend(Ext.Container, {
defaultType: 'button',
componentCls: 'x-segmentedbutton',
pressedCls: 'x-button-pressed',
allowMultiple: false,
initComponent : function() {
this.layout = Ext.apply({}, this.layout || {}, {
type: 'hbox',
align: 'stretch'
});
Ext.SegmentedButton.superclass.initComponent.call(this);
if (this.allowDepress === undefined) {
this.allowDepress = this.allowMultiple;
}
this.addEvents(
'toggle'
);
},
initEvents : function() {
Ext.SegmentedButton.superclass.initEvents.call(this);
this.mon(this.el, {
tap: this.onTap,
capture: true,
scope: this
});
},
afterLayout : function(layout) {
var me = this;
Ext.SegmentedButton.superclass.afterLayout.call(me, layout);
if (!me.initialized) {
me.items.each(function(item, index) {
me.setPressed(item, !!item.pressed, true);
});
if (me.allowMultiple) {
me.pressedButtons = me.getPressedButtons();
}
me.initialized = true;
}
},
onTap : function(e, t) {
if (!this.disabled && (t = e.getTarget('.x-button'))) {
this.setPressed(t.id, this.allowDepress ? undefined : true);
}
},
getPressed : function() {
return this.allowMultiple ? this.getPressedButtons() : this.pressedButton;
},
setPressed : function(btn, pressed, suppressEvents) {
var me = this;
btn = me.getComponent(btn);
if (!btn || !btn.isButton || btn.disabled) {
if (!me.allowMultiple && me.pressedButton) {
me.setPressed(me.pressedButton, false);
}
return;
}
if (!Ext.isBoolean(pressed)) {
pressed = !btn.pressed;
}
if (pressed) {
if (!me.allowMultiple) {
if (me.pressedButton && me.pressedButton !== btn) {
me.pressedButton.el.removeCls(me.pressedCls);
me.pressedButton.pressed = false;
if (suppressEvents !== true) {
me.fireEvent('toggle', me, me.pressedButton, false);
}
}
me.pressedButton = btn;
}
btn.el.addCls(me.pressedCls);
btn.pressed = true;
btn.preventCancel = true;
if (me.initialized && suppressEvents !== true) {
me.fireEvent('toggle', me, btn, true);
}
}
else if (!pressed) {
if (!me.allowMultiple && btn === me.pressedButton) {
me.pressedButton = null;
}
if (btn.pressed) {
btn.el.removeCls(me.pressedCls);
btn.pressed = false;
if (suppressEvents !== true) {
me.fireEvent('toggle', me, btn, false);
}
}
}
if (me.allowMultiple && me.initialized) {
me.pressedButtons = me.getPressedButtons();
}
},
getPressedButtons : function(toggleEvents) {
var pressed = this.items.filterBy(function(item) {
return item.isButton && !item.disabled && item.pressed;
});
return pressed.items;
},
disable : function() {
this.items.each(function(item) {
item.disable();
});
Ext.SegmentedButton.superclass.disable.apply(this, arguments);
},
enable : function() {
this.items.each(function(item) {
item.enable();
}, this);
Ext.SegmentedButton.superclass.enable.apply(this, arguments);
}
});
Ext.reg('segmentedbutton', Ext.SegmentedButton);
Ext.AbstractStoreSelectionModel = Ext.extend(Ext.util.Observable, {
allowDeselect: false,
selected: null,
constructor: function(cfg) {
cfg = cfg || {};
Ext.apply(this, cfg);
this.modes = {
SINGLE: true,
SIMPLE: true,
MULTI: true
};
this.setSelectionMode(cfg.mode);
this.selected = new Ext.util.MixedCollection();
Ext.AbstractStoreSelectionModel.superclass.constructor.call(this, cfg);
},
bind : function(store, initial){
if(!initial && this.store){
if(store !== this.store && this.store.autoDestroy){
this.store.destroy();
}else{
this.store.un("add", this.onStoreAdd, this);
this.store.un("clear", this.onStoreClear, this);
this.store.un("remove", this.onStoreRemove, this);
this.store.un("update", this.onStoreUpdate, this);
}
}
if(store){
store = Ext.StoreMgr.lookup(store);
store.on({
add: this.onStoreAdd,
clear: this.onStoreClear,
remove: this.onStoreRemove,
update: this.onStoreUpdate,
scope: this
});
}
this.store = store;
if(store && !initial) {
this.refresh();
}
},
selectAll: function(silent) {
var selections = this.store.getRange();
for (var i = 0, ln = selections.length; i < ln; i++) {
this.doSelect(selections[i], true, silent);
}
},
deselectAll: function() {
var selections = this.getSelection();
for (var i = 0, ln = selections.length; i < ln; i++) {
this.doDeselect(selections[i]);
}
},
selectWithEvent: function(record, e) {
switch (this.selectionMode) {
case 'MULTI':
if (e.ctrlKey && this.isSelected(record)) {
this.doDeselect(record, false);
} else if (e.shiftKey && this.lastFocused) {
this.selectRange(this.lastFocused, record, e.ctrlKey);
} else if (e.ctrlKey) {
this.doSelect(record, true, false);
} else if (this.isSelected(record) && !e.shiftKey && !e.ctrlKey && this.selected.getCount() > 1) {
this.doSelect(record, false, false);
} else {
this.doSelect(record, false);
}
break;
case 'SIMPLE':
if (this.isSelected(record)) {
this.doDeselect(record);
} else {
this.doSelect(record, true);
}
break;
case 'SINGLE':
if (this.allowDeselect && this.isSelected(record)) {
this.doDeselect(record);
} else {
this.doSelect(record, false);
}
break;
}
},
selectRange : function(startRecord, endRecord, keepExisting, dir){
var i,
startRow = this.store.indexOf(startRecord),
endRow = this.store.indexOf(endRecord),
tmp,
selectedCount = 0,
dontDeselect;
if (this.isLocked()){
return;
}
if (startRow > endRow){
tmp = endRow;
endRow = startRow;
startRow = tmp;
}
for (i = startRow; i <= endRow; i++) {
if (this.isSelected(this.store.getAt(i))) {
selectedCount++;
}
}
if (!dir) {
dontDeselect = -1;
} else {
dontDeselect = (dir == 'up') ? startRow : endRow;
}
for (i = startRow; i <= endRow; i++){
if (selectedCount == (endRow - startRow + 1)) {
if (i != dontDeselect) {
this.doDeselect(i, true);
}
} else {
this.doSelect(i, true);
}
}
},
select: function(records, keepExisting, suppressEvent) {
this.doSelect(records, keepExisting, suppressEvent);
},
deselect: function(records, suppressEvent) {
this.doDeselect(records, suppressEvent);
},
doSelect: function(records, keepExisting, suppressEvent) {
if (this.locked) {
return;
}
if (typeof records === "number") {
records = [this.store.getAt(records)];
}
if (this.selectionMode == "SINGLE" && records) {
var record = records.length ? records[0] : records;
this.doSingleSelect(record, suppressEvent);
} else {
this.doMultiSelect(records, keepExisting, suppressEvent);
}
},
doMultiSelect: function(records, keepExisting, suppressEvent) {
if (this.locked) {
return;
}
var selected = this.selected,
change = false,
record;
records = !Ext.isArray(records) ? [records] : records;
if (!keepExisting && selected.getCount() > 0) {
change = true;
this.doDeselect(this.getSelection(), true);
}
for (var i = 0, ln = records.length; i < ln; i++) {
record = records[i];
if (keepExisting && this.isSelected(record)) {
continue;
}
change = true;
this.lastSelected = record;
selected.add(record);
if (!suppressEvent) {
this.setLastFocused(record);
}
this.onSelectChange(record, true, suppressEvent);
}
this.maybeFireSelectionChange(change && !suppressEvent);
},
doDeselect: function(records, suppressEvent) {
if (this.locked) {
return;
}
if (typeof records === "number") {
records = [this.store.getAt(records)];
}
var change = false,
selected = this.selected,
record;
records = !Ext.isArray(records) ? [records] : records;
for (var i = 0, ln = records.length; i < ln; i++) {
record = records[i];
if (selected.remove(record)) {
if (this.lastSelected == record) {
this.lastSelected = selected.last();
}
this.onSelectChange(record, false, suppressEvent);
change = true;
}
}
this.maybeFireSelectionChange(change && !suppressEvent);
},
doSingleSelect: function(record, suppressEvent) {
if (this.locked) {
return;
}
if (this.isSelected(record)) {
return;
}
var selected = this.selected;
if (selected.getCount() > 0) {
this.doDeselect(this.lastSelected, suppressEvent);
}
selected.add(record);
this.lastSelected = record;
this.onSelectChange(record, true, suppressEvent);
this.setLastFocused(record);
this.maybeFireSelectionChange(!suppressEvent);
},
setLastFocused: function(record) {
var recordBeforeLast = this.lastFocused;
this.lastFocused = record;
this.onLastFocusChanged(recordBeforeLast, record);
},
maybeFireSelectionChange: function(fireEvent) {
if (fireEvent) {
this.fireEvent('selectionchange', this, this.getSelection());
}
},
getLastSelected: function() {
return this.lastSelected;
},
getLastFocused: function() {
return this.lastFocused;
},
getSelection: function() {
return this.selected.getRange();
},
getSelectionMode: function() {
return this.selectionMode;
},
setSelectionMode: function(selMode) {
selMode = selMode ? selMode.toUpperCase() : 'SINGLE';
this.selectionMode = this.modes[selMode] ? selMode : 'SINGLE';
},
isLocked: function() {
return this.locked;
},
setLocked: function(locked) {
this.locked = !!locked;
},
isSelected: function(record) {
record = Ext.isNumber(record) ? this.store.getAt(record) : record;
return this.selected.indexOf(record) !== -1;
},
hasSelection: function() {
return this.selected.getCount() > 0;
},
refresh: function() {
var toBeSelected = [],
oldSelections = this.getSelection(),
ln = oldSelections.length,
selection,
change,
i = 0;
for (; i < ln; i++) {
selection = oldSelections[i];
if (this.store.indexOf(selection) != -1) {
toBeSelected.push(selection);
}
}
if (this.selected.getCount() != toBeSelected.length) {
change = true;
}
this.clearSelections();
if (toBeSelected.length) {
this.doSelect(toBeSelected, false, true);
}
this.maybeFireSelectionChange(change);
},
clearSelections: function() {
this.selected.clear();
this.lastSelected = null;
this.setLastFocused(null);
},
onStoreAdd: function() {
},
onStoreClear: function() {
var selected = this.selected;
if (selected.getCount > 0) {
selected.clear();
this.lastSelected = null;
this.setLastFocused(null);
this.maybeFireSelectionChange(true);
}
},
onStoreRemove: function(store, record) {
if (this.locked) {
return;
}
var selected = this.selected;
if (selected.remove(record)) {
if (this.lastSelected == record) {
this.lastSelected = null;
}
if (this.getLastFocused() == record) {
this.setLastFocused(null);
}
this.maybeFireSelectionChange(true);
}
},
getCount: function() {
return this.selected.getCount();
},
destroy: function() {
},
onStoreUpdate: function() {
},
onSelectChange: function(record, isSelected, suppressEvent) {
},
onLastFocusChanged: function(oldFocused, newFocused) {
},
onEditorKey: function(field, e) {
},
bindComponent: function(cmp) {
}
});
Ext.DataViewSelectionModel = Ext.extend(Ext.AbstractStoreSelectionModel, {
deselectOnContainerClick: true,
bindComponent: function(view) {
this.view = view;
this.bind(view.getStore());
var eventListeners = {
refresh: this.refresh,
scope: this,
el: {
scope: this
}
};
eventListeners.el[view.triggerEvent] = this.onItemClick;
eventListeners.el[view.triggerCtEvent] = this.onContainerClick;
view.on(eventListeners);
},
onItemClick: function(e) {
var view = this.view,
node = view.findTargetByEvent(e);
if (node) {
this.selectWithEvent(view.getRecord(node), e);
} else {
return false;
}
},
onContainerClick: function() {
if (this.deselectOnContainerClick) {
this.deselectAll();
}
},
onSelectChange: function(record, isSelected, suppressEvent) {
var view = this.view;
if (isSelected) {
view.onItemSelect(record);
if (!suppressEvent) {
this.fireEvent('select', this, record);
}
} else {
view.onItemDeselect(record);
if (!suppressEvent) {
this.fireEvent('deselect', this, record);
}
}
}
});
Ext.DataView = Ext.extend(Ext.Component, {
loadingText: 'Loading...',
selectedItemCls: "x-item-selected",
emptyText: "",
deferEmptyText: true,
trackOver: false,
blockRefresh: false,
last: false,
triggerEvent: 'click',
triggerCtEvent: 'containerclick',
addCmpEvents: function() {
},
initComponent : function(){
var isDef = Ext.isDefined;
if (!isDef(this.tpl) || !isDef(this.store) || !isDef(this.itemSelector)) {
throw "DataView requires tpl, store and itemSelector configurations to be defined.";
}
Ext.DataView.superclass.initComponent.call(this);
if(Ext.isString(this.tpl) || Ext.isArray(this.tpl)){
this.tpl = new Ext.XTemplate(this.tpl);
}
if (Ext.isDefined(this.overCls) || Ext.isDefined(this.overClass)) {
this.overItemCls = this.overCls || this.overClass;
delete this.overCls;
delete this.overClass;
throw "Using the deprecated overCls or overClass configuration. Use overItemCls.";
}
if (Ext.isDefined(this.selectedCls) || Ext.isDefined(this.selectedClass)) {
this.selectedItemCls = this.selectedCls || this.selectedClass;
delete this.selectedCls;
delete this.selectedClass;
throw "Using the deprecated selectedCls or selectedClass configuration. Use selectedItemCls.";
}
this.addEvents(
'beforerefresh',
'refresh'
);
this.addCmpEvents();
this.store = Ext.StoreMgr.lookup(this.store)
this.all = new Ext.CompositeElementLite();
this.getSelectionModel().bindComponent(this);
},
onRender : function() {
Ext.DataView.superclass.onRender.apply(this, arguments);
if (this.loadingText) {
this.loadMask = new Ext.LoadMask(this.el, {
msg: this.loadingText
});
}
},
getSelectionModel: function(){
if (!this.selModel) {
this.selModel = {};
}
var mode;
switch(true) {
case this.simpleSelect:
mode = 'SIMPLE';
break;
case this.multiSelect:
mode = 'MULTI';
break;
case this.singleSelect:
default:
mode = 'SINGLE';
break;
}
Ext.applyIf(this.selModel, {
allowDeselect: this.allowDeselect,
mode: mode
});
if (!this.selModel.events) {
this.selModel = new Ext.DataViewSelectionModel(this.selModel);
}
if (!this.selModel.hasRelaySetup) {
this.relayEvents(this.selModel, ['selectionchange', 'select', 'deselect']);
this.selModel.hasRelaySetup = true;
}
if (this.disableSelection) {
this.selModel.locked = true;
}
return this.selModel;
},
refresh: function() {
if (!this.rendered) {
return;
}
this.fireEvent('beforerefresh', this);
var el = this.getTargetEl(),
records = this.store.getRange();
el.update('');
if (records.length < 1) {
if (!this.deferEmptyText || this.hasSkippedEmptyText) {
el.update(this.emptyText);
}
this.all.clear();
} else {
this.tpl.overwrite(el, this.collectData(records, 0));
this.all.fill(Ext.query(this.itemSelector, el.dom));
this.updateIndexes(0);
}
this.hasSkippedEmptyText = true;
this.fireEvent('refresh', this);
},
prepareData: function(data, index, record) {
if (record) {
Ext.apply(data, this.prepareAssociatedData(record));
}
return data;
},
prepareAssociatedData: function(record, ids) {
ids = ids || [];
var associations = record.associations.items,
associationCount = associations.length,
associationData = {},
associatedStore, associatedName, associatedRecords, associatedRecord,
associatedRecordCount, association, internalId, i, j;
for (i = 0; i < associationCount; i++) {
association = associations[i];
associatedStore = record[association.storeName];
associationData[association.name] = [];
if (associatedStore && associatedStore.data.length > 0) {
associatedRecords = associatedStore.data.items;
associatedRecordCount = associatedRecords.length;
for (j = 0; j < associatedRecordCount; j++) {
associatedRecord = associatedRecords[j];
internalId = associatedRecord.internalId;
if (ids.indexOf(internalId) == -1) {
ids.push(internalId);
associationData[association.name][j] = associatedRecord.data;
Ext.apply(associationData[association.name][j], this.prepareAssociatedData(associatedRecord, ids));
}
}
}
}
return associationData;
},
collectData : function(records, startIndex){
var r = [],
i = 0,
len = records.length;
for(; i < len; i++){
r[r.length] = this.prepareData(records[i].data, startIndex + i, records[i]);
}
return r;
},
bufferRender : function(records, index){
var div = document.createElement('div');
this.tpl.overwrite(div, this.collectData(records, index));
return Ext.query(this.itemSelector, div);
},
onUpdate : function(ds, record){
var index = this.store.indexOf(record),
original,
node;
if (index > -1){
original = this.all.elements[index];
node = this.bufferRender([record], index)[0];
this.all.replaceElement(index, node, true);
this.updateIndexes(index, index);
this.selModel.refresh();
}
},
onAdd : function(ds, records, index){
if (this.all.getCount() === 0) {
this.refresh();
return;
}
var nodes = this.bufferRender(records, index), n, a = this.all.elements;
if (index < this.all.getCount()) {
n = this.all.item(index).insertSibling(nodes, 'before', true);
a.splice.apply(a, [index, 0].concat(nodes));
} else {
n = this.all.last().insertSibling(nodes, 'after', true);
a.push.apply(a, nodes);
}
this.updateIndexes(index);
},
onRemove : function(ds, record, index){
this.all.removeElement(index, true);
this.updateIndexes(index);
if (this.store.getCount() === 0){
this.refresh();
}
},
refreshNode : function(index){
this.onUpdate(this.store, this.store.getAt(index));
},
updateIndexes : function(startIndex, endIndex){
var ns = this.all.elements;
startIndex = startIndex || 0;
endIndex = endIndex || ((endIndex === 0) ? 0 : (ns.length - 1));
for(var i = startIndex; i <= endIndex; i++){
ns[i].viewIndex = i;
}
},
getStore : function(){
return this.store;
},
bindStore : function(store, initial) {
if (!initial && this.store) {
if (store !== this.store && this.store.autoDestroy) {
this.store.destroy();
}
else {
this.mun(this.store, {
scope: this,
beforeload: this.onBeforeLoad,
datachanged: this.onDataChanged,
add: this.onAdd,
remove: this.onRemove,
update: this.onUpdate,
clear: this.refresh
});
}
if (!store) {
if (this.loadMask) {
this.loadMask.bindStore(null);
}
this.store = null;
}
}
if (store) {
store = Ext.StoreMgr.lookup(store);
this.mon(store, {
scope: this,
beforeload: this.onBeforeLoad,
datachanged: this.onDataChanged,
add: this.onAdd,
remove: this.onRemove,
update: this.onUpdate,
clear: this.refresh
});
if (this.loadMask) {
this.loadMask.bindStore(store);
}
}
this.store = store;
this.getSelectionModel().bind(store);
if (store) {
this.refresh();
}
},
onDataChanged: function() {
if (this.blockRefresh !== true) {
this.refresh.apply(this, arguments);
}
},
findItemByChild: function(node){
return Ext.fly(node).findParent(this.itemSelector, this.getTargetEl());
},
findTargetByEvent: function(e) {
return e.getTarget(this.itemSelector, this.getTargetEl());
},
getSelectedNodes: function(){
var nodes = [],
records = this.selModel.getSelection(),
ln = records.length,
i = 0;
for (; i < ln; i++) {
nodes.push(this.getNode(records[i]));
}
return nodes;
},
getRecords: function(nodes) {
var records = [],
i = 0,
len = nodes.length;
for (; i < len; i++) {
records[records.length] = this.store.getAt(nodes[i].viewIndex);
}
return r;
},
getRecord: function(node){
return this.store.getAt(node.viewIndex);
},
isSelected : function(node) {
var r = this.getRecord(node);
return this.selModel.isSelected(r);
},
select: function(records, keepExisting, suppressEvent) {
this.selModel.select(records, keepExisting, suppressEvent);
},
deselect: function(records, suppressEvent) {
this.selModel.deselect(records, suppressEvent);
},
getNode : function(nodeInfo) {
if (Ext.isString(nodeInfo)) {
return document.getElementById(nodeInfo);
} else if (Ext.isNumber(nodeInfo)) {
return this.all.elements[nodeInfo];
} else if (nodeInfo instanceof Ext.data.Model) {
var idx = this.store.indexOf(nodeInfo);
return this.all.elements[idx];
}
return nodeInfo;
},
getNodes: function(start, end) {
var ns = this.all.elements,
nodes = [],
i;
start = start || 0;
end = !Ext.isDefined(end) ? Math.max(ns.length - 1, 0) : end;
if (start <= end) {
for (i = start; i <= end && ns[i]; i++) {
nodes.push(ns[i]);
}
} else {
for (i = start; i >= end && ns[i]; i--) {
nodes.push(ns[i]);
}
}
return nodes;
},
indexOf: function(node) {
node = this.getNode(node);
if (Ext.isNumber(node.viewIndex)) {
return node.viewIndex;
}
return this.all.indexOf(node);
},
onBeforeLoad: function() {
if (this.loadingText) {
this.getTargetEl().update('');
this.all.clear();
}
},
onDestroy : function() {
this.all.clear();
Ext.DataView.superclass.onDestroy.call(this);
this.bindStore(null);
this.selModel.destroy();
},
onItemSelect: function(record) {
var node = this.getNode(record);
Ext.fly(node).addCls(this.selectedItemCls);
},
onItemDeselect: function(record) {
var node = this.getNode(record);
Ext.fly(node).removeCls(this.selectedItemCls);
},
select: function(records, keepExisting, supressEvents) {
console.warn("DataView: select will be removed, please access select through a DataView's SelectionModel, ie: view.getSelectionModel().select()");
var sm = this.getSelectionModel();
return sm.select.apply(sm, arguments);
},
clearSelections: function() {
console.warn("DataView: clearSelections will be removed, please access deselectAll through DataView's SelectionModel, ie: view.getSelectionModel().deselectAll()");
var sm = this.getSelectionModel();
return sm.deselectAll();
}
});
Ext.reg('dataview', Ext.DataView);
Ext.DataView.override({
getSelectionCount : function(){
return this.selModel.getSelection().length;
},
getSelectedRecords : function(){
return this.selModel.getSelection();
}
});
Ext.DataView.override({
scroll: 'vertical',
pressedCls : "x-item-pressed",
pressedDelay: 100,
allowDeselect: true,
triggerEvent: 'singletap',
triggerCtEvent: 'containertap',
addCmpEvents: function() {
this.addEvents(
'itemtap',
'itemdoubletap',
'itemswipe',
"containertap",
"selectionchange",
"beforeselect"
);
},
afterRender: function() {
var me = this;
Ext.DataView.superclass.afterRender.call(me);
var eventHandlers = {
tapstart : me.onTapStart,
tapcancel: me.onTapCancel,
touchend : me.onTapCancel,
doubletap: me.onDoubleTap,
swipe : me.onSwipe,
scope : me
};
eventHandlers[this.triggerEvent] = me.onTap;
me.mon(me.getTargetEl(), eventHandlers);
if (this.store) {
this.bindStore(this.store, true);
}
},
onTap: function(e) {
var item = this.findTargetByEvent(e);
if (item) {
Ext.fly(item).removeCls(this.pressedCls);
var index = this.indexOf(item);
if (this.onItemTap(item, index, e) !== false) {
this.fireEvent("itemtap", this, index, item, e);
}
}
else {
if(this.fireEvent("containertap", this, e) !== false) {
this.onContainerTap(e);
}
}
},
onTapStart: function(e, t) {
var me = this,
item = this.findTargetByEvent(e);
if (item) {
if (me.pressedDelay) {
if (me.pressedTimeout) {
clearTimeout(me.pressedTimeout);
}
me.pressedTimeout = setTimeout(function() {
Ext.fly(item).addCls(me.pressedCls);
}, Ext.isNumber(me.pressedDelay) ? me.pressedDelay : 100);
}
else {
Ext.fly(item).addCls(me.pressedCls);
}
}
},
onTapCancel: function(e, t) {
var me = this,
item = this.findTargetByEvent(e);
if (me.pressedTimeout) {
clearTimeout(me.pressedTimeout);
delete me.pressedTimeout;
}
if (item) {
Ext.fly(item).removeCls(me.pressedCls);
}
},
onContainerTap: function(e) {
},
onDoubleTap: function(e) {
var item = this.findTargetByEvent(e);
if (item) {
this.fireEvent("itemdoubletap", this, this.indexOf(item), item, e);
}
},
onSwipe: function(e) {
var item = this.findTargetByEvent(e);
if (item) {
this.fireEvent("itemswipe", this, this.indexOf(item), item, e);
}
},
onItemTap: function(item, index, e) {
if (this.pressedTimeout) {
clearTimeout(this.pressedTimeout);
delete this.pressedTimeout;
}
return true;
}
});
Ext.List = Ext.extend(Ext.DataView, {
componentCls: 'x-list',
pinHeaders: Ext.is.iOS || Ext.is.Desktop,
indexBar: false,
grouped: false,
clearSelectionOnDeactivate: true,
renderTpl: [
''
],
groupTpl : [
'',
'
',
'
{group}
',
'
',
'{items}',
'
',
'
',
''
],
itemSelector: '.x-list-item',
itemCls: '',
onItemDisclosure: false,
preventSelectionOnDisclose: true,
initComponent : function() {
var memberFnsCombo = {};
if (Ext.isArray(this.itemTpl)) {
this.itemTpl = this.itemTpl.join('');
} else if (this.itemTpl && this.itemTpl.html) {
Ext.apply(memberFnsCombo, this.itemTpl.initialConfig);
this.itemTpl = this.itemTpl.html;
}
if (!Ext.isDefined(this.itemTpl)) {
throw new Error("Ext.List: itemTpl is a required configuration.");
}
if (this.itemTpl && this.itemTpl.indexOf("\"x-list-item\"") !== -1) {
throw new Error("Ext.List: Using a CSS class of x-list-item within your own tpl will break Ext.Lists. Remove the x-list-item from the tpl/itemTpl");
}
this.tpl = '
'
),
isRefreshing: false,
isLoading: false,
currentViewState: '',
init: function(list) {
this.list = list;
this.lastUpdated = new Date();
list.on('update', this.onListUpdate, this);
list.onBeforeLoad = Ext.util.Functions.createInterceptor(list.onBeforeLoad, this.onBeforeLoad, this);
},
onListUpdate: function() {
if (!this.rendered) {
this.render();
}
this.list.getTargetEl().insertFirst(this.el);
if (!this.refreshFn) {
this.onLoadComplete.call(this);
}
},
render : function() {
var list = this.list,
targetEl = list.getTargetEl(),
scroller = targetEl.getScrollParent();
if (!this.pullTpl.isTemplate) {
this.pullTpl = new Ext.XTemplate(this.pullTpl);
}
this.el = this.pullTpl.insertFirst(targetEl, {
message: this.pullRefreshText,
lastUpdated: this.lastUpdated
}, true);
this.messageEl = this.el.down('.x-list-pullrefresh-message');
this.updatedEl = this.el.down('.x-list-pullrefresh-updated > span');
this.pullHeight = this.el.getHeight();
this.scroller = scroller;
scroller.on('bouncestart', this.onBounceStart, this);
scroller.on('offsetchange', this.onOffsetChange, this);
scroller.on('bounceend', this.onBounceEnd, this);
scroller.on('offsetboundaryupdate', this.onOffsetBoundaryUpdate, this);
this.rendered = true;
},
onOffsetBoundaryUpdate: function(scroller, offsetBoundary) {
if (this.isRefreshing) {
offsetBoundary.bottom += this.pullHeight;
}
},
onBounceStart: function(scroller, info) {
if (info.axis === 'y') {
if (!this.isRefreshing && scroller.offset.y > this.pullHeight) {
this.isRefreshing = true;
this.onOffsetBoundaryUpdate(scroller, scroller.offsetBoundary);
}
}
},
onBounceEnd: function(scroller, info) {
if (info.axis === 'y') {
if (this.isRefreshing) {
this.isRefreshing = false;
this.setViewState('loading');
this.isLoading = true;
if (this.refreshFn) {
this.refreshFn.call(this, this.onLoadComplete, this);
}
else {
this.list.getStore().load();
}
}
}
},
onOffsetChange: function(scroller, offset) {
if (offset.y > 0 && !this.isRefreshing && !this.isLoading) {
if (offset.y > this.pullHeight) {
this.setViewState('release');
}
else {
this.setViewState('pull');
}
}
},
setViewState: function(state) {
if (state === this.currentViewState) {
return this;
}
this.currentViewState = state;
switch (state) {
case 'pull':
this.messageEl.setHTML(this.pullRefreshText);
this.el.removeCls(['x-list-pullrefresh-release', 'x-list-pullrefresh-loading']);
break;
case 'release':
this.messageEl.setHTML(this.releaseRefreshText);
this.el.addCls('x-list-pullrefresh-release');
break;
case 'loading':
this.messageEl.setHTML(this.loadingText);
this.el.addCls('x-list-pullrefresh-loading');
break;
}
return this;
},
onBeforeLoad: function() {
if (this.isLoading && this.list.store.getCount() > 0) {
this.list.loadMask.disable();
return false;
}
},
onLoadComplete: function() {
var me = this;
if (this.isLoading) {
this.isLoading = false;
this.lastUpdated = new Date();
this.setViewState('pull');
this.updatedEl.setHTML(Ext.util.Format.date(this.lastUpdated, "m/d/Y h:iA"));
setTimeout(function() {
me.scroller.updateBoundary(me.snappingAnimationDuration);
}, 100);
}
}
});
Ext.preg('pullrefresh', Ext.plugins.PullRefreshPlugin);
;
/**
* @class Ext.History
* @extends Ext.util.Observable
* @ignore
* @private
*
* Mobile-optimized port of Ext.History. Note - iPad on iOS < 4.2 does not have HTML5 History support so we still
* have to poll for changes.
*/
Ext.History = new Ext.util.Observable({
constructor: function() {
Ext.History.superclass.constructor.call(this, config);
this.addEvents(
/**
* @event change
*/
'change'
);
},
/**
* @private
* Initializes event listeners
*/
init: function() {
var me = this;
me.setToken(window.location.hash);
if (Ext.supports.History) {
window.addEventListener('hashchange', this.onChange);
} else {
setInterval(function() {
var newToken = me.cleanToken(window.location.hash),
oldToken = me.getToken();
if (newToken != oldToken) {
me.onChange();
}
}, 50);
}
},
/**
* @private
* Event listener for the hashchange event
*/
onChange: function() {
var me = Ext.History,
newToken = me.cleanToken(window.location.hash);
if (me.token != newToken) {
me.fireEvent('change', newToken);
}
me.setToken(newToken);
},
/**
* Sets a new token, stripping of the leading # if present. Does not fire the 'change' event
* @param {String} token The new token
* @return {String} The cleaned token
*/
setToken: function(token) {
return this.token = this.cleanToken(token);
},
/**
* @private
* Cleans a token by stripping off the leading # if it is present
* @param {String} token The unclean token
* @return {String} The clean token
*/
cleanToken: function(token) {
return token[0] == '#' ? token.substr(1) : token;
},
/**
* Returns the current history token
* @return {String} The current token
*/
getToken: function() {
return this.token;
},
/**
* Adds a token to the history stack by updation the address bar hash
* @param {String} token The new token
*/
add: function(token) {
window.location.hash = this.setToken(token);
if (!Ext.supports.History) {
this.onChange();
}
}
});
/**
* @author Ed Spencer
* @class Ext.ControllerManager
* @extends Ext.AbstractManager
* @singleton
*
*
Keeps track of all of the registered controllers. This should very rarely need to be used by developers. This
* is simply an {@link Ext.AbstractManager AbstractManager} with a custom {@link #register} function which sets up
* the controller and its linked {@link Ext.Application application}.
*/
Ext.ControllerManager = new Ext.AbstractManager({
register: function(id, options) {
options.id = id;
Ext.applyIf(options, {
application: Ext.ApplicationManager.currentApplication
});
var controller = new Ext.Controller(options);
if (controller.init) {
controller.init();
}
this.all.add(controller);
return controller;
}
});
/**
* Shorthand for {@link Ext.ControllerMgr#register}
* Creates a new Controller class from the specified config object. See {@link Ext.Controller} for full examples.
*
* @param {Object} config A configuration object for the Controller you wish to create.
* @return {Ext.Controller} The newly registered Controller
* @member Ext
* @method regController
*/
Ext.regController = function() {
return Ext.ControllerManager.register.apply(Ext.ControllerManager, arguments);
};
/**
* @author Ed Spencer
* @class Ext.Controller
* @extends Ext.util.Observable
*
* @constructor
*/
Ext.Controller = Ext.extend(Ext.util.Observable, {
constructor: function(config) {
this.addEvents(
/**
* @event instance-created
* Fired when a new model instance has been successfully created by this controller
* @param {Ext.data.Model} instance The newly-created model instance
*/
'instance-created',
/**
* @event instance-creation-failed
* Fired when an attempt at saving a new instance failed
* @param {Ext.data.Model} instance The instance that could not be saved
* @param {Object} errors The set of errors (if any) that caused the failure
*/
'instance-creation-failed',
/**
* @event instance-updated
* Fired when an existing model instance has been successfully updated by this controller
* @param {Ext.data.Model} instance The instance that was updated
*/
'instance-updated',
/**
* @event instance-update-failed
* Fired when an update to existing model instance could not be successfully completed
* @param {Ext.data.Model} instance The instance that could not be updated
* @param {Object} errors The set of errors (if any) that caused the failure
*/
'instance-update-failed',
/**
* @event instance-destroyed
* Fired when an existing instance has been successfully destroyed by this controller
* @param {Ext.data.Model} instance The instance that was destroyed
*/
'instance-destroyed',
/**
* @event instance-destruction-failed
* Fired when an existing instance could not be destroyed
* @param {Ext.data.Model} instance The instance that could not be destroyed
* @param {Object} errors The set of errors (if any) that caused the failure
*/
'instance-destruction-failed'
);
Ext.Controller.superclass.constructor.call(this, config);
Ext.apply(this, config || {});
if (typeof this.model == 'string') {
this.model = Ext.ModelMgr.getModel(this.model);
}
},
index: function() {
this.render('index', {
listeners: {
scope : this,
edit : this.edit,
build : this.build,
create : this.onCreateInstance,
destroy: this.onDestroyInstance
}
});
},
/**
* Renders the edit form for a given model instance
* @param {Ext.data.Model} instance The instance to edit
*/
edit: function(instance) {
var view = this.render('edit', {
listeners: this.getEditListeners()
});
view.loadModel(instance);
},
/**
* Callback automatically tied to the index view's 'build' event. By default this just renders the registered
* 'build' view
*/
build: function() {
this.render('build', {
listeners: this.getBuildListeners()
});
},
/**
* Saves a phantom Model instance via its configured Proxy. Fires the 'instance-created' event if successful,
* the 'instance-creation-failed' event if not.
* @param {Object} data The data to create the instance from
* @param {Object} options Optional options object containing callbacks for success and failure plus optional scope
*/
create: function(data, options) {
options = options || {};
var model = this.getModel(),
instance = new model(data),
successCb = options.success,
failureCb = options.failure,
scope = options.scope || this;
instance.save({
scope : this,
success: function(instance) {
if (typeof successCb == 'function') {
successCb.call(scope, instance);
}
this.fireEvent('instance-created', instance);
},
failure: function(instance, errors) {
if (typeof failureCb == 'function') {
failureCb.call(scope, instance, errors);
}
this.fireEvent('instance-creation-failed', instance, errors);
}
});
},
/**
* Updates an existing model instance by applying optional updates to it and attempting to save
* @param {Ext.data.Model} instance The existing instance
* @param {Object} updates Optional additional updates to apply to the instance before saving
* @param {Object} options success and failure callback functions
*/
update: function(instance, updates, options) {
options = options || {};
var successCb = options.success,
failureCb = options.failure,
scope = options.scope || this;
if (Ext.isObject(updates)) {
instance.set(updates);
}
instance.save({
scope : this,
success: function(instance) {
if (typeof successCb == 'function') {
successCb.call(scope, instance);
}
this.fireEvent('instance-updated', instance);
},
failure: function(instance, errors) {
if (typeof failureCb == 'function') {
failureCb.call(scope, instance, errors);
}
this.fireEvent('instance-update-failed', instance, errors);
}
});
},
/**
* Destroys one or more existing, previously saved model instances
* @param {Ext.data.Model} instance The model instance to destroy
* @param {Object} options success and failure callbacks
*/
destroy: function(instance, options) {
options = options || {};
var successCb = options.success,
failureCb = options.failure,
scope = options.scope || this;
instance.destroy({
scope : this,
success: function(instance) {
if (typeof successCb == 'function') {
successCb.call(scope, instance);
}
this.fireEvent('instance-destroyed', instance);
},
failure: function(instance, errors) {
if (typeof failureCb == 'function') {
failureCb.call(scope, instance, errors);
}
this.fireEvent('instance-destruction-failed', instance, errors);
}
});
},
/**
* Returns the listeners to attach to the view rendered by the {@link #build} action. By default this returns listeners
* for save and cancel, but this can be overridden
* @return {Object} listeners
*/
getBuildListeners: function() {
return {
scope : this,
save : this.onCreateInstance,
cancel: this.onCancelBuild
};
},
/**
* Returns the listeners to attach to the view rendered by the {@link #edit} action. By default this returns listeners
* for save and cancel, but this can be overridden
* @return {Object} listeners
*/
getEditListeners: function() {
return {
scope : this,
save : this.onUpdateInstance,
cancel: this.onCancelEdit
};
},
/**
* Handler for the 'cancel' event fired by an {@link #edit} view. By default this just closes the view
* @param {Ext.Component} view The edit form
*/
onCancelEdit: function(view) {
return this.closeView(view);
},
/**
* Handler for the 'cancel' event fired by an {@link #build} view. By default this just closes the view
* @param {Ext.Component} view The build form
*/
onCancelBuild: function(view) {
return this.closeView(view);
},
/**
* Callback automatically tied to the index view's 'create' event. By default this just calls the controller's
* create function with the data and some basic callbacks to handle errors or show success. Can be overridden
* to provide custom behavior
* @param {Ext.View} view The view instance that fired the event
*/
onCreateInstance: function(view) {
this.create(view.getValues(), {
scope : this,
success: function(instance) {
this.closeView(view);
},
failure: function(instance, errors) {
console.log('fail');
}
});
},
/**
* Callback automatically tied to the index view's 'update' event. By default this just calls the controller's
* update function with the data and some basic callbacks to handle errors or show success. Can be overridden
* to provide custom behavior
* @param {Ext.Component} view The view instance that fired the event
*/
onUpdateInstance: function(view) {
this.update(view.getRecord(), view.getValues(), {
scope : this,
success: function(instance) {
this.closeView(view);
},
failure: function(instance, errors) {
}
});
},
/**
* Callback automatically tied to the index view's 'destroy' event. By default that just calls the controller's
* destroy function with the model instance and some basic callbacks to handle errors or show success. Can be
* overridden to provide custom behavior.
* @param {Ext.data.Model} instance The instance to destroy
* @param {Ext.View} view The view instance that fired the event
*/
onDestroyInstance: function(instance, view) {
this.destroy(instance, {
scope : this,
success: function(instance) {
},
failure: function(instance, errors) {
}
});
},
/**
* Sets the default container that components rendered using {@link #render} will be added to.
* In many applications there is a fixed navigation panel and a content panel - the content
* panel would usually form the render target in this type of setup.
* @param {Ext.Container} target The container to add rendered components to
*/
setRenderTarget: function(target) {
/**
* @property renderTarget
* @type Ext.Container
* The current {@link #setRenderTarget render target}. Read only
*/
Ext.Controller.renderTarget = target;
},
/**
* Renders a given view based on a registered name
* @param {String} viewName The name of the view to render
* @param {Object} config Optional config object
* @return {Ext.View} The view instance
*/
render: function(config, target) {
var Controller = Ext.Controller,
application = this.application,
profile = application ? application.currentProfile : undefined,
profileTarget, view;
Ext.applyIf(config, {
profile: profile
});
view = Ext.ComponentMgr.create(config);
if (target !== false) {
//give the current Ext.Profile a chance to set the target
profileTarget = profile ? profile.getRenderTarget(config, application) : target;
if (target == undefined) {
target = profileTarget || (application ? application.defaultTarget : undefined);
}
if (typeof target == 'string') {
target = Ext.getCmp(target);
}
if (target != undefined && target.add) {
if (profile) {
profile.beforeLayout(view, target, application);
}
target.add(view);
if (target.layout && target.layout.setActiveItem) {
target.layout.setActiveItem(view);
}
target.doComponentLayout();
if (profile) {
profile.afterLayout(view, target, application);
}
}
}
return view;
},
/**
* This function allows you to add listeners to a view
* in a convenient way
*/
control : function(view, actions, itemName) {
if (!view || !view.isView) {
throw 'Trying to control a view that doesnt exist';
}
var item = itemName ? view.refs[itemName] : view,
key, value, name, child, listener;
if (!item) {
throw "No item called " + itemName + " found inside the " + view.name + " view.";
}
for (key in actions) {
value = actions[key];
// If it is an object, it can either be a listener with a handler defined
// in which case the key is the event name, or it can be an object containing
// listener(s), in which case key will be the items name
if (Ext.isObject(value) && !value.fn) {
this.control(view, value, key);
}
else {
// Now hopefully we can be sure that key is an event name. We will loop over all
// child items and enable bubbling for this event
if (item.refs) {
for (name in item.refs) {
child = item.refs[name];
if (child.isObservable && child.events[key]) {
child.enableBubble(key);
}
}
}
if (!value.fn) {
listener = {};
listener[key] = value;
listener.scope = this;
}
else {
listener = value;
if (listener.scope === undefined) {
listener.scope = this;
}
}
// Finally we bind the listener on this item
item.addListener(listener);
}
}
return view;
},
/**
* Returns the constructor for the model type linked to this controller
* @return {Ext.data.Model} The model constructor
*/
getModel: function() {
return Ext.ModelMgr.getModel(this.model);
},
/**
* @private
* Used internally whenever we want to remove a component from its parent container. See onCancelEdit and onCancelBuild
* @param {Ext.Component} view The component to close
*/
closeView: function(view) {
var ownerCt = view.ownerCt;
if (ownerCt) {
ownerCt.remove(view);
ownerCt.doLayout();
ownerCt.setActiveItem(ownerCt.items.last());
}
}
});
/**
* @author Ed Spencer
* @class Ext.util.Dispatcher
* @extends Ext.util.Observable
*
*
The Dispatcher class is used to send requests through to a controller action. Usually, only a single Dispatcher
* is required on the page, and by default a single instance is already created - {@link Ext.Dispatcher}. See the
* {@link Ext.Dispatcher Dispatcher docs} for details on how this works.
*
* @constructor
*/
Ext.util.Dispatcher = Ext.extend(Ext.util.Observable, {
constructor: function(config) {
this.addEvents(
/**
* @event before-dispatch
* Fires before an interaction is dispatched. Return false from any listen to cancel the dispatch
* @param {Ext.Interaction} interaction The Interaction about to be dispatched
*/
'before-dispatch',
/**
* @event dispatch
* Fired once an Interaction has been dispatched
* @param {Ext.Interaction} interaction The Interaction that was just dispatched
*/
'dispatch'
);
Ext.util.Dispatcher.superclass.constructor.call(this, config);
},
/**
* Dispatches a single interaction to a controller/action pair
* @param {Object} options Options representing at least the controller and action to dispatch to
*/
dispatch: function(options) {
var interaction = new Ext.Interaction(options),
controller = interaction.controller,
action = interaction.action,
History = Ext.History;
if (this.fireEvent('before-dispatch', interaction) !== false) {
if (History && options.historyUrl) {
History.suspendEvents(false);
History.add(options.historyUrl);
Ext.defer(History.resumeEvents, 100, History);
}
if (controller && action) {
controller[action].call(controller, interaction);
interaction.dispatched = true;
}
this.fireEvent('dispatch', interaction);
}
},
/**
* Dispatches to a controller/action pair, adding a new url to the History stack
*/
redirect: function(options) {
if (options instanceof Ext.data.Model) {
//compose a route for the model
} else if (typeof options == 'string') {
//use router
var route = Ext.Router.recognize(options);
if (route) {
return this.dispatch(route);
}
}
return null;
},
/**
* Convenience method which returns a function that calls Ext.Dispatcher.redirect. Useful when setting
* up several listeners that should redirect, e.g.:
* @param {String/Object} url The url to create the redirect function for
* @return {Function} The redirect function
*/
createRedirect: function(url) {
return function() {
Ext.Dispatcher.redirect(url);
};
}
});
/**
* @class Ext.Dispatcher
* @extends Ext.util.Dispatcher
*
*
The Dispatcher is responsible for sending requests through to a specific {@link Ext.Controller controller}
* action. It is usually invoked either by a UI event handler calling {@link Ext#dispatch}, or by the
* {@link Ext.Router Router} recognizing a change in the page url.
*
*
Ext.Dispatcher is the default instance of {@link Ext.util.Dispatcher} that is automatically created for every
* application. Usually it is the only instance that you will need.
*
*
Let's say we have an application that manages instances of a Contact model using a contacts controller:
*
Ext.regModel('Contact', {
fields: ['id', 'name', 'email']
});
//the controller has a single action - list - which just loads the Contacts and logs them to the console
Ext.regController('contacts', {
list: function() {
new Ext.data.Store({
model: 'Contact',
autoLoad: {
callback: function(contacts) {
console.log(contacts);
}
}
});
}
});
*
*
We can easily dispatch to the contacts controller's list action from anywhere in our app:
The Dispatcher finds the contacts controller and calls its list action. We also passed in a couple of additional
* options to dispatch - historyUrl and anotherOption. 'historyUrl' is a special parameter which automatically changes
* the browser's url when passed. For example, if your application is being served from http://yourapp.com, dispatching
* with the options we passed above would update the url to http://yourapp.com/#contacts/list, as well as calling the
* controller action as before.
*
*
We also passed a second configuration into dispatch - anotherOption. We can access this inside our controller
* action like this:
We can pass anything in to Ext.dispatch and have it come through to our controller action. Internally, all of the
* options that we pass to dispatch are rolled into an {@link Ext.Interaction}. Interaction is a very simple class that
* represents a single request into the application - typically the controller and action names plus any additional
* information like the Model instance that a particular action is concerned with.
*
* @singleton
*/
Ext.Dispatcher = new Ext.util.Dispatcher();
/**
* Shorthand for {@link Ext.Dispatcher#dispatch}. Dispatches a request to a controller action
*
* @member Ext
* @method dispatch
*/
Ext.dispatch = function() {
return Ext.Dispatcher.dispatch.apply(Ext.Dispatcher, arguments);
};
/**
* Shorthand for {@link Ext.Dispatcher#redirect}. Dispatches a request to a controller action, adding to the History
* stack and updating the page url as necessary.
*
* @member Ext
* @method redirect
*/
Ext.redirect = function() {
return Ext.Dispatcher.redirect.apply(Ext.Dispatcher, arguments);
};
Ext.createRedirect = Ext.Dispatcher.createRedirect;
/**
* @author Ed Spencer
* @class Ext.util.Router
* @extends Ext.util.Observable
*
*
See {@link Ext.Router}.
*/
Ext.util.Router = Ext.extend(Ext.util.Observable, {
constructor: function(config) {
config = config || {};
Ext.apply(this, config, {
defaults: {
action: 'index'
}
});
this.routes = [];
Ext.util.Router.superclass.constructor.call(this, config);
},
/**
* Connects a url-based route to a controller/action pair plus additional params
* @param {String} url The url to recognize
*/
connect: function(url, params) {
params = Ext.apply({url: url}, params || {}, this.defaults);
var route = new Ext.util.Route(params);
this.routes.push(route);
return route;
},
/**
* Recognizes a url string connected to the Router, return the controller/action pair associated with it
* @param {String} url The url to recognize
* @return {Object/undefined} If the url was recognized, the controller and action to call, else undefined
*/
recognize: function(url) {
var routes = this.routes,
length = routes.length,
i, result;
for (i = 0; i < length; i++) {
result = routes[i].recognize(url);
if (result != undefined) {
return result;
}
}
return undefined;
},
/**
* Convenience method which just calls the supplied function with the Router instance. Example usage:
* @param {Function} fn The fn to call
*/
draw: function(fn) {
fn.call(this, this);
}
});
/**
* @author Ed Spencer
* @class Ext.Router
* @extends Ext.util.Observable
*
The Router is used to map urls to {@link Ext.Controller controller}/action pairs. It can be used whenever an
* application wishes to provide history and deep linking support. Every {@link Ext.Application} can set up Routes
* using the default {@link Ext.Router} instance, supplying application-specific routes like this:
*
//Note the # in the url examples below
Ext.Router.draw(function(map) {
//maps the url http://mydomain.com/#dashboard to the home controller's index action
map.connect('dashboard', {controller: 'home', action: 'index'});
//fallback route - would match routes like http://mydomain.com/#users/list to the 'users' controller's
//'list' action
map.connect(':controller/:action');
});
*
*
The Router is concerned only with the segment of the url after the hash (#) character. This segment is parsed
* by the {@link Ext.Dispatcher Dispatcher} and passed to the Router's {@link #recognize} method. Most of the time you
* will not need to modify any of the behavior of the Router - it is all handled internally by the application
* architecture.
Represents a mapping between a url and a controller/action pair. May also contain additional params
*/
Ext.util.Route = Ext.extend(Object, {
/**
* @cfg {String} url The url string to match. Required.
*/
constructor: function(config) {
Ext.apply(this, config, {
conditions: {}
});
/*
* The regular expression we use to match a segment of a route mapping
* this will recognise segments starting with a colon,
* e.g. on 'namespace/:controller/:action', :controller and :action will be recognised
*/
this.paramMatchingRegex = new RegExp(/:([0-9A-Za-z\_]*)/g);
/*
* Converts a route string into an array of symbols starting with a colon. e.g.
* ":controller/:action/:id" => [':controller', ':action', ':id']
*/
this.paramsInMatchString = this.url.match(this.paramMatchingRegex) || [];
this.matcherRegex = this.createMatcherRegex(this.url);
},
/**
* Attempts to recognize a given url string and return controller/action pair for it
* @param {String} url The url to recognize
* @return {Object} The matched data, or false if no match
*/
recognize: function(url) {
if (this.recognizes(url)) {
var matches = this.matchesFor(url);
return Ext.applyIf(matches, {
controller: this.controller,
action : this.action,
historyUrl: url
});
}
},
/**
* Returns true if this Route matches the given url string
* @param {String} url The url to test
* @return {Boolean} True if this Route recognizes the url
*/
recognizes: function(url) {
return this.matcherRegex.test(url);
},
/**
* @private
* Returns a hash of matching url segments for the given url.
* @param {String} url The url to extract matches for
* @return {Object} matching url segments
*/
matchesFor: function(url) {
var params = {},
keys = this.paramsInMatchString,
values = url.match(this.matcherRegex),
length = keys.length,
i;
//first value is the entire match so reject
values.shift();
for (i = 0; i < length; i++) {
params[keys[i].replace(":", "")] = values[i];
}
return params;
},
/**
* Constructs a url for the given config object by replacing wildcard placeholders in the Route's url
* @param {Object} config The config object
* @return {String} The constructed url
*/
urlFor: function(config) {
},
/**
* @private
* Takes the configured url string including wildcards and returns a regex that can be used to match
* against a url
* @param {String} url The url string
* @return {RegExp} The matcher regex
*/
createMatcherRegex: function(url) {
/**
* Converts a route string into an array of symbols starting with a colon. e.g.
* ":controller/:action/:id" => [':controller', ':action', ':id']
*/
var paramsInMatchString = this.paramsInMatchString,
length = paramsInMatchString.length,
i, cond, matcher;
for (i = 0; i < length; i++) {
cond = this.conditions[paramsInMatchString[i]];
matcher = Ext.util.Format.format("({0})", cond || "[%a-zA-Z0-9\\_\\s,]+");
url = url.replace(new RegExp(paramsInMatchString[i]), matcher);
}
//we want to match the whole string, so include the anchors
return new RegExp("^" + url + "$");
}
});
/**
* @author Ed Spencer
* @class Ext.Interaction
* @extends Ext.util.Observable
*
*
Interactions are very simple objects that represent an action performed by specific {@link Ext.Controller}
* action. The must consist of the {@link #controller} and {@link #action} to be called, but can contain any other
* data too. See {@link Ext.Dispatcher} for more details on how Interactions fit into the application ecosystem.
*
*
Interactions are an internal representation that most developers will not have much direct use for. They
* help provide a normalized API for controller actions - each action should simply be set up to receive an Interaction
* object. Because Interaction objects are always created when dispatching to a controller action, it is possible to
* store the Interaction objects that were created in a session to perform simple analytics on how the application
* is used. This is not built into the framework at the moment, but is left open for custom development if needed.
*
* @constructor
* @param {Object} config Options object containing at least a controller/action pair
*/
Ext.Interaction = Ext.extend(Ext.util.Observable, {
/**
* @cfg {String} controller The controller to dispatch to
*/
controller: '',
/**
* @cfg {String} action The controller action to invoke
*/
action: '',
/**
* @cfg {Array} args Any arguments to pass to the action
*/
/**
* @cfg {Object} scope Optional scope to execute the controller action in
*/
/**
* True if this Interaction has already been dispatched
* @property dispatched
* @type Boolean
*/
dispatched: false,
constructor: function(config) {
Ext.Interaction.superclass.constructor.apply(this, arguments);
config = config || {};
Ext.applyIf(config, {
scope: this
});
Ext.apply(this, config);
if (typeof this.controller == 'string') {
this.controller = Ext.ControllerManager.get(this.controller);
}
}
});
/**
* @author Ed Spencer
* @class Ext.Application
* @extends Ext.util.Observable
*
*
Represents a Sencha Application. Most Applications consist of at least the application's name and a launch
* function:
*
new Ext.Application({
name: 'MyApp',
launch: function() {
this.viewport = new Ext.Panel({
fullscreen: true,
id : 'mainPanel',
layout: 'card',
items : [
{
html: 'Welcome to My App!'
}
]
});
}
});
*
*
Instantiating a new application automatically creates a global variable using the configured {@link #name}
* property and sets up namespaces for views, stores, models and controllers within the app:
*
//this code is run internally automatically when creating the app
{@link Ext.ns}('MyApp', 'MyApp.views', 'MyApp.stores', 'MyApp.models', 'MyApp.controllers');
*
*
The launch function usually creates the Application's Viewport and runs any actions the Application needs to
* perform when it boots up. The launch function is only expected to be run once.
*
*
Routes and history support
*
*
Sencha Applications provide in-app deep linking and history support, allowing your users both to use the back
* button inside your application and to refresh the page and come back to the same screen even after navigating.
* In-app history support relies on the Routing engine, which maps urls to controller/action pairs. Here's an example
* route definition:
*
//Note the # in the url examples below
Ext.Router.draw(function(map) {
//maps the url http://mydomain.com/#dashboard to the home controller's index action
map.connect('dashboard', {controller: 'home', action: 'index'});
//fallback route - would match routes like http://mydomain.com/#users/list to the 'users' controller's
//'list' action
map.connect(':controller/:action');
});
*
*
If you generated your Sencha app using the Sencha Command application generator script, you'll see this file is
* already present in your application's app/routes.js file. History-driven apps can specify the {@link #defaultUrl}
* configuration option, which will dispatch to that url if no url is currently set:
*
new Ext.Application({
name: 'MyApp',
defaultUrl: 'dashboard'
});
*
*
Application profiles
*
*
Applications support multiple app profiles and reconfigure itself accordingly. Here we set up an Application
* with 3 profiles - one if the device is a phone, one for tablets in landscape orientation and one for tablets in
* portrait orientation:
When the Application checks its list of profiles, the first function that returns true becomes the current profile.
* The Application will normally automatically detect when a profile change has occurred (e.g. if a tablet is rotated
* from portrait to landscape mode) and fire the {@link #profilechange} event. It will also by default inform all
* {@link Ext.Component Components} on the page that the current profile has changed by calling their
* {@link Ext.Component#setProfile setProfile} functions. The setProfile function is left as an empty function for you
* to implement if your component needs to react to different device/application profiles.
*
*
The current profile can be found using {@link #getProfile}. If the Application does not correctly detect device
* profile changes, calling the {@link #determineProfile} function will force it to re-check.
*/
Ext.Application = Ext.extend(Ext.util.Observable, {
/**
* @cfg {String} name The name of the Application. This should be the same as the single global variable that the
* application uses, and should not contain spaces
*/
/**
* @cfg {Object} scope The scope to execute the {@link #launch} function in. Defaults to the Application
* instance.
*/
scope: undefined,
/**
* @cfg {Boolean} useHistory True to automatically set up Ext.History support (defaults to true)
*/
useHistory: true,
/**
* @cfg {String} defaultUrl When the app is first loaded, this url will be redirected to. Defaults to undefined
*/
/**
* @cfg {Boolean} autoUpdateComponentProfiles If true, automatically calls {@link Ext.Component#setProfile} on
* all components whenever a application/device profile change is detected (defaults to true)
*/
autoUpdateComponentProfiles: true,
/**
* @cfg {Boolean} setProfilesOnLaunch If true, determines the current application profile on launch and calls
* {@link #updateComponentProfiles}. Defaults to true
*/
setProfilesOnLaunch: true,
/**
* @cfg {Object} profiles A set of named profile specifications that this application supports. See the intro
* docs for an example
*/
constructor: function(config) {
this.addEvents(
/**
* @event launch
* Fires when the application is launched
* @param {Ext.Application} app The Application instance
*/
'launch',
/**
* @event beforeprofilechange
* Fires when a change in Application profile has been detected, but before any action is taken to
* update the application's components about the change. Return false from any listener to cancel the
* automatic updating of application components (see {@link #autoUpdateComponentProfiles})
* @param {String} profile The name of the new profile
* @param {String} oldProfile The name of the old profile (may be undefined)
*/
'beforeprofilechange',
/**
* @event profilechange
* Fires when a change in Applicatino profile has been detected and the application's components have
* already been informed. Listeners can perform additional processing here if required
* @param {String} profile The name of the new profile
* @param {String} oldProfile The name of the old profile (may be undefined)
*/
'profilechange'
);
Ext.Application.superclass.constructor.call(this, config);
this.bindReady();
var name = this.name;
if (name) {
window[name] = this;
Ext.ns(
name,
name + ".views",
name + ".stores",
name + ".models",
name + ".controllers"
);
}
if (Ext.addMetaTags) {
Ext.addMetaTags(config);
}
},
/**
* @private
* We bind this outside the constructor so that we can cancel it in the test environment
*/
bindReady : function() {
Ext.onReady(this.onReady, this);
},
/**
* Called automatically when the page has completely loaded. This is an empty function that should be
* overridden by each application that needs to take action on page load
* @property launch
* @type Function
* @param {String} profile The detected {@link #profiles application profile}
* @return {Boolean} By default, the Application will dispatch to the configured startup controller and
* action immediately after running the launch function. Return false to prevent this behavior.
*/
launch: Ext.emptyFn,
/**
* @cfg {Boolean/String} useLoadMask True to automatically remove an application loading mask when the
* DOM is ready. If set to true, this expects a div called "loading-mask" to be present in the body.
* Pass the id of some other DOM node if using a custom loading mask element. Defaults to false.
*/
useLoadMask: false,
/**
* @cfg {Number} loadMaskFadeDuration The number of milliseconds the load mask takes to fade out. Defaults to 1000
*/
loadMaskFadeDuration: 1000,
/**
* @cfg {Number} loadMaskRemoveDuration The number of milliseconds until the load mask is removed after starting the
* {@link #loadMaskFadeDuration fadeout}. Defaults to 1050.
*/
loadMaskRemoveDuration: 1050,
/**
* @cfg {Boolean} autoInitViewport Will automatically set up the application to work in full screen mode by calling
* {@link Ext.Viewport#init} if true (defaults to true)
*/
autoInitViewport: true,
/**
* Dispatches to a given controller/action combo with optional arguments.
* @param {Object} options Object containing strings referencing the controller and action to dispatch
* to, plus optional args array
* @return {Boolean} True if the controller and action were found and dispatched to, false otherwise
*/
dispatch: function(options) {
return Ext.dispatch(options);
},
/**
* @private
* Initializes the loading mask, called automatically by onReady if {@link #useLoadMask} is configured
*/
initLoadMask: function() {
var useLoadMask = this.useLoadMask,
defaultId = 'loading-mask',
loadMaskId = typeof useLoadMask == 'string' ? useLoadMask : defaultId;
if (useLoadMask) {
if (loadMaskId == defaultId) {
Ext.getBody().createChild({id: defaultId});
}
var loadingMask = Ext.get('loading-mask'),
fadeDuration = this.loadMaskFadeDuration,
hideDuration = this.loadMaskRemoveDuration;
Ext.defer(function() {
loadingMask.addCls('fadeout');
Ext.defer(function() {
loadingMask.remove();
}, hideDuration);
}, fadeDuration);
}
},
/**
* @private
*/
onBeforeLaunch: function() {
var History = Ext.History,
useHistory = History && this.useHistory,
profile = this.determineProfile(true);
if (useHistory) {
this.historyForm = Ext.getBody().createChild({
id : 'history-form',
cls : 'x-hide-display',
style : 'display: none;',
tag : 'form',
action: '#',
children: [
{
tag: 'div',
children: [
{
tag : 'input',
id : History.fieldId,
type: 'hidden'
},
{
tag: 'iframe',
id : History.iframeId
}
]
}
]
});
History.init();
History.on('change', this.onHistoryChange, this);
var token = History.getToken();
if (this.launch.call(this.scope || this, profile) !== false) {
Ext.redirect(token || this.defaultUrl || {controller: 'application', action: 'index'});
}
} else {
this.launch.call(this.scope || this, profile);
}
this.launched = true;
this.fireEvent('launch', this);
if (this.setProfilesOnLaunch) {
this.updateComponentProfiles(profile);
}
},
/**
* @private
* Called when the DOM is ready. Calls the application-specific launch function and dispatches to the
* first controller/action combo
*/
onReady: function() {
if (this.useLoadMask) {
this.initLoadMask();
}
Ext.EventManager.onOrientationChange(this.determineProfile, this);
if (this.autoInitViewport) {
Ext.Viewport.init(this.onBeforeLaunch, this);
} else {
this.onBeforeLaunch();
}
return this;
},
/**
* Calls each configured {@link #profile} function, marking the first one that returns true as the current
* application profile. Fires the 'beforeprofilechange' and 'profilechange' events if the profile has changed
* @param {Boolean} silent If true, the events profilechange event is not fired
*/
determineProfile: function(silent) {
var currentProfile = this.currentProfile,
profiles = this.profiles,
name;
for (name in profiles) {
if (profiles[name]() === true) {
if (name != currentProfile && this.fireEvent('beforeprofilechange', name, currentProfile) !== false) {
if (this.autoUpdateComponentProfiles) {
this.updateComponentProfiles(name);
}
if (silent !== true) {
this.fireEvent('profilechange', name, currentProfile);
}
}
this.currentProfile = name;
break;
}
}
return this.currentProfile;
},
/**
* @private
* Sets the profile on every component on the page. Will probably refactor this to something less hacky.
* @param {String} profile The new profile name
*/
updateComponentProfiles: function(profile) {
Ext.ComponentMgr.each(function(key, component){
if (component.setProfile) {
component.setProfile(profile);
}
});
},
/**
* Gets the name of the currently-detected application profile
* @return {String} The profile name
*/
getProfile: function() {
return this.currentProfile;
},
/**
* @private
*/
onHistoryChange: function(token) {
return Ext.redirect(token);
}
});
/**
* @class Ext.ApplicationManager
* @extends Ext.AbstractManager
* @singleton
* @ignore
*/
Ext.ApplicationManager = new Ext.AbstractManager({
register: function(name, options) {
if (Ext.isObject(name)) {
options = name;
} else {
options.name = name;
}
var application = new Ext.Application(options);
this.all.add(application);
this.currentApplication = application;
return application;
}
});
/**
* Shorthand for {@link Ext.ApplicationManager#register}
* Creates a new Application class from the specified config object. See {@link Ext.Application} for full examples.
*
* @param {Object} config A configuration object for the Model you wish to create.
* @return {Ext.Application} The newly created Application
* @member Ext
* @method regApplication
*/
Ext.regApplication = function() {
return Ext.ApplicationManager.register.apply(Ext.ApplicationManager, arguments);
};
;
Ext.ns('OrderEze.views');
Ext.regApplication('OrderEze', {
// defaultTarget: "viewport",
defaultUrl: 'home/index',
name: "OrderEze",
useHistory: true,
useLoadMask: true,
launch: function () {
// these values are defined globally on the Default.aspx page
OrderEze.settings = OrderEzeSettings;
if (typeof (OrderEzeCartSettings) !== 'undefined')
OrderEze.cartSettings = OrderEzeCartSettings;
Eze.log('app launch');
Eze.bustCache();
mapboxgl.accessToken = OrderEze.settings.mapKey;
// Fix iOS 11.3 scrolling bug
document.addEventListener('touchmove', function (e) {
e.preventDefault();
}, { passive: false });
// Fix websites viewed with Google App on iOS
if (!Ext.is.Android) {
document.body.style.position = 'absolute';
document.body.style.bottom = '0px';
}
this.viewport = new OrderEze.Viewport({
application: this
});
Eze.log('app launched');
}
});;
Ext.ns('Eze');
Eze = {
history: [],
// set in Viewport.initComponent() function
viewport: null,
nav: function (controller, action, options) {
Eze.log('currPage ' + Ext.History.getToken());
Eze.log(Eze.history);
var config = options || {};
config.controller = controller;
config.action = action || 'index';
config.historyUrl = config.controller + '/' + config.action;
if (config.id) config.historyUrl += '/' + config.id;
config.internalNav = true;
Eze.log('navigating to #' + config.historyUrl);
Ext.dispatch(config);
},
navToUrl: function (url, options) {
Eze.log('navigating to ' + url);
if (url.substr(0, 1) != '#') return;
url = url.substr(1);
var parts = url.split('/');
if (parts.length < 2) return;
var config = options || {};
if (parts.length >= 3) config.id = parts[2];
Eze.nav(parts[0], parts[1], config);
Eze.log(parts);
},
trackPageView: function () {
Eze.history.push('#' + Ext.History.getToken());
},
navBack: function (defaultPage) {
Eze.history.pop(); // discard the current page in history
var prevPage = Eze.history.pop(); // pop and go to the prev page
Eze.log('prev page = ' + prevPage);
Eze.log('defaultPage = ' + defaultPage);
if (typeof (defaultPage) !== 'string' || defaultPage.charAt(0) !== '#') defaultPage = null;
Eze.navToUrl(prevPage || defaultPage || '#home/index', { direction: 'right' });
},
showMask: function (message) {
Eze.mask = new Ext.LoadMask(Ext.getBody(), { msg: message });
Eze.mask.show();
var el = Ext.Element.data(Eze.mask.el.dom, 'mask');
if (el) {
Eze.log('adding super-mask');
el.addCls('super-mask');
} else {
Eze.log('couldn\'t add super-mask');
}
},
hideMask: function () {
if (Eze.mask) {
Eze.mask.hide();
}
},
showListMask: function (listitem) {
Eze.currentLoadingItem = listitem;
Ext.fly(Eze.currentLoadingItem).addCls('item-loading');
},
hideListMask: function () {
if (Eze.currentLoadingItem) {
Ext.fly(Eze.currentLoadingItem).removeCls('item-loading');
}
},
alert: function (title, message) {
Ext.Msg.show({
cls: 'msgbox-over',
title: title,
msg: message,
btns: Ext.MessageBox.OK
});
},
load: function (type, action, params, callback, scope, dontShowMask) {
if (!dontShowMask) Eze.showMask('Please wait...');
if (Ext.isFunction(params)) {
// params arg can be ommited, so swap vars around
scope = callback;
callback = params;
params = {};
}
Eze.log('Eze.load ' + type + '/' + action);
var args = Ext.isObject(params) ? Ext.encode(params) : params;
Eze.log(args);
Ext.Ajax.request({
url: 'json.aspx',
params: { type: type, action: action, args: args },
timeout: 120000,
callback: function (opts, success, response) {
Eze.hideMask();
Eze.hideListMask();
var error = 'There was a problem loading the data';
if (success) {
var json = Ext.decode(response.responseText);
Eze.log('Eze.load callback');
Eze.log(json);
if (json.success) {
if (callback) callback.call(scope || this, json.Data);
return;
}
error = json.GeneralError;
}
Eze.alert('', error);
},
scope: this
});
},
log: function (obj) {
if (OrderEze.settings.debug) {
console.log(obj);
}
},
bustCache: function () {
Ext.Ajax.on('beforerequest', function (conn, options) {
Eze.log('*** ', options);
conn.useDefaultXhrHeader = false;
options.url += '?_=' + (new Date().getTime());
if (options.params) options.url += '&a=' + options.params.type + '-' + options.params.action;
});
}
};;
/**
* The routes.js file connects local urls (e.g. http://mydomain.com/#someUrl) to a controller action.
* This allows the application to reinitialize itself if it is refreshed, and provides in-application
* history support. Sample usage:
*
* Connects http://myapp.com/#home to the index controller's overview action:
* map.connect("home", {controller: 'index', action: 'overview'});
*
* Connects urls like "images/myImage.jpg" to the images controller's show action, passing
* "myImage.jpg" as the "url" property of the options object each controller action receives:
* map.connect("images/:url", {controller: 'images', action: 'show'});
*
* Your app.js file can specify a defaultUrl config property, which will be dispatched to if there is
* no specified url when the application first loads.
*/
Ext.Router.draw(function(map) {
//These are default fallback routes and can be removed if not needed
map.connect(':controller/:action');
map.connect(':controller/:action/:id');
// map.connect(':controller/:action/:id/:arg1');
// map.connect(':controller/:action/:id/:arg1/:arg2');
// map.connect(':controller/:action/:id/:arg1/:arg2/:arg3');
});;
Ext.regController("account", {
index: function(options) {
Eze.trackPageView();
Eze.log('controller account/index ' + options.id);
// if (this.indexView && !options.refresh) {
// // used cached view
// this.application.viewport.setActiveItem(this.indexView, options.direction ? { type: 'slide', direction: options.direction} : null);
// return;
// }
Eze.load('account', 'index', options.phoneSearch, function (data) {
this.indexView = this.render({
xtype: 'account-index',
pageData: data,
listeners: {
deactivate: function(v) {
if (v.destroyMe) {
v.destroy();
this.indexView = null;
}
},
scope: this
}
});
Eze.log('controller account/index after render');
this.application.viewport.setActiveItem(this.indexView, options.direction ? { type: 'slide', direction: options.direction} : null);
Eze.log('controller account/index after active');
}, this);
},
order: function(options) {
Eze.trackPageView();
Eze.log('controller account/order ' + options.id);
Eze.load('account', 'order', parseInt(options.id) || 0, function (data) {
if (data.status == "ERROR") return Eze.nav('account');
this.orderView = this.render({
xtype: 'account-order',
pageData: data,
listeners: {
deactivate: function(v) {
v.destroy();
},
scope: this
}
});
Eze.log('controller account/order after render');
this.application.viewport.setActiveItem(this.orderView, { type: 'slide', direction: options.direction || 'left' });
Eze.log('controller account/order after active');
}, this, true);
}
});
;
Ext.regController("cart", {
index: function (options) {
Eze.trackPageView();
Eze.log('controller cart/index ' + options.id);
Eze.load('cart', 'index', function (data) {
Eze.utils.cartItemCount = data.itemCount;
var view = this.render({
xtype: 'cart-index',
pageData: data,
listeners: {
deactivate: function (v) {
v.destroy();
},
scope: this
}
});
Eze.log('controller cart/index after render');
this.application.viewport.setActiveItem(view);
Eze.hideListMask();
Eze.log('controller cart/index after active');
}, this);
}
});
;
Ext.regController("checkout", {
index: function (options) {
if (!OrderEze.settings.isLoggedIn || Eze.utils.cartItemCount <= 0) return Eze.nav('cart');
Eze.trackPageView();
Eze.log('controller checkout/index ' + options.id);
if (this.indexView) {
// used cached view
Eze.log('controller checkout/index ' + options.id + ' (cached)');
this.application.viewport.setActiveItem(this.indexView, { type: 'slide', direction: options.direction || 'left' });
return;
}
Eze.load('checkout', 'index', function (data) {
if (data.status == "ERROR") return Eze.nav('cart');
this.indexView = this.render({
xtype: 'checkout-index',
pageData: data,
listeners: {
deactivate: function (v) {
if (v.destroyMe) {
v.destroy();
this.indexView = null;
}
},
scope: this
}
});
Eze.log('controller checkout/index after render');
this.application.viewport.setActiveItem(this.indexView, { type: 'slide', direction: options.direction || 'left' });
Eze.log('controller checkout/index after active');
}, this);
},
delivery: function (options) {
if (!OrderEze.settings.isLoggedIn || Eze.utils.cartItemCount <= 0) return Eze.nav('cart');
Eze.trackPageView();
Eze.log('controller checkout/delivery ' + options.id);
if (this.deliveryView) {
// used cached view
Eze.log('controller checkout/delivery ' + options.id + ' (cached)');
this.application.viewport.setActiveItem(this.deliveryView, { type: 'slide', direction: options.direction || 'left' });
return;
}
Eze.load('checkout', 'delivery', function (data) {
if (data.status == "ERROR") return Eze.nav('cart');
this.deliveryView = this.render({
xtype: 'checkout-delivery',
pageData: data,
listeners: {
deactivate: function (v) {
if (v.destroyMe) {
v.destroy();
this.deliveryView = null;
}
},
scope: this
}
});
Eze.log('controller checkout/delivery after render');
this.application.viewport.setActiveItem(this.deliveryView, { type: 'slide', direction: options.direction || 'left' });
Eze.log('controller checkout/delivery after active');
}, this);
},
deliverysl: function (options) {
if (!OrderEze.settings.isLoggedIn || Eze.utils.cartItemCount <= 0) return Eze.nav('cart');
Eze.trackPageView();
Eze.log('controller checkout/deliverysl ' + options.id);
if (this.deliveryView) {
// used cached view
Eze.log('controller checkout/deliverysl ' + options.id + ' (cached)');
this.application.viewport.setActiveItem(this.deliveryView, { type: 'slide', direction: options.direction || 'left' });
return;
}
Eze.load('checkout', 'deliverysl', function (data) {
if (data.status == "ERROR") return Eze.nav('cart');
this.deliveryView = this.render({
xtype: 'checkout-deliverysl',
pageData: data,
listeners: {
deactivate: function (v) {
if (v.destroyMe) {
v.destroy();
this.deliveryView = null;
}
},
scope: this
}
});
Eze.log('controller checkout/deliverysl after render');
this.application.viewport.setActiveItem(this.deliveryView, { type: 'slide', direction: options.direction || 'left' });
Eze.log('controller checkout/deliverysl after active');
}, this);
},
payment: function (options) {
if (!OrderEze.settings.isLoggedIn || Eze.utils.cartItemCount <= 0) return Eze.nav('cart');
Eze.trackPageView();
Eze.log('controller checkout/payment ' + options.id);
if (this.paymentView) {
// used cached view
this.application.viewport.setActiveItem(this.paymentView, { type: 'slide', direction: options.direction || 'left' });
return;
}
Eze.load('checkout', 'payment', function (data) {
if (data.status == "ERROR") return Eze.nav('cart');
this.paymentView = this.render({
xtype: 'checkout-payment',
pageData: data,
listeners: {
deactivate: function (v) {
if (v.destroyMe) {
v.destroy();
this.paymentView = null;
}
},
scope: this
}
});
Eze.log('controller checkout/payment after render');
this.application.viewport.setActiveItem(this.paymentView, { type: 'slide', direction: options.direction || 'left' });
Eze.log('controller checkout/payment after active');
}, this);
},
guest: function (options) {
if (!OrderEze.settings.isLoggedIn || Eze.utils.cartItemCount <= 0) return Eze.nav('cart');
Eze.trackPageView();
Eze.log('controller checkout/guest ' + options.id);
if (this.guestView) {
// used cached view
Eze.log('controller checkout/guest ' + options.id + ' (cached)');
this.application.viewport.setActiveItem(this.guestView, { type: 'slide', direction: options.direction || 'left' });
return;
}
Eze.load('checkout', 'guest', function (data) {
if (data.status == "ERROR") return Eze.nav('cart');
this.guestView = this.render({
xtype: 'checkout-guest',
pageData: data,
listeners: {
deactivate: function (v) {
if (v.destroyMe) {
v.destroy();
this.guestView = null;
}
},
scope: this
}
});
Eze.log('controller checkout/guest after render');
this.application.viewport.setActiveItem(this.guestView, { type: 'slide', direction: options.direction || 'left' });
Eze.log('controller checkout/guest after active');
}, this);
},
summary: function (options) {
// cartItemCount will be 0 when we redirect from processor page
if (!OrderEze.settings.isLoggedIn || (Eze.utils.cartItemCount <= 0 && !options.id)) return Eze.nav('cart');
// check if we are returning to this page from a credit card processor
// if id is defined, we are returning from a processor (see ~/AuthorizeNetReturn.aspx.cs, ~/Checkout/HeartlandReturn.aspx.cs, ~/Checkout/GdpayProcess.aspx.cs)
// options.id will be 'true' if approved otherwise 'false'
if (options.id) {
if (options.id == 'true') {
// succesfully processed, submit the order with a 'true' param signifying a external processor
Eze.load('checkout', 'summarySubmit', true, function (data) {
Eze.log('checkout/summary.next done');
Eze.navToUrl(data.nextPage);
}, this);
return;
} else if (options.id == 'false') {
// failed processing, fetch the error message from session on the server & show an alert
Eze.load('checkout', 'cardFailedMessage', function (data) {
Eze.alert('Transaction failed!', data.message);
}, this);
}
}
if (Eze.utils.cartItemCount <= 0) return Eze.nav('cart');
Eze.trackPageView();
Eze.log('controller checkout/summary ' + options.id);
Eze.load('checkout', 'summary', function (data) {
if (data.status == "ERROR") return Eze.nav('cart');
this.summaryView = this.render({
xtype: 'checkout-summary',
pageData: data,
listeners: {
deactivate: function (v) {
v.destroy();
},
scope: this
}
});
Eze.log('controller checkout/summary after render');
this.application.viewport.setActiveItem(this.summaryView, options.id ? null : { type: 'slide', direction: options.direction || 'left' });
Eze.log('controller checkout/summary after active');
}, this);
},
complete: function (options) {
if (!OrderEze.settings.isLoggedIn) return Eze.nav('cart');
Eze.log('controller checkout/complete ' + options.id);
Eze.load('checkout', 'complete', parseInt(options.id), function (data) {
if (data.status == "ERROR") return Eze.nav('cart');
Eze.utils.cartItemCount = 0;
var view = this.render({
xtype: 'checkout-complete',
pageData: data,
listeners: {
deactivate: function (v) {
v.destroy();
},
scope: this
}
});
Eze.log('controller checkout/complete after render');
this.application.viewport.setActiveItem(view, { type: 'slide', direction: options.direction || 'left' });
Eze.log('controller checkout/complete after active');
}, this);
}
});
;
Ext.regController("contact", {
index: function (options) {
Eze.trackPageView();
Eze.log('controller contact/index ' + options.id);
var view = this.render({
xtype: 'contact-index',
pageData: { locationId: options.id },
listeners: {
deactivate: function (v) {
v.destroy();
}
}
});
Eze.log('controller contact/index after render');
this.application.viewport.setActiveItem(view, {
type: 'slide',
direction: options.direction || 'left'
});
Eze.log('controller contact/index after active');
Eze.hideListMask();
}
});
;
Ext.regController("events", {
destroyMe: false,
index: function (options) {
Eze.trackPageView();
Eze.log(options);
if (this.indexView) {
// used cached view
this.application.viewport.setActiveItem(this.indexView, { type: 'slide', direction: options.direction || 'left' });
Eze.hideListMask();
return;
}
Ext.Ajax.request({
url: 'json.aspx',
params: { type: 'events', action: 'index', calendarId: options.id },
callback: function (opts, success, response) {
var items = [];
if (success) {
var json = Ext.decode(response.responseText);
if (json.success) {
items = json.Data;
}
}
this.indexView = this.render({
xtype: 'events-index',
calendarId: options.id,
events: items,
listeners: {
deactivate: function (v) {
if (v.destroyMe) {
v.destroy();
this.indexView = null;
}
},
scope: this
}
});
this.application.viewport.setActiveItem(this.indexView, { type: 'slide', direction: options.direction || 'left' });
Eze.hideListMask();
},
scope: this
});
},
details: function (options) {
Eze.trackPageView();
Eze.log('controller Events/details ' + options.calendarId);
Ext.Ajax.request({
url: 'json.aspx',
params: { type: 'events', action: 'details', eventId: options.id },
callback: function (opts, success, response) {
var data = null;
if (success) {
var json = Ext.decode(response.responseText);
if (json.success && json.Data.length > 0) {
data = json.Data[0];
}
}
var view = this.render({
xtype: 'events-details',
calendarId: data.calendarId,
eventDetails: data,
listeners: {
deactivate: function (v) {
v.destroy();
}
}
});
Eze.log('controller Events/details after render ');
this.application.viewport.setActiveItem(view, {
type: 'slide',
direction: 'left'
});
Eze.log('controller Events/details after active ');
Eze.hideListMask();
},
scope: this
});
}
});;
Ext.regController("favs", {
index: function(options) {
Eze.trackPageView();
Eze.log('controller favs/index ' + options.id);
// if (this.indexView) {
// // used cached view
// this.application.viewport.setActiveItem(this.indexView, { type: 'slide', direction: options.direction || 'left' });
// return;
// }
//
Eze.load('favs', 'index', function(data) {
this.indexView = this.render({
xtype: 'favs-index',
pageData: data,
listeners: {
deactivate: function(v) {
v.destroy();
},
scope: this
}
});
Eze.log('controller favs/index after render');
this.application.viewport.setActiveItem(this.indexView);
Eze.log('controller favs/index after active');
}, this);
}
});
;
Ext.regController("form", {
index: function (options) {
Eze.trackPageView();
Eze.log('controller form/index ' + options.id);
if (this.indexView) {
// used cached view
this.application.viewport.setActiveItem(this.indexView, { type: 'slide', direction: options.direction || 'left' });
Eze.hideListMask();
return;
}
Ext.Ajax.request({
url: 'json.aspx',
params: { type: 'form', action: 'index', formId: options.id },
callback: function (opts, success, response) {
var data = [], name = 'Contact Form', topTextData = '', bottomTextData = '';
if (success) {
var json = Ext.decode(response.responseText);
if (json.success) {
name = json.Data.name;
data = json.Data.formFields;
topTextData = json.Data.topText;
bottomTextData = json.Data.bottomText;
}
}
this.indexView = this.render({
xtype: 'form-index',
formName: name,
formFields: data,
topText: topTextData,
bottomText: bottomTextData,
formId: options.id,
listeners: {
deactivate: function (v) {
v.destroy();
this.indexView = null;
},
click: {
element: 'el',
fn: function () {
var combos = Ext.ComponentQuery.query("datepickerfield");
for (var i = 0; i < combos.length; i++) {
if (combos[i].value == null)
combos[i].getDatePicker().setValue(new Date(new Date().getFullYear(), 0, 1));
}
}
},
scope: this
}
});
Eze.log('controller form/index after render');
this.application.viewport.setActiveItem(this.indexView, { type: 'slide', direction: options.direction || 'left' });
Eze.hideListMask();
Eze.log('controller form/index after active');
},
scope: this
});
}
});
;
Ext.regController("home", {
index: function (options) {
Eze.trackPageView();
Eze.log('controller home/index');
if (!this.mainPanel) {
this.mainPanel = this.render({
xtype: 'home-index'
});
this.application.viewport.setActiveItem(this.mainPanel);
Eze.log(' created mainPanel ...');
} else {
Eze.log(options);
this.application.viewport.setActiveItem(this.mainPanel, { type: 'slide', direction: 'right' });
Eze.log(' shown mainPanel ...');
}
}
});;
Ext.regController("locations", {
index: function (options) {
Eze.trackPageView();
Eze.log('controller locations/index ' + options.id);
if (this.indexView) {
// used cached view
this.application.viewport.setActiveItem(this.indexView, { type: 'slide', direction: options.direction || 'left' });
Eze.hideListMask();
return;
}
Ext.Ajax.request({
url: 'json.aspx',
params: { type: 'locations', action: 'index' },
callback: function (opts, success, response) {
var data = [];
if (success) {
var json = Ext.decode(response.responseText);
if (json.success) {
data = json.Data;
}
}
this.indexView = this.render({
xtype: 'locations-index',
pageData: data,
listeners: {
deactivate: function (v) {
if (v.destroyMe) {
v.destroy();
this.indexView = null;
}
},
scope: this
}
});
Eze.log('controller locations/index after render');
this.application.viewport.setActiveItem(this.indexView, { type: 'slide', direction: options.direction || 'left' });
Eze.hideListMask();
Eze.log('controller locations/index after active');
},
scope: this
});
},
details: function (options) {
Eze.trackPageView();
Eze.log('controller locations/details ' + options.id);
Ext.Ajax.request({
url: 'json.aspx',
params: { type: 'locations', action: 'details', locationId: options.id },
callback: function (opts, success, response) {
var data = {};
if (success) {
var json = Ext.decode(response.responseText);
if (json.success) {
data = json.Data;
}
}
if (data.latitude && data.longitude) {
this.showLocationDetails([data.longitude, data.latitude], data, options);
return;
}
var that = this;
this.mapboxClient = mapboxSdk({ accessToken: mapboxgl.accessToken });
this.mapboxClient.geocoding.forwardGeocode({ query: data.addressString, limit: 1 }).send().then((response) => {
var mapCenter = response.body.features[0].center;
that.showLocationDetails(mapCenter, data, options);
});
},
scope: this
});
},
showLocationDetails: function(mapCenter, data, options) {
var view = this.render({
xtype: 'locations-details',
pageData: data,
mapCenter: mapCenter,
listeners: {
deactivate: function (v) {
v.destroy();
},
scope: this
}
});
Eze.log('controller locations/details after render');
this.application.viewport.setActiveItem(view, { type: 'slide', direction: options.direction || 'left' });
Eze.hideListMask();
Eze.log('controller locations/details after active');
}
});
;
Ext.regController("mailing", {
index: function (options) {
Eze.trackPageView();
Eze.log('controller mailing/index ' + options.id);
Ext.Ajax.request({
url: 'json.aspx',
params: { type: 'mailing', action: 'index' },
callback: function (opts, success, response) {
var data = { formFields: [{ html: '
There was a problem loading the mailing list form. Please try again.
' }] };
if (success) {
var json = Ext.decode(response.responseText);
if (json.success) {
data = json.Data;
}
}
var view = this.render({
xtype: 'mailing-index',
pageData: data,
listeners: {
deactivate: function (v) {
v.destroy();
},
click: {
element: 'el',
fn: function () {
var combos = Ext.ComponentQuery.query("datepickerfield");
for (var i = 0; i < combos.length; i++) {
if (combos[i].value == null)
combos[i].getDatePicker().setValue(new Date(new Date().getFullYear(), 0, 1));
}
}
},
scope: this
}
});
Eze.log('controller mailing/index after render');
this.application.viewport.setActiveItem(view, {
type: 'slide',
direction: options.direction || 'left'
});
Eze.log('controller mailing/index after active');
Eze.hideListMask();
},
scope: this
});
}
});
;
Ext.regController("map", {
index: function (options) {
Eze.trackPageView();
Eze.log('controller map/index ' + options.id);
if (OrderEze.settings.longitude && OrderEze.settings.latitude) {
this.showMapPage([OrderEze.settings.longitude, OrderEze.settings.latitude], options);
return;
}
var that = this;
var mapboxClient = mapboxSdk({ accessToken: mapboxgl.accessToken });
mapboxClient.geocoding.forwardGeocode({ query: OrderEze.settings.addressString, limit: 1 }).send().then((response) => {
var mapCenter = response.body.features[0].center;
that.showMapPage(mapCenter, options);
}, (error) => { alert('There was a problem finding the address'); });
},
showMapPage: function (mapCenter, options) {
var view = this.render({
xtype: 'map-index',
mapCenter: mapCenter
});
Eze.log('controller map/index after render');
this.application.viewport.setActiveItem(view, { type: 'slide', direction: options.direction || 'left' });
Eze.log('controller map/index after active');
Eze.hideListMask();
}
});;
Ext.regController("menu", {
destroyAll: false,
deptViews: {},
deptViewIds: [],
index: function (options) {
Eze.trackPageView();
Eze.log('controller menu/index ' + options.id);
var deptId = options.id || 1;
var view = this.deptViews['deptView' + deptId];
if (view) {
// used cached view
Eze.log('controller menu/index ' + deptId + ' cached');
// change order of deptViewIds so that this view is last and less likely to be removed from cache
this.moveViewToBackOfCache('deptView' + deptId);
this.application.viewport.setActiveItem(view, { type: 'slide', direction: options.direction || 'left' });
Eze.hideListMask();
return;
}
Ext.Ajax.request({
url: 'json.aspx',
params: { type: 'menu', action: 'index', deptId: deptId },
callback: function (opts, success, response) {
var deptData = {};
if (success) {
var json = Ext.decode(response.responseText);
if (json.success) {
deptData = json.Data;
}
}
view = this.render({
xtype: 'menu-index',
deptId: deptId,
deptData: deptData,
listeners: {
deactivate: this.cleanupViews,
scope: this
}
});
// view caching
this.deptViews['deptView' + deptId] = view;
this.deptViewIds.push('deptView' + deptId);
Eze.log('controller menu/index after render');
Eze.log(this.deptViews);
this.application.viewport.setActiveItem(view, { type: 'slide', direction: options.direction || 'left' });
Eze.hideListMask();
Eze.log('controller menu/index after active');
},
scope: this
});
},
cleanupViews: function (v) {
if (v.destroyAll) {
// delete all menu views when going back to home screen
for (var i = 0; i < this.deptViewIds.length; i++) {
var id = this.deptViewIds[i];
Eze.log('controller menu/index ' + this.deptViews[id].deptId + ' destroying');
this.deptViews[id].destroy();
delete this.deptViews[id];
}
this.deptViewIds = [];
} else if (this.deptViewIds.length > 10) {
// only cache 10 menu views
var id = this.deptViewIds.shift();
Eze.log('controller menu/index ' + this.deptViews[id].deptId + ' destroying');
this.deptViews[id].destroy();
delete this.deptViews[id];
}
Eze.log(this.deptViews);
Eze.log(this.deptViewIds);
},
moveViewToBackOfCache: function (viewId) {
var index = -1;
for (var i = 0; i < this.deptViewIds.length; i++) {
if (this.deptViewIds[i] == viewId) {
index = i;
break;
}
}
if (index != -1) {
this.deptViewIds.splice(index, 1);
this.deptViewIds.push(viewId);
}
}
});
;
Ext.regController("menupro", {
menus: [],
showImages: true,
showPrices: true,
index: function (options) {
Eze.trackPageView();
Eze.log('controller menupro/index');
if (this.indexView) {
// used cached view
Eze.log('controller menupro/index (cached)');
this.application.viewport.setActiveItem(this.indexView, { type: 'slide', direction: options.direction || 'left' });
return;
}
Eze.load('menupro', 'index', function (data) {
Eze.log(data);
this.showImages = data.showImages;
this.showPrices = data.showPrices;
this.menus = this._formatMenu(data.menus);
Eze.log(this.menus);
this.indexView = this.render({
xtype: 'menupro-index',
menus: this.menus,
listeners: {
deactivate: function (v) {
if (v.destroyMe) {
v.destroy();
this.indexView = null;
}
},
scope: this
}
});
Eze.log('controller menupro/index after render');
this.application.viewport.setActiveItem(this.indexView, { type: 'slide', direction: options.direction || 'left' });
Eze.log('controller menupro/index after active');
}, this);
},
menu: function (options) {
Eze.trackPageView();
Eze.hideListMask();
Eze.log('controller menupro/menu ' + options.id);
var menu = this._findMenu(parseInt(options.id, 10));
if (!menu) {
Eze.log('menu with id ' + options.id + ' not found');
Eze.nav('menupro', 'index');
return;
}
var view = this.render({
xtype: 'menupro-menu',
menu: menu,
listeners: {
deactivate: function (v) {
if (v.destroyMe) {
v.destroy();
}
},
scope: this
}
});
Eze.log('controller menupro/menu after render');
this.application.viewport.setActiveItem(view, { type: 'slide', direction: options.direction || 'left' });
Eze.log('controller menupro/menu after active');
},
section: function (options) {
Eze.trackPageView();
Eze.hideListMask();
Eze.log('controller menupro/section ' + options.id);
var section = this._findSection(parseInt(options.id, 10));;
if (!section) {
Eze.log('section with id ' + options.id + ' not found');
Eze.nav('menupro', 'index');
return;
}
var view = this.render({
xtype: 'menupro-section',
section: section,
listeners: {
deactivate: function (v) {
if (v.destroyMe) {
v.destroy();
}
},
scope: this
}
});
Eze.log('controller menupro/section after render');
this.application.viewport.setActiveItem(view, { type: 'slide', direction: options.direction || 'left' });
Eze.log('controller menupro/section after active');
},
// Return the menu item price
_formatPrice(prices) {
return !this.showPrices || prices[0] === 0 ? '' : '$' + parseFloat(prices[0].value).toFixed(2);
},
// updates the values for menu item price and image based on mobile settings
_formatMenu(menus) {
for (var m = 0; m < menus.length; m++) {
var menu = menus[m];
// update featured items
for (var i = 0; i < menu.featuredItems.length; i++) {
var item = menu.featuredItems[i];
item.price = this._formatPrice(item.prices);
item.imageHtml = this.showImages && item.imagePath
? '
' : '';
}
for (var s = 0; s < menu.sections.length; s++) {
var section = menu.sections[s];
// update menu items
for (var i = 0; i < section.menuItems.length; i++) {
var item = section.menuItems[i];
item.price = this._formatPrice(item.prices);
item.imageHtml = this.showImages && item.thumbPath
? '
' : '';
}
}
}
return menus;
},
_findMenu(menuId) {
for (var m = 0; m < this.menus.length; m++) {
if (this.menus[m].id === menuId) {
return this.menus[m];
}
}
},
_findSection(sectionId) {
for (var m = 0; m < this.menus.length; m++) {
var menu = this.menus[m];
for (var s = 0; s < menu.sections.length; s++) {
if (menu.sections[s].id === sectionId) {
return menu.sections[s];
}
}
}
}
});;
Ext.regController("page", {
index: function (options) {
Eze.trackPageView();
Eze.log('controller page/index ' + options.id);
Ext.Ajax.request({
url: 'json.aspx',
params: { type: 'page', action: 'index', pageId: options.id },
callback: function (opts, success, response) {
var data = [];
if (success) {
var json = Ext.decode(response.responseText);
if (json.success) {
data = json.Data;
} else {
}
}
var view = this.render({
xtype: 'page-index',
pageData: data,
listeners: {
deactivate: function (v) {
if (v.destroyMe) {
v.destroy();
}
},
scope: this
}
});
Eze.log('controller page/index after render');
this.application.viewport.setActiveItem(view, { type: 'slide', direction: options.direction || 'left' });
Eze.hideListMask();
Eze.log('controller page/index after active');
},
scope: this
});
}
});
;
Ext.regController("photos", {
destroyMe: false,
index: function (options) {
Eze.trackPageView();
Eze.log(options);
if (this.indexView) {
// used cached view
Eze.log('controller photos/index (cached)');
this.application.viewport.setActiveItem(this.indexView, { type: 'slide', direction: options.direction || 'left' });
Eze.hideListMask();
return;
}
Eze.log('controller photos/index');
Ext.Ajax.request({
url: 'json.aspx',
params: { type: 'photos', action: 'index' },
callback: function (opts, success, response) {
var items = [];
if (success) {
var json = Ext.decode(response.responseText);
if (json.success) {
items = json.Data;
}
}
this.indexView = this.render({
xtype: 'photos-index',
galleries: items,
listeners: {
deactivate: function (v) {
if (v.destroyMe) {
v.destroy();
this.indexView = null;
}
},
scope: this
}
});
Eze.log('controller photos/index after render');
this.application.viewport.setActiveItem(this.indexView, { type: 'slide', direction: options.direction || 'left' });
Eze.hideListMask();
Eze.log('controller photos/index after active');
},
scope: this
});
},
show: function (options) {
Eze.trackPageView();
Eze.log(options);
Ext.Ajax.request({
url: 'json.aspx',
params: { type: 'photos', action: 'images', galleryId: options.id },
callback: function (opts, success, response) {
var galleryName = 'Photos';
var items = [{ cls: 'photoSlide', html: '
There was a problem loading the photos. Please try again.
'}];
if (success) {
var json = Ext.decode(response.responseText);
if (json.success) {
items = json.Data.photos;
galleryName = json.Data.galleryName;
}
}
var view = this.render({
xtype: 'photos-show',
photos: items,
galleryName: galleryName,
listeners: {
deactivate: function (v) {
v.destroy();
}
}
});
this.application.viewport.setActiveItem(view, { type: 'slide', direction: 'left' });
Eze.hideListMask();
},
scope: this
});
}
});;
Ext.regController("rpage", {
index: function (options) {
Eze.trackPageView();
Eze.log('controller rpage/index ' + options.id);
Ext.Ajax.request({
url: 'json.aspx',
params: { type: 'page', action: 'responsive', pageId: options.id },
callback: function (opts, success, response) {
var data = [];
if (success) {
var json = Ext.decode(response.responseText);
if (json.success) {
data = json.Data;
}
}
var view = this.render({
xtype: 'rpage-index',
pageData: data,
listeners: {
deactivate: function (v) {
if (v.destroyMe) {
v.destroy();
}
},
scope: this
}
});
Eze.log('controller rpage/index after render');
this.application.viewport.setActiveItem(view, { type: 'slide', direction: options.direction || 'left' });
Eze.hideListMask();
Eze.log('controller rpage/index after active');
},
scope: this
});
}
});
;
Ext.regController("takeout", {
destroyAll: false,
deptViews: {},
deptViewIds: [],
index: function (options) {
Eze.trackPageView();
Eze.log('controller takeout/index ' + options.id);
Eze.log(options);
var deptId = parseInt(options.id) || 1;
var view = this.deptViews['deptView' + deptId];
// if (view) {
// // used cached view
// Eze.log('controller takeout/index ' + deptId + ' cached');
// // change order of deptViewIds so that this view is last and less likely to be removed from cache
// this.moveViewToBackOfCache('deptView' + deptId);
// if (options.fromTab) {
// this.application.viewport.setActiveItem(view);
// } else {
// this.application.viewport.setActiveItem(view, { type: 'flip', direction: options.direction || 'left' });
// }
// Eze.hideListMask();
// return;
// }
Eze.load('takeout', 'index', deptId, function (deptData) {
Eze.utils.cartItemCount = deptData.cartItemCount;
view = this.render({
xtype: 'takeout-index',
deptId: deptId,
deptData: deptData,
listeners: {
deactivate: this.cleanupViews,
scope: this
}
});
// view caching
this.deptViews['deptView' + deptId] = view;
this.deptViewIds.push('deptView' + deptId);
Eze.log('controller takeout/index after render');
Eze.log(this.deptViews);
if (options.animation == false) {
this.application.viewport.setActiveItem(view);
} else {
this.application.viewport.setActiveItem(view, { type: 'slide', direction: options.direction || 'left' });
}
Eze.hideListMask();
Eze.log('controller takeout/index after active');
}, this, !options.fromTab);
// Ext.Ajax.request({
// url: 'json.aspx',
// params: { type: 'takeout', action: 'index', deptId: deptId },
// callback: function (opts, success, response) {
// var deptData = {};
// if (success) {
// var json = Ext.decode(response.responseText);
// if (json.success) {
// deptData = json.Data;
// }
// }
//
// Eze.utils.cartItemCount = deptData.cartItemCount;
//
// view = this.render({
// xtype: 'takeout-index',
// deptId: deptId,
// deptData: deptData,
// listeners: {
// deactivate: this.cleanupViews,
// scope: this
// }
// });
//
// // view caching
// this.deptViews['deptView' + deptId] = view;
// this.deptViewIds.push('deptView' + deptId);
//
// Eze.log('controller takeout/index after render');
// Eze.log(this.deptViews);
//
// if (options.animation == false) {
// this.application.viewport.setActiveItem(view);
// } else {
// this.application.viewport.setActiveItem(view, { type: 'slide', direction: options.direction || 'left' });
// }
// Eze.hideListMask();
//
// Eze.log('controller takeout/index after active');
// },
// scope: this
// });
},
cleanupViews: function (v) {
if (v.destroyAll) {
// delete all menu views when going back to home screen
for (var i = 0; i < this.deptViewIds.length; i++) {
var id = this.deptViewIds[i];
Eze.log('controller takeout/index ' + this.deptViews[id].deptId + ' destroying');
this.deptViews[id].destroy();
delete this.deptViews[id];
}
this.deptViewIds = [];
} else if (this.deptViewIds.length > 0) {
// only cache 10 takeout views
var id = this.deptViewIds.shift();
Eze.log('controller takeout/index ' + this.deptViews[id].deptId + ' destroying');
this.deptViews[id].destroy();
delete this.deptViews[id];
}
Eze.log(this.deptViews);
Eze.log(this.deptViewIds);
},
moveViewToBackOfCache: function (viewId) {
var index = -1;
for (var i = 0; i < this.deptViewIds.length; i++) {
if (this.deptViewIds[i] == viewId) {
index = i;
break;
}
}
if (index != -1) {
this.deptViewIds.splice(index, 1);
this.deptViewIds.push(viewId);
}
},
item: function (options) {
Eze.trackPageView();
Eze.log('controller takeout/item ' + options.id);
var itemId = options.id;
if (!itemId) return;
Ext.Ajax.request({
url: 'json.aspx',
params: { type: 'takeout', action: 'item', itemId: itemId },
callback: function (opts, success, response) {
var itemData = { name: 'Invalid Item', description: '', imageHtml: '', price: '' };
if (success) {
var json = Ext.decode(response.responseText);
if (json.success) {
itemData = json.Data;
}
}
var view = this.render({
xtype: 'takeout-item',
itemData: itemData
});
Eze.log('controller takeout/item after render');
this.application.viewport.setActiveItem(view, { type: 'slide', direction: options.direction || 'left' });
Eze.hideListMask();
Eze.log('controller takeout/item after active');
},
scope: this
});
}
});
;
Ext.regModel('Dept', {
fields: ['deptId', 'name', 'imagePath']
});
;
Ext.regModel('Event', {
fields: ['listId', 'name', 'description', 'dayStr', { name: 'sortOrder', type: 'int'}]
});
Ext.regModel('EventDetail', {
fields: ['name', 'description', 'start', 'end', 'repeat', 'link', 'calendarId']
});
;
Ext.regModel('ItemOptions', {
fields: [
{ name: 'key', type: 'string' },
{ name: 'text', type: 'string' }
]
});
;
Ext.regModel('Location', {
fields: ['locationId', 'name', 'address', 'phone']
});
;
Ext.regModel('MenuItem', {
fields: ['itemId', 'name', 'description', 'price', 'imagePath', 'availHtml']
});
;
Ext.regModel('NavItem', {
fields: ['title', 'key', 'subkey', 'image', 'href', 'header', 'internalUrl']
});
;
Ext.regModel('Page', {
fields: ['pageId', 'name', 'type', 'internalUrl', 'externalUrl', 'isLink']
});
;
Ext.regModel('Photo', {
fields: [
'name',
'image_url',
{ name: 'gallery_id', type: 'number' },
{ name: 'image_count', type: 'number' }
]
});;
Ext.regModel('ProMenu', {
fields: ['id', 'name', 'description']
});;
Ext.regModel('ProMenuItem', {
fields: ['id', 'name', 'description', 'price', 'imagePath']
});
;
Ext.regModel('ProSection', {
fields: ['id', 'name', 'description']
});;
Ext.ux.EditableList = Ext.extend(Ext.List, {
inEditMode: false,
inSwipeMode: false,
initComponent: function () {
var me = this;
var tmpTpl, tplParams;
// define the template for our delete-able list items
tmpTpl = '
' +
'' +
'
{listtpl}
' +
'' +
'
' +
'Delete' +
'
' +
'
'
tplParams = {
listtpl: (Ext.isString(this.itemTpl) ? this.itemTpl : this.itemTpl.html)
};
// create new xtemplate
this.deleteTpl = new Ext.XTemplate(tmpTpl);
// apply any existing templates to our new one
this.itemTpl = this.deleteTpl.apply(tplParams);
// set up listeners for our editable list
this.listeners = {
// activate: when component is created
"activate": this.addEditButton,
// beginEdit: when editing action begins
"beginEdit": function (list, mode) {
this.selModel.setLocked(true);
if (mode == "multi") {
this.inEditMode = true;
this.addDeleteBar();
}
else {
this.inSwipeMode = true;
}
},
// endEdit; when editing action stops
"endEdit": function (list, mode) {
if (mode == "multi") {
this.inEditMode = false;
}
else {
this.inSwipeMode = false;
}
this.selModel.setLocked(false);
},
// el: adding delegate listener to the delete button "item" in our XTemplate
// will fire on clicks of the element
el: {
tap: function (e, item, delegate) {
if (me.inSwipeMode) {
var listitem = Ext.get(item).up(".x-list-delete");
listitem.addCls("selected");
me.deleteItems();
}
// else {
e.stopEvent();
// }
},
delegate: '.x-display'
},
// itemtap: when an item in our list is tapped; handles regular and in-edit-mode taps
itemtap: function (view, index, item, e) {
// if we're in view mode, handle delete list fn
if (view.inEditMode) {
var item = Ext.get(item);
item.select(".x-list-delete").each(function () {
if (this.hasCls("selected")) {
this.addCls("unselected");
this.removeCls("selected");
view.setDeleteButton();
}
else {
this.addCls("selected");
this.removeCls("unselected");
view.setDeleteButton();
}
})
}
// otherwise, let regular process take over
else {
if (e.target.className != "x-list-disclosure") {
this.getSelectionModel().select(this.getRecord(item))
}
}
},
// swipe: when user swipes over a list itme
itemswipe: function (view, index, item, e) {
if (view.inEditMode) {
return false;
}
var swipedIndex = "";
view.fireEvent("beginEdit", view, "swipe");
// loop over all list items, removing display class from delete button
view.el.select(".x-list-delete-button").each(function (el, c, idx) {
// if this delete button is displayed, save index
if (el.hasCls("x-display")) {
swipedIndex = idx;
}
el.removeCls("x-display");
el.addCls("x-hidden");
});
// if the index of the existing delete button equals the row just swiped
// fire the endEdit event, since swiping is done
if (swipedIndex === index) {
view.fireEvent("endEdit", view, "swipe");
}
// otherwise, add the display class to the new row's delete button
else {
var el = Ext.get(item);
el.select(".x-list-delete-button").each(function () {
this.removeCls("x-hidden");
this.addCls("x-display");
})
}
}
}
Ext.ux.EditableList.superclass.initComponent.call(this);
// add new events
this.addEvents("beginEdit", "endEdit");
},
/* addEditButton: adds an editing button to the parent panel's toolbar
* is fired when this component is originally created
*/
addEditButton: function () {
var me = this;
var panel = this.up("panel");
var ttbar = panel.dockedItems.getAt(0);
var btn = new Ext.Button({
ui: "action",
text: "Edit",
//bubbleEvents: ["endEdit"],
handler: function () {
if (this.getText() == "Edit") {
this.setText("Done");
me.showDeleteIcons();
}
else {
this.setText("Edit");
me.hideDeleteIcons();
}
},
listeners: {
"beginEdit": function (list, mode) {
this.setText("Done");
},
"endEdit": function (list, mode) {
this.setText("Edit");
}
}
});
// relay events to the button so we can cherry pick on them from the button as well
btn.relayEvents(this, ['beginEdit', 'endEdit']);
ttbar.add(btn);
ttbar.doComponentLayout();
panel.doComponentLayout();
},
/* addDeleteBar: adds a toolbar to the bottom of the parent panel
* is fired when the mode is set to "multi" (e.g., when not in swipe editing mode)
*/
addDeleteBar: function () {
var me = this;
var panel = this.up("panel");
var bbar = panel.dockedItems.getAt(1);
if (!bbar) {
bbar = new Ext.Toolbar({
dock: "bottom",
ui: "light",
hidden: true,
showAnimation: "fade",
listeners: {
"endEdit": function (list, mode) {
this.hide(this.showAnimation)
},
"hide": function () {
this.doHide();
panel.doComponentLayout();
}
},
items: [{
xtype: "button",
iconCls: "trash",
iconMask: true,
ui: "decline",
text: "Delete",
disabled: true,
handler: me.deleteItems,
scope: me
}]
});
// relay event to bottom toolbar so we can cherry pick it from the toolbar as well
bbar.relayEvents(this, ["endEdit"])
panel.addDocked(bbar);
}
this.setDeleteButton();
bbar.show();
panel.doComponentLayout();
},
/* showDeleteIcons: adds/removes classes from list item's delete icons, allowing CSS3 to handle animations
*/
showDeleteIcons: function () {
var nodes = this.getNodes();
this.el.select(".x-list-delete").each(function () {
this.removeCls("hidden");
this.removeCls("selected");
this.addCls("unselected");
});
this.fireEvent("beginEdit", this, "multi");
},
/* hideDeleteIcons: adds/removes classes from list item's delete icons, allowing CSS3 to handle animations
*/
hideDeleteIcons: function () {
var nodes = this.getNodes();
this.el.select(".x-list-delete").each(function () {
this.addCls("hidden");
});
this.el.select(".x-list-delete-button").each(function () {
this.removeCls("x-display");
this.addCls("x-hidden");
})
var mode = this.inEditMode ? "multi" : "swipe";
this.fireEvent("endEdit", this, mode)
},
/* onTapStart: override of regular onTapStart() method to prevent highlighting of list items during edit mode
* is fired every time a list item is taped
*/
onTapStart: function (e, t) {
var me = this,
item = this.findTargetByEvent(e);
if (item && !this.inEditMode && !this.inSwipeMode) {
if (me.pressedDelay) {
if (me.pressedTimeout) {
clearTimeout(me.pressedTimeout);
}
me.pressedTimeout = setTimeout(function () {
Ext.fly(item).addCls(me.pressedCls);
}, Ext.isNumber(me.pressedDelay) ? me.pressedDelay : 100);
}
else {
Ext.fly(item).addCls(me.pressedCls);
}
}
},
/* setDeleteButton: enables multi-delete button and increments button "count" text
*/
setDeleteButton: function () {
var count = this.el.select(".selected").elements.length;
var btn = this.up("panel").dockedItems.getAt(1).items.getAt(0);
if (count) {
btn.enable()
btn.setText(Ext.util.Format.format('Delete ({0})', count));
btn.doComponentLayout()
}
else {
btn.setText("Delete");
btn.disable();
}
},
/* deleteItems: deletes selected items from list's store
*/
deleteItems: function () {
var me = this;
var records = [];
var groups = me.store.getGroups();
var tmprecords = [];
if (groups.length) {
for (var i = 0; i < groups.length; i++) {
var cr = groups[i].children;
for (var x = 0; x < cr.length; x++) {
tmprecords.push(cr[x]);
}
}
var cache = new Ext.util.MixedCollection();
cache.addAll(tmprecords);
}
var count = this.el.select(".x-list-delete").each(function (el, c, idx) {
if (this.hasCls("selected")) {
if (cache) {
var record = cache.getAt(idx);
}
else {
var record = me.store.getAt(idx);
}
records.push(record);
}
});
this.store.remove(records)
this.store.sync();
this.hideDeleteIcons();
}
});
Ext.reg('editablelist', Ext.ux.EditableList);;
/**
* Script name: TabBarMvc
*
* Description: Custom Sencha Touch TabBar that works with a MVC structured application;
* Full description can be found here:
* http://www.onlinesolutionsdevelopment.com/blog/mobile-development/javascript/sencha-touch-tabbar-in-a-mvc-structured-application
*
* Author: CAM
* Author URL: http://www.onlinesolutionsdevelopment.com/blog
*
* Last modified date: October 8, 2011
*/
TabBarMvc = Ext.extend(Ext.TabBar, {
dock: 'bottom',
ui: 'dark',
layout: {
pack: 'center'
},
initComponent: function () {
var thisComponent = this;
this.previousTabIndex = 0;
// iterate through all the items
Ext.each(this.items, function (item) {
// add a handler function for the tab button
item.handler = function () {
thisComponent.tabButtonHandler(this);
};
}, this);
// detect when the route changed
Ext.Dispatcher.on('dispatch', function (interaction) {
var tabs = this.query('.tab');
var action = interaction.action;
var controller = interaction.controller.id;
Ext.each(tabs, function (item) {
if (!item.route)
return;
var dispatchOptions = Ext.Router.recognize(item.route);
//
var itemAction = dispatchOptions.action;
var itemController = dispatchOptions.controller;
if (itemController == controller && itemAction == action) {
this.setActiveTab(item);
this.previousTabIndex = this.items.indexOf(item);
return false;
}
}, this);
}, this);
// switch animation
if (!this.switchAnimation) {
this.switchAnimation = { type: 'slide' };
}
else if (Ext.isString(this.switchAnimation)) {
this.switchAnimation = { type: this.switchAnimation };
}
TabBarMvc.superclass.initComponent.apply(this, arguments);
},
// function called on tab button tap
tabButtonHandler: function (tab) {
var tabIndex = this.items.indexOf(tab);
this.setActiveTab(tab);
if (!Ext.isEmpty(tab.route)) {
var anim = {};
anim = Ext.apply(anim, this.switchAnimation);
if (tabIndex != -1 && tabIndex < this.previousTabIndex) {
anim.reverse = true;
}
var dispatchOptions = Ext.Router.recognize(tab.route);
dispatchOptions.animation = anim;
//
Ext.dispatch(dispatchOptions);
}
this.previousTabIndex = tabIndex;
},
setActiveTab: function (tab) {
var tabs = this.query('.tab');
Ext.each(tabs, function (item, index) {
item.removeCls('x-tab-active');
}, this);
tab.addCls('x-tab-active');
}
});
Ext.reg('TabBarMvc', TabBarMvc);;
Eze.TakeoutTabs = Ext.extend(Ext.TabBar, {
dock: 'bottom',
ui: 'dark',
layout: {
pack: 'justify',
align: 'stretch'
},
initComponent: function () {
Eze.log('takeout-tabs init');
this.items = [{
text: 'Home',
iconCls: 'home',
route: 'home/index'
}, {
text: 'Menu',
iconCls: 'note2',
route: 'takeout/index'
}, {
text: 'Favorites',
iconCls: 'favorites',
route: 'favs/index'
}, {
cls: 'cartTabIcon',
text: OrderEze.cartSettings.ShoppingCartTitle,
iconCls: 'shop1',
route: 'cart/index',
badgeText: Eze.utils.cartItemCount <= 0 ? null : Eze.utils.cartItemCount
}, {
text: 'Account',
iconCls: 'user',
route: 'account/index'
}];
var thisComponent = this;
this.previousTabIndex = 0;
// iterate through all the items
Ext.each(this.items, function (item) {
// add a handler function for the tab button
item.handler = function () {
thisComponent.tabButtonHandler(this);
};
var currPage = Ext.History.getToken();
currPage = currPage.substr(0, item.route.length);
if (item.route == currPage) {
item.cls = 'x-tab-active';
}
}, this);
Eze.TakeoutTabs.superclass.initComponent.apply(this, arguments);
},
// function called on tab button tap
tabButtonHandler: function (tab) {
var tabIndex = this.items.indexOf(tab);
if (!Ext.isEmpty(tab.route)) {
var dispatchOptions = Ext.Router.recognize(tab.route);
dispatchOptions.animation = false;
dispatchOptions.fromTab = true;
Eze.navToUrl('#' + tab.route, dispatchOptions);
//Ext.dispatch(dispatchOptions);
}
this.previousTabIndex = tabIndex;
}
});
Ext.reg('takeout-tabs', Eze.TakeoutTabs);
;
Eze.utils = {
cartItemCount: -1,
updateCartItemCount: function (view, count) {
Eze.utils.cartItemCount = count;
Eze.log(view.dockedItems.getAt(1).items.getAt(3));
view.dockedItems.getAt(1).items.getAt(3).setBadge(count);
Eze.log(view.dockedItems.getAt(1).items.getAt(3));
},
hideKeyboard: function () {
var activeElement = document.activeElement;
activeElement.setAttribute('readonly', 'readonly');
activeElement.setAttribute('disabled', 'true');
Ext.defer(function () {
activeElement.blur();
activeElement.removeAttribute('readonly');
activeElement.removeAttribute('disabled');
}, 100);
}
};
Number.prototype.formatMoney = function (c, d, t) {
if (this == 0) return '';
p = '';
if (Object.prototype.toString.apply(c) === '[object Boolean]' && c) {
c = 2;
p = '+';
}
var n = this,
c = isNaN(c = Math.abs(c)) ? 2 : c,
d = d == undefined ? "." : d,
t = t == undefined ? "," : t,
s = n < 0 ? "-$" : "$",
i = parseInt(n = Math.abs(+n || 0).toFixed(c)) + "",
j = (j = i.length) > 3 ? j % 3 : 0;
return p + s + (j ? i.substr(0, j) + t : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + t) + (c ? d + Math.abs(n - i).toFixed(c).slice(2) : "");
};
Ext.Picker.override({
show: function () {
if (Ext.is.Phone) {
// need to manually hide the keyboard and delay showing the Picker popup because the popup displays under the keyboard
// and when the keyboard and picker are dismissed, the layout is completely broken
// See https://ordereze.visualstudio.com/DefaultCollection/OrderEze/_workitems#_a=edit&id=3443
Eze.utils.hideKeyboard();
Ext.defer(Ext.Sheet.superclass.show, 500, this, arguments);
} else {
Ext.Sheet.superclass.show.apply(this, arguments);
}
}
});;
/**
* @class OrderEze.Viewport
* @extends Ext.Panel
* This is a default generated class which would usually be used to initialize your application's
* main viewport. By default this is simply a welcome screen that tells you that the app was
* generated correctly.
*/
OrderEze.Viewport = Ext.extend(Ext.Panel, {
id: 'viewport',
layout: 'card',
fullscreen: true,
initComponent: function () {
Eze.log('viewport init');
Eze.viewport = this;
Eze.log('viewport init done');
// delay adding the event handler to prevent sending duplicate pageviews of the first
// page, because it is already sent by the GA script included in the page html
var that = this;
setTimeout(function() {
that.on('cardswitch', that.sendPageViewToAnalytics);
}, 500);
OrderEze.Viewport.superclass.initComponent.call(this, arguments);
},
sendPageViewToAnalytics: function () {
// send pageview to google analytics if present on the page
if (typeof (window.ga) !== 'function') return;
var relativeUrl = document.location.href.replace(document.location.origin, '');
Eze.log('sending pageview to GA: ' + relativeUrl);
var pageTitle = 'Mobile Website';
var toolbar = Eze.viewport.getActiveItem().getDockedItems();
if (toolbar.length > 0 && toolbar[0].title) {
pageTitle += ' - ' + toolbar[0].title;
} else if (document.location.hash === '#home/index') {
pageTitle += ' - Home';
}
Eze.log('Page Title: ' + pageTitle);
ga('set', {
page: relativeUrl,
title: pageTitle
});
ga('send', 'pageview');
}
});
;
Ext.ns('OrderEze.views.account');
OrderEze.views.account.index = Ext.extend(Ext.Panel, {
initComponent: function () {
Ext.apply(this, {
cls: 'account-index',
scroll: true,
dockedItems: [{
dock: 'top',
xtype: 'toolbar',
title: 'My Account',
items: [{
xtype: 'spacer'
}, {
text: 'Order Lookup',
ui: 'action',
hidden: !this.pageData.showOrderLookup,
handler: this.orderLookup,
scope: this
}, {
text: 'Login',
ui: 'action',
hidden: OrderEze.settings.isLoggedIn,
handler: this.showLoginSheet,
scope: this
}, {
text: 'Logout',
ui: 'action',
hidden: !OrderEze.settings.isLoggedIn || OrderEze.settings.isGuestUser,
handler: this.logout,
scope: this
}]
}, {
xtype: 'takeout-tabs'
}]
});
if (OrderEze.settings.isLoggedIn && !OrderEze.settings.isGuestUser) {
this.items = [];
this.items.push({
cls: 'panel-text',
html: '
Your ' + OrderEze.cartSettings.ShoppingCartTitle + ' is Empty!
Click on the Menu icon below to browse our menu and add items to your ' + OrderEze.cartSettings.ShoppingCartTitle + '
';
if (this.pageData.itemCount == 0) {
this.items = [{ html: this.emptyMsg}];
} else {
var subtotalHtml = '
';
subtotalHtml += '
Sub-total:
' + this.pageData.subtotal.formatMoney() + '
';
if (this.pageData.promoResult && this.pageData.promoResult.IsValid) {
var discounts = this.pageData.promoResult.Discounts;
for (var i = 0; i < discounts.length; i++) {
var d = discounts[i];
var amount = (d.Value == 0) ? '-$0.00' : (-d.Value).formatMoney();
subtotalHtml += '
There are no upcoming events. Please check back again soon.
',
listeners: {
itemtap: this.onItemTap,
afterrender: this.onEventItemRender,
scope: this
}
});
}
Eze.log('view events/index after apply');
OrderEze.views.events.index.superclass.initComponent.call(this, arguments);
},
onEventItemRender: function (list) {
var nodes = list.getNodes();
for (var i = 0; i < nodes.length; i++) {
var node = nodes[i];
var record = list.getRecord(node);
var color = record.data.borderColor;
if (record.data.borderColor.length > 0) {
Ext.fly(node).setStyle('border-left', '10px solid ' + color);
}
}
},
onItemTap: function (list, index, item, event) {
Eze.log('onItemTap');
Eze.showListMask(item);
var r = list.store.getAt(index);
var id = r.get('listId');
Eze.nav('events', 'details', { calendarId: this.calendarId, id: id });
}
});
Ext.reg('events-index', OrderEze.views.events.index);;
Ext.ns('OrderEze.views.favs');
OrderEze.views.favs.index = Ext.extend(Ext.Panel, {
initComponent: function () {
Ext.apply(this, {
cls: 'favs-index',
scroll: true,
dockedItems: [{
dock: 'top',
xtype: 'toolbar',
title: 'Favorites',
items: [{
xtype: 'spacer'
}, {
text: 'Login',
ui: 'action',
hidden: OrderEze.settings.isLoggedIn,
handler: this.showLoginSheet,
scope: this
}]
}, {
xtype: 'takeout-tabs'
}]
});
if (OrderEze.settings.isLoggedIn && !OrderEze.settings.isGuestUser) {
if (this.pageData.favs.length == 0) {
this.items = [{
cls: 'panel-text',
html: '
No Favorites Yet!
You have not saved any items as favorites yet.
When adding an item to your ' + OrderEze.cartSettings.ShoppingCartTitle + ', select the option to Add to My Favorites. The item will then be shown on this page for you to quickly add to your ' + OrderEze.cartSettings.ShoppingCartTitle + ' for your next order.
'
}];
} else {
this.list = new Ext.ux.EditableList({
cls: 'favs-list',
scroll: false,
grouped: true,
store: new Ext.data.Store({
fields: ['favId', 'name', 'price', 'units', 'tag', 'comment', 'info'],
getGroupString: function (record) {
return 'Favorite Items';
},
data: this.pageData.favs,
proxy: new Ext.data.MemoryProxy(),
listeners: {
remove: this.deleteItem,
scope: this
}
}),
itemTpl: '{units} {price}
{name}
' +
'
{info}
' +
'
{tag}
' +
'
{comment}
',
groupTpl: [
'',
'
',
'
{group}swipe to delete item
',
'
',
'{items}',
'
',
'
',
''
],
disableSelection: true,
onItemDisclosure: true
});
this.list.on('itemtap', function (list, index, item, e) {
if (list.inSwipeMode) return;
var rec = list.store.getAt(index);
Eze.log('addToCart - ' + rec.get('name'));
Ext.Msg.confirm('', 'Add your favorite "' + rec.get('name') + '" to your ' + OrderEze.cartSettings.ShoppingCartTitle + '?', function (btn) {
if (btn == 'no') return;
this.selectedFavId = rec.get('favId');
this.addToCart();
}, this);
}, this);
this.items = [{
cls: 'panel-text',
html: '
Tap on a item to add it to your ' + OrderEze.cartSettings.ShoppingCartTitle + '
You must login in order to view your Favorite Items. Click on the Login button above to login.
'
}];
}
OrderEze.views.favs.index.superclass.initComponent.call(this, arguments);
},
deleteItem: function (store, record, index) {
Eze.log('deleteItem ' + record.get('favId'));
Eze.load('favs', 'deleteItem', record.get('favId'), function (data) {
Eze.nav('favs');
}, this);
},
addToCart: function () {
Eze.load('favs', 'addToCart', this.selectedFavId, function (data) {
if (data.status == 'TIMENOTSET') {
this.showPickupTimeSheet();
} else if (data.status == 'UNAVAILABLE') {
this.showUnavailableSheet(data);
} else if (data.status == 'OK') {
Eze.utils.cartItemCount = data.cartItemCount;
Eze.nav('favs');
}
}, this);
},
showPickupTimeSheet: function () {
Eze.log('showPickupTimeSheet');
var sheet = new OrderEze.views.takeout.PickupTimeSheet({
listeners: {
done: function (theSheet) {
this.addToCart();
},
scope: this
}
});
sheet.show();
},
showUnavailableSheet: function (data) {
Eze.log('showUnavailableSheet');
var sheet = new OrderEze.views.takeout.UnavailableSheet({
availData: data,
listeners: {
done: function (theSheet, showChangeTimeSheet) {
if (showChangeTimeSheet)
this.showPickupTimeSheet();
},
scope: this
}
});
sheet.show();
},
showLoginSheet: function () {
Eze.log('showLoginSheet');
var sheet = new OrderEze.views.account.LoginSheet({
instructions: 'You must login to the website to view your favorite items',
listeners: {
loggedin: function (theSheet) {
Eze.log('showLoginSheet done');
Eze.nav('favs');
},
scope: this
}
});
sheet.show();
}
});
Ext.reg('favs-index', OrderEze.views.favs.index);;
Ext.ns('OrderEze.views.form');
OrderEze.views.form.index = Ext.extend(Ext.form.FormPanel, {
initComponent: function () {
Ext.apply(this, {
cls: 'form-index',
scroll: 'vertical',
standardSubmit: false,
url: 'json.aspx',
baseParams: { type: 'form', action: 'submit', formId: this.formId },
dockedItems: [{
dock: 'top',
xtype: 'toolbar',
title: this.formName,
items: [{
text: 'Home',
ui: 'back',
handler: Eze.navBack
}]
}]
});
this.items = [];
if (this.topText !== '') {
this.items.push({ html: '
' + this.topText + '
' });
}
if (this.formFields.length >= 1) {
this.defaults = { xtype: 'fieldset' };
this.items.push([this.formFields, { // pulled from server by the form controller
xtype: 'button',
text: 'Submit',
handler: function () {
this.submit({
method: 'POST',
waitMsg: { message: 'Submitting ', cls: 'loading-mask', target: Ext.getBody() },
success: function (form, result) {
form.reset();
if (result.Data.thankYouMsg === '' || result.Data.thankYouMsg === '') {
Ext.Msg.alert('Thank You', 'The form has been submitted successfully', function () {
Eze.nav('home');
});
} else {
Ext.Msg.alert('', result.Data.thankYouMsg, function () {
Eze.nav('home');
});
}
},
failure: function (form, result) {
var msg = 'There was a problem submitting the form. Please try again';
if (result.GeneralError) msg += '
');
var marker = new mapboxgl.Marker()
.setLngLat(center)
.setPopup(popup)
.addTo(this.map);
marker.togglePopup();
// get the south west and north east map bounds
var sw = this.map.getBounds().getSouthWest();
var ne = this.map.getBounds().getNorthEast();
// add padding to allow the user to pan and scroll tha map around the area
var swPadded = new mapboxgl.LngLat(sw.lng - 0.07, sw.lat - 0.04);
var nePadded = new mapboxgl.LngLat(ne.lng + 0.07, ne.lat + 0.04);
this.map.setMaxBounds(new mapboxgl.LngLatBounds(swPadded, nePadded));
},
resizeMap: function () {
if (!this.map) {
return;
}
var that = this;
// The time out was added because the map breaks
// on window resize if you resize instantly
setTimeout(function () {
that.map.resize();
}, 1000);
}
});
Ext.reg('locations-details', OrderEze.views.locations.details);;
Ext.ns('OrderEze.views.locations');
OrderEze.views.locations.index = Ext.extend(Ext.Panel, {
destroyMe: false,
initComponent: function () {
var self = this;
window.addEventListener("resize", function () {
self.resizeMap();
});
Ext.apply(this, {
cls: 'locations-index',
scroll: true,
dockedItems: [{
dock: 'top',
xtype: 'toolbar',
title: OrderEze.settings.moduleNames.locations,
items: [{
text: 'Home',
ui: 'back',
handler: function () {
this.destroyMe = true;
Eze.navBack();
},
scope: this
}]
}],
items: [{
xtype: 'component',
id: 'map-container-location',
height: 200,
width: '100%',
autoEl: {
tag: 'div'
}
}, {
xtype: 'list',
cls: 'locations-list',
scroll: false,
store: new Ext.data.JsonStore({
model: 'Location',
data: this.pageData
}),
itemTpl: '
' +
'
{name}
{addressHtml}
tel: {phone}
' +
'
{days}:
{hours}
' +
'
{notes}
' +
'
' +
'
' +
'
Directions
' +
'' +
'
Call
' +
'' +
'
Contact Us
' +
'' +
'
',
disableSelection: true,
onItemDisclosure: true,
listeners: {
itemtap: function (list, index, item, e) {
var buttonType = e.target.getAttribute("data-type");
if (buttonType === "directions") {
Eze.log('Directions');
window.location = this.pageData[index].directionsUrl;
}
else if (buttonType === "call") {
Eze.log('Call Now');
window.location = "tel:" + this.pageData[index].phone;
}
else if (buttonType === "contact") {
var rec = list.store.getAt(index);
var locId = rec.get("locationId");
Eze.log("Contact with location id: " + locId);
Eze.nav("contact", "index", { id: locId });
}
else {
var rec = list.store.getAt(index);
Eze.showListMask(item);
Eze.nav('locations', 'details', { id: rec.get('locationId') });
}
},
scope: this
}
}],
listeners: {
activate: this._onActivate,
deactivate: function (v) {
v.hide();
}
}
});
Eze.log('view locations/index init');
this.mapboxClient = mapboxSdk({ accessToken: mapboxgl.accessToken });
OrderEze.views.locations.index.superclass.initComponent.call(this, arguments);
},
_onActivate: function () {
var container = document.getElementById("map-container-location");
var center = this.mapCenter;
this.map = new mapboxgl.Map({
container: container, // container id
style: 'mapbox://styles/mapbox/streets-v9', // stylesheet location
center: center, // starting position [lng, lat]
zoom: 14 // starting zoom
});
this.markerBounds = new mapboxgl.LngLatBounds();
for (var i = 0; i < this.pageData.length; i++) {
this.addMarker(this.pageData[i], i === this.pageData.length - 1);
}
// get the south west and north east map bounds
var sw = this.map.getBounds().getSouthWest();
var ne = this.map.getBounds().getNorthEast();
// add padding to allow the user to pan and scroll tha map around the area
var swPadded = new mapboxgl.LngLat(sw.lng - 0.07, sw.lat - 0.04);
var nePadded = new mapboxgl.LngLat(ne.lng + 0.07, ne.lat + 0.04);
this.map.setMaxBounds(new mapboxgl.LngLatBounds(swPadded, nePadded));
},
resizeMap: function () {
if (!this.map) {
return;
}
var that = this;
// The time out was added because the map breaks
// on window resize if you resize instantly
setTimeout(function () {
that.map.resize();
}, 1000);
},
addMarker: function (location, fitBounds) {
if (location.latitude && location.longitude) {
this.addMarkerMap([location.longitude, location.latitude], fitBounds);
return;
}
var that = this;
this.mapboxClient.geocoding.forwardGeocode({ query: location.addressString, limit: 1 }).send().then((response) => {
var mapCenter = response.body.features[0].center;
that.addMarkerMap(mapCenter, fitBounds);
}, (error) => { alert('There was a problem finding the address'); });
},
addMarkerMap: function (mapCenter, fitBounds) {
this.markerBounds.extend(mapCenter);
var popup = new mapboxgl.Popup({ offset: 25 }).setHTML('
');
var marker = new mapboxgl.Marker()
.setLngLat(center)
.setPopup(popup)
.addTo(this.map);
marker.togglePopup();
// get the south west and north east map bounds
var sw = this.map.getBounds().getSouthWest();
var ne = this.map.getBounds().getNorthEast();
// add padding to allow the user to pan and scroll tha map around the area
var swPadded = new mapboxgl.LngLat(sw.lng - 0.07, sw.lat - 0.04);
var nePadded = new mapboxgl.LngLat(ne.lng + 0.07, ne.lat + 0.04);
this.map.setMaxBounds(new mapboxgl.LngLatBounds(swPadded, nePadded));
},
resizeMap: function () {
if (!this.map) {
return;
}
var that = this;
// The time out was added because the map breaks
// on window resize if you resize instantly
setTimeout(function () {
that.map.resize();
}, 1000);
}
});
Ext.reg('map-index', OrderEze.views.map.index);;
Ext.ns('OrderEze.views.menu');
OrderEze.views.menu.index = Ext.extend(Ext.Panel, {
initComponent: function () {
var isTopDept = this.deptData.parentId == 0;
Ext.apply(this, {
cls: 'menu-index',
scroll: true,
dockedItems: [{
dock: 'top',
xtype: 'toolbar',
title: isTopDept ? OrderEze.settings.moduleNames.menus : this.deptData.name,
items: [{
text: isTopDept ? 'Home' : 'Back',
ui: 'back',
handler: function () {
if (isTopDept) {
this.destroyAll = true;
}
Eze.navBack();
},
scope: this
}]
}]
});
this.items = [];
if (isTopDept) {
if (this.deptData.topText !== '')
this.items.push({ html: '
',
name: 'paymentType',
value: 'PayPal',
checked: !this.pageData.payOnlineAllowed && this.pageData.payWithPaypalAllowed,
listeners: {
check: this.onPaymentChanged,
scope: this
}
});
}
if (this.pageData.payInPersonAllowed) {
pmtItems.push({
xtype: 'radiofield',
label: 'In Person',
name: 'paymentType',
value: 'In Person',
checked: !this.pageData.payOnlineAllowed && !this.pageData.payWithPaypalAllowed && this.pageData.payInPersonAllowed,
listeners: {
check: this.onPaymentChanged,
scope: this
}
});
}
this.form = new Ext.form.FormPanel({
scroll: true,
standardSubmit: false,
items: [{
xtype: 'fieldset',
title: 'How would you like to pay?',
instructions: this.pageData.paymentMessage,
defaults: {
labelWidth: '80%'
},
items: pmtItems
}, {
xtype: 'fieldset',
title: 'How much would you like to tip?',
defaults: { labelWidth: '70%' },
hidden: !this.pageData.showTipField,
items: [{
xtype: 'numberfield',
name: 'tip',
label: 'Tip Amount ($)',
value: '0',
minValue: 0
}]
}, {
xtype: 'fieldset',
title: this.pageData.commentsTitle || 'Order Comments:',
hidden: !this.pageData.commentsAllowed,
items: [{
xtype: 'textareafield',
name: 'orderComments'
}]
}]
});
this.items = [this.form];
OrderEze.views.checkout.index.superclass.initComponent.call(this, arguments);
},
onPaymentChanged: function (cb) {
Eze.log('onPaymentChanged ' + cb.getValue());
var showTipSection = (cb.getValue() == 'Online');
// tip fieldset
if (this.pageData.showTipField) this.form.items.getAt(1).setVisible(showTipSection);
},
next: function () {
Eze.log('next');
Eze.load('checkout', 'indexSubmit', this.form.getValues(), function (data) {
Eze.log('checkout/index.next done');
Eze.navToUrl(data.nextPage);
}, this);
}
});
Ext.reg('checkout-index', OrderEze.views.checkout.index);;
Ext.ns('OrderEze.views.checkout');
OrderEze.views.checkout.payment = Ext.extend(Ext.Panel, {
initComponent: function () {
Ext.apply(this, {
cls: 'checkout-payment',
scroll: false,
layout: 'fit',
dockedItems: [{
dock: 'top',
xtype: 'toolbar',
title: 'Payment',
items: [{
text: 'Back',
ui: 'back',
handler: function () {
this.destroyMe = true;
Eze.navBack();
},
scope: this
}, {
xtype: 'spacer'
}, {
text: 'Next',
ui: 'forward',
handler: this.next,
scope: this
}]
}]
});
this.form = new Ext.form.FormPanel({
scroll: true,
standardSubmit: false,
items: [{
xtype: 'fieldset',
title: 'Payment Method',
hidden: this.pageData.cards.length == 0,
items: [{
xtype: 'selectfield',
name: 'cardId',
options: this.pageData.cards,
value: this.pageData.cards.length > 1 ? this.pageData.cards[1].value : '-1',
listeners: {
change: this.onCardChanged,
scope: this
}
}]
}, {
id: 'pmt_info',
xtype: 'fieldset',
title: 'Payment Information:',
hidden: this.pageData.cards.length > 0,
defaults: { labelWidth: '40%', required: true },
items: [{
xtype: 'textfield',
name: 'name',
label: 'Name',
hidden: !this.pageData.cardConfig.OwnerName
}, {
xtype: 'selectfield',
name: 'cardType',
label: 'Type',
options: this.pageData.allTypes
}, {
xtype: 'textfield',
name: 'cardNumber',
label: 'Number'
}, {
xtype: 'selectfield',
name: 'cardExpMonth',
label: 'Exp. Month',
options: this.pageData.allMonths
}, {
xtype: 'selectfield',
name: 'cardExpYear',
label: 'Exp. Year',
options: this.pageData.allYears
}, {
xtype: 'numberfield',
name: 'cardCode',
label: 'Auth Code',
hidden: !this.pageData.cardConfig.SecurityCode,
minValue: 100,
maxValue: 9999
}, {
xtype: 'checkboxfield',
name: 'save',
label: 'Save card info for later?',
labelWidth: '80%',
checked: true,
value: 'true',
required: false,
hidden: OrderEze.settings.isGuestUser
}]
}, {
id: 'billing_info',
xtype: 'fieldset',
title: 'Billing Information:',
hidden: this.pageData.cards.length > 0 && this.pageData.cardConfig.HasAny,
defaults: { labelWidth: '40%', required: true },
items: [{
xtype: 'textfield',
name: 'streeNumber',
label: 'House #',
hidden: !this.pageData.cardConfig.StreetNumber
}, {
xtype: 'textfield',
name: 'streetName',
label: 'Street',
hidden: !this.pageData.cardConfig.StreetName
}, {
xtype: 'textfield',
name: 'city',
label: 'City',
hidden: !this.pageData.cardConfig.City
}, {
xtype: 'selectfield',
name: 'state',
label: 'State',
options: !this.pageData.cardConfig.State ? [] : this.pageData.allStates,
hidden: !this.pageData.cardConfig.State
}, {
xtype: 'textfield',
name: 'zip',
label: 'Zip',
hidden: !this.pageData.cardConfig.ZipCode
}]
}]
});
// show ssl seal
var seal = Ext.get('siteseal');
if (seal) {
this.form.insert(0, {
cls: 'panel-text',
padding: 0,
bodyPadding: 0,
html: '
