Skip to content
Browse files

more performance tweaks

  • Loading branch information...
1 parent a1e2a50 commit 097c661be9c3358fbac1bb982501b11094722944 @rsanchez1 committed Jan 6, 2012
Showing with 229 additions and 49 deletions.
  1. +2 −0 depends.js
  2. +24 −48 source/ArticlesView.js
  3. +122 −0 source/RowServer.js
  4. +80 −0 source/ScrollingList.js
  5. +1 −1 source/models/api.js
View
2 depends.js
@@ -27,6 +27,8 @@ enyo.depends(
"source/models/subscription.js",
//START VIEWS
"source/libraries/Metrix/metrix.js",
+ "source/ScrollingList.js",
+ "source/RowServer.js",
"source/Dashboard.js",
"source/Launcher.js",
"source/Main.js",
View
72 source/ArticlesView.js
@@ -37,7 +37,7 @@ enyo.kind({
{kind: "Spinner", showing: true, className: "tfSpinner",}
]},
{name: "emptyNotice", content: "There are no articles available.", className: "articleTitle itemLists", style: "font-weight: bold; padding-top: 20px; padding-left: 20px; font-size: 0.9rem;", flex: 1},
- {name: "articlesList", kind: "ScrollingList", flex: 1, onSetupRow: "getListArticles", rowsPerScrollerPage: 50, className: "itemLists", components: [
+ {name: "articlesList", kind: "VirtualList", flex: 1, onSetupRow: "getListArticles", /*rowsPerScrollerPage: 50,*/ pageSize: 1, lookAhead: 50, onAcquirePage: "refreshList", className: "itemLists", components: [
{kind: "Divider", onclick: "articleDividerClick"},
{name: "articleItem", kind: "SwipeableItem", layoutKind: "VFlexLayout", onConfirm: "swipedArticle", confirmRequired: false, allowLeft: true, components: [
{name: "title", className: "articleTitle", kind: "HtmlContent"},
@@ -73,6 +73,7 @@ enyo.kind({
this.inherited(arguments);
this.headerContentChanged();
this.app = enyo.application.app;
+ this.$.articlesList.render();
},
headerContentChanged: function() {
//this.$.header.setContent(this.headerContent);
@@ -95,10 +96,8 @@ enyo.kind({
}
*/
this.articles = [];
- /*
enyo.log("CALLED RESET OFFLINE ARTICLES CHANGED");
this.$.articlesList.reset();
- */
if (Preferences.groupFoldersByFeed()) {
this.offlineArticles.sort(this.originSortingFunction);
this.offlineArticles = this.sortSortedArticlesByDate(this.offlineArticles);
@@ -109,15 +108,9 @@ enyo.kind({
this.offlineArticles.sort(function(a, b) {return b.sortDate - a.sortDate;});
}
}
- if (this.isRendered) {
- enyo.log("CALLED REFRESH OFFLINE ARTICLES CHANGED");
- //this.$.articlesList.refresh();
- this.refresh();
- } else {
- this.isRendered = true;
- enyo.log("CALLED RENDER OFFLINE ARTICLES CHANGED");
- this.$.articlesList.render();
- }
+ enyo.log("CALLED REFRESH OFFLINE ARTICLES CHANGED");
+ //this.$.articlesList.refresh();
+ //this.refresh();
if (this.wasOfflineSet) {
this.selectArticle(0);
} else {
@@ -137,25 +130,15 @@ enyo.kind({
var scroller = this.$.articlesList.$.scroller;
this.maxTop = 0;
this.numberRendered = 0;
- /*
scroller.adjustTop(0);
scroller.adjustBottom(10);
- */
scroller.top = 0;
scroller.bottom = 10;
this.offlineArticles = [];
this.articles.items = [];
//this.$.articlesList.punt();
enyo.log("CALLED RESET ARTICLES CHANGED");
this.$.articlesList.reset();
- /*
- if (this.isRendered) {
- this.$.articlesList.refresh();
- } else {
- this.isRendered = true;
- this.$.articlesList.render();
- }
- */
if (this.articles.canMarkAllRead) {
this.$.readAllButton.setIcon("images/read-footer.png");
} else {
@@ -213,15 +196,9 @@ enyo.kind({
this.articles.items = this.sortSortedArticlesByDate(this.articles.items);
}
}
- if (this.isRendered) {
- enyo.log("CALLED REFRESH FOUND ARTICLES");
- //this.$.articlesList.refresh();
- this.refresh();
- } else {
- this.isRendered = true;
- enyo.log("CALLED RENDER FOUND ARTICLES");
- this.$.articlesList.render();
- }
+ enyo.log("CALLED REFRESH FOUND ARTICLES");
+ //this.$.articlesList.refresh();
+ this.refresh();
if (this.articles.items.length) {
this.selectArticle(0);
}
@@ -334,6 +311,10 @@ enyo.kind({
},
getListArticles: function(inSender, inIndex) {
+ enyo.log("GETTING INDEX: ", inIndex);
+ if (inIndex < 0) {
+ return false;
+ }
var articles = [];
if (this.offlineArticles.length) {
articles = this.offlineArticles;
@@ -348,8 +329,11 @@ enyo.kind({
this.numberRendered = numberRendered;
}
if (articles.length) {
+ if (inIndex > articles.length) {
+ return false;
+ }
r = articles[inIndex];
- if (r) {
+ if (!!r) {
if (!!this.itemsToHide[r.origin]) {
this.$.articleItem.hide();
this.$.articleItem.addClass("firstRow");
@@ -493,6 +477,8 @@ enyo.kind({
}
}
return true;
+ } else {
+ return false;
}
}
},
@@ -592,6 +578,7 @@ enyo.kind({
articleItemClick: function(inSender, inEvent) {
this.articleClicked = true;
+ enyo.log(inEvent);
this.selectArticle(inEvent.rowIndex);
},
headerClick: function(inSender, inEvent) {
@@ -648,10 +635,8 @@ enyo.kind({
}
}
var scroller = this.$.articlesList.$.scroller;
- /*
scroller.adjustTop(scrollTop);
scroller.adjustBottom(scrollBottom);
- */
scroller.top = scrollTop;
scroller.bottom = scrollBottom;
} else {
@@ -750,10 +735,8 @@ enyo.kind({
}
}
var scroller = this.$.articlesList.$.scroller;
- /*
scroller.adjustTop(scrollTop);
scroller.adjustBottom(scrollBottom);
- */
scroller.top = scrollTop;
scroller.bottom = scrollBottom;
} else {
@@ -849,10 +832,8 @@ enyo.kind({
if (!this.offlineArticles.length) {
var scroller = this.$.articlesList.$.scroller;
this.maxTop = 0;
- /*
scroller.adjustTop(0);
scroller.adjustBottom(10);
- */
scroller.top = 0;
scroller.bottom = 10;
this.articles.items = [];
@@ -873,15 +854,9 @@ enyo.kind({
this.$.articlesList.removeClass("medium");
this.$.articlesList.removeClass("large");
this.$.articlesList.addClass(Preferences.getArticleListFontSize());
- if (this.isRendered) {
- enyo.log("CALLED REFRESH CHOOSE FONT");
- //this.$.articlesList.refresh();
- this.refresh();
- } else {
- this.isRendered = true;
- enyo.log("CALLED RENDER CHOOSE FONT");
- this.$.articlesList.render();
- }
+ enyo.log("CALLED REFRESH CHOOSE FONT");
+ //this.$.articlesList.refresh();
+ this.refresh();
},
originSortingFunction: function(a, b) {
var originA = a.sortOrigin.toLowerCase();
@@ -970,6 +945,7 @@ enyo.kind({
refresh: function() {
//this.$.articlesList.refresh();
enyo.log("CALLED UPDATED REFRESH");
- this.$.articlesList.$.scroller.updatePages();
+ //this.$.articlesList.$.scroller.updatePages();
+ this.$.articlesList.update();
},
});
View
122 source/RowServer.js
@@ -0,0 +1,122 @@
+enyo.kind({
+ name: "TouchFeeds.RowServer",
+ kind: enyo.Control,
+ events: {
+ onSetupRow: ""
+ },
+ chrome: [
+ {name: "client", kind: "Flyweight", onNodeChange: "clientNodeChanged", onDecorateEvent: "clientDecorateEvent"},
+ ],
+ lastIndex: null,
+ itemsCache: [],
+ create: function() {
+ this.inherited(arguments);
+ this.$.client.generateHtml();
+ },
+ prepareRow: function(inIndex) {
+ this.transitionRow(inIndex);
+ var r = this.controlsToRow(inIndex);
+ if (!r) {
+ this.disableNodeAccess();
+ }
+ return r;
+ },
+ generateHtml: function() {
+ return '';
+ },
+ generateRow: function(inIndex) {
+ if (!!this.itemsCache[inIndex]) {
+ return this.itemsCache[inIndex];
+ }
+ var r;
+ if (this.lastIndex != null) {
+ this.lastIndex = null;
+ }
+ if (!this._nodesDisabled) {
+ this.disableNodeAccess();
+ }
+ var fr = this.formatRow(inIndex);
+ if (fr !== undefined) {
+ if (fr === null) {
+ r = " ";
+ } else if (fr) {
+ this.$.client.domAttributes.rowIndex = inIndex;
+ r = this.getChildContent();
+ this.itemsCache[inIndex] = r;
+ }
+ }
+ this.$.client.needsNode = true;
+ return r;
+ },
+ formatRow: function(inIndex) {
+ return this.doSetupRow(inIndex);
+ },
+ updateRow: function(inIndex) {
+ this.itemsCache[inIndex] = undefined;
+ this.generateRow(inIndex);
+ },
+ invalidate: function() {
+ this.itemsCache = [];
+ },
+ clearState: function() {
+ this.lastIndex = null;
+ },
+ clientDecorateEvent: function(inSender, inEvent) {
+ inEvent.rowIndex = this.rowIndex;
+ },
+ clientNodeChanged: function(inSender, inNode) {
+ var i = this.fetchRowIndex();
+ this.transitionRow(i);
+ },
+ disableNodeAccess: function() {
+ this.$.client.disableNodeAccess();
+ this._nodesDisabled = true;
+ },
+ enableNodeAccess: function() {
+ this.$.client.enableNodeAccess();
+ this._nodesDisabled = false;
+ },
+ transitionRow: function(inIndex) {
+ this.rowIndex = inIndex;
+ if (inIndex != this.lastIndex) {
+ this.lastIndex = inIndex;
+ }
+ this.enableNodeAccess();
+ },
+ controlsToRow: function(inRowIndex) {
+ var n = this.fetchRowNode(inRowIndex);
+ if (n) {
+ this.$.client.setNode(n);
+ return true;
+ }
+ },
+ fetchRowNode: function(inRowIndex) {
+ var pn = this.getParentNode();
+ if (pn) {
+ var matches = pn.querySelectorAll('[rowindex="' + inRowIndex + '"]');
+ for (var i=0, m; m=matches[i]; i++) {
+ if (m.id == this.$.client.id) {
+ return m;
+ }
+ }
+ }
+ },
+ fetchRowIndex: function(inControl) {
+ var c = inControl || this.$.client;
+ var n = c.node;
+ if (n) {
+ return this.fetchRowIndexByNode(n);
+ }
+ },
+ fetchRowIndexByNode: function(inNode) {
+ var i, n = inNode, p = this.getParentNode();
+ while (n && n.getAttribute && n != p) {
+ i = n.getAttribute("rowIndex");
+ if (i !== null) {
+ return Number(i);
+ }
+ n = n.parentNode;
+ }
+ }
+});
+
View
80 source/ScrollingList.js
@@ -0,0 +1,80 @@
+enyo.kind({
+ name: "TouchFeeds.ScrollingList",
+ kind: enyo.VFlexBox,
+ events: {
+ /** sent with arguments (inSender,inIndex) to ask owner to prepare the row with specificed index by
+ setting the properties of the objects in the list's components. Return true if you should keep
+ getting more onSetupRow events for more items. */
+ onSetupRow: ""
+ },
+ rowsPerScrollerPage: 1,
+ //* @protected
+ controlParentName: "list",
+ initComponents: function() {
+ this.createComponents([
+ {flex: 1, name: "scroller", kind: enyo.BufferedScroller, rowsPerPage: this.rowsPerScrollerPage, onGenerateRow: "generateRow", onAdjustTop: "adjustTop", onAdjustBottom: "adjustBottom", components: [
+ {name: "list", kind: "TouchFeeds.RowServer", onSetupRow: "setupRow"}
+ ]}
+ ]);
+ this.inherited(arguments);
+ },
+ generateRow: function(inSender, inRow) {
+ return this.$.list.generateRow(inRow);
+ },
+ setupRow: function(inSender, inRow) {
+ return this.doSetupRow(inRow);
+ },
+ rendered: function() {
+ this.inherited(arguments);
+ // allow access to flyweight node after rendering or refreshing;
+ // ensures, for example, that any dynamically added controls do not have
+ // a node access state out of sync with flyweight
+ this.$.list.enableNodeAccess();
+ },
+ //* @public
+ //* move the active index of the list to inIndex where it can be altered
+ prepareRow: function(inIndex) {
+ return this.$.list.prepareRow(inIndex);
+ },
+ //* indicate that a row has changed so the onSetupRow callback will be called for it
+ updateRow: function(inIndex) {
+ //this.prepareRow(inIndex);
+ this.$.list.updateRow(inIndex);
+ //this.setupRow(this, inIndex);
+ },
+ //* return the index of the active row
+ fetchRowIndex: function() {
+ return this.$.list.fetchRowIndex();
+ },
+ //* adjust rendering buffers to fit display
+ update: function() {
+ this.$.scroller.updatePages();
+ },
+ /** redraw any visible items in the list to reflect data changes without
+ adjusting the list positition */
+ refresh: function() {
+ this.$.scroller.refreshPages();
+ this.$.list.enableNodeAccess();
+ },
+ //* clear the list's internal state and refresh
+ reset: function() {
+ // dump state buffer
+ this.$.list.clearState();
+ // stop scroller animation
+ this.$.scroller.$.scroll.stop();
+ // dump and rebuild rendering buffers
+ this.refresh();
+ },
+ //* completely reset the list so that it reloads all data and rerenders
+ punt: function() {
+ // dump state buffer
+ this.$.list.clearState();
+ // dump rendering buffers and locus data, rebuild from start state
+ this.$.scroller.punt();
+ },
+ invalidate: function() {
+ this.$.list.invalidate();
+ this.refresh();
+ },
+});
+
View
2 source/models/api.js
@@ -513,4 +513,4 @@ var Api = Class.create({
}
})
-Api.BASE_URL = "http://www.google.com/reader/api/0/"
+Api.BASE_URL = "https://www.google.com/reader/api/0/"

0 comments on commit 097c661

Please sign in to comment.
Something went wrong with that request. Please try again.