selecting only replies/DMs/both works on main scene, favorites scene …

…now converted to widgets.

DMs are not being stored for some reason, need to look into it...

Next is type as you go filter, then calling it a night

TODO

@@ -7,15 +7,4 @@
 	* People Picker widget to integrate with contacts for posting(?)
 
 # Widget Reorg
-  * Replace existing programmatic template rendering (from templates.js), be sure to clean up all instances
-  * Start with timeline/List widget
-    * Add filter (search user name and content) once this is working properly
-    * Be sure to tweak lookahead to work nicely with quick flicks on the list widget
-  * Separation of data/logic/presentation
-  * Data is available immediately from widget model, rather than having to parse it from the DOM as it is currently
-  * Perform all logic (filtering/sorting/classifying entries as new/read/direct/retweet/etc) on the data prior to rendering view
-    * Invalid items, such as tweets without users, should be pruned at the model level, perhaps in Lawnchair
-    * If it will be reused, break this logic off into one of the helpers, view into shared
-  * View becomes a dumb shell, easy to maintain
-  * Using Mojo models allows us to update multiple widgets onscreen with one call to modelChanged()
-  * Make sure to apply all existing event listeners to the widgets
+  * Add filter (search user name and content) once this is working properly

app/assistants/favorites-assistant.js

@@ -8,6 +8,10 @@ function FavoritesAssistant() {
 
 FavoritesAssistant.prototype.setup = function() {
 
+	this.timelineModel = {items: []};
+  this.controller.setupWidget("favorites-timeline", {itemTemplate: "shared/tweet", hasNoWidgets: true, lookahead: 20, renderLimit: 20}, this.timelineModel);
+  this.filterState = "favorites";
+
 	this.scroller = this.controller.getSceneScroller();
 	this.initAppMenu({ 'items':loggedin_appmenu_items });
 	this.initTwit('DOM');
@@ -69,7 +73,7 @@ FavoritesAssistant.prototype.activate = function(event) {
 		Prepare for timeline entry taps
 	*/
 	this.bindTimelineEntryTaps('#favorites-timeline');
-
+  this.controller.listen("favorites-timeline", Mojo.Event.listTap, this.handleTimelineTap);
 	/*
 		set up the public timeline
 	*/
@@ -107,7 +111,9 @@ FavoritesAssistant.prototype.activate = function(event) {
 
 			};
 
-			thisA.favtl.addItems(no_dupes);
+      // thisA.favtl.addItems(no_dupes);
+      thisA.renderTimeline();
+
 			sc.helpers.markAllAsRead('#favorites-timeline div.timeline-entry'); // favs are never "new"
 			sc.helpers.updateRelativeTimes('#favorites-timeline div.timeline-entry span.date', 'data-created_at');
 			thisA.hideInlineSpinner('activity-spinner-favorites');
@@ -151,7 +157,7 @@ FavoritesAssistant.prototype.deactivate = function(event) {
 		stop listening for timeline entry taps
 	*/
 	this.unbindTimelineEntryTaps('#favorites-timeline');
-	
+  this.controller.stopListening("favorites-timeline", Mojo.Event.listTap, this.handleTimelineTap);
 	/*
 		unbind and stop refresher for public timeline
 	*/

app/assistants/my-timeline-assistant.js

@@ -53,6 +53,8 @@ function MyTimelineAssistant(argFromPusher) {
 MyTimelineAssistant.prototype.setup = function() {
 
 	sch.debug('SETUP');
+	this.timelineModel = {items: []};
+  this.controller.setupWidget("my-timeline", {itemTemplate: "shared/tweet", hasNoWidgets: true, lookahead: 20, renderLimit: 20}, this.timelineModel);
 
 	var thisA = this;
 
@@ -179,6 +181,7 @@ MyTimelineAssistant.prototype.deactivate = function(event) {
 		stop listening for timeline entry taps
 	*/
 	this.unbindTimelineEntryTaps('#my-timeline');
+	this.controller.stopListening("my-timeline", Mojo.Event.listTap, this.handleTimelineTap);
 
 
 
@@ -220,10 +223,6 @@ MyTimelineAssistant.prototype.cleanup = function(event) {
 MyTimelineAssistant.prototype.initTimeline = function() {
 
 	sch.debug('initializing Timeline in assistant');
-  // TODO: Timeline list widget
-	this.timelineModel = {items: []};
-  this.controller.setupWidget("my-timeline", {itemTemplate: "shared/tweet", hasNoWidgets: true, lookahead: 20, renderLimit: 20}, this.timelineModel);
-
 	var thisA = this;
 	/*
 		set up the combined "my" timeline
@@ -272,26 +271,7 @@ MyTimelineAssistant.prototype.initTimeline = function() {
 
       // TODO: Timeline list widget
       // remove invalid data, massage into format that works for view interpolation, sort
-      sc.app.Tweets.bucket.all(function(tweets) {
-        thisA.timelineModel.items = tweets.select(function(tweet) {
-          if(tweet.id && tweet.user)
-            return true;
-          else
-            return false;
-        }).
-        map(function(tweet){
-          tweet.status = null;
-          tweet.status = tweet.not_new ? "" : "new";
-          tweet.status += tweet.SC_is_reply ? " reply" : "";
-          tweet.protected_icon = tweet.user["protected"] ? "protected-icon" : "";
-          tweet.relative_time = sch.getRelativeTime(tweet.created_at);
-          return tweet;
-        }).
-        sort(function(a, b) {
-          return b.SC_created_at_unixtime - a.SC_created_at_unixtime;
-        });
-        thisA.controller.modelChanged(thisA.timelineModel);
-      });
+      thisA.renderTimeline();
 
 			/*
 				sort timeline

app/helpers/scene.js

@@ -239,33 +239,80 @@ scene_helpers.addCommonSceneMethods = function(assistant) {
 	assistant.filterTimeline = function(command) {
 
 		if (!command) {
-			command = this.filterState;
+			command = this.filterState || "filter-timeline-all";
 		}
 
 		switch (command) {
 			case 'filter-timeline-all':
-				jQuery('#my-timeline div.timeline-entry').show();
+			  this.renderTimeline(true);
 				break;
 			case 'filter-timeline-replies-dm':
-				jQuery('#my-timeline div.timeline-entry').hide();
-				jQuery('#my-timeline div.timeline-entry.reply, #my-timeline div.timeline-entry.dm').show();
+			  this.timelineModel.items = this.timelineModel.items.filter(function(tweet) {
+			    if(tweet.SC_is_reply || tweet.SC_is_dm)
+			      return true;
+		      else
+			      return false;
+			  });
 				break;
 			case 'filter-timeline-replies':
-				jQuery('#my-timeline div.timeline-entry').hide();
-				jQuery('#my-timeline div.timeline-entry.reply').show();
+			  this.timelineModel.items = this.timelineModel.items.filter(function(tweet) {
+			    if(tweet.SC_is_reply)
+			      return true;
+		      else
+			      return false;
+			  });
 				break;
 			case 'filter-timeline-dms':
-				jQuery('#my-timeline div.timeline-entry').hide();
-				jQuery('#my-timeline div.timeline-entry.dm').show();
+			  this.timelineModel.items = this.timelineModel.items.filter(function(tweet) {
+			    if(tweet.SC_is_dm)
+			      return true;
+		      else
+			      return false;
+			  });
 				break;
-			default:
-				jQuery('#my-timeline div.timeline-entry').show();
+			case "favorites":
+			  this.timelineModel.items = this.timelineModel.items.filter(function(tweet) {
+			    if(tweet.favorited)
+			      return true;
+			    else
+			      return false;
+			  });
+			  break;
 		}
 
 		this.filterState = command;	
+		this.controller.modelChanged(this.timelineModel);
+		this.scrollToTop();
 	};
 
-
+	assistant.renderTimeline = function(skipFilter) {
+	  var thisA = this;
+	  sc.app.Tweets.bucket.all(function(tweets) {
+      thisA.timelineModel.items = tweets.select(function(tweet) {
+        if(tweet.id && tweet.user)
+          return true;
+        else
+          return false;
+      }).
+      map(function(tweet){
+        tweet.status = null;
+        tweet.status = tweet.not_new ? "" : "new";
+        tweet.status += tweet.SC_is_reply ? " reply" : "";
+        tweet.protected_icon = tweet.user["protected"] ? "protected-icon" : "";
+        tweet.relative_time = sch.getRelativeTime(tweet.created_at);
+        return tweet;
+      }).
+      sort(function(a, b) {
+        return b.SC_created_at_unixtime - a.SC_created_at_unixtime;
+      });
+      if(skipFilter) {
+        thisA.controller.modelChanged(thisA.timelineModel);
+        thisA.scrollToTop();
+      }
+      else
+        thisA.filterTimeline();
+    });
+	};
 
 	assistant.setTimelineTextSize = function(tl_id, size) {
 		size = size.toLowerCase();

app/views/favorites/favorites-scene.html

@@ -18,5 +18,5 @@
 	</div>
 
 
-<div id="favorites-timeline" class="timeline"></div>
+  <div id="favorites-timeline" class="timeline" x-mojo-element="List"></div>
 </div>

app/views/startsearch/startsearch-scene.html

@@ -29,7 +29,6 @@
 		</table> 
 	    <div class="pane">
 			<div class="palm-group palm-group-spaz">
-				<div class="palm-group-title" id="search-toggle" x-mojo-loc=''>Search</div>
 				<div class="palm-list" id="search-panel">
 			   		<div class="palm-row single">
 						<div class="palm-row-wrapper textfield-group" x-mojo-focus-highlight="true">