FeedViewer.js 2.3 KB

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