examples/key-feed-viewer/viewer/FeedViewer.js

   1 /**
   2  * @class FeedViewer.FeedViewer
   3  * @extends Ext.container.Viewport
   4  *
   5  * The main FeedViewer application
   6  *
   7  * @constructor
   8  * Create a new Feed Viewer app
   9  * @param {Object} config The config object
  10  */
  11 Ext.define('FeedViewer.App', {
  12     extend: 'Ext.container.Viewport',
  13
  14     initComponent: function(){
  15
  16         Ext.define('Feed', {
  17             extend: 'Ext.data.Model',
  18             fields: ['title', 'url']
  19         });
  20
  21         Ext.define('FeedItem', {
  22             extend: 'Ext.data.Model',
  23             fields: ['title', 'author', {
  24                 name: 'pubDate',
  25                 type: 'date'
  26             }, 'link', 'description', 'content']
  27         });
  28
  29         Ext.apply(this, {
  30             layout: 'border',
  31             padding: 5,
  32             items: [this.createFeedPanel(), this.createFeedInfo()]
  33         });
  34         this.callParent(arguments);
  35     },
  36
  37     /**
  38      * Create the list of fields to be shown on the left
  39      * @private
  40      * @return {FeedViewer.FeedPanel} feedPanel
  41      */
  42     createFeedPanel: function(){
  43         this.feedPanel = Ext.create('widget.feedpanel', {
  44             region: 'west',
  45             collapsible: true,
  46             width: 225,
  47             floatable: false,
  48             split: true,
  49             feeds: [{
  50                 title: 'Sencha Blog',
  51                 url: 'http://feeds.feedburner.com/extblog'
  52             }, {
  53                 title: 'Sencha Forums',
  54                 url: 'http://sencha.com/forum/external.php?type=RSS2'
  55             }, {
  56                 title: 'Ajaxian',
  57                 url: 'http://feeds.feedburner.com/ajaxian'
  58             }],
  59             listeners: {
  60                 scope: this,
  61                 feedselect: this.onFeedSelect
  62             }
  63         });
  64         return this.feedPanel;
  65     },
  66
  67     /**
  68      * Create the feed info container
  69      * @private
  70      * @return {FeedViewer.FeedInfo} feedInfo
  71      */
  72     createFeedInfo: function(){
  73         this.feedInfo = Ext.create('widget.feedinfo', {
  74             region: 'center'
  75         });
  76         return this.feedInfo;
  77     },
  78
  79     /**
  80      * Reacts to a feed being selected
  81      * @private
  82      */
  83     onFeedSelect: function(feed, title, url){
  84         this.feedInfo.addFeed(title, url);
  85     }
  86 });