Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
BB Extra for Sencha Touch 1 to support click scrolling
//Extra patch for BB devices to simulate scrolling
//Credit to
//http://resilientcoder.blogspot.com/2011/04/sencha-touch-scrolling-non-touch.html and
//http://pastebin.com/Mih4Ps12
window.BBScroller = function(evt, div, el) {
if (this.scroller.offsetBoundary.top === 0) {
this.scroller.updateBoundary();
}
var maxOffset = this.scroller.offsetBoundary[1] - 400;
var bottom = this.getHeight() + 50;
if (evt.xy[1] > bottom && this.scroller.offset.y >= maxOffset) {
var offset = -1 * this.scroller.offset.y + 8;
this.scroller.scrollTo({
x: -1*this.scroller.offset.x,
y: offset
});
} else if (evt.xy[1] < 130 && this.scroller.offset.y <= 0) {
this.scroller.scrollTo({
x: -1*this.scroller.offset.x,
y: (-1 * this.scroller.offset.y) - 8
});
}
if (this.scroll === 'both') {
var maxOffset = this.scroller.offsetBoundary[0];
var right = this.getWidth() - 70;
if (evt.xy[0] > right && this.scroller.offset.x >= maxOffset) {
var offset = -1 * this.scroller.offset.x + 8;
this.scroller.scrollTo({
x: offset,
y: -1*this.scroller.offset.y
});
} else if (evt.xy[0] < 70 && this.scroller.offset.x <= 0) {
this.scroller.scrollTo({
x: (-1 * this.scroller.offset.x) - 8,
y: -1*this.scroller.offset.y
});
}
}
//console.log(evt.xy, this.getWidth(), this.getHeight(), this.scroller.offsetBoundary[0], this.scroller.offsetBoundary[1]);
};
Ext.override(Ext.List, {
initComponent: function() {
var memberFnsCombo = {};
//<deprecated since=0.99>
if (this.tpl) {
console.warn('Ext.List: The tpl config has been removed and replaced by itemTpl. Please remove tpl and itemSelector from your Lists.');
// convert from array to string
if (Ext.isArray(this.tpl)) {
this.tpl = this.tpl.join('');
} else if (this.tpl.html) {
Ext.apply(memberFnsCombo, this.tpl.initialConfig);
this.tpl = this.tpl.html;
}
this.tpl = Ext.util.Format.trim(this.tpl);
if (this.tpl.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");
}
var tpl = this.tpl,
first = '<tpl for=".">',
firstLn = first.length,
end = '</tpl>',
tplFirst = this.tpl.substr(0, firstLn),
tplEndIdx = this.tpl.lastIndexOf(end),
stripped;
if (tplFirst === first && tplEndIdx !== -1) {
this.itemTpl = tpl.substr(firstLn, tplEndIdx - firstLn);
this.itemSelector = Ext.List.prototype.itemSelector;
} else {
throw new Error("Ext.List: tpl to itemTpl conversion failed.");
}
}
//</deprecated>
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;
}
//<debug>
if (!Ext.isDefined(this.itemTpl)) {
throw new Error("Ext.List: itemTpl is a required configuration.");
}
// this check is not enitrely fool proof, does not account for spaces or multiple classes
// if the check is done without "s then things like x-list-item-entity would throw exceptions that shouldn't have.
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");
}
//</debug>
this.tpl = '<tpl for="."><div class="x-list-item ' + this.itemCls + '"><div class="x-list-item-body">' + this.itemTpl + '</div>';
if (this.onItemDisclosure) {
this.tpl += '<div class="x-list-disclosure"></div>';
}
this.tpl += '</div></tpl>';
this.tpl = new Ext.XTemplate(this.tpl, memberFnsCombo);
if (this.grouped) {
this.listItemTpl = this.tpl;
if (Ext.isString(this.listItemTpl) || Ext.isArray(this.listItemTpl)) {
// memberFns will go away after removal of tpl configuration for itemTpl
// this copies memberFns by storing the original configuration.
this.listItemTpl = new Ext.XTemplate(this.listItemTpl, memberFnsCombo);
}
if (Ext.isString(this.groupTpl) || Ext.isArray(this.groupTpl)) {
this.tpl = new Ext.XTemplate(this.groupTpl);
}
}
else {
this.indexBar = false;
}
if (this.scroll !== false) {
this.scroll = {
direction: 'vertical',
useIndicators: !this.indexBar
};
}
// if (this.enableAutoPaging) {
// this.enablePaging = true;
// }
Ext.List.superclass.initComponent.call(this);
if (this.onItemDisclosure) {
// disclosure can be a function that will be called when
// you tap the disclosure button
if (Ext.isFunction(this.onItemDisclosure)) {
this.onItemDisclosure = {
scope: this,
handler: this.onItemDisclosure
};
}
}
this.on('deactivate', this.onDeactivate, this);
this.addEvents(
/**
* @event disclose
* Fires when the user taps the disclosure icon on an item
* @param {Ext.data.Record} record The record associated with the item
* @param {Ext.Element} node The wrapping element of this node
* @param {Number} index The index of this list item
* @param {Ext.util.Event} e The tap event that caused this disclose to fire
*/
'disclose',
/**
* @event update
* Fires whenever the contents of the List is updated.
* @param {Ext.List} list This list
*/
'update'
);
if (this.scroll !== false && window.BBTouch == false) {
this.on('mousemove', window.BBScroller, this, {element:'el'} );
}
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.