1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
| Ext.define('Pandora.view.Viewport', {
| extend: 'Ext.container.Viewport',
| layout: 'fit',
|
| requires: [
| 'Pandora.view.NewStation',
| 'Pandora.view.SongControls',
| 'Pandora.view.StationsList',
| 'Pandora.view.RecentlyPlayedScroller',
| 'Pandora.view.SongInfo'
| ],
|
| initComponent: function() {
| this.items = {
| dockedItems: [{
| dock: 'top',
| xtype: 'toolbar',
| height: 80,
| items: [{
| xtype: 'newstation',
| width: 150
| }, {
| xtype: 'songcontrols',
| flex: 1
| }, {
| xtype: 'component',
| html: 'Pandora<br>Internet Radio'
| }]
| }],
| layout: {
| type: 'hbox',
| align: 'stretch'
| },
| items: [{
| width: 250,
| xtype: 'panel',
| layout: {
| type: 'vbox',
| align: 'stretch'
| },
| items: [{
| xtype: 'stationslist',
| flex: 1
| }, {
| html: 'Ad',
| height: 250,
| xtype: 'panel'
| }]
| }, {
| xtype: 'container',
| flex: 1,
| border: false,
| layout: {
| type: 'vbox',
| align: 'stretch'
| },
| items: [{
| xtype: 'recentlyplayedscroller',
| height: 250
| }, {
| xtype: 'songinfo',
| flex: 1
| }]
| }]
| };
|
| this.callParent();
| }
| });
|
|