├── .gitignore ├── LICENSE ├── README.MD ├── Readme.md.tpl.default ├── app.js.tpl.default ├── app.json.tpl ├── app ├── Readme.md ├── data │ ├── Pie.js.tpl.default │ ├── Radial.js.tpl.default │ ├── Simulated.js.tpl.default │ ├── Subscriptions.js.tpl.default │ ├── UserSharedItems.js.tpl.default │ ├── UserTimeline.js.tpl.default │ ├── dashboard │ │ ├── Counce.js.tpl.default │ │ ├── Full.js.tpl.default │ │ ├── Movies.js.tpl.default │ │ ├── Tasks.js.tpl.default │ │ └── Visitor.js.tpl.default │ ├── email │ │ ├── Friends.js.tpl.default │ │ └── Inbox.js.tpl.default │ ├── faq │ │ └── FAQ.js.tpl.default │ ├── marketshare │ │ ├── MultiYear.js.tpl.default │ │ ├── OneEntity.js.tpl.default │ │ ├── OneYear.js.tpl.default │ │ └── Yearwise.js.tpl.default │ ├── qg │ │ ├── Area.js.tpl.default │ │ ├── Bar.js.tpl.default │ │ ├── Line.js.tpl.default │ │ └── Pie.js.tpl.default │ └── search │ │ ├── Results.js.tpl.default │ │ └── Users.js.tpl.default ├── model │ ├── Base.js.tpl.default │ ├── ChatMessages.js.tpl.default │ ├── DataXY.js.tpl.default │ ├── FriendsList.js.tpl.default │ ├── MultiDataXY.js.tpl.default │ ├── PanelSetting.js.tpl.default │ ├── PersonalInfo.js.tpl.default │ ├── Subscription.js.tpl.default │ ├── YearwiseData.js.tpl.default │ ├── email │ │ ├── Email.js.tpl.default │ │ └── Friend.js.tpl.default │ ├── faq │ │ ├── Category.js.tpl.default │ │ └── Question.js.tpl.default │ └── search │ │ ├── Attachment.js.tpl.default │ │ ├── Result.js.tpl.default │ │ └── User.js.tpl.default ├── proxy │ └── Api.js.tpl.default ├── store │ ├── NavigationTree.js.tpl.default │ ├── email │ │ ├── Friends.js.tpl.default │ │ └── Inbox.js.tpl.default │ ├── faq │ │ └── FAQ.js.tpl.default │ └── search │ │ ├── Results.js.tpl.default │ │ └── Users.js.tpl.default └── view │ ├── chart │ ├── Bounces.js.tpl.default │ ├── Network.js.tpl.default │ └── Visitors.js.tpl.default │ ├── charts │ ├── Area.js.tpl.default │ ├── Bar.js.tpl.default │ ├── ChartBase.js.tpl.default │ ├── ChartsModel.js.tpl.default │ ├── Gauge.js.tpl.default │ ├── Line.js.tpl.default │ ├── Pie.js.tpl.default │ ├── Pie3D.js.tpl.default │ ├── Polar.js.tpl.default │ └── Stacked.js.tpl.default │ ├── dashboard │ ├── DashboardController.js.tpl.default │ ├── DashboardModel.js.tpl.default │ └── Weather.js.tpl.default │ ├── email │ └── EmailModel.js.tpl.default │ ├── forms │ └── SpecialOffer.js.tpl.default │ └── profile │ ├── Description.js.tpl.default │ ├── Notifications.js.tpl.default │ ├── Social.js.tpl.default │ ├── Timeline.js.tpl │ ├── UserProfileBase.js.tpl.default │ └── UserProfileModel.js.tpl.default ├── bootstrap.css.tpl.default ├── bootstrap.js ├── build.xml.tpl.default ├── classic ├── overrides │ └── menu │ │ └── Item.js.tpl.default ├── resources │ └── Readme.md ├── sass │ ├── etc │ │ └── all.scss │ ├── src │ │ └── view │ │ │ ├── authentication │ │ │ ├── Dialog.scss │ │ │ └── LockingWindow.scss │ │ │ ├── dashboard │ │ │ └── Dashboard.scss │ │ │ ├── email │ │ │ ├── Details.scss │ │ │ ├── Email.scss │ │ │ └── Inbox.scss │ │ │ ├── forms │ │ │ └── Wizards.scss │ │ │ ├── main │ │ │ └── Main.scss │ │ │ ├── pages │ │ │ ├── BlankPage.scss │ │ │ ├── Error404Window.scss │ │ │ └── FAQ.scss │ │ │ ├── search │ │ │ └── Results.scss │ │ │ └── widgets │ │ │ └── Widgets.scss │ └── var │ │ └── view │ │ ├── authentication │ │ └── Dialog.scss │ │ ├── email │ │ ├── Details.scss │ │ ├── Email.scss │ │ └── Inbox.scss │ │ ├── main │ │ └── Main.scss │ │ ├── pages │ │ ├── BlankPage.scss │ │ └── FAQ.scss │ │ ├── profile │ │ └── UserProfile.scss │ │ └── widgets │ │ └── Widgets.scss └── src │ ├── Application.js.tpl.default │ └── view │ ├── authentication │ ├── AuthenticationController.js.tpl.default │ ├── AuthenticationModel.js.tpl.default │ ├── Dialog.js.tpl.default │ ├── LockScreen.js.tpl.default │ ├── LockingWindow.js.tpl.default │ ├── Login.js.tpl.default │ ├── PasswordReset.js.tpl.default │ └── Register.js.tpl.default │ ├── charts │ └── Charts.js.tpl.default │ ├── dashboard │ ├── Dashboard.js.tpl.default │ ├── Earnings.js.tpl.default │ ├── HDDUsage.js.tpl.default │ ├── Network.js.tpl.default │ ├── Sales.js.tpl.default │ ├── Services.js.tpl.default │ ├── Todos.js.tpl.default │ ├── TopMovie.js.tpl.default │ └── Widgets.js.tpl.default │ ├── email │ ├── Compose.js.tpl.default │ ├── ComposeViewController.js.tpl.default │ ├── ComposeViewModel.js.tpl.default │ ├── Details.js.tpl.default │ ├── DetailsViewModel.js.tpl.default │ ├── Email.js.tpl.default │ ├── EmailController.js.tpl.default │ ├── FriendsList.js.tpl.default │ ├── FriendsListViewController.js.tpl.default │ ├── FriendsListViewModel.js.tpl.default │ ├── Inbox.js.tpl.default │ ├── Menu.js.tpl.default │ ├── MenuViewModel.js.tpl.default │ └── Window.js.tpl.default │ ├── forms │ ├── WizardForm.js.tpl.default │ ├── WizardFormController.js.tpl.default │ ├── WizardFormModel.js.tpl.default │ ├── WizardOne.js.tpl.default │ └── Wizards.js.tpl.default │ ├── main │ ├── Main.js.tpl.default │ ├── MainContainerWrap.js.tpl.default │ ├── MainController.js.tpl.default │ └── MainModel.js.tpl.default │ ├── pages │ ├── BlankPage.js.tpl.default │ ├── Error404Window.js.tpl.default │ ├── Error500Window.js.tpl.default │ ├── ErrorBase.js.tpl.default │ └── FAQ.js.tpl.default │ ├── profile │ ├── ShareUpdate.js.tpl.default │ └── UserProfile.js.tpl.default │ ├── search │ ├── Results.js.tpl.default │ ├── ResultsController.js.tpl.default │ └── ResultsModel.js.tpl.default │ └── widgets │ ├── WidgetA.js.tpl.default │ ├── WidgetB.js.tpl.default │ ├── WidgetC.js.tpl.default │ ├── WidgetD.js.tpl.default │ ├── WidgetE.js.tpl.default │ ├── WidgetF.js.tpl.default │ └── Widgets.js.tpl.default ├── index.html.tpl.default ├── modern ├── sass │ ├── etc │ │ └── all.scss │ ├── src │ │ └── view │ │ │ ├── authentication │ │ │ └── AuthBase.scss │ │ │ ├── dashboard │ │ │ ├── Dashboard.scss │ │ │ ├── Network.scss │ │ │ └── Services.scss │ │ │ ├── faq │ │ │ └── Items.scss │ │ │ ├── forms │ │ │ ├── Finish.scss │ │ │ ├── Forms.scss │ │ │ └── Wizard.scss │ │ │ ├── main │ │ │ └── Main.scss │ │ │ ├── pages │ │ │ ├── BlankPage.scss │ │ │ └── ErrorBase.scss │ │ │ ├── phone │ │ │ ├── email │ │ │ │ └── Email.scss │ │ │ └── search │ │ │ │ └── Users.scss │ │ │ ├── profile │ │ │ └── UserProfile.scss │ │ │ ├── search │ │ │ └── All.scss │ │ │ ├── tablet │ │ │ └── email │ │ │ │ └── Email.scss │ │ │ └── widgets │ │ │ ├── BioTile.scss │ │ │ ├── SocialStatus.scss │ │ │ └── StatusTile.scss │ └── var │ │ └── view │ │ ├── dashboard │ │ └── Dashboard.scss │ │ ├── main │ │ └── Main.scss │ │ └── profile │ │ └── UserProfile.scss └── src │ ├── Application.js.tpl.default │ ├── profile │ ├── Phone.js.tpl.default │ └── Tablet.js.tpl.default │ └── view │ ├── authentication │ ├── AuthBase.js.tpl.default │ ├── LockScreen.js.tpl.default │ ├── Login.js.tpl.default │ ├── PasswordReset.js.tpl.default │ └── Register.js.tpl.default │ ├── charts │ └── Charts.js.tpl.default │ ├── dashboard │ ├── Dashboard.js.tpl.default │ ├── Earnings.js.tpl.default │ ├── HDDUsage.js.tpl.default │ ├── Network.js.tpl.default │ ├── Sales.js.tpl.default │ ├── Services.js.tpl.default │ ├── Todos.js.tpl.default │ └── TopMovie.js.tpl.default │ ├── email │ ├── Actions.js.tpl.default │ └── EmailController.js.tpl.default │ ├── faq │ ├── Items.js.tpl.default │ ├── ItemsController.js.tpl.default │ └── List.js.tpl.default │ ├── forms │ ├── Account.js.tpl.default │ ├── Address.js.tpl.default │ ├── Finish.js.tpl.default │ ├── Forms.js.tpl.default │ ├── Profile.js.tpl.default │ └── Wizard.js.tpl.default │ ├── main │ ├── Main.js.tpl.default │ ├── MainController.js.tpl.default │ └── Toolbar.js.tpl.default │ ├── pages │ ├── BlankPage.js.tpl.default │ ├── Error404.js.tpl.default │ ├── Error500.js.tpl.default │ └── ErrorBase.js.tpl.default │ ├── phone │ ├── email │ │ ├── Compose.js.tpl.default │ │ ├── Email.js.tpl.default │ │ ├── EmailController.js.tpl.default │ │ └── Inbox.js.tpl.default │ ├── main │ │ └── MainController.js.tpl.default │ └── search │ │ └── Users.js.tpl.default │ ├── profile │ ├── ShareUpdate.js.tpl.default │ └── UserProfile.js.tpl.default │ ├── search │ ├── All.js.tpl.default │ ├── Results.js.tpl.default │ └── ResultsModel.js.tpl.default │ ├── tablet │ ├── email │ │ ├── Compose.js.tpl.default │ │ ├── Email.js.tpl.default │ │ ├── EmailController.js.tpl.default │ │ └── Inbox.js.tpl.default │ └── search │ │ └── Users.js.tpl.default │ └── widgets │ ├── BioTile.js.tpl.default │ ├── FollowMessage.js.tpl.default │ ├── SocialBar.js.tpl.default │ ├── SocialStatus.js.tpl.default │ ├── StatusTile.js.tpl.default │ ├── Widgets.js.tpl.default │ └── WidgetsController.js.tpl.default ├── resources └── images │ ├── checkbox.png │ ├── company-logo.png │ ├── custom-bar.gif │ ├── error-page-background.jpg │ ├── flag-icon.png │ ├── form │ ├── checkbox.png │ └── radio.png │ ├── friends │ ├── f1.png │ ├── f10.png │ ├── f11.png │ ├── f12.png │ ├── f13.png │ ├── f14.png │ ├── f15.png │ ├── f16.png │ ├── f17.png │ ├── f2.png │ ├── f3.png │ ├── f4.png │ ├── f5.png │ ├── f6.png │ ├── f7.png │ ├── f8.png │ └── f9.png │ ├── icons │ ├── cloud-icon.png │ ├── hot-icon.png │ ├── hot-icon1.png │ ├── new-icon.png │ └── new-icon1.png │ ├── img1.jpg │ ├── img2.jpg │ ├── img3.jpg │ ├── img4.jpg │ ├── lock-screen-background.jpg │ ├── profile-icon.png │ ├── radio.png │ └── user-profile │ ├── 1.png │ ├── 10.png │ ├── 11.png │ ├── 12.png │ ├── 13.png │ ├── 14.png │ ├── 15.png │ ├── 16.png │ ├── 17.png │ ├── 18.png │ ├── 19.png │ ├── 1_.png │ ├── 2.png │ ├── 20.png │ ├── 2_.png │ ├── 3.png │ ├── 3_.png │ ├── 4.png │ ├── 4_.png │ ├── 5.png │ ├── 6.png │ ├── 7.png │ ├── 8.png │ ├── 9.png │ ├── mitul.jpg │ └── mitul1.jpg └── sass ├── Readme.md.tpl.default ├── config.rb ├── etc └── all.scss ├── example ├── bootstrap.css.tpl.default └── custom.js.default ├── src ├── Application.scss └── view │ ├── dashboard │ └── Weather.scss │ ├── forms │ └── SpecialOffer.scss │ ├── main │ └── Main.scss │ ├── profile │ └── UserProfileBase.scss │ └── search │ └── Results.scss └── var ├── all.scss └── view └── main └── Main.scss /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | *.DS_Store 3 | .idea 4 | .git 5 | 6 | -------------------------------------------------------------------------------- /app.js.tpl.default: -------------------------------------------------------------------------------- 1 | /* 2 | * This file is responsible for launching the application. Application logic should be 3 | * placed in the {appName}.Application class. 4 | */ 5 | Ext.application({ 6 | name: '{appName}', 7 | 8 | extend: '{appName}.Application', 9 | 10 | // Simply require all classes in the application. This is sufficient to ensure 11 | // that all {appName} classes will be included in the application build. If classes 12 | // have specific requirements on each other, you may need to still require them 13 | // explicitly. 14 | // 15 | requires: [ 16 | '{appName}.*' 17 | ] 18 | }); 19 | -------------------------------------------------------------------------------- /app/Readme.md: -------------------------------------------------------------------------------- 1 | # ./controller 2 | 3 | This folder contains the application's global controllers. ViewControllers are located 4 | alongside their respective view class in `"./view"`. These controllers are used for routing 5 | and other activities that span all views. 6 | 7 | # ./model 8 | 9 | This folder contains the application's (data) Model classes. 10 | 11 | # ./view 12 | 13 | This folder contains the views as well as ViewModels and ViewControllers depending on the 14 | application's architecture. Pure MVC applications may not have ViewModels, for example. For 15 | MVCVM applications or MVC applications that use ViewControllers, the following directory 16 | structure is recommended: 17 | 18 | ./view/ 19 | foo/ # Some meaningful grouping of one or more views 20 | Foo.js # The view class 21 | FooController.js # The controller for Foo (a ViewController) 22 | FooModel.js # The ViewModel for Foo 23 | 24 | This structure helps keep these closely related classes together and easily identifiable in 25 | most tabbed IDE's or text editors. 26 | 27 | # ./store 28 | 29 | This folder contains any number of store instances or types that can then be reused in the 30 | application. 31 | -------------------------------------------------------------------------------- /app/data/Pie.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.data.Pie', { 2 | extend: '{appName}.data.Simulated', 3 | 4 | data: [ 5 | { 6 | "xvalue": "Drama", 7 | "yvalue": 10 8 | }, 9 | { 10 | "xvalue": "Fantasy", 11 | "yvalue": 10 12 | }, 13 | { 14 | "xvalue": "Action", 15 | "yvalue": 12 16 | } 17 | ] 18 | }); 19 | -------------------------------------------------------------------------------- /app/data/Radial.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.data.Radial', { 2 | extend: '{appName}.data.Simulated', 3 | 4 | data: [ 5 | { 6 | "xvalue": "A", 7 | "yvalue": 417 8 | }, 9 | { 10 | "xvalue": "B", 11 | "yvalue": 676 12 | }, 13 | { 14 | "xvalue": "C", 15 | "yvalue": 606 16 | }, 17 | { 18 | "xvalue": "D", 19 | "yvalue": 124 20 | }, 21 | { 22 | "xvalue": "E", 23 | "yvalue": 473 24 | }, 25 | { 26 | "xvalue": "F", 27 | "yvalue": 108 28 | }, 29 | { 30 | "xvalue": "G", 31 | "yvalue": 847 32 | }, 33 | { 34 | "xvalue": "H", 35 | "yvalue": 947 36 | }, 37 | { 38 | "xvalue": "I", 39 | "yvalue": 694 40 | }, 41 | { 42 | "xvalue": "J", 43 | "yvalue": 603 44 | } 45 | ] 46 | }); 47 | -------------------------------------------------------------------------------- /app/data/Simulated.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.data.Simulated', { 2 | requires: [ 3 | 'Ext.ux.ajax.JsonSimlet', 4 | 'Ext.ux.ajax.SimManager' 5 | ], 6 | 7 | onClassExtended: function (cls, data) { 8 | var url = data.$className.replace(/\\./g, '/'). 9 | replace(/^{appName}\\/data/, '~api').toLowerCase(), 10 | simlet = { 11 | type: 'json', 12 | data: data.data 13 | }, 14 | registration = {}; 15 | 16 | registration[url] = simlet; 17 | 18 | Ext.ux.ajax.SimManager.register(registration); 19 | } 20 | }, 21 | function () { 22 | Ext.ux.ajax.SimManager.init({ 23 | defaultSimlet: null 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /app/data/Subscriptions.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.data.Subscriptions', { 2 | extend: '{appName}.data.Simulated', 3 | 4 | data: [ 5 | { 6 | "id": 1, 7 | "name": "Steve Horton", 8 | "subscription": "Enterprise" 9 | }, 10 | { 11 | "id": 2, 12 | "name": "Scott Calabrese", 13 | "subscription": "Trial" 14 | }, 15 | { 16 | "id": 3, 17 | "name": "Taresa Doe", 18 | "subscription": "Premium" 19 | }, 20 | { 21 | "id": 4, 22 | "name": "Lucy Doe", 23 | "subscription": "Trial" 24 | }, 25 | { 26 | "id": 5, 27 | "name": "Charles Boyle", 28 | "subscription": "Enterprise" 29 | }, 30 | { 31 | "id": 6, 32 | "name": "Charles Doe", 33 | "subscription": "Enterprise" 34 | } 35 | ] 36 | }); 37 | -------------------------------------------------------------------------------- /app/data/dashboard/Counce.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.data.dashboard.Counce', { 2 | extend: '{appName}.data.Simulated', 3 | 4 | data: [ 5 | { 6 | "xvalue": 0, 7 | "y1value": 15, 8 | "y2value": 15 9 | }, 10 | { 11 | "xvalue": 5, 12 | "y1value": 20, 13 | "y2value": 20 14 | }, 15 | { 16 | "xvalue": 10, 17 | "y1value": 15, 18 | "y2value": 15 19 | }, 20 | { 21 | "xvalue": 15, 22 | "y1value": 16, 23 | "y2value": 16 24 | }, 25 | { 26 | "xvalue": 20, 27 | "y1value": 14, 28 | "y2value": 14 29 | }, 30 | { 31 | "xvalue": 25, 32 | "y1value": 18, 33 | "y2value": 18 34 | }, 35 | { 36 | "xvalue": 30, 37 | "y1value": 10, 38 | "y2value": 10 39 | } 40 | ] 41 | }); 42 | -------------------------------------------------------------------------------- /app/data/dashboard/Movies.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.data.dashboard.Movies', { 2 | extend: '{appName}.data.Simulated', 3 | 4 | data: [ 5 | { 6 | "xvalue": "Foo", 7 | "yvalue": 943 8 | }, 9 | { 10 | "xvalue": "Bar", 11 | "yvalue": 622 12 | }, 13 | { 14 | "xvalue": "Baz", 15 | "yvalue": 1044 16 | } 17 | ] 18 | }); 19 | -------------------------------------------------------------------------------- /app/data/dashboard/Tasks.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.data.dashboard.Tasks', { 2 | extend: '{appName}.data.Simulated', 3 | 4 | data: [ 5 | { 6 | "id": 1, 7 | "task": "Upgrade to SSD harddisks", 8 | "done": true 9 | }, 10 | { 11 | "id": 2, 12 | "task": "Pay server invoice", 13 | "done": true 14 | }, 15 | { 16 | "id": 3, 17 | "task": "Upgrade to SSD harddisks", 18 | "done": false 19 | }, 20 | { 21 | "id": 4, 22 | "task": "Pay server invoice", 23 | "done": false 24 | }, 25 | { 26 | "id": 5, 27 | "task": "Upgrade to SSD harddisks", 28 | "done": false 29 | } 30 | ] 31 | }); 32 | -------------------------------------------------------------------------------- /app/data/dashboard/Visitor.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.data.dashboard.Visitor', { 2 | extend: '{appName}.data.Simulated', 3 | 4 | data: [ 5 | { 6 | "xvalue": 0, 7 | "y1value": 10, 8 | "y2value": 10 9 | }, 10 | { 11 | "xvalue": 5, 12 | "y1value": 15, 13 | "y2value": 15 14 | }, 15 | { 16 | "xvalue": 10, 17 | "y1value": 20, 18 | "y2value": 20 19 | }, 20 | { 21 | "xvalue": 15, 22 | "y1value": 15, 23 | "y2value": 15 24 | }, 25 | { 26 | "xvalue": 20, 27 | "y1value": 20, 28 | "y2value": 20 29 | }, 30 | { 31 | "xvalue": 25, 32 | "y1value": 15, 33 | "y2value": 15 34 | }, 35 | { 36 | "xvalue": 30, 37 | "y1value": 20, 38 | "y2value": 20 39 | } 40 | ] 41 | }); 42 | -------------------------------------------------------------------------------- /app/data/email/Friends.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.data.email.Friends', { 2 | extend: '{appName}.data.Simulated', 3 | 4 | data: [ 5 | { 6 | "id": 0, 7 | "online": true, 8 | "name": "Torres Tran" 9 | }, 10 | { 11 | "id": 1, 12 | "online": false, 13 | "name": "Oneill Franklin" 14 | }, 15 | { 16 | "id": 2, 17 | "online": false, 18 | "name": "Branch Allison" 19 | }, 20 | { 21 | "id": 3, 22 | "online": true, 23 | "name": "Hines Moon" 24 | }, 25 | { 26 | "id": 4, 27 | "online": true, 28 | "name": "Molina Wilkerson" 29 | }, 30 | { 31 | "id": 5, 32 | "online": true, 33 | "name": "Suzette Powell" 34 | } 35 | ] 36 | }); 37 | -------------------------------------------------------------------------------- /app/data/marketshare/MultiYear.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.data.marketshare.MultiYear', { 2 | extend: '{appName}.data.Simulated', 3 | 4 | data: [ 5 | { 6 | "xvalue": 1997, 7 | "y1value": 281, 8 | "y2value": 72, 9 | "y3value": 269, 10 | "y4value": 762 11 | }, 12 | { 13 | "xvalue": 1981, 14 | "y1value": 518, 15 | "y2value": 999, 16 | "y3value": 43, 17 | "y4value": 310 18 | }, 19 | { 20 | "xvalue": 1985, 21 | "y1value": 38, 22 | "y2value": 311, 23 | "y3value": 942, 24 | "y4value": 77 25 | }, 26 | { 27 | "xvalue": 1984, 28 | "y1value": 936, 29 | "y2value": 415, 30 | "y3value": 562, 31 | "y4value": 412 32 | }, 33 | { 34 | "xvalue": 1979, 35 | "y1value": 978, 36 | "y2value": 331, 37 | "y3value": 927, 38 | "y4value": 114 39 | }, 40 | { 41 | "xvalue": 1982, 42 | "y1value": 196, 43 | "y2value": 240, 44 | "y3value": 72, 45 | "y4value": 888 46 | }, 47 | { 48 | "xvalue": 1992, 49 | "y1value": 481, 50 | "y2value": 375, 51 | "y3value": 139, 52 | "y4value": 762 53 | }, 54 | { 55 | "xvalue": 19895, 56 | "y1value": 623, 57 | "y2value": 999, 58 | "y3value": 260, 59 | "y4value": 310 60 | }, 61 | { 62 | "xvalue": 1988, 63 | "y1value": 328, 64 | "y2value": 451, 65 | "y3value": 542, 66 | "y4value": 77 67 | }, 68 | { 69 | "xvalue": 1980, 70 | "y1value": 456, 71 | "y2value": 615, 72 | "y3value": 342, 73 | "y4value": 412 74 | }, 75 | { 76 | "xvalue": 1990, 77 | "y1value": 788, 78 | "y2value": 531, 79 | "y3value": 489, 80 | "y4value": 114 81 | } 82 | ] 83 | }); 84 | -------------------------------------------------------------------------------- /app/data/marketshare/OneEntity.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.data.marketshare.OneEntity', { 2 | extend: '{appName}.data.Simulated', 3 | 4 | data: [ 5 | { 6 | "xvalue": 2011, 7 | "yvalue": 0.1, 8 | "y1value": 0.2, 9 | "y2value": 0.3, 10 | "y3value": 0.1, 11 | "y4value": 0, 12 | "y5value": 1 13 | }, 14 | { 15 | "xvalue": 2012, 16 | "yvalue": 0.2, 17 | "y1value": 0.4, 18 | "y2value": 0.2, 19 | "y3value": 0.2, 20 | "y4value": 0, 21 | "y5value": 1 22 | }, 23 | { 24 | "xvalue": 2013, 25 | "yvalue": 0.3, 26 | "y1value": 0.2, 27 | "y2value": 0.4, 28 | "y3value": 0.3, 29 | "y4value": 0, 30 | "y5value": 1 31 | 32 | }, 33 | { 34 | "xvalue": 2014, 35 | "yvalue": 0.2, 36 | "y1value": 0.4, 37 | "y2value": 0.1, 38 | "y3value": 0.2, 39 | "y4value": 0, 40 | "y5value": 1 41 | },{ 42 | "xvalue": 2015, 43 | "yvalue": 0.4, 44 | "y1value": 0.3, 45 | "y2value": 0.4, 46 | "y3value": 0.4, 47 | "y4value": 0, 48 | "y5value": 1 49 | } 50 | ] 51 | }); 52 | -------------------------------------------------------------------------------- /app/data/marketshare/OneYear.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.data.marketshare.OneYear', { 2 | extend: '{appName}.data.Simulated', 3 | 4 | "data" :[ 5 | { 6 | "xvalue": 2004, 7 | "yvalue": 239 8 | }, 9 | { 10 | "xvalue": 2005, 11 | "yvalue": 402 12 | }, 13 | { 14 | "xvalue": 2006, 15 | "yvalue": 706 16 | }, 17 | { 18 | "xvalue": 2007, 19 | "yvalue": 432 20 | }, 21 | { 22 | "xvalue": 2008, 23 | "yvalue": 200 24 | }, 25 | { 26 | "xvalue": 2009, 27 | "yvalue": 763 28 | }, 29 | { 30 | "xvalue": 2010, 31 | "yvalue": 550 32 | }, 33 | { 34 | "xvalue": 2011, 35 | "yvalue": 630 36 | }, 37 | { 38 | "xvalue": 2012, 39 | "yvalue": 278 40 | }, 41 | { 42 | "xvalue": 2013, 43 | "yvalue": 312 44 | }, 45 | { 46 | "xvalue": 2014, 47 | "yvalue": 600 48 | }, 49 | { 50 | "xvalue": 2015, 51 | "yvalue": 283 52 | } 53 | ] 54 | }); 55 | -------------------------------------------------------------------------------- /app/data/marketshare/Yearwise.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.data.marketshare.Yearwise', { 2 | extend: '{appName}.data.Simulated', 3 | 4 | data: [ 5 | { 6 | "xvalue": 2011, 7 | "y1value": 517.27, 8 | "y2value": 520.3, 9 | "y3value": 291.41, 10 | "y4value": 420.24 11 | }, 12 | { 13 | "xvalue": 2012, 14 | "y1value": 389.38, 15 | "y2value": 632.31, 16 | "y3value": 882.90, 17 | "y4value": 771.08 18 | }, 19 | { 20 | "xvalue": 2013, 21 | "y1value": 287.24, 22 | "y2value": 440.78, 23 | "y3value": 549.99, 24 | "y4value": 627.71 25 | }, 26 | { 27 | "xvalue": 2014, 28 | "y1value": 505.25, 29 | "y2value": 631.07, 30 | "y3value": 570.43, 31 | "y4value": 583.67 32 | } 33 | ] 34 | }); 35 | -------------------------------------------------------------------------------- /app/data/qg/Area.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.data.qg.Area', { 2 | extend: '{appName}.data.Simulated', 3 | 4 | data: [ 5 | { 6 | "xvalue": 0, 7 | "yvalue": 100 8 | }, 9 | { 10 | "xvalue": 10, 11 | "yvalue": 141 12 | }, 13 | { 14 | "xvalue": 20, 15 | "yvalue": 120 16 | }, 17 | { 18 | "xvalue": 30, 19 | "yvalue": 156 20 | }, 21 | { 22 | "xvalue": 40, 23 | "yvalue": 130 24 | }, 25 | { 26 | "xvalue": 50, 27 | "yvalue": 160 28 | }, 29 | { 30 | "xvalue": 60, 31 | "yvalue": 120 32 | }, 33 | { 34 | "xvalue": 70, 35 | "yvalue": 135 36 | } 37 | ] 38 | }); 39 | -------------------------------------------------------------------------------- /app/data/qg/Bar.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.data.qg.Bar', { 2 | extend: '{appName}.data.Simulated', 3 | 4 | data: [ 5 | { 6 | "xvalue": 0, 7 | "yvalue": 600 8 | }, 9 | { 10 | "xvalue": 10, 11 | "yvalue": 748 12 | }, 13 | { 14 | "xvalue": 20, 15 | "yvalue": 569 16 | }, 17 | { 18 | "xvalue": 30, 19 | "yvalue": 850 20 | }, 21 | { 22 | "xvalue": 40, 23 | "yvalue": 500 24 | }, 25 | { 26 | "xvalue": 50, 27 | "yvalue": 753 28 | }, 29 | { 30 | "xvalue": 60, 31 | "yvalue": 707 32 | }, 33 | { 34 | "xvalue": 70, 35 | "yvalue": 640 36 | } 37 | ] 38 | }); 39 | -------------------------------------------------------------------------------- /app/data/qg/Line.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.data.qg.Line', { 2 | extend: '{appName}.data.Simulated', 3 | 4 | data: [ 5 | { 6 | "xvalue": 0, 7 | "yvalue": 250 8 | }, 9 | { 10 | "xvalue": 10, 11 | "yvalue": 300 12 | }, 13 | { 14 | "xvalue": 20, 15 | "yvalue": 270 16 | }, 17 | { 18 | "xvalue": 30, 19 | "yvalue": 370 20 | }, 21 | { 22 | "xvalue": 40, 23 | "yvalue": 400 24 | }, 25 | { 26 | "xvalue": 50, 27 | "yvalue": 350 28 | }, 29 | { 30 | "xvalue": 60, 31 | "yvalue": 410 32 | }, 33 | { 34 | "xvalue": 70, 35 | "yvalue": 450 36 | } 37 | ] 38 | }); 39 | -------------------------------------------------------------------------------- /app/data/qg/Pie.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.data.qg.Pie', { 2 | extend: '{appName}.data.Simulated', 3 | 4 | data: [ 5 | { 6 | "xvalue": "Research", 7 | "yvalue": 68 8 | }, 9 | { 10 | "xvalue": "Finance", 11 | "yvalue": 20 12 | }, 13 | { 14 | "xvalue": "Marketing", 15 | "yvalue": 12 16 | } 17 | ] 18 | }); 19 | -------------------------------------------------------------------------------- /app/model/Base.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.model.Base', { 2 | extend: 'Ext.data.Model', 3 | 4 | schema: { 5 | namespace: '{appName}.model' 6 | } 7 | }); 8 | -------------------------------------------------------------------------------- /app/model/ChatMessages.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.model.ChatMessages', { 2 | extend: '{appName}.model.Base', 3 | 4 | fields: [ 5 | { 6 | type: 'string', 7 | name: 'message' 8 | }, 9 | { 10 | type: 'string', 11 | defaultValue: 'user', 12 | name: 'sender' 13 | } 14 | ] 15 | }); 16 | -------------------------------------------------------------------------------- /app/model/DataXY.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.model.DataXY', { 2 | extend: '{appName}.model.Base', 3 | 4 | fields: [ 5 | { 6 | name: 'xvalue' 7 | }, 8 | { 9 | name: 'yvalue' 10 | } 11 | ] 12 | }); 13 | -------------------------------------------------------------------------------- /app/model/FriendsList.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.model.FriendsList', { 2 | extend: '{appName}.model.Base', 3 | 4 | fields: [ 5 | { 6 | name: 'friendsName' 7 | }, 8 | { 9 | name: 'connectionStatus' 10 | } 11 | ] 12 | }); 13 | -------------------------------------------------------------------------------- /app/model/MultiDataXY.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.model.MultiDataXY', { 2 | extend: '{appName}.model.Base', 3 | 4 | fields: [ 5 | { 6 | name: 'xvalue' 7 | }, 8 | { 9 | name: 'y1value' 10 | }, 11 | { 12 | name: 'y2value' 13 | }, 14 | { 15 | name: 'y3value' 16 | }, 17 | { 18 | name: 'y4value' 19 | } 20 | ] 21 | }); 22 | -------------------------------------------------------------------------------- /app/model/PanelSetting.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.model.PanelSetting', { 2 | extend: '{appName}.model.Base', 3 | 4 | fields: [ 5 | { 6 | name: 'title' 7 | }, 8 | { 9 | name: 'subTitle' 10 | }, 11 | { 12 | name: 'toggleStatus' 13 | } 14 | ] 15 | }); 16 | -------------------------------------------------------------------------------- /app/model/PersonalInfo.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.model.PersonalInfo', { 2 | extend: '{appName}.model.Base', 3 | 4 | fields: [ 5 | { 6 | name: 'name' 7 | }, 8 | { 9 | name: 'status' 10 | }, 11 | { 12 | name: 'icon' 13 | } 14 | ] 15 | }); 16 | -------------------------------------------------------------------------------- /app/model/Subscription.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.model.Subscription', { 2 | extend: '{appName}.model.Base', 3 | 4 | fields: [ 5 | { 6 | type: 'int', 7 | name: 'id' 8 | }, 9 | { 10 | type: 'string', 11 | name: 'name' 12 | }, 13 | { 14 | type: 'string', 15 | name: 'subscription' 16 | } 17 | ] 18 | }); 19 | -------------------------------------------------------------------------------- /app/model/YearwiseData.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.model.YearwiseData', { 2 | extend: '{appName}.model.Base', 3 | 4 | fields: [ 5 | { 6 | name: 'year' 7 | }, 8 | { 9 | name: 'data' 10 | } 11 | ] 12 | }); 13 | -------------------------------------------------------------------------------- /app/model/email/Email.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.model.email.Email', { 2 | extend: '{appName}.model.Base', 3 | 4 | fields: [ 5 | { 6 | type: 'int', 7 | name: 'id' 8 | }, 9 | { 10 | name: 'read' 11 | }, 12 | { 13 | type: 'string', 14 | name: 'title' 15 | }, 16 | { 17 | name: 'user_id' 18 | }, 19 | { 20 | type: 'string', 21 | name: 'contents' 22 | }, 23 | { 24 | type: 'string', 25 | name: 'from' 26 | }, 27 | { 28 | name: 'has_attachments' 29 | }, 30 | { 31 | name: 'attachments' 32 | }, 33 | { 34 | name: 'received_on', 35 | type: 'date' 36 | }, 37 | { 38 | name: 'favorite' 39 | } 40 | ] 41 | }); 42 | -------------------------------------------------------------------------------- /app/model/email/Friend.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.model.email.Friend', { 2 | extend: '{appName}.model.Base', 3 | 4 | fields: [ 5 | { 6 | type: 'int', 7 | name: 'id' 8 | }, 9 | { 10 | type: 'string', 11 | name: 'name' 12 | }, 13 | { 14 | type: 'string', 15 | name: 'thumbnail' 16 | }, 17 | { 18 | type: 'boolean', 19 | name: 'online' 20 | } 21 | ] 22 | }); 23 | -------------------------------------------------------------------------------- /app/model/faq/Category.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.model.faq.Category', { 2 | extend: '{appName}.model.Base', 3 | 4 | fields: [ 5 | { 6 | type: 'string', 7 | name: 'name' 8 | } 9 | ], 10 | 11 | hasMany: { 12 | name: 'questions', 13 | model: 'faq.Question' 14 | } 15 | }); 16 | -------------------------------------------------------------------------------- /app/model/faq/Question.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.model.faq.Question', { 2 | extend: '{appName}.model.Base', 3 | 4 | fields: [ 5 | { 6 | type: 'string', 7 | name: 'name' 8 | } 9 | ] 10 | }); 11 | -------------------------------------------------------------------------------- /app/model/search/Attachment.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.model.search.Attachment', { 2 | extend: '{appName}.model.Base', 3 | 4 | fields: [ 5 | { 6 | type: 'int', 7 | name: 'id' 8 | }, 9 | { 10 | type: 'string', 11 | name: 'url' 12 | }, 13 | { 14 | type: 'string', 15 | name: 'title' 16 | } 17 | ] 18 | }); 19 | -------------------------------------------------------------------------------- /app/model/search/Result.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.model.search.Result', { 2 | extend: '{appName}.model.Base', 3 | 4 | fields: [ 5 | { 6 | type: 'int', 7 | name: 'id' 8 | }, 9 | { 10 | type: 'string', 11 | name: 'title' 12 | }, 13 | { 14 | type: 'string', 15 | name: 'thumbnail' 16 | }, 17 | { 18 | type: 'string', 19 | name: 'url' 20 | }, 21 | { 22 | type: 'string', 23 | name: 'content' 24 | } 25 | ], 26 | 27 | hasMany: { 28 | name: 'attachments', 29 | model: 'search.Attachment' 30 | } 31 | }); 32 | -------------------------------------------------------------------------------- /app/model/search/User.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.model.search.User', { 2 | extend: '{appName}.model.Base', 3 | 4 | fields: [ 5 | { 6 | type: 'int', 7 | name: 'identifier' 8 | }, 9 | { 10 | type: 'string', 11 | name: 'fullname' 12 | }, 13 | { 14 | type: 'string', 15 | name: 'email' 16 | }, 17 | { 18 | name: 'subscription' 19 | }, 20 | { 21 | type: 'date', 22 | name: 'joinDate' 23 | }, 24 | { 25 | type: 'boolean', 26 | name: 'isActive' 27 | }, 28 | { 29 | name: 'profile_pic' 30 | } 31 | ] 32 | }); 33 | -------------------------------------------------------------------------------- /app/proxy/Api.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.proxy.API', { 2 | extend: 'Ext.data.proxy.Ajax', 3 | alias: 'proxy.api', 4 | 5 | reader: { 6 | type: 'json', 7 | rootProperty: 'data' 8 | } 9 | }); -------------------------------------------------------------------------------- /app/store/email/Friends.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.store.email.Friends', { 2 | extend: 'Ext.data.Store', 3 | 4 | alias: 'store.emailfriends', 5 | 6 | model: '{appName}.model.email.Friend', 7 | 8 | autoLoad: true, 9 | 10 | proxy: { 11 | type: 'api', 12 | url: '~api/email/friends' 13 | }, 14 | 15 | sorters: { 16 | direction: 'DESC', 17 | property: 'online' 18 | } 19 | }); 20 | -------------------------------------------------------------------------------- /app/store/email/Inbox.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.store.email.Inbox', { 2 | extend: 'Ext.data.Store', 3 | 4 | alias: 'store.inbox', 5 | 6 | model: '{appName}.model.email.Email', 7 | 8 | pageSize: 20, 9 | 10 | autoLoad: true, 11 | 12 | proxy: { 13 | type: 'api', 14 | url: '~api/email/inbox' 15 | } 16 | }); 17 | -------------------------------------------------------------------------------- /app/store/faq/FAQ.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.store.faq.FAQ', { 2 | extend: 'Ext.data.Store', 3 | alias: 'store.faq', 4 | 5 | model: '{appName}.model.faq.Category', 6 | 7 | proxy: { 8 | type: 'api', 9 | url: '~api/faq/faq' 10 | } 11 | }); 12 | -------------------------------------------------------------------------------- /app/store/search/Results.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.store.search.Results', { 2 | extend: 'Ext.data.Store', 3 | 4 | alias: 'store.searchresults', 5 | 6 | model: '{appName}.model.search.Result', 7 | 8 | proxy: { 9 | type: 'api', 10 | url: '~api/search/results' 11 | }, 12 | 13 | autoLoad: 'true', 14 | 15 | sorters: { 16 | direction: 'ASC', 17 | property: 'title' 18 | } 19 | }); 20 | -------------------------------------------------------------------------------- /app/store/search/Users.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.store.search.Users', { 2 | extend: 'Ext.data.Store', 3 | 4 | alias: 'store.searchusers', 5 | 6 | model: '{appName}.model.search.User', 7 | 8 | proxy: { 9 | type: 'api', 10 | url: '~api/search/users' 11 | }, 12 | 13 | autoLoad: 'true', 14 | 15 | sorters: { 16 | direction: 'ASC', 17 | property: 'fullname' 18 | } 19 | }); 20 | -------------------------------------------------------------------------------- /app/view/chart/Bounces.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.chart.Bounces', { 2 | extend: 'Ext.chart.CartesianChart', 3 | xtype: 'chartbounces', 4 | 5 | requires: [ 6 | 'Ext.chart.axis.Category', 7 | 'Ext.chart.axis.Numeric', 8 | 'Ext.chart.series.Area', 9 | 'Ext.chart.interactions.PanZoom' 10 | ], 11 | 12 | animation : !Ext.isIE9m && Ext.os.is.Desktop, 13 | 14 | height: 22, 15 | 16 | background: 'rgba(255, 255, 255, 1)', 17 | colors: [ 18 | 'rgba(250,222,225, 0.8)' 19 | ], 20 | 21 | insetPadding: { 22 | top: 0, 23 | left: 0, 24 | right: 0, 25 | bottom: 0 26 | }, 27 | 28 | axes: [ 29 | { 30 | type: 'category', 31 | fields: [ 32 | 'xvalue' 33 | ], 34 | hidden: true, 35 | position: 'bottom' 36 | }, 37 | { 38 | type: 'numeric', 39 | fields: [ 40 | 'y2value' 41 | ], 42 | grid: { 43 | odd: { 44 | fill: '#e8e8e8' 45 | } 46 | }, 47 | hidden: true, 48 | position: 'left' 49 | } 50 | ], 51 | 52 | series: [ 53 | { 54 | type: 'area', 55 | xField: 'xvalue', 56 | yField: [ 57 | 'y2value' 58 | ] 59 | } 60 | ], 61 | 62 | interactions: [ 63 | { 64 | type: 'panzoom' 65 | } 66 | ] 67 | }); 68 | -------------------------------------------------------------------------------- /app/view/chart/Network.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.chart.Network', { 2 | extend: 'Ext.chart.CartesianChart', 3 | xtype: 'chartnetwork', 4 | 5 | requires: [ 6 | 'Ext.chart.axis.Category', 7 | 'Ext.chart.axis.Numeric', 8 | 'Ext.chart.series.Line', 9 | 'Ext.chart.interactions.PanZoom' 10 | ], 11 | 12 | animation : !Ext.isIE9m && Ext.os.is.Desktop, 13 | 14 | insetPadding: 0, 15 | 16 | axes: [ 17 | { 18 | type: 'category', 19 | fields: [ 20 | 'xvalue' 21 | ], 22 | hidden: true, 23 | position: 'bottom' 24 | }, 25 | { 26 | type: 'numeric', 27 | fields: [ 28 | 'y1value', 29 | 'y2value' 30 | ], 31 | grid: { 32 | odd: { 33 | fill: '#e8e8e8' 34 | } 35 | }, 36 | hidden: true, 37 | position: 'left' 38 | } 39 | ], 40 | 41 | series: [ 42 | { 43 | type: 'line', 44 | colors: [ 45 | 'rgba(103, 144, 199, 0.6)' 46 | ], 47 | useDarkerStrokeColor: false, 48 | xField: 'xvalue', 49 | yField: [ 50 | 'y1value' 51 | ], 52 | fill: true, 53 | smooth: true 54 | }, 55 | { 56 | type: 'line', 57 | colors: [ 58 | 'rgba(238, 146, 156, 0.6)' 59 | ], 60 | useDarkerStrokeColor: false, 61 | xField: 'xvalue', 62 | yField: [ 63 | 'y2value' 64 | ], 65 | fill: true, 66 | smooth: true 67 | } 68 | ], 69 | 70 | interactions: [ 71 | { 72 | type: 'panzoom' 73 | } 74 | ] 75 | }); 76 | -------------------------------------------------------------------------------- /app/view/chart/Visitors.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.chart.Visitors', { 2 | extend: 'Ext.chart.CartesianChart', 3 | xtype: 'chartvisitors', 4 | 5 | requires: [ 6 | 'Ext.chart.axis.Category', 7 | 'Ext.chart.axis.Numeric', 8 | 'Ext.chart.series.Area', 9 | 'Ext.chart.interactions.PanZoom' 10 | ], 11 | 12 | animation : !Ext.isIE9m && Ext.os.is.Desktop, 13 | 14 | height: 22, 15 | 16 | background: 'rgba(255, 255, 255, 1)', 17 | colors: [ 18 | 'rgba(225,233,244, 0.8)' 19 | ], 20 | 21 | insetPadding: { 22 | top: 0, 23 | left: 0, 24 | right: 0, 25 | bottom: 0 26 | }, 27 | 28 | axes: [ 29 | { 30 | type: 'category', 31 | fields: [ 32 | 'xvalue' 33 | ], 34 | hidden: true, 35 | position: 'bottom' 36 | }, 37 | { 38 | type: 'numeric', 39 | fields: [ 40 | 'y1value' 41 | ], 42 | grid: { 43 | odd: { 44 | fill: '#e8e8e8' 45 | } 46 | }, 47 | hidden: true, 48 | position: 'left' 49 | } 50 | ], 51 | 52 | series: [ 53 | { 54 | type: 'area', 55 | xField: 'xvalue', 56 | yField: [ 57 | 'y1value' 58 | ] 59 | } 60 | ], 61 | 62 | interactions: [ 63 | { 64 | type: 'panzoom' 65 | } 66 | ] 67 | }); 68 | -------------------------------------------------------------------------------- /app/view/charts/Bar.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.charts.Bar', { 2 | extend: '{appName}.view.charts.ChartBase', 3 | xtype: 'chartsbarpanel', 4 | 5 | requires: [ 6 | 'Ext.chart.CartesianChart', 7 | 'Ext.chart.axis.Category', 8 | 'Ext.chart.axis.Numeric', 9 | 'Ext.chart.interactions.PanZoom', 10 | 'Ext.chart.series.Bar' 11 | ], 12 | 13 | title: 'Bar Chart', 14 | iconCls: 'x-fa fa-bar-chart', 15 | 16 | items: [{ 17 | xtype: 'cartesian', 18 | colors: [ 19 | '#6aa5db' 20 | ], 21 | bind: '{["\{barData\}"]}', 22 | axes: [{ 23 | type: 'category', 24 | fields: [ 25 | 'xvalue' 26 | ], 27 | hidden: true, 28 | position: 'bottom' 29 | },{ 30 | type: 'numeric', 31 | fields: [ 32 | 'yvalue' 33 | ], 34 | grid: { 35 | odd: { 36 | fill: '#e8e8e8' 37 | } 38 | }, 39 | hidden: true, 40 | position: 'left' 41 | }], 42 | series: [{ 43 | type: 'bar', 44 | xField: 'xvalue', 45 | yField: [ 46 | 'yvalue' 47 | ] 48 | }], 49 | platformConfig: { 50 | phone: { 51 | // On a phone the whole view becomes a vertical strip of charts, 52 | // which makes it impossible to scroll the view if touch action 53 | // started on a chart. So we use a custom touchAction config. 54 | touchAction: { 55 | panX: true, 56 | panY: true 57 | } 58 | }, 59 | '!phone': { 60 | interactions: { 61 | type: 'panzoom', 62 | zoomOnPanGesture: true 63 | } 64 | } 65 | } 66 | }] 67 | }); 68 | -------------------------------------------------------------------------------- /app/view/charts/ChartBase.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.charts.ChartBase', { 2 | extend: 'Ext.Panel', 3 | 4 | cls: 'quick-graph-panel shadow', 5 | 6 | height: 300, 7 | ui: 'light', 8 | layout: 'fit', 9 | 10 | platformConfig: { 11 | classic: { 12 | headerPosition: 'bottom' 13 | }, 14 | modern: { 15 | header: { 16 | docked: 'bottom' 17 | } 18 | } 19 | }, 20 | 21 | defaults: { 22 | width: '100%' 23 | } 24 | }); 25 | -------------------------------------------------------------------------------- /app/view/charts/ChartsModel.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.charts.ChartsModel', { 2 | extend: 'Ext.app.ViewModel', 3 | alias: 'viewmodel.charts', 4 | 5 | stores: { 6 | barData: { 7 | model: '{appName}.model.DataXY', 8 | autoLoad: true, 9 | 10 | proxy: { 11 | type: 'api', 12 | url: '~api/marketshare/oneyear' 13 | } 14 | }, 15 | 16 | stackedData: { 17 | model: '{appName}.model.MultiDataXY', 18 | autoLoad: true, 19 | 20 | proxy: { 21 | type: 'api', 22 | url: '~api/marketshare/multiyear' 23 | } 24 | }, 25 | 26 | gaugeData: { 27 | data: [ 28 | { 29 | position: 40 30 | } 31 | ], 32 | 33 | fields: [ 34 | { 35 | name: 'position' 36 | } 37 | ] 38 | }, 39 | 40 | radialData: { 41 | model: '{appName}.model.DataXY', 42 | autoLoad: true, 43 | 44 | proxy: { 45 | type: 'api', 46 | url: '~api/radial' 47 | } 48 | }, 49 | 50 | lineData: { 51 | model: '{appName}.model.DataXY', 52 | autoLoad: true, 53 | 54 | proxy: { 55 | type: 'api', 56 | url: '~api/marketshare/oneentity' 57 | } 58 | }, 59 | 60 | pieData: { 61 | model: '{appName}.model.DataXY', 62 | autoLoad: true, 63 | 64 | proxy: { 65 | type: 'api', 66 | url: '~api/pie' 67 | } 68 | }, 69 | 70 | areaData: { 71 | model: '{appName}.model.MultiDataXY', 72 | autoLoad: true, 73 | 74 | proxy: { 75 | type: 'api', 76 | url: '~api/dashboard/full' 77 | } 78 | } 79 | } 80 | }); 81 | -------------------------------------------------------------------------------- /app/view/charts/Gauge.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.charts.Gauge', { 2 | extend: '{appName}.view.charts.ChartBase', 3 | xtype: 'chartsgaugepanel', 4 | 5 | requires: [ 6 | 'Ext.chart.PolarChart', 7 | 'Ext.chart.series.Gauge' 8 | ], 9 | 10 | title: 'Gauge Chart', 11 | iconCls: 'x-fa fa-wifi', 12 | 13 | items: [{ 14 | xtype: 'polar', 15 | colors: [ 16 | '#6aa5db', 17 | '#aed581' 18 | ], 19 | bind: '{gaugeData}', 20 | series: [{ 21 | type: 'gauge', 22 | angleField: 'position', 23 | needleLength: 100 24 | }], 25 | platformConfig: { 26 | phone: { 27 | // On a phone the whole view becomes a vertical strip of charts, 28 | // which makes it impossible to scroll the view if touch action 29 | // started on a chart. So we use a custom touchAction config. 30 | touchAction: { 31 | panX: true, 32 | panY: true 33 | } 34 | } 35 | } 36 | }] 37 | 38 | }); 39 | -------------------------------------------------------------------------------- /app/view/charts/Line.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.charts.Line', { 2 | extend: '{appName}.view.charts.ChartBase', 3 | xtype: 'chartslinepanel', 4 | 5 | requires: [ 6 | 'Ext.chart.CartesianChart', 7 | 'Ext.chart.axis.Category', 8 | 'Ext.chart.axis.Numeric', 9 | 'Ext.chart.interactions.PanZoom', 10 | 'Ext.chart.series.Line' 11 | 12 | ], 13 | 14 | title: 'Line Chart', 15 | iconCls: 'x-fa fa-line-chart', 16 | 17 | items: [{ 18 | xtype: 'cartesian', 19 | colors: [ 20 | '#6aa5db', 21 | '#94ae0a' 22 | ], 23 | bind: '{lineData}', 24 | axes: [{ 25 | type: 'category', 26 | fields: [ 27 | 'xvalue' 28 | ], 29 | hidden: true, 30 | position: 'bottom' 31 | },{ 32 | type: 'numeric', 33 | fields: [ 34 | 'yvalue', 35 | 'y1value', 36 | 'y2value', 37 | 'y3value', 38 | 'y4value', 39 | 'y5value' 40 | ], 41 | hidden: true, 42 | position: 'left' 43 | }], 44 | series: [{ 45 | type: 'line', 46 | xField: 'xvalue', 47 | yField: [ 48 | 'yvalue' 49 | ] 50 | },{ 51 | type: 'line', 52 | xField: 'xvalue', 53 | yField: [ 54 | 'y1value' 55 | ] 56 | }], 57 | platformConfig: { 58 | phone: { 59 | // On a phone the whole view becomes a vertical strip of charts, 60 | // which makes it impossible to scroll the view if touch action 61 | // started on a chart. So we use a custom touchAction config. 62 | touchAction: { 63 | panX: true, 64 | panY: true 65 | } 66 | }, 67 | '!phone': { 68 | interactions: { 69 | type: 'panzoom', 70 | zoomOnPanGesture: true 71 | } 72 | } 73 | } 74 | }] 75 | }); 76 | -------------------------------------------------------------------------------- /app/view/charts/Pie.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.charts.Pie', { 2 | extend: '{appName}.view.charts.ChartBase', 3 | xtype: 'chartspiepanel', 4 | 5 | requires: [ 6 | 'Ext.chart.PolarChart', 7 | 'Ext.chart.interactions.Rotate', 8 | 'Ext.chart.series.Pie', 9 | 'Ext.chart.series.sprite.PieSlice' 10 | ], 11 | 12 | title: '2D Pie Chart', 13 | iconCls: 'x-fa fa-pie-chart', 14 | 15 | items: [{ 16 | xtype: 'polar', 17 | colors: [ 18 | '#aed581', 19 | '#6aa5db', 20 | '#ee929c' 21 | ], 22 | bind: '{pieData}', 23 | series: [{ 24 | type: 'pie', 25 | label: { 26 | field: 'xvalue', 27 | display: 'rotate', 28 | contrast: true, 29 | font: '12px Open Sans', 30 | color: '#888' 31 | }, 32 | xField: 'yvalue' 33 | }], 34 | platformConfig: { 35 | '!phone': { 36 | interactions: 'rotate' 37 | } 38 | } 39 | }] 40 | }); 41 | -------------------------------------------------------------------------------- /app/view/charts/Pie3D.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.charts.Pie3D', { 2 | extend: '{appName}.view.charts.ChartBase', 3 | xtype: 'chartspie3dpanel', 4 | 5 | requires: [ 6 | 'Ext.chart.PolarChart', 7 | 'Ext.chart.interactions.Rotate', 8 | 'Ext.chart.series.Pie3D' 9 | ], 10 | 11 | title: '3D Pie Chart', 12 | iconCls: 'x-fa fa-pie-chart', 13 | 14 | items: [{ 15 | xtype: 'polar', 16 | colors: [ 17 | '#aed581', 18 | '#6aa5db', 19 | '#ee929c' 20 | ], 21 | platformConfig: { 22 | phone: { 23 | // On a phone the whole view becomes a vertical strip of charts, 24 | // which makes it impossible to scroll the view if touch action 25 | // started on a chart. So we use a custom touchAction config. 26 | touchAction: { 27 | panX: true, 28 | panY: true 29 | } 30 | }, 31 | '!phone': { 32 | interactions: 'rotate' 33 | } 34 | }, 35 | bind: '{["\{pieData\}"]}', 36 | series: [{ 37 | type: 'pie3d', 38 | angleField: 'yvalue', 39 | donut: 30 40 | }] 41 | }] 42 | }); 43 | -------------------------------------------------------------------------------- /app/view/charts/Polar.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.charts.Polar', { 2 | extend: '{appName}.view.charts.ChartBase', 3 | xtype: 'chartspolarpanel', 4 | 5 | requires: [ 6 | 'Ext.chart.PolarChart', 7 | 'Ext.chart.axis.Category', 8 | 'Ext.chart.axis.Numeric', 9 | 'Ext.chart.interactions.Rotate', 10 | 'Ext.chart.series.Radar' 11 | ], 12 | 13 | title: 'Radial Chart', 14 | iconCls: 'x-fa fa-dot-circle-o', 15 | 16 | items: [{ 17 | xtype: 'polar', 18 | colors: ['#6aa5db'], 19 | bind: '{radialData}', 20 | axes: [{ 21 | type: 'numeric', 22 | fields: [ 23 | 'yvalue' 24 | ], 25 | grid: true, 26 | position: 'radial' 27 | },{ 28 | type: 'category', 29 | fields: [ 30 | 'xvalue' 31 | ], 32 | grid: true, 33 | position: 'angular' 34 | }], 35 | series: [{ 36 | type: 'radar', 37 | xField: 'xvalue', 38 | yField: 'yvalue' 39 | }], 40 | platformConfig: { 41 | phone: { 42 | // On a phone the whole view becomes a vertical strip of charts, 43 | // which makes it impossible to scroll the view if touch action 44 | // started on a chart. So we use a custom touchAction config. 45 | touchAction: { 46 | panX: true, 47 | panY: true 48 | } 49 | }, 50 | '!phone': { 51 | interactions: 'rotate' 52 | } 53 | } 54 | }] 55 | }); 56 | -------------------------------------------------------------------------------- /app/view/charts/Stacked.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.charts.Stacked', { 2 | extend: '{appName}.view.charts.ChartBase', 3 | xtype: 'chartsstackedpanel', 4 | 5 | requires: [ 6 | 'Ext.chart.CartesianChart', 7 | 'Ext.chart.axis.Category', 8 | 'Ext.chart.axis.Numeric', 9 | 'Ext.chart.series.Bar', 10 | 'Ext.chart.interactions.PanZoom' 11 | ], 12 | 13 | title: 'Stacked Bar Chart', 14 | iconCls: 'x-fa fa-bar-chart', 15 | 16 | items: [{ 17 | xtype: 'cartesian', 18 | colors: [ 19 | '#6aa5db', 20 | '#ee929c' 21 | ], 22 | bind: '{["\{stackedData\}"]}', 23 | axes: [{ 24 | type: 'category', 25 | fields: [ 26 | 'xvalue' 27 | ], 28 | hidden: true, 29 | position: 'bottom' 30 | },{ 31 | type: 'numeric', 32 | fields: [ 33 | 'y1value', 34 | 'y2value', 35 | 'y3value' 36 | ], 37 | grid: { 38 | odd: { 39 | fill: '#e8e8e8' 40 | } 41 | }, 42 | hidden: true, 43 | position: 'left' 44 | }], 45 | series: [{ 46 | type: 'bar', 47 | xField: 'xvalue', 48 | yField: [ 49 | 'y2value', 50 | 'y3value' 51 | ] 52 | }], 53 | platformConfig: { 54 | phone: { 55 | // On a phone the whole view becomes a vertical strip of charts, 56 | // which makes it impossible to scroll the view if touch action 57 | // started on a chart. So we use a custom touchAction config. 58 | touchAction: { 59 | panX: true, 60 | panY: true 61 | } 62 | }, 63 | '!phone': { 64 | interactions: { 65 | type: 'panzoom', 66 | zoomOnPanGesture: true 67 | } 68 | } 69 | } 70 | }] 71 | }); 72 | -------------------------------------------------------------------------------- /app/view/dashboard/DashboardController.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.dashboard.DashboardController', { 2 | extend: 'Ext.app.ViewController', 3 | alias: 'controller.dashboard', 4 | 5 | requires: [ 6 | 'Ext.util.TaskRunner' 7 | ], 8 | 9 | onRefreshToggle: function(tool, e, owner) { 10 | var store, runner; 11 | 12 | if (tool.toggleValue){ 13 | this.clearChartUpdates(); 14 | } else { 15 | store = this.getStore('networkData'); 16 | if (store.getCount()) { 17 | runner = this.chartTaskRunner; 18 | if (!runner) { 19 | this.chartTaskRunner = runner = new Ext.util.TaskRunner(); 20 | } 21 | runner.start({ 22 | run : function () { 23 | // Move the first record to the end 24 | var rec = store.first(); 25 | store.remove(rec); 26 | store.add(rec); 27 | }, 28 | interval : 200 29 | }); 30 | } 31 | } 32 | 33 | // change the toggle value 34 | tool.toggleValue = !tool.toggleValue; 35 | }, 36 | 37 | clearChartUpdates : function() { 38 | this.chartTaskRunner = Ext.destroy(this.chartTaskRunner); 39 | }, 40 | 41 | destroy: function () { 42 | this.clearChartUpdates(); 43 | this.callParent(); 44 | }, 45 | 46 | onHideView: function () { 47 | this.clearChartUpdates(); 48 | } 49 | }); 50 | -------------------------------------------------------------------------------- /app/view/dashboard/Weather.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.dashboard.Weather', { 2 | extend: 'Ext.Component', 3 | xtype: 'weather', 4 | baseCls: 'weather-panel', 5 | 6 | border: false, 7 | height: 80, 8 | 9 | data: { 10 | icon: 'cloud-icon.png', 11 | forecast: 'Partly Cloudy', 12 | temperature: 25 13 | }, 14 | 15 | tpl: '
{[
'+ 16 | '
' + 17 | '
{["\{temperature\}"]}°
' + 18 | '
{["\{forecast\}"]}
' + 19 | '
' 20 | }); 21 | -------------------------------------------------------------------------------- /app/view/email/EmailModel.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.email.EmailModel', { 2 | extend: 'Ext.app.ViewModel', 3 | alias: 'viewmodel.email', 4 | 5 | stores: { 6 | inbox: { 7 | type: 'inbox' 8 | }, 9 | 10 | friends: { 11 | type: 'emailfriends' 12 | } 13 | } 14 | }); 15 | -------------------------------------------------------------------------------- /app/view/forms/SpecialOffer.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.forms.SpecialOffer', { 2 | extend: 'Ext.Component', 3 | xtype: 'specialoffer', 4 | 5 | isSpecialOffer: true, 6 | 7 | cls: 'forms-specialoffer', 8 | minWidth: 200, 9 | 10 | html: '
' + 11 | '
' + 12 | '

Register Today

' + 13 | '' + 14 | '' + 15 | '' + 16 | '
' + 17 | 'Members get 50% more points, ' + 18 | 'so register today and start earning points for savings on great rewards!' + 19 | '
' + 20 | '' + 21 | 'Learn More...' + 22 | '
' + 23 | '
' 24 | }); 25 | -------------------------------------------------------------------------------- /app/view/profile/Notifications.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.profile.Notifications', { 2 | extend: 'Ext.DataView', 3 | xtype: 'profilenotifications', 4 | 5 | cls: 'user-notifications', 6 | 7 | scrollable: false, 8 | 9 | bind: { 10 | store: '{["\{userSharedItems\}"]}' 11 | }, 12 | 13 | itemSelector: 'div.timeline-item', 14 | 15 | itemTpl: [ 16 | "
", 17 | "Smiley face", 18 | "
", 19 | "
", 20 | "

{["\{name\}"]}

", 21 | "3 Hours Ago", 22 | "
", 23 | "
{["\{content\}"]}
", 24 | "", 29 | "
", 30 | "
" 31 | ] 32 | }); 33 | -------------------------------------------------------------------------------- /app/view/profile/Social.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.profile.Social', { 2 | extend: 'Ext.panel.Panel', 3 | xtype: 'profilesocial', 4 | 5 | requires: [ 6 | 'Ext.Button', 7 | 'Ext.Container' 8 | ], 9 | 10 | layout: { 11 | type: 'vbox', 12 | align: 'middle' 13 | }, 14 | 15 | height: 320, 16 | 17 | bodyPadding: 20, 18 | 19 | items: [ 20 | { 21 | xtype: 'image', 22 | cls: 'userProfilePic', 23 | height: 120, 24 | width: 120, 25 | alt: 'profile-picture', 26 | src: 'resources/images/user-profile/20.png' 27 | }, 28 | { 29 | xtype: 'component', 30 | cls: 'userProfileName', 31 | height: '', 32 | html: 'Jessica Warren' 33 | }, 34 | { 35 | xtype: 'component', 36 | cls: 'userProfileDesc', 37 | html: 'CO-FOUNDER, CEO' 38 | }, 39 | { 40 | xtype: 'container', 41 | layout: 'hbox', 42 | defaults: { 43 | xtype: 'button', 44 | margin: 5 45 | }, 46 | margin: 5, 47 | items: [ 48 | { 49 | ui: 'facebook', 50 | iconCls: 'x-fa fa-facebook' 51 | }, 52 | { 53 | ui: 'soft-cyan', 54 | iconCls: 'x-fa fa-twitter' 55 | }, 56 | { 57 | ui: 'soft-red', 58 | iconCls: 'x-fa fa-google-plus' 59 | }, 60 | { 61 | ui: 'soft-purple', 62 | iconCls: 'x-fa fa-envelope' 63 | } 64 | ] 65 | }, 66 | { 67 | xtype: 'button', 68 | width: 220, 69 | text: 'Follow', 70 | platformConfig: { 71 | classic: { 72 | scale: 'large' 73 | }, 74 | modern: { 75 | ui: 'action' 76 | } 77 | } 78 | } 79 | ] 80 | }); 81 | -------------------------------------------------------------------------------- /app/view/profile/UserProfileBase.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.profile.UserProfileBase', { 2 | extend: 'Ext.Container', 3 | 4 | viewModel: { 5 | type: 'userprofile' 6 | } 7 | }); 8 | -------------------------------------------------------------------------------- /app/view/profile/UserProfileModel.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.profile.UserProfileModel', { 2 | extend: 'Ext.app.ViewModel', 3 | alias: 'viewmodel.userprofile', 4 | 5 | stores: { 6 | userSharedItems: { 7 | autoLoad: true, 8 | fields: [ 9 | { 10 | name: '_id' 11 | }, 12 | { 13 | name: 'parent_id' 14 | }, 15 | { 16 | name: 'name' 17 | }, 18 | { 19 | name: 'source' 20 | }, 21 | { 22 | name: 'date' 23 | }, 24 | { 25 | name: 'isActive' 26 | }, 27 | { 28 | name: 'time' 29 | }, 30 | { 31 | name: 'content' 32 | } 33 | ], 34 | proxy: { 35 | type: 'api', 36 | url: '~api/usershareditems' 37 | } 38 | }, 39 | 40 | userTimeline: { 41 | autoLoad: true, 42 | fields: [ 43 | { 44 | name: '_id' 45 | }, 46 | { 47 | name: 'name' 48 | }, 49 | { 50 | name: 'content' 51 | }, 52 | { 53 | name: 'date', 54 | type: 'date' 55 | }, 56 | { 57 | name: 'userId' 58 | }, 59 | { 60 | name: 'notificationType' 61 | } 62 | ], 63 | proxy: { 64 | type: 'api', 65 | url: '~api/usertimeline' 66 | } 67 | } 68 | } 69 | }); 70 | -------------------------------------------------------------------------------- /bootstrap.css.tpl.default: -------------------------------------------------------------------------------- 1 | 2 | 3 | /* 4 | * This file is generated by Sencha Cmd and should NOT be edited. It redirects 5 | * to the most recently built CSS file for the application to allow index.html 6 | * in the development directory to load properly (i.e., "dev mode"). 7 | */ 8 | @import '../../build/examples/admin-dashboard/modern/resources/{appName}-all.css'; 9 | 10 | -------------------------------------------------------------------------------- /build.xml.tpl.default: -------------------------------------------------------------------------------- 1 | 2 | 3 | 8 | 9 | 10 | 41 | 42 | 46 | 48 | 49 | Copying shared resources to ${shared.resources.dir}... 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | -------------------------------------------------------------------------------- /classic/overrides/menu/Item.js.tpl.default: -------------------------------------------------------------------------------- 1 | // IE8 has an odd bug with handling font icons in pseudo elements; 2 | // it will render the icon once and not update it when something 3 | // like text color is changed via style addition or removal. 4 | // We have to force icon repaint by adding a style with forced empty 5 | // pseudo element content, (x-sync-repaint) and removing it back to work 6 | // around this issue. 7 | // See this: https://github.com/FortAwesome/Font-Awesome/issues/954 8 | // and this: https://github.com/twbs/bootstrap/issues/13863 9 | Ext.define('{appName}.override.menu.Item', { 10 | override: 'Ext.menu.Item', 11 | 12 | compatibility: 'IE@8', // only activate this override on IE8 13 | 14 | onFocus: function(e) { 15 | this.callParent([e]); 16 | this.repaintFontIcons(); 17 | }, 18 | 19 | onFocusLeave: function(e) { 20 | this.callParent([e]); 21 | this.repaintFontIcons(); 22 | }, 23 | 24 | privates: { 25 | repaintFontIcons: function() { 26 | var itemEl = this.itemEl, 27 | textEl = this.textEl, 28 | fly; 29 | 30 | // This application uses font icons on some elements that the framework 31 | // does not expect, so we have to extend its normal IE8 workarounds 32 | 33 | if (itemEl && this.el.hasCls('font-icon')) { 34 | itemEl.syncRepaint(); 35 | } 36 | 37 | if (textEl) { 38 | fly = Ext.fly(textEl.dom.firstChild); 39 | 40 | if (fly && fly.hasCls(Ext.baseCSSPrefix + 'fa')) { 41 | fly.syncRepaint(); 42 | } 43 | } 44 | } 45 | } 46 | }); 47 | -------------------------------------------------------------------------------- /classic/resources/Readme.md: -------------------------------------------------------------------------------- 1 | # {appName}/resources 2 | 3 | This folder contains resources (such as images) needed by the application. This file can 4 | be removed if not needed. 5 | -------------------------------------------------------------------------------- /classic/sass/etc/all.scss: -------------------------------------------------------------------------------- 1 | @mixin btn-border($background-color){ 2 | background-color: $background-color; 3 | border-color: $background-color !important; 4 | .x-btn-inner-default-toolbar-small{ 5 | color: $lightest-color; 6 | } 7 | &:hover{ 8 | .x-btn-inner-default-toolbar-small,.x-btn-inner-default-small{ 9 | color: $background-color; 10 | } 11 | .x-btn-icon-el-default-small,.x-btn-icon-el-default-toolbar-small{ 12 | color: $background-color; 13 | } 14 | background-color: transparent; 15 | } 16 | } 17 | 18 | @mixin border-radius($radius) { 19 | -webkit-border-radius: $radius; 20 | -moz-border-radius: $radius; 21 | -ms-border-radius: $radius; 22 | border-radius: $radius; 23 | } 24 | 25 | @mixin box-shadow($h-shadow,$v-shadow,$blur,$spread,$shadow-color) { 26 | $value: $h-shadow, $v-shadow, $blur, $spread, $shadow-color; 27 | -webkit-box-shadow: $value; 28 | -moz-box-shadow: $value; 29 | -ms-box-shadow: $value; 30 | box-shadow: $value; 31 | } 32 | 33 | *:focus { 34 | outline:0 !important; 35 | } 36 | 37 | .x-menu-header { 38 | z-index: 0 !important; 39 | } 40 | 41 | .x-css-shadow{ 42 | box-shadow:none !important; 43 | } 44 | 45 | .x-fa { 46 | display: inline-block; 47 | font: normal normal normal 14px/1 $font-family; 48 | } 49 | 50 | .alignRight { 51 | float: right; 52 | } 53 | 54 | .boldFont { 55 | font-weight: bold; 56 | } 57 | 58 | -------------------------------------------------------------------------------- /classic/sass/src/view/authentication/LockingWindow.scss: -------------------------------------------------------------------------------- 1 | .auth-locked-window{ 2 | .x-window-body { 3 | background-image:url('images/lock-screen-background.jpg'); 4 | background-size:cover; 5 | background-repeat:repeat; 6 | } 7 | 8 | &.x-window-default { 9 | border: none; 10 | border-radius: 0; 11 | padding: 0; 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /classic/sass/src/view/email/Details.scss: -------------------------------------------------------------------------------- 1 | .email-sender-img { 2 | @include border-radius(64px); 3 | border:1px solid $single-mail-border-color; 4 | } 5 | .single-mail-email-subject { 6 | line-height: 1.7em; 7 | .user-name{ 8 | font-size: 16px; 9 | } 10 | .user-info{ 11 | font-size: 22px; 12 | max-width: 95%; 13 | text-overflow: ellipsis; 14 | overflow: hidden; 15 | white-space: nowrap; 16 | } 17 | } 18 | .mail-body{ 19 | font-size: 14px; 20 | line-height: 1.6em; 21 | padding-bottom: 14px; 22 | border-bottom: 1px solid $single-mail-border-color; 23 | } 24 | .single-mail-top-toolbar{ 25 | background-color: $lightest-color; 26 | border-bottom: 1px solid $single-mail-border-color !important; 27 | 28 | .x-btn-inner-default-toolbar-small { 29 | color: $color; 30 | } 31 | 32 | a:first-child { 33 | left: 2px !important; 34 | } 35 | } 36 | 37 | .single-mail-attachment{ 38 | border: 1px solid $single-mail-border-color; 39 | border-left-width: 0; 40 | border-right-width: 0; 41 | margin-right: 15px; 42 | width: 100px; 43 | height: 100px; 44 | } 45 | 46 | .single-mail-action-button{ 47 | .email-compose-save-button, .email-compose-save-button .x-frame-mc { 48 | @include btn-border($single-mail-save-button-color); 49 | } 50 | 51 | .email-compose-send-button, .email-compose-send-button .x-frame-mc { 52 | @include btn-border($single-mail-send-button-color); 53 | } 54 | } 55 | 56 | .attachment-container{ 57 | margin-top: 16px; 58 | } 59 | -------------------------------------------------------------------------------- /classic/sass/src/view/email/Inbox.scss: -------------------------------------------------------------------------------- 1 | .email-inbox-panel{ 2 | .fa-heart:before { 3 | color: $active-heart-icon-color; 4 | } 5 | 6 | .fa-heart-o:before{ 7 | color: $inactive-heart-icon-color; 8 | } 9 | 10 | .x-grid-body{ 11 | border-width: 1px; 12 | } 13 | 14 | .x-grid-cell-special{ 15 | border-right-width: 0; 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /classic/sass/src/view/forms/Wizards.scss: -------------------------------------------------------------------------------- 1 | .wizards .x-panel{ 2 | background: #fff; 3 | } 4 | 5 | .wizardthree .wizardprogressbar { 6 | background-color: $wizard-three-button-background-color; 7 | } 8 | 9 | @include extjs-button-small-ui( 10 | $ui: 'wizard-blue', 11 | $color: $button-toolbar-color, 12 | $color-pressed: $wizard-primary-background-color, 13 | $background-color: transparent, 14 | $opacity-disabled: 1, 15 | $glyph-color: $button-toolbar-glyph-color, 16 | $border-width: 0 17 | ); 18 | 19 | @include extjs-button-small-ui( 20 | $ui: 'wizard-soft-purple', 21 | $color: $button-toolbar-color, 22 | $color-pressed: #fff, 23 | $background-color: transparent, 24 | $background-color-pressed: $wizard-two-button-background-color, 25 | $opacity-disabled: 1, 26 | $glyph-color: $button-toolbar-glyph-color, 27 | $border-width: 0 28 | ); 29 | 30 | @include extjs-button-small-ui( 31 | $ui: 'wizard-soft-green', 32 | $color: #fff, 33 | $color-pressed: $color, 34 | $background-color: transparent, 35 | $opacity-disabled: 1, 36 | $glyph-color: #fff, 37 | $border-width: 0 38 | ); 39 | 40 | // This rule is required because the button mixin does not currently support 41 | // separate icon colors for each state 42 | .x-btn-pressed { 43 | .x-btn-icon-el-wizard-blue-small { 44 | color: $wizard-primary-background-color; 45 | } 46 | 47 | &.x-btn-disabled { 48 | &.x-btn-wizard-soft-purple-small, 49 | .x-btn-wizard-soft-purple-small-mc { 50 | background-color: $wizard-two-button-background-color; 51 | } 52 | } 53 | 54 | .x-btn-icon-el-wizard-soft-purple-small { 55 | color: #fff; 56 | } 57 | 58 | .x-btn-icon-el-wizard-soft-green-small { 59 | color: $color; 60 | } 61 | } 62 | -------------------------------------------------------------------------------- /classic/sass/src/view/pages/BlankPage.scss: -------------------------------------------------------------------------------- 1 | .blank-page-container { 2 | text-align: center; 3 | color: $blank-page-color; 4 | .fa-outer-class { 5 | margin:auto; 6 | width: 150px; 7 | height: 150px; 8 | border-radius: 75px; 9 | background-color: $blank-page-background-color; 10 | text-align: center; 11 | .x-fa:before { 12 | line-height:150px; 13 | font-size:80px; 14 | color: $blank-page-color; 15 | } 16 | } 17 | h1{ 18 | margin:5px; 19 | line-height:30px; 20 | font-weight:normal; 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /classic/sass/src/view/pages/Error404Window.scss: -------------------------------------------------------------------------------- 1 | .error-page-container{ 2 | .error-page-inner-container{ 3 | margin-top:-50px; 4 | } 5 | .x-window-body-default{ 6 | background-image:url('images/error-page-background.jpg'); 7 | background-size:cover; 8 | color: $lightest-color; 9 | 10 | } 11 | &.x-window-default{ 12 | border: none; 13 | } 14 | .error-page-top-text{ 15 | font-size: 150px; 16 | line-height: 150px; 17 | } 18 | .error-page-bottom-text{ 19 | font-size: 18px; 20 | } 21 | .error-page-desc{ 22 | line-height:24px; 23 | text-align:center; 24 | font-size:18px; 25 | a{ 26 | color:$base-color; 27 | text-decoration:none; 28 | &:hover{ 29 | text-decoration:underline; 30 | } 31 | } 32 | } 33 | } 34 | -------------------------------------------------------------------------------- /classic/sass/src/view/pages/FAQ.scss: -------------------------------------------------------------------------------- 1 | .pages-faq-container{ 2 | 3 | .x-header{ 4 | &.x-panel-header-light{ 5 | border-bottom: 1px solid $base-border-color !important; 6 | padding:15px 16px; 7 | .x-panel-header-title-light{ 8 | color: $color; 9 | font-size: 14px; 10 | font-family: "Open Sans"; 11 | font-weight: Bold; 12 | } 13 | } 14 | 15 | .x-fa{ 16 | line-height:16px; 17 | } 18 | .x-tool-after-title .x-tool-img{ 19 | display: none; 20 | } 21 | } 22 | .x-accordion-body{ 23 | padding-left:34px; 24 | } 25 | .round-btn{ 26 | @include btn-border($base-color); 27 | } 28 | 29 | .x-accordion-hd { 30 | .x-title-icon { 31 | color: $color !important; 32 | } 33 | 34 | &.x-collapsed .x-title-icon:before { 35 | content: "\f0da" !important; 36 | } 37 | } 38 | } 39 | 40 | .faq-left-sidebar{ 41 | .x-fa{ 42 | font-size: 16px; 43 | margin-right: 10px; 44 | } 45 | .faq-tips-list { 46 | list-style: none; 47 | padding:0; 48 | margin:0; 49 | li{ 50 | margin:15px 0; 51 | &:before { 52 | font-family:FontAwesome; 53 | content: "\f111"; 54 | padding-right:10px; 55 | } 56 | &.pointone:before { 57 | color: $FAQ-tip-list-color-1; 58 | } 59 | &.pointtwo:before { 60 | color: $FAQ-tip-list-color-2; 61 | } 62 | &.pointthree:before { 63 | color: $FAQ-tip-list-color-3; 64 | } 65 | &.pointfour:before { 66 | color: $FAQ-tip-list-color-4; 67 | } 68 | } 69 | 70 | } 71 | .borderCls{ 72 | border-bottom: 1px solid $base-border-color; 73 | } 74 | } 75 | 76 | .FAQPanel .x-title-text-default{ 77 | font-size: 16px; 78 | font-weight: normal; 79 | } 80 | -------------------------------------------------------------------------------- /classic/sass/src/view/search/Results.scss: -------------------------------------------------------------------------------- 1 | .allRecordsCls{ 2 | .x-grid-cell-inner{ 3 | padding:15px; 4 | div{ 5 | white-space: normal; 6 | } 7 | .resultsTitleCls{ 8 | font-size:14px; 9 | color: $FAQ-sub-header-color; 10 | } 11 | .resultsUrlCls a{ 12 | color:$base-color; 13 | text-decoration:none; 14 | &:hover{ 15 | text-decoration:underline; 16 | } 17 | } 18 | .imageRowCls img{ 19 | margin-right:15px; 20 | } 21 | } 22 | } 23 | .user-grid{ 24 | .x-grid-td{ 25 | vertical-align:middle; 26 | img{ 27 | @include border-radius($circle-border-radius); 28 | } 29 | } 30 | .x-grid-body{ 31 | border-width:1px; 32 | } 33 | } 34 | .x-action-col-icon{ 35 | font-size: 13px !important; 36 | } 37 | 38 | -------------------------------------------------------------------------------- /classic/sass/var/view/authentication/Dialog.scss: -------------------------------------------------------------------------------- 1 | $dialog-login-background-color: #83c748; 2 | $create-account-background-color: #a1a1a2; 3 | $dialog-trigger-color: #e5e5e5; -------------------------------------------------------------------------------- /classic/sass/var/view/email/Details.scss: -------------------------------------------------------------------------------- 1 | $single-mail-border-color: #eee; 2 | $single-mail-save-button-color: #9da6a3; 3 | $single-mail-send-button-color: #56B750; -------------------------------------------------------------------------------- /classic/sass/var/view/email/Email.scss: -------------------------------------------------------------------------------- 1 | $default-menu-item-color: #858585; 2 | $online-menu-item-color: #86c747; 3 | $offline-menu-item-color: #9e9f9f; 4 | $menu-item-focus-color: #88bf4c; -------------------------------------------------------------------------------- /classic/sass/var/view/email/Inbox.scss: -------------------------------------------------------------------------------- 1 | $active-heart-icon-color: #facc6e; 2 | $inactive-heart-icon-color: #b2b2b2; -------------------------------------------------------------------------------- /classic/sass/var/view/main/Main.scss: -------------------------------------------------------------------------------- 1 | $circle-border-radius:50%; 2 | $base-border-color: #ddd; 3 | $lightest-color:#fff; 4 | $font-weight: 400; 5 | $font-weight-bold: 500; 6 | 7 | $accordion-header-background-color: $lightest-color; 8 | $accordion-header-color: #333; 9 | 10 | $social-facebook-btn-background: #167abc; 11 | $social-twitter-btn-background: #03b4d5; 12 | $social-google-plus-btn-background: #e44959; 13 | $social-envelope-btn-background: #7754aa; 14 | -------------------------------------------------------------------------------- /classic/sass/var/view/pages/BlankPage.scss: -------------------------------------------------------------------------------- 1 | $blank-page-background-color: #ebebeb; 2 | $blank-page-color :#cacaca; -------------------------------------------------------------------------------- /classic/sass/var/view/pages/FAQ.scss: -------------------------------------------------------------------------------- 1 | $FAQ-sub-header-color: #333; 2 | 3 | $FAQ-tip-list-color-1: #56b650; 4 | $FAQ-tip-list-color-2: #ffc037; 5 | $FAQ-tip-list-color-3: #e55149; 6 | $FAQ-tip-list-color-4: #a97fe3; -------------------------------------------------------------------------------- /classic/sass/var/view/profile/UserProfile.scss: -------------------------------------------------------------------------------- 1 | $like-comment-btn-background-color: #f4f4f4; 2 | $like-comment-btn-color: #979797; 3 | $article-comment-color: #eee; -------------------------------------------------------------------------------- /classic/sass/var/view/widgets/Widgets.scss: -------------------------------------------------------------------------------- 1 | $widget-first-container-background: #468fd3; 2 | $widget-second-container-background: #8dc153; 3 | $widget-third-container-background: #607d8b; 4 | $follow-button-color : #82c748; 5 | $follower-toolbar-background: #fafafa; 6 | 7 | $sale-container-color: #458fd2; 8 | $message-container-color: #4caf50; 9 | $code-container-color: #9c27b0; 10 | $user-container-color: #e91e63; 11 | $server-container-color: #ffc107; 12 | $file-container-color: #673ab7; -------------------------------------------------------------------------------- /classic/src/Application.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.Application', { 2 | extend: 'Ext.app.Application', 3 | 4 | name: '{appName}', 5 | 6 | stores: [ 7 | 'NavigationTree' 8 | ], 9 | 10 | defaultToken : 'dashboard', 11 | 12 | // The name of the initial view to create. This class will gain a "viewport" plugin 13 | // if it does not extend Ext.Viewport. 14 | // 15 | mainView: '{appName}.view.main.Main', 16 | 17 | onAppUpdate: function () { 18 | Ext.Msg.confirm('Application Update', 'This application has an update, reload?', 19 | function (choice) { 20 | if (choice === 'yes') { 21 | window.location.reload(); 22 | } 23 | } 24 | ); 25 | } 26 | }); 27 | -------------------------------------------------------------------------------- /classic/src/view/authentication/AuthenticationController.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.authentication.AuthenticationController', { 2 | extend: 'Ext.app.ViewController', 3 | alias: 'controller.authentication', 4 | 5 | //TODO: implement central Facebook OATH handling here 6 | 7 | onFaceBookLogin : function() { 8 | this.redirectTo('dashboard', true); 9 | }, 10 | 11 | onLoginButton: function() { 12 | this.redirectTo('dashboard', true); 13 | }, 14 | 15 | onLoginAsButton: function() { 16 | this.redirectTo('login', true); 17 | }, 18 | 19 | onNewAccount: function() { 20 | this.redirectTo('register', true); 21 | }, 22 | 23 | onSignupClick: function() { 24 | this.redirectTo('dashboard', true); 25 | }, 26 | 27 | onResetClick: function() { 28 | this.redirectTo('dashboard', true); 29 | } 30 | }); -------------------------------------------------------------------------------- /classic/src/view/authentication/AuthenticationModel.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.authentication.AuthenticationModel', { 2 | extend: 'Ext.app.ViewModel', 3 | alias: 'viewmodel.authentication', 4 | 5 | data: { 6 | userid : '', 7 | fullName : '', 8 | password : '', 9 | email : '', 10 | persist: false, 11 | agrees : false 12 | } 13 | }); -------------------------------------------------------------------------------- /classic/src/view/authentication/Dialog.js.tpl.default: -------------------------------------------------------------------------------- 1 | /** 2 | * This is the base class for all Authentication related Form dialogs. It optionally 3 | * enables autoComplete support to any child textfield so that browsers or their plugins 4 | * may restore/persist username, password and other attributes to/from such forms. 5 | */ 6 | Ext.define('{appName}.view.authentication.Dialog', { 7 | extend: 'Ext.form.Panel', 8 | xtype: 'authdialog', 9 | 10 | requires: [ 11 | '{appName}.view.authentication.AuthenticationController', 12 | 'Ext.form.Panel' 13 | ], 14 | 15 | controller: 'authentication', 16 | viewModel: { 17 | type: 'authentication' 18 | }, 19 | 20 | /* 21 | * Seek out the first enabled, focusable, empty textfield when the form is focused 22 | */ 23 | defaultFocus: 'textfield:focusable:not([hidden]):not([disabled]):not([value])', 24 | 25 | /** 26 | * @cfg {Boolean} [autoComplete=false] 27 | * Enables browser (or Password Managers) support for autoCompletion of User Id and 28 | * password. 29 | */ 30 | autoComplete : false, 31 | 32 | initComponent: function () { 33 | var me = this, listen; 34 | 35 | if (me.autoComplete) { 36 | // Use standard FORM tag for detection by browser or password tools 37 | me.autoEl = Ext.applyIf( 38 | me.autoEl || {}, 39 | { 40 | tag: 'form', 41 | name: 'authdialog', 42 | method: 'post' 43 | }); 44 | } 45 | 46 | me.addCls('auth-dialog'); 47 | me.callParent(); 48 | 49 | if (me.autoComplete) { 50 | listen = { 51 | afterrender : 'doAutoComplete', 52 | scope : me, 53 | single : true 54 | }; 55 | 56 | Ext.each(me.query('textfield'), function (field) { 57 | field.on(listen); 58 | }); 59 | } 60 | }, 61 | 62 | doAutoComplete : function(target) { 63 | if (target.inputEl && target.autoComplete !== false) { 64 | target.inputEl.set({ autocomplete: 'on' }); 65 | } 66 | } 67 | }); 68 | -------------------------------------------------------------------------------- /classic/src/view/authentication/LockingWindow.js.tpl.default: -------------------------------------------------------------------------------- 1 | /** 2 | * This class provides the modal Ext.Window support for all Authentication forms. 3 | * It's layout is structured to center any Authentication dialog within it's center, 4 | * and provides a backGround image during such operations. 5 | */ 6 | Ext.define('{appName}.view.authentication.LockingWindow', { 7 | extend: 'Ext.window.Window', 8 | xtype: 'lockingwindow', 9 | 10 | requires: [ 11 | '{appName}.view.authentication.AuthenticationController', 12 | 'Ext.layout.container.VBox' 13 | ], 14 | 15 | cls: 'auth-locked-window', 16 | closable: false, 17 | resizable: false, 18 | autoShow: true, 19 | titleAlign: 'center', 20 | maximized: true, 21 | modal: true, 22 | 23 | layout: { 24 | type: 'vbox', 25 | align: 'center', 26 | pack: 'center' 27 | }, 28 | 29 | controller: 'authentication' 30 | }); 31 | -------------------------------------------------------------------------------- /classic/src/view/charts/Charts.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.charts.Charts', { 2 | extend: 'Ext.container.Container', 3 | xtype: 'charts', 4 | 5 | requires: [ 6 | '{appName}.view.charts.Area', 7 | '{appName}.view.charts.Bar', 8 | '{appName}.view.charts.ChartsModel', 9 | '{appName}.view.charts.Gauge', 10 | '{appName}.view.charts.Pie3D', 11 | '{appName}.view.charts.Polar', 12 | '{appName}.view.charts.Stacked', 13 | 'Ext.ux.layout.ResponsiveColumn' 14 | ], 15 | 16 | viewModel: { 17 | type: 'charts' 18 | }, 19 | 20 | layout: 'responsivecolumn', 21 | 22 | defaults: { 23 | defaults: { 24 | animation : !Ext.isIE9m && Ext.os.is.Desktop 25 | } 26 | }, 27 | 28 | items: [ 29 | { 30 | xtype: 'chartsareapanel', 31 | userCls: 'big-50 small-100' 32 | }, 33 | { 34 | xtype: 'chartspie3dpanel', 35 | userCls: 'big-50 small-100' 36 | }, 37 | { 38 | xtype: 'chartspolarpanel', 39 | userCls: 'big-50 small-100' 40 | }, 41 | { 42 | xtype: 'chartsstackedpanel', 43 | userCls: 'big-50 small-100' 44 | }, 45 | { 46 | xtype: 'chartsbarpanel', 47 | userCls: 'big-50 small-100' 48 | }, 49 | { 50 | xtype: 'chartsgaugepanel', 51 | userCls: 'big-50 small-100' 52 | } 53 | ] 54 | }); 55 | -------------------------------------------------------------------------------- /classic/src/view/dashboard/Dashboard.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.dashboard.Dashboard', { 2 | extend: 'Ext.container.Container', 3 | xtype: 'admindashboard', 4 | 5 | requires: [ 6 | 'Ext.ux.layout.ResponsiveColumn' 7 | ], 8 | 9 | controller: 'dashboard', 10 | viewModel: { 11 | type: 'dashboard' 12 | }, 13 | 14 | layout: 'responsivecolumn', 15 | 16 | listeners: { 17 | hide: 'onHideView' 18 | }, 19 | 20 | items: [ 21 | { 22 | xtype: 'network', 23 | 24 | // 60% width when viewport is big enough, 25 | // 100% when viewport is small 26 | userCls: 'big-60 small-100' 27 | }, 28 | { 29 | xtype: 'hddusage', 30 | userCls: 'big-20 small-50' 31 | }, 32 | { 33 | xtype: 'earnings', 34 | userCls: 'big-20 small-50' 35 | }, 36 | { 37 | xtype: 'sales', 38 | userCls: 'big-20 small-50' 39 | }, 40 | { 41 | xtype: 'topmovies', 42 | userCls: 'big-20 small-50' 43 | }, 44 | { 45 | xtype: 'weather', 46 | cls: 'weather-panel shadow', 47 | userCls: 'big-40 small-100' 48 | }, 49 | { 50 | xtype: 'todo', 51 | userCls: 'big-60 small-100' 52 | }, 53 | { 54 | xtype: 'services', 55 | userCls: 'big-40 small-100' 56 | } 57 | ] 58 | }); 59 | -------------------------------------------------------------------------------- /classic/src/view/dashboard/Sales.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.dashboard.Sales', { 2 | extend: 'Ext.panel.Panel', 3 | xtype: 'sales', 4 | 5 | requires: [ 6 | 'Ext.chart.CartesianChart', 7 | 'Ext.chart.axis.Category', 8 | 'Ext.chart.axis.Numeric', 9 | 'Ext.chart.series.Bar' 10 | ], 11 | 12 | title: 'Sales', 13 | ui: 'light', 14 | iconCls: 'x-fa fa-briefcase', 15 | headerPosition: 'bottom', 16 | 17 | cls: 'quick-graph-panel shadow', 18 | height: 130, 19 | layout: 'fit', 20 | 21 | items: [ 22 | { 23 | xtype: 'cartesian', 24 | animation : !Ext.isIE9m && Ext.os.is.Desktop, 25 | height: 75, 26 | background: '#8561c5', 27 | colors: [ 28 | '#ffffff' 29 | ], 30 | bind: '{["\{quarterlyGrowth\}"]}', 31 | axes: [ 32 | { 33 | type: 'category', 34 | fields: [ 35 | 'xvalue' 36 | ], 37 | hidden: true, 38 | position: 'bottom' 39 | }, 40 | { 41 | type: 'numeric', 42 | fields: [ 43 | 'yvalue' 44 | ], 45 | grid: { 46 | odd: { 47 | fill: '#e8e8e8' 48 | } 49 | }, 50 | hidden: true, 51 | position: 'left' 52 | } 53 | ], 54 | series: [ 55 | { 56 | type: 'bar', 57 | xField: 'xvalue', 58 | yField: [ 59 | 'yvalue' 60 | ] 61 | } 62 | ], 63 | interactions: [ 64 | { 65 | type: 'panzoom' 66 | } 67 | ] 68 | } 69 | ] 70 | }); 71 | -------------------------------------------------------------------------------- /classic/src/view/dashboard/TopMovie.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.dashboard.TopMovie', { 2 | extend: 'Ext.panel.Panel', 3 | xtype: 'topmovies', 4 | 5 | requires: [ 6 | 'Ext.chart.series.Pie', 7 | 'Ext.chart.series.sprite.PieSlice', 8 | 'Ext.chart.interactions.Rotate' 9 | ], 10 | 11 | title: 'Top Movie', 12 | ui: 'light', 13 | iconCls: 'x-fa fa-video-camera', 14 | headerPosition: 'bottom', 15 | 16 | cls: 'quick-graph-panel shadow', 17 | height: 130, 18 | layout: 'fit', 19 | 20 | items: [ 21 | { 22 | xtype: 'polar', 23 | animation : !Ext.isIE9m && Ext.os.is.Desktop, 24 | height: 75, 25 | background: '#33abaa', 26 | colors: [ 27 | '#115fa6', 28 | '#94ae0a', 29 | '#a61120', 30 | '#ff8809', 31 | '#ffd13e', 32 | '#a61187', 33 | '#24ad9a', 34 | '#7c7474', 35 | '#a66111' 36 | ], 37 | radius: 100, 38 | bind: '{["\{topMovies\}"]}', 39 | series: [ 40 | { 41 | type: 'pie', 42 | colors: [ 43 | '#ffffff' 44 | ], 45 | label: { 46 | field: 'x', 47 | display: 'rotate', 48 | contrast: true, 49 | font: '12px Arial' 50 | }, 51 | xField: 'yvalue' 52 | } 53 | ], 54 | interactions: [ 55 | { 56 | type: 'rotate' 57 | } 58 | ] 59 | } 60 | ] 61 | }); 62 | -------------------------------------------------------------------------------- /classic/src/view/dashboard/Widgets.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.dashboard.Widgets', { 2 | extend: 'Ext.Panel', 3 | xtype: 'dashboardwidgetspanel', 4 | 5 | cls: 'dashboard-widget-block shadow', 6 | bodyPadding: 15, 7 | 8 | title: 'Widgets', 9 | 10 | layout: { 11 | type: 'vbox', 12 | align: 'stretch' 13 | }, 14 | 15 | items: [ 16 | { 17 | xtype: 'slider', 18 | width: 400, 19 | fieldLabel: 'Single Slider', 20 | value: 40 21 | }, 22 | { 23 | xtype: 'tbspacer', 24 | flex: 0.3 25 | }, 26 | { 27 | xtype: 'multislider', 28 | width: 400, 29 | fieldLabel: 'Range Slider', 30 | values: [ 31 | 10, 32 | 40 33 | ] 34 | }, 35 | { 36 | xtype: 'tbspacer', 37 | flex: 0.3 38 | }, 39 | { 40 | xtype: 'pagingtoolbar', 41 | width: 360, 42 | displayInfo: false 43 | }, 44 | { 45 | xtype: 'tbspacer', 46 | flex: 0.3 47 | }, 48 | { 49 | xtype: 'progressbar', 50 | cls: 'widget-progressbar', 51 | value: 0.4 52 | }, 53 | { 54 | xtype: 'tbspacer' 55 | } 56 | ] 57 | }); 58 | -------------------------------------------------------------------------------- /classic/src/view/email/ComposeViewController.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.email.ComposeViewController', { 2 | extend: 'Ext.app.ViewController', 3 | alias: 'controller.emailcompose', 4 | 5 | onComposeDiscardClick: function(bt) { 6 | var win = bt.up('window'); 7 | if (win) { 8 | win.close(); 9 | } 10 | } 11 | }); 12 | -------------------------------------------------------------------------------- /classic/src/view/email/ComposeViewModel.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.email.ComposeViewModel', { 2 | extend: 'Ext.app.ViewModel', 3 | alias: 'viewmodel.emailcompose' 4 | 5 | // TODO - Add view data or remove if not needed 6 | }); -------------------------------------------------------------------------------- /classic/src/view/email/DetailsViewModel.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.email.DetailsViewModel', { 2 | extend: 'Ext.app.ViewModel', 3 | alias: 'viewmodel.emaildetails' 4 | }); -------------------------------------------------------------------------------- /classic/src/view/email/Email.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.email.Email', { 2 | extend: 'Ext.container.Container', 3 | 4 | xtype: 'email', 5 | 6 | controller: 'email', 7 | 8 | viewModel: { 9 | type: 'email' 10 | }, 11 | 12 | itemId: 'emailMainContainer', 13 | 14 | layout: { 15 | type: 'hbox', 16 | align: 'stretch' 17 | }, 18 | 19 | margin: '20 0 0 20', 20 | 21 | items: [ 22 | { 23 | xtype: 'container', 24 | 25 | itemId: 'navigationPanel', 26 | 27 | layout: { 28 | type: 'vbox', 29 | align: 'stretch' 30 | }, 31 | 32 | width: '30%', 33 | minWidth: 180, 34 | maxWidth: 240, 35 | 36 | defaults: { 37 | cls: 'navigation-email', 38 | margin: '0 20 20 0' 39 | }, 40 | 41 | items: [ 42 | { 43 | xtype: 'emailmenu', 44 | listeners: { 45 | click: 'onMenuClick' 46 | } 47 | }, 48 | { 49 | xtype: 'emailfriendslist' 50 | } 51 | ] 52 | }, 53 | { 54 | xtype: 'container', 55 | itemId: 'contentPanel', 56 | margin: '0 20 20 0', 57 | flex: 1, 58 | layout: { 59 | type : 'anchor', 60 | anchor : '100%' 61 | } 62 | } 63 | ] 64 | }); 65 | -------------------------------------------------------------------------------- /classic/src/view/email/FriendsList.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.email.FriendsList', { 2 | extend: 'Ext.menu.Menu', 3 | 4 | alias: 'widget.emailfriendslist', 5 | 6 | viewModel: { 7 | type: 'emailfriendslist' 8 | }, 9 | 10 | controller: 'emailfriendslist', 11 | 12 | title: 'Friends', 13 | 14 | cls: 'navigation-email', 15 | 16 | iconCls: 'x-fa fa-group', 17 | 18 | floating: false 19 | }); 20 | -------------------------------------------------------------------------------- /classic/src/view/email/FriendsListViewController.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.email.FriendsListViewController', { 2 | extend: 'Ext.app.ViewController', 3 | alias: 'controller.emailfriendslist', 4 | 5 | init: function() { 6 | var me = this, 7 | friendsStore = me.getViewModel().getStore('friends'); 8 | 9 | //Trigger local sorting once new data is available 10 | friendsStore.on('load', function (store) { 11 | store.sort(); 12 | }); 13 | 14 | //Sort locally and then update menu 15 | friendsStore.on('sort', function (store) { 16 | me.mutateData(store, store.getRange()); 17 | }); 18 | 19 | me.callParent(arguments); 20 | }, 21 | 22 | mutateData: function (store, records) { 23 | var view = this.getView(), 24 | arr = [], 25 | len = records.length, 26 | i; 27 | 28 | for (i = 0; i < len; i++) { 29 | arr.push({ 30 | xtype: 'menuitem', 31 | text : records[i].get('name'), 32 | cls: 'font-icon ' + (records[i].get('online') ? 'online-user' : 'offline-user') 33 | }); 34 | } 35 | 36 | Ext.suspendLayouts(); 37 | view.removeAll(true); 38 | view.add(arr); 39 | Ext.resumeLayouts(true); 40 | } 41 | }); 42 | -------------------------------------------------------------------------------- /classic/src/view/email/FriendsListViewModel.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.email.FriendsListViewModel', { 2 | extend: 'Ext.app.ViewModel', 3 | 4 | alias: 'viewmodel.emailfriendslist', 5 | 6 | stores: { 7 | friends: { 8 | //Store reference 9 | type: 'emailfriends', 10 | 11 | //Auto load 12 | autoLoad: true 13 | } 14 | } 15 | }); 16 | -------------------------------------------------------------------------------- /classic/src/view/email/Inbox.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.email.Inbox', { 2 | extend: 'Ext.grid.Panel', 3 | xtype: 'inbox', 4 | 5 | cls: 'email-inbox-panel shadow', 6 | 7 | bind: { 8 | store: '{["\{inbox\}"]}' 9 | }, 10 | 11 | viewConfig: { 12 | preserveScrollOnRefresh: true, 13 | preserveScrollOnReload: true 14 | }, 15 | 16 | selModel: { 17 | selType: 'checkboxmodel', 18 | checkOnly: true, 19 | showHeaderCheckbox: true 20 | }, 21 | 22 | listeners: { 23 | cellclick: 'onGridCellItemClick' 24 | }, 25 | 26 | headerBorders: false, 27 | rowLines: false, 28 | scrollable: false, 29 | 30 | columns: [ 31 | { 32 | dataIndex: 'favorite', 33 | menuDisabled: true, 34 | text: '', 35 | width: 40, 36 | renderer: function(value) { 37 | return ''; 38 | } 39 | }, 40 | { 41 | dataIndex: 'from', 42 | text: 'From', 43 | width: 140 44 | }, 45 | { 46 | dataIndex: 'title', 47 | text: 'Title', 48 | flex: 1 49 | }, 50 | { 51 | dataIndex: 'has_attachments', 52 | text: '', 53 | width: 40, 54 | renderer: function(value) { 55 | return value ? '' : ''; 56 | } 57 | }, 58 | { 59 | xtype: 'datecolumn', 60 | dataIndex: 'received_on', 61 | width: 90, 62 | text: 'Received' 63 | } 64 | ] 65 | }); 66 | -------------------------------------------------------------------------------- /classic/src/view/email/Menu.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.email.Menu', { 2 | extend: 'Ext.menu.Menu', 3 | 4 | alias: 'widget.emailmenu', 5 | 6 | viewModel: { 7 | type: 'emailmenu' 8 | }, 9 | 10 | title: 'Email', 11 | 12 | iconCls: 'x-fa fa-inbox', 13 | 14 | floating: false, 15 | 16 | items: [ 17 | { 18 | routeId: 'emailcompose', //xtype and used for url routing 19 | params: { 20 | openWindow: true, // Let the controller know that we want this component in the window, 21 | targetCfg: { 22 | //put any extra configs for your view here 23 | }, 24 | windowCfg: { 25 | // Any configs that you would like to apply for window popup goes here 26 | title: 'Compose Message' 27 | } 28 | }, 29 | iconCls: 'x-fa fa-edit', 30 | text: 'Compose' 31 | }, 32 | { 33 | routeId: '', 34 | iconCls: 'x-fa fa-inbox', 35 | text: 'Inbox' 36 | }, 37 | { 38 | routeId: '', 39 | iconCls: 'x-fa fa-check-circle', 40 | text: 'Sent Mail' 41 | }, 42 | { 43 | routeId: '', 44 | iconCls: 'x-fa fa-exclamation-circle', 45 | text: 'Spam' 46 | }, 47 | { 48 | routeId: '', 49 | iconCls: 'x-fa fa-trash-o', 50 | text: 'Trash' 51 | } 52 | ] 53 | }); 54 | -------------------------------------------------------------------------------- /classic/src/view/email/MenuViewModel.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.email.MenuViewModel', { 2 | extend: 'Ext.app.ViewModel', 3 | alias: 'viewmodel.emailmenu' 4 | 5 | // TODO - Add view data as needed or remove if not used 6 | }); 7 | -------------------------------------------------------------------------------- /classic/src/view/email/Window.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.email.Window', { 2 | extend: 'Ext.window.Window', 3 | alias: 'widget.emailwindow', 4 | autoShow: true, 5 | modal: true, 6 | 7 | layout: 'fit', 8 | 9 | width: 200, 10 | height: 200, 11 | 12 | afterRender: function () { 13 | var me = this; 14 | 15 | me.callParent(arguments); 16 | 17 | me.syncSize(); 18 | 19 | // Since we want to always be a %age of the viewport, we have to watch for 20 | // resize events. 21 | Ext.on(me.resizeListeners = { 22 | resize: me.onViewportResize, 23 | scope: me, 24 | buffer: 50 25 | }); 26 | }, 27 | 28 | doDestroy: function () { 29 | Ext.un(this.resizeListeners); 30 | 31 | this.callParent(); 32 | }, 33 | 34 | onViewportResize: function () { 35 | this.syncSize(); 36 | }, 37 | 38 | syncSize: function () { 39 | var width = Ext.Element.getViewportWidth(), 40 | height = Ext.Element.getViewportHeight(); 41 | 42 | // We use percentage sizes so we'll never overflow the screen (potentially 43 | // clipping buttons and locking the user in to the dialog). 44 | 45 | this.setSize(Math.floor(width * 0.9), Math.floor(height * 0.9)); 46 | this.setXY([ Math.floor(width * 0.05), Math.floor(height * 0.05) ]); 47 | } 48 | }); 49 | -------------------------------------------------------------------------------- /classic/src/view/forms/WizardFormModel.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.forms.WizardFormModel', { 2 | extend: 'Ext.app.ViewModel', 3 | alias: 'viewmodel.wizardform', 4 | 5 | data: { 6 | atBeginning: true, 7 | atEnd: false 8 | } 9 | }); 10 | -------------------------------------------------------------------------------- /classic/src/view/forms/WizardOne.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.forms.WizardOne', { 2 | extend: 'Ext.panel.Panel', 3 | alias: 'widget.formswizardone', 4 | requires: [ 5 | 'Ext.form.field.Radio' 6 | ], 7 | 8 | cls: 'wizardone shadow', 9 | 10 | plugins: 'responsive', 11 | 12 | responsiveConfig: { 13 | 'width >= 1000': { 14 | layout: { 15 | type: 'box', 16 | align: 'stretch', 17 | vertical: false 18 | } 19 | }, 20 | 21 | 'width < 1000': { 22 | layout: { 23 | type: 'box', 24 | align: 'stretch', 25 | vertical: true 26 | } 27 | } 28 | }, 29 | 30 | items: [ 31 | { 32 | xtype: 'specialoffer', 33 | plugins: 'responsive', 34 | height: 338, 35 | 36 | responsiveConfig: { 37 | 'width < 1000': { 38 | flex: null 39 | }, 40 | 41 | 'width >= 1000': { 42 | flex: 1 43 | } 44 | } 45 | }, 46 | { 47 | xtype: 'wizardform', 48 | cls: 'wizardone', 49 | colorScheme: 'blue', 50 | flex: 1 51 | } 52 | ] 53 | }); 54 | -------------------------------------------------------------------------------- /classic/src/view/forms/Wizards.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.forms.Wizards', { 2 | extend: 'Ext.container.Container', 3 | xtype: 'forms', 4 | 5 | requires: [ 6 | 'Ext.ux.layout.ResponsiveColumn' 7 | ], 8 | 9 | cls: 'wizards', 10 | defaultFocus : 'wizardform', 11 | layout: 'responsivecolumn', 12 | 13 | items: [ 14 | { 15 | xtype: 'formswizardone', 16 | userCls: 'big-100' 17 | }, 18 | { 19 | xtype: 'wizardform', 20 | cls: 'wizardtwo shadow', 21 | colorScheme: 'soft-purple', 22 | userCls: 'big-50 small-100' 23 | }, 24 | { 25 | xtype: 'wizardform', 26 | cls: 'wizardthree shadow', 27 | colorScheme: 'soft-green', 28 | userCls: 'big-50 small-100' 29 | } 30 | ] 31 | }); 32 | -------------------------------------------------------------------------------- /classic/src/view/main/MainContainerWrap.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.main.MainContainerWrap', { 2 | extend: 'Ext.container.Container', 3 | xtype: 'maincontainerwrap', 4 | 5 | requires : [ 6 | 'Ext.layout.container.HBox' 7 | ], 8 | 9 | scrollable: 'y', 10 | 11 | layout: { 12 | type: 'hbox', 13 | align: 'stretchmax', 14 | 15 | // Tell the layout to animate the x/width of the child items. 16 | animate: true, 17 | animatePolicy: { 18 | x: true, 19 | width: true 20 | } 21 | }, 22 | 23 | beforeLayout : function() { 24 | // We setup some minHeights dynamically to ensure we stretch to fill the height 25 | // of the viewport minus the top toolbar 26 | 27 | var me = this, 28 | height = Ext.Element.getViewportHeight() - 64, // offset by topmost toolbar height 29 | // We use itemId/getComponent instead of "reference" because the initial 30 | // layout occurs too early for the reference to be resolved 31 | navTree = me.getComponent('navigationTreeList'); 32 | 33 | me.minHeight = height; 34 | 35 | navTree.setStyle({ 36 | 'min-height': height + 'px' 37 | }); 38 | 39 | me.callParent(arguments); 40 | } 41 | }); 42 | -------------------------------------------------------------------------------- /classic/src/view/main/MainModel.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.main.MainModel', { 2 | extend: 'Ext.app.ViewModel', 3 | alias: 'viewmodel.main', 4 | 5 | data: { 6 | currentView: null 7 | } 8 | }); 9 | -------------------------------------------------------------------------------- /classic/src/view/pages/BlankPage.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.pages.BlankPage', { 2 | extend: 'Ext.container.Container', 3 | xtype: 'pageblank', 4 | 5 | requires: [ 6 | 'Ext.container.Container' 7 | ], 8 | 9 | anchor : '100% -1', 10 | 11 | layout:{ 12 | type:'vbox', 13 | pack:'center', 14 | align:'center' 15 | }, 16 | 17 | items: [ 18 | { 19 | xtype: 'box', 20 | cls: 'blank-page-container', 21 | html: '

Coming Soon!

Stay tuned for updates' 22 | } 23 | ] 24 | }); 25 | -------------------------------------------------------------------------------- /classic/src/view/pages/Error404Window.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.pages.Error404Window', { 2 | extend: '{appName}.view.pages.ErrorBase', 3 | xtype: 'page404', 4 | 5 | requires: [ 6 | '{appName}.view.authentication.AuthenticationController', 7 | 'Ext.container.Container', 8 | 'Ext.form.Label', 9 | 'Ext.layout.container.VBox', 10 | 'Ext.toolbar.Spacer' 11 | ], 12 | 13 | items: [ 14 | { 15 | xtype: 'container', 16 | width: 400, 17 | cls:'error-page-inner-container', 18 | layout: { 19 | type: 'vbox', 20 | align: 'center', 21 | pack: 'center' 22 | }, 23 | items: [ 24 | { 25 | xtype: 'label', 26 | cls: 'error-page-top-text', 27 | text: '404' 28 | }, 29 | { 30 | xtype: 'label', 31 | cls: 'error-page-desc', 32 | html: '
Seems you\\'ve hit a wall!
Try going back to our Home page
' 33 | }, 34 | { 35 | xtype: 'tbspacer', 36 | flex: 1 37 | } 38 | ] 39 | } 40 | ] 41 | }); 42 | -------------------------------------------------------------------------------- /classic/src/view/pages/Error500Window.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.pages.Error500Window', { 2 | extend: '{appName}.view.pages.ErrorBase', 3 | xtype: 'page500', 4 | 5 | requires: [ 6 | 'Ext.container.Container', 7 | 'Ext.form.Label', 8 | 'Ext.layout.container.VBox', 9 | 'Ext.toolbar.Spacer' 10 | ], 11 | 12 | items: [ 13 | { 14 | xtype: 'container', 15 | width: 600, 16 | cls:'error-page-inner-container', 17 | layout: { 18 | type: 'vbox', 19 | align: 'center', 20 | pack: 'center' 21 | }, 22 | items: [ 23 | { 24 | xtype: 'label', 25 | cls: 'error-page-top-text', 26 | text: '500' 27 | }, 28 | { 29 | xtype: 'label', 30 | cls: 'error-page-desc', 31 | html: '
Something went wrong and server could not process your request.
' + 32 | '
Try going back to our Home page
' 33 | }, 34 | { 35 | xtype: 'tbspacer', 36 | flex: 1 37 | } 38 | ] 39 | } 40 | ] 41 | }); 42 | -------------------------------------------------------------------------------- /classic/src/view/pages/ErrorBase.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.pages.ErrorBase', { 2 | extend: 'Ext.window.Window', 3 | 4 | requires: [ 5 | '{appName}.view.authentication.AuthenticationController', 6 | 'Ext.container.Container', 7 | 'Ext.form.Label', 8 | 'Ext.layout.container.VBox', 9 | 'Ext.toolbar.Spacer' 10 | ], 11 | 12 | controller: 'authentication', 13 | autoShow: true, 14 | cls: 'error-page-container', 15 | closable: false, 16 | title: 'Sencha', 17 | titleAlign: 'center', 18 | maximized: true, 19 | modal: true, 20 | 21 | layout: { 22 | type: 'vbox', 23 | align: 'center', 24 | pack: 'center' 25 | } 26 | }); 27 | -------------------------------------------------------------------------------- /classic/src/view/profile/ShareUpdate.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.profile.ShareUpdate', { 2 | extend: 'Ext.panel.Panel', 3 | xtype: 'profileshare', 4 | 5 | bodyPadding : 10, 6 | layout: 'fit', 7 | 8 | cls: 'share-panel', 9 | 10 | items: [ 11 | { 12 | xtype: 'textareafield', 13 | emptyText: "What's on your mind?" 14 | } 15 | ], 16 | 17 | bbar: { 18 | defaults : { 19 | margin:'0 10 5 0' 20 | }, 21 | items:[ 22 | { 23 | ui: 'header', 24 | iconCls: 'x-fa fa-video-camera' 25 | }, 26 | { 27 | ui: 'header', 28 | iconCls: 'x-fa fa-camera' 29 | }, 30 | { 31 | ui: 'header', 32 | iconCls: 'x-fa fa-file' 33 | }, 34 | '->', 35 | { 36 | text: 'Share', 37 | ui: 'soft-blue' 38 | } 39 | ] 40 | } 41 | }); 42 | -------------------------------------------------------------------------------- /classic/src/view/profile/UserProfile.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.profile.UserProfile', { 2 | extend: '{appName}.view.profile.UserProfileBase', 3 | xtype: 'profile', 4 | cls: 'userProfile-container', 5 | 6 | requires: [ 7 | 'Ext.ux.layout.ResponsiveColumn' 8 | ], 9 | 10 | layout: 'responsivecolumn', 11 | 12 | items: [ 13 | { 14 | xtype: 'profileshare', 15 | 16 | // Always 100% of container 17 | userCls: 'big-100 small-100 shadow' 18 | }, 19 | { 20 | xtype: 'profilesocial', 21 | 22 | // Use 50% of container when viewport is big enough, 100% otherwise 23 | userCls: 'big-50 small-100 shadow' 24 | }, 25 | { 26 | xtype: 'profiledescription', 27 | 28 | userCls: 'big-50 small-100 shadow' 29 | }, 30 | { 31 | xtype: 'profilenotifications', 32 | 33 | userCls: 'big-50 small-100 shadow' 34 | }, 35 | { 36 | xtype: 'profiletimeline', 37 | 38 | userCls: 'big-50 small-100 shadow' 39 | } 40 | ] 41 | }); 42 | -------------------------------------------------------------------------------- /classic/src/view/search/ResultsController.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.search.ResultsController', { 2 | extend: 'Ext.app.ViewController', 3 | alias: 'controller.searchresults' 4 | 5 | // TODO - Add control logic or remove is not needed 6 | }); 7 | -------------------------------------------------------------------------------- /classic/src/view/search/ResultsModel.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.search.ResultsModel', { 2 | extend: 'Ext.app.ViewModel', 3 | alias: 'viewmodel.searchresults', 4 | 5 | requires: [ 6 | 'Ext.data.Store', 7 | 'Ext.data.proxy.Memory', 8 | 'Ext.data.field.Integer', 9 | 'Ext.data.field.String', 10 | 'Ext.data.field.Date', 11 | 'Ext.data.field.Boolean', 12 | 'Ext.data.reader.Json' 13 | ], 14 | 15 | stores: { 16 | allResults: { 17 | type: 'searchresults' 18 | }, 19 | 20 | usersResults: { 21 | type: 'searchusers' 22 | }, 23 | 24 | inboxResults: { 25 | type: 'inbox' 26 | } 27 | } 28 | }); 29 | -------------------------------------------------------------------------------- /classic/src/view/widgets/WidgetA.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.widgets.WidgetA', { 2 | extend: 'Ext.panel.Panel', 3 | xtype: 'widget-a', 4 | 5 | cls: 'admin-widget shadow', 6 | 7 | items: [ 8 | { 9 | xtype: 'image', 10 | cls: 'widget-top-container-first-img', 11 | height: 66, 12 | width: 66, 13 | alt: 'profile-image', 14 | src: 'resources/images/user-profile/3.png' 15 | }, 16 | { 17 | xtype: 'component', 18 | cls: 'widget-top-first-container postion-class', 19 | height: 135 20 | }, 21 | { 22 | xtype: 'container', 23 | cls: 'widget-bottom-first-container postion-class', 24 | height: 135, 25 | padding: '30 0 0 0', 26 | layout: { 27 | type: 'vbox', 28 | align: 'center' 29 | }, 30 | items: [ 31 | { 32 | xtype: 'label', 33 | cls: 'widget-name-text', 34 | html: 'John Doe' 35 | }, 36 | { 37 | xtype: 'label', 38 | html: 'Administrator' 39 | }, 40 | { 41 | xtype: 'toolbar', 42 | cls: 'widget-tool-button', 43 | flex: 1, 44 | items: [ 45 | { 46 | ui: 'soft-green', 47 | text: 'Follow' 48 | }, 49 | { 50 | ui: 'soft-blue', 51 | text: 'Message' 52 | } 53 | ] 54 | } 55 | ] 56 | } 57 | ] 58 | }); 59 | -------------------------------------------------------------------------------- /classic/src/view/widgets/WidgetB.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.widgets.WidgetB', { 2 | extend: 'Ext.panel.Panel', 3 | xtype: 'widget-b', 4 | 5 | cls: 'admin-widget shadow', 6 | 7 | items: [ 8 | { 9 | xtype: 'image', 10 | cls: 'widget-top-container-first-img', 11 | height: 66, 12 | width: 66, 13 | alt: 'profile-image', 14 | src: 'resources/images/user-profile/4.png' 15 | }, 16 | { 17 | xtype: 'component', 18 | cls: 'widget-top-second-container postion-class', 19 | height: 135 20 | }, 21 | { 22 | xtype: 'container', 23 | cls: 'widget-bottom-first-container postion-class', 24 | height: 135, 25 | padding: '30 0 0 0', 26 | layout: { 27 | type: 'vbox', 28 | align: 'center' 29 | }, 30 | items: [ 31 | { 32 | xtype: 'label', 33 | cls: 'widget-name-text', 34 | html: 'Lucy Moon' 35 | }, 36 | { 37 | xtype: 'label', 38 | html: 'Web and Graphic designer' 39 | }, 40 | { 41 | xtype: 'toolbar', 42 | flex: 1, 43 | items: [ 44 | { 45 | ui: 'facebook', 46 | iconCls: 'x-fa fa-facebook' 47 | }, 48 | { 49 | ui: 'soft-cyan', 50 | iconCls: 'x-fa fa-twitter' 51 | }, 52 | { 53 | ui: 'soft-red', 54 | iconCls: 'x-fa fa-google-plus' 55 | }, 56 | { 57 | ui: 'soft-purple', 58 | iconCls: 'x-fa fa-envelope' 59 | } 60 | ] 61 | } 62 | ] 63 | } 64 | ] 65 | }); 66 | -------------------------------------------------------------------------------- /classic/src/view/widgets/WidgetD.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.widgets.WidgetD', { 2 | extend: 'Ext.panel.Panel', 3 | xtype: 'widget-d', 4 | 5 | cls:'admin-widget shadow', 6 | 7 | items: [ 8 | { 9 | xtype: 'image', 10 | cls: 'widget-top-container-first-img', 11 | height: 66, 12 | width: 66, 13 | alt: 'profile-image', 14 | src: 'resources/images/user-profile/2.png' 15 | }, 16 | { 17 | xtype: 'component', 18 | cls: 'widget-top-first-fourth-container postion-class', 19 | height: 135 20 | }, 21 | { 22 | xtype: 'container', 23 | cls: 'widget-bottom-first-container postion-class', 24 | height: 135, 25 | padding: '30 0 0 0', 26 | layout: { 27 | type: 'vbox', 28 | align: 'center', 29 | pack: 'center' 30 | }, 31 | items: [ 32 | { 33 | xtype: 'label', 34 | cls: 'widget-name-text', 35 | html: 'Goff Smith' 36 | }, 37 | { 38 | xtype: 'label', 39 | html: 'Project manager' 40 | }, 41 | { 42 | xtype: 'toolbar', 43 | flex: 1, 44 | cls: 'widget-tool-button', 45 | items: [ 46 | { 47 | ui: 'soft-green', 48 | text: 'Follow' 49 | }, 50 | { 51 | ui: 'soft-blue', 52 | text: 'Message' 53 | } 54 | ] 55 | } 56 | ] 57 | } 58 | ] 59 | }); 60 | -------------------------------------------------------------------------------- /classic/src/view/widgets/WidgetE.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.widgets.WidgetE', { 2 | extend: 'Ext.panel.Panel', 3 | xtype: 'widget-e', 4 | 5 | cls: 'admin-widget-small sale-panel info-card-item shadow', 6 | 7 | containerColor: '', 8 | 9 | height: 170, 10 | 11 | data: { 12 | amount: 0, 13 | type: '', 14 | icon: '' 15 | }, 16 | 17 | tpl: '

{["\{amount\}"]}

{type}
', 18 | 19 | initComponent: function(){ 20 | var me = this; 21 | 22 | Ext.apply(me, { 23 | cls: me.config.containerColor 24 | }); 25 | 26 | me.callParent(arguments); 27 | } 28 | }); 29 | -------------------------------------------------------------------------------- /classic/src/view/widgets/WidgetF.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.widgets.WidgetF', { 2 | extend: '{appName}.view.widgets.WidgetE', 3 | xtype: 'widget-f', 4 | 5 | cls:'admin-widget info-card-item info-card-large-wrap shadow', 6 | 7 | height: 280, 8 | 9 | tpl: '

{["\{amount\}"]}

{["\{type\}"]}
' 10 | }); 11 | -------------------------------------------------------------------------------- /modern/sass/etc/all.scss: -------------------------------------------------------------------------------- 1 | $border-color: #ddd; 2 | 3 | $panel-header-background-color: dynamic($base-color); 4 | 5 | $mask-page-opacity: dynamic($mask-opacity); 6 | $mask-page-background-color: dynamic($mask-background-color); 7 | 8 | //----------------------------------------- 9 | 10 | $main-nav-width: 260px; 11 | $main-nav-collapsed-width: 64px; 12 | $main-toolbar-height: 65px; 13 | $main-phone-toolbar-height: 56px; 14 | 15 | @mixin list-item-title() { 16 | font-weight: 600; 17 | line-height: 20px; 18 | } 19 | -------------------------------------------------------------------------------- /modern/sass/src/view/authentication/AuthBase.scss: -------------------------------------------------------------------------------- 1 | .auth-locked-inner { 2 | background-image:url('images/lock-screen-background.jpg'); 3 | background-size:cover; 4 | .x-panel-inner.auth-locked-inner { 5 | background-color: transparent; 6 | } 7 | } 8 | 9 | .lockscreen-header{ 10 | background-color:$base-color; 11 | color:white; 12 | } 13 | 14 | .x-unsized .x-field-input{ 15 | min-width:2em; 16 | } 17 | -------------------------------------------------------------------------------- /modern/sass/src/view/dashboard/Dashboard.scss: -------------------------------------------------------------------------------- 1 | $dashboard-item-spacing: 20px; 2 | 3 | .dashboard > * > .x-inner, 4 | .dashboard > * > * > .x-inner { 5 | padding: $dashboard-item-spacing 0 0 $dashboard-item-spacing; 6 | } 7 | 8 | .dashboard-item { 9 | margin: 0 $dashboard-item-spacing $dashboard-item-spacing 0; 10 | float: left; 11 | } 12 | 13 | .small-100 { 14 | width: calc(100% - #{$dashboard-item-spacing}); 15 | } 16 | 17 | .small-60 { 18 | width: calc(60% - #{$dashboard-item-spacing}); 19 | } 20 | 21 | .small-50 { 22 | width: calc(50% - #{$dashboard-item-spacing}); 23 | } 24 | 25 | .small-40 { 26 | width: calc(40% - #{$dashboard-item-spacing}); 27 | } 28 | 29 | .small-20 { 30 | width: calc(20% - #{$dashboard-item-spacing}); 31 | } 32 | 33 | @media (min-width: 1000px) { 34 | .big-100 { 35 | width: calc(100% - #{$dashboard-item-spacing}); 36 | } 37 | 38 | .big-60 { 39 | width: calc(60% - #{$dashboard-item-spacing}); 40 | } 41 | 42 | .big-50 { 43 | width: calc(50% - #{$dashboard-item-spacing}); 44 | } 45 | 46 | .big-40 { 47 | width: calc(40% - #{$dashboard-item-spacing}); 48 | } 49 | 50 | .big-33 { 51 | width: calc(33.3% - #{$dashboard-item-spacing}); 52 | } 53 | 54 | .big-20 { 55 | width: calc(20% - #{$dashboard-item-spacing}); 56 | } 57 | } 58 | 59 | // Custom Tool type: 'wrench' 60 | .#{$prefix}tool-wrench { 61 | @include font-icon($fa-var-wrench); 62 | background: none; 63 | } 64 | 65 | .quick-graph-panel { 66 | .x-panel-header { 67 | padding-left: 1.375em; 68 | } 69 | 70 | .x-panel-title-icon { 71 | position: relative; 72 | 73 | &:before { 74 | position: absolute; 75 | height: 1.875em; 76 | width: 1.875em; 77 | top: -.4375em; 78 | left: -.4375em; 79 | border-radius: 1.875em; 80 | background-color: #f1f1f1; 81 | line-height: 1.875em; 82 | text-align: center; 83 | } 84 | } 85 | 86 | .x-panel-title-text { 87 | padding-left: .53em; 88 | } 89 | } -------------------------------------------------------------------------------- /modern/sass/src/view/dashboard/Network.scss: -------------------------------------------------------------------------------- 1 | @include progress-ui( 2 | $ui: 'plain', 3 | 4 | $min-height: 5px, 5 | $min-height-big: 5px, 6 | $border-width: 0, 7 | $border-radius: 0 8 | ); 9 | 10 | .top-info-container{ 11 | color: #4590D3; 12 | .inner { 13 | white-space: nowrap; 14 | overflow: hidden; 15 | text-overflow: ellipsis; 16 | } 17 | } 18 | 19 | .dashboard-graph-analysis-left { 20 | border-right: 1px solid #ddd; 21 | } 22 | 23 | .graph-analysis-right-inner-container.right-value { 24 | text-align: right; 25 | } 26 | 27 | .graph-analysis-right { 28 | padding-left: 15px; 29 | } 30 | 31 | @media (max-width: 699px) { 32 | .graph-analysis-right { 33 | padding-left: 0; 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /modern/sass/src/view/faq/Items.scss: -------------------------------------------------------------------------------- 1 | .faq-title { 2 | display: table; 3 | } 4 | 5 | .faq-expander, .faq-question { 6 | display: table-cell; 7 | font-size: 110%; 8 | 9 | cursor: pointer; // placement of this style controls the expand/collapse logic 10 | } 11 | 12 | .faq-expander { 13 | width: 1.8em; 14 | text-align: center; 15 | 16 | &:before { 17 | content: $fa-var-caret-right; 18 | } 19 | 20 | .faq-expanded & { 21 | &:before { 22 | content: $fa-var-caret-down; 23 | } 24 | } 25 | } 26 | 27 | .faq-question { 28 | @include list-item-title(); 29 | } 30 | 31 | .faq-body { 32 | > div { 33 | padding: 6px 0 10px 10px; 34 | } 35 | 36 | height: 0; 37 | overflow: hidden; 38 | 39 | .faq-expanded & { 40 | height: auto; 41 | } 42 | } 43 | -------------------------------------------------------------------------------- /modern/sass/src/view/forms/Finish.scss: -------------------------------------------------------------------------------- 1 | .finish-form { 2 | color: red; 3 | } 4 | 5 | .finish-form-icon, 6 | .finish-form-title, 7 | .finish-form-text { 8 | color: #888; 9 | } 10 | 11 | .finish-form-icon { 12 | float: left; 13 | font-size: 8em; 14 | width: 1.1em; 15 | 16 | &:before { 17 | content: $fa-var-check-circle-o; 18 | } 19 | } 20 | 21 | .finish-form-title { 22 | margin-top: 20px; 23 | font-size: 200%; 24 | } 25 | 26 | .finish-form-text { 27 | margin-top: 20px; 28 | } 29 | -------------------------------------------------------------------------------- /modern/sass/src/view/forms/Forms.scss: -------------------------------------------------------------------------------- 1 | @include button-ui( 2 | $ui: 'wizard', 3 | $background-color: $wizard-primary-background-color, 4 | $color: #fff 5 | ); 6 | -------------------------------------------------------------------------------- /modern/sass/src/view/forms/Wizard.scss: -------------------------------------------------------------------------------- 1 | @include tab-ui( 2 | $ui: 'wizard', 3 | $background-color: #fff, 4 | $active-color: $wizard-primary-background-color, 5 | $color: #888 6 | ); 7 | 8 | @include tabbar-ui( 9 | $ui: 'wizard', 10 | $background-color: #fff 11 | ); 12 | 13 | .wizard { 14 | .x-form-inner { 15 | background-color: #fff; 16 | } 17 | } 18 | 19 | @media (max-width: 400px) { 20 | .wizard { 21 | .x-tab-icon { 22 | margin: 0; 23 | } 24 | .x-tab .x-button-label { 25 | display: none; 26 | } 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /modern/sass/src/view/pages/BlankPage.scss: -------------------------------------------------------------------------------- 1 | .blank-page-container { 2 | text-align: center; 3 | color: #cacaca; 4 | .fa-outer-class { 5 | margin: auto; 6 | background-color: #ebebeb; 7 | width: 10rem; 8 | border-radius: 5rem; 9 | .x-fa:before { 10 | line-height: 10rem; 11 | font-size: 12rem; 12 | color: #cacaca; 13 | } 14 | } 15 | h1 { 16 | margin: .75rem; 17 | font-size: 2.5rem; 18 | } 19 | .blank-page-text { 20 | font-size: 1.5rem; 21 | } 22 | } -------------------------------------------------------------------------------- /modern/sass/src/view/pages/ErrorBase.scss: -------------------------------------------------------------------------------- 1 | .error-page-container{ 2 | background-image:url('images/error-page-background.jpg'); 3 | background-size:cover; 4 | color: #fff; 5 | } 6 | 7 | .error-page-top-text{ 8 | font-size: 10rem; 9 | line-height: 10rem; 10 | } 11 | .error-page-desc{ 12 | text-align:center; 13 | font-size: 1.3rem; 14 | } -------------------------------------------------------------------------------- /modern/sass/src/view/phone/email/Email.scss: -------------------------------------------------------------------------------- 1 | .x-selected > .inbox-item { 2 | background-color: $listitem-selected-background-color; 3 | } 4 | 5 | .inbox-item { 6 | padding: 20px; 7 | border-bottom: 1px solid $border-color; 8 | background-color: #fff; 9 | overflow: auto; // ensure the box expands to include the floated items 10 | } 11 | 12 | .inbox-inner-row:after { 13 | content: " "; 14 | clear: both; // clear the floated items in the row 15 | } 16 | 17 | .inbox-from, 18 | .inbox-summary { 19 | float: left; 20 | } 21 | 22 | .inbox-date, 23 | .inbox-favorite { 24 | float: right; 25 | } 26 | 27 | .inbox-favorite-icon { 28 | color: #facc6e; 29 | } 30 | 31 | .inbox-attachment { 32 | padding-right: 10px; 33 | } 34 | 35 | .inbox-summary { 36 | width: calc(100vw - 6em); 37 | overflow: hidden; 38 | text-overflow: ellipsis; 39 | white-space: nowrap; 40 | } 41 | 42 | .email-controls { 43 | width: 30%; 44 | min-width: 180px; 45 | max-width: 240px; 46 | } 47 | 48 | .email-controls-box { 49 | margin: 0 20px 20px 0; 50 | } 51 | 52 | //------------------------------- 53 | 54 | .email-friend { 55 | overflow: auto; 56 | padding: 20px; 57 | } 58 | 59 | .email-friend:after { 60 | content: " "; 61 | clear: both; 62 | } 63 | 64 | .email-friend-name { 65 | float: left; 66 | } 67 | 68 | .email-friend-status { 69 | float: right; 70 | } 71 | 72 | .online > .email-friend-status { 73 | color: green; 74 | } 75 | 76 | .offline > .email-friend-status { 77 | color: #ddd; 78 | } 79 | -------------------------------------------------------------------------------- /modern/sass/src/view/phone/search/Users.scss: -------------------------------------------------------------------------------- 1 | .search-user-item { 2 | overflow: hidden; 3 | padding: 20px; 4 | border-bottom: 1px solid $border-color; 5 | } 6 | 7 | .search-user-title { 8 | @include list-item-title(); 9 | } 10 | 11 | .search-user-email { 12 | margin-bottom: 5px; 13 | } 14 | 15 | .search-user-image { 16 | float: left; 17 | 18 | > img { 19 | border: 2px solid $border-color; 20 | } 21 | } 22 | 23 | .search-user-content { 24 | margin-left: 70px; 25 | 26 | &:after { 27 | content: " "; 28 | clear: both; 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /modern/sass/src/view/profile/UserProfile.scss: -------------------------------------------------------------------------------- 1 | .userProfile-container { 2 | .userProfilePic { 3 | border: 4px solid $base-border-color; 4 | @include border-radius($circle-border-radius); 5 | } 6 | 7 | .userProfileName { 8 | font-size: 16px; 9 | font-weight:bold; 10 | line-height: 30px; 11 | color: $color; 12 | } 13 | 14 | .userProfileDesc { 15 | color:$color; 16 | line-height:16px; 17 | } 18 | 19 | .user-profile-desc { 20 | .x-layout-box-item { 21 | &:before { 22 | top: 0px; 23 | } 24 | } 25 | 26 | .box { 27 | display: flex; 28 | } 29 | } 30 | } -------------------------------------------------------------------------------- /modern/sass/src/view/search/All.scss: -------------------------------------------------------------------------------- 1 | .search-all { 2 | background-color: #fff; 3 | 4 | .search-result-item { 5 | padding: 20px; 6 | 7 | .x-innerhtml { 8 | padding: 0; 9 | } 10 | } 11 | 12 | .search-result-item-selected .search-result-item { 13 | background-color: #f2e3b2; 14 | } 15 | 16 | img { 17 | margin: 10px 10px 0 0; 18 | } 19 | 20 | .list-cls { 21 | @include list-item-title(); 22 | } 23 | 24 | a { 25 | text-decoration:none; 26 | color: $base-color; 27 | font-size: 14px; 28 | font-weight: normal; 29 | margin-bottom: 3px; 30 | display: inline-block; 31 | } 32 | 33 | .x-list-item { 34 | .x-innerhtml { 35 | font-size: 14px; 36 | } 37 | } 38 | 39 | .x-dataview-inner { 40 | width: 100% !important; 41 | } 42 | } 43 | -------------------------------------------------------------------------------- /modern/sass/src/view/tablet/email/Email.scss: -------------------------------------------------------------------------------- 1 | @include button-ui( 2 | $ui: 'launch', 3 | $background-color: #fff, 4 | $border-width: 0, 5 | $padding: 14px, 6 | $padding-big: 14px 7 | ); 8 | 9 | .x-button-launch:after { 10 | content: $fa-var-chevron-right; 11 | font-family: FontAwesome; 12 | font-size: 80%; 13 | position: absolute; 14 | right: 12px; 15 | vertical-align: middle; 16 | color: silver; 17 | } 18 | 19 | @include button-ui( 20 | $ui: 'presence', 21 | $background-color: #fff, 22 | $border-width: 0, 23 | $padding: 14px, 24 | $padding-big: 14px 25 | ); 26 | 27 | .x-button-presence:after { 28 | content: $fa-var-circle; 29 | font-family: FontAwesome; 30 | font-size: 80%; 31 | position: absolute; 32 | right: 12px; 33 | color: silver; 34 | top: 50%; 35 | margin-top: -8px; 36 | } 37 | 38 | .x-button-presence.online:after { 39 | color: green; 40 | } 41 | 42 | .inbox-unread { 43 | .inbox-from, .inbox-title { 44 | font-weight: 600; 45 | } 46 | } 47 | 48 | .email-toolbox { 49 | padding-top: 1.25rem; 50 | padding-bottom: 1.25rem; 51 | } 52 | 53 | .friends-list { 54 | .x-button { 55 | display: block; 56 | } 57 | } 58 | -------------------------------------------------------------------------------- /modern/sass/src/view/widgets/BioTile.scss: -------------------------------------------------------------------------------- 1 | $bio-image-size: 66px; 2 | 3 | .bio-tile { 4 | background-color: #fff; 5 | } 6 | 7 | .bio-banner { 8 | background-color: #607d8b; 9 | } 10 | 11 | .bio-banner, .bio-image { 12 | background-position: top left !important; // framework rules have higher specificity 13 | background-size: 100% auto !important; // framework rules have higher specificity 14 | } 15 | 16 | .bio-image { 17 | width: $bio-image-size; 18 | height: $bio-image-size; 19 | border: 2px solid #fff; 20 | border-radius: 50%; 21 | margin-left: (-$bio-image-size / 2); 22 | margin-top: (-$bio-image-size / 2); 23 | } 24 | 25 | .bio-description { 26 | padding-top: $bio-image-size/2 + 8px; 27 | text-align: center; 28 | } 29 | 30 | .bio-description > .x-innerhtml::first-line { 31 | font-weight: 600; 32 | font-size: 130%; 33 | } -------------------------------------------------------------------------------- /modern/sass/src/view/widgets/SocialStatus.scss: -------------------------------------------------------------------------------- 1 | .social-status-header, .social-status-count { 2 | text-align: center; 3 | } 4 | 5 | .social-status-category:not(:last-child) { 6 | border-right: 1px solid $border-color; 7 | } 8 | -------------------------------------------------------------------------------- /modern/sass/src/view/widgets/StatusTile.scss: -------------------------------------------------------------------------------- 1 | .status-tile { 2 | background-color: #fff; 3 | border: 3px solid transparent; 4 | position: relative; 5 | text-align: center; 6 | } 7 | 8 | .status-tile-wrap { 9 | position: relative; 10 | top: 50%; 11 | @include transform(translateY(-50%)); 12 | 13 | .status-tile-large > & { 14 | font-size: 150%; 15 | } 16 | } 17 | 18 | .status-tile-quantity { 19 | font-size: 250%; 20 | font-weight: 500; 21 | } 22 | 23 | .status-tile-icon-wrap { 24 | font-size: 180%; 25 | } 26 | 27 | .status-tile-icon-wrap, 28 | .status-tile-icon { 29 | display: inline-block; 30 | } 31 | 32 | .status-tile-icon-first .status-tile-icon-wrap { 33 | width: 2.4em; 34 | height: 2.4em; 35 | line-height: 2.4em; 36 | color: #fff; 37 | border-radius: 50%; 38 | } 39 | -------------------------------------------------------------------------------- /modern/sass/var/view/dashboard/Dashboard.scss: -------------------------------------------------------------------------------- 1 | // 2 | -------------------------------------------------------------------------------- /modern/sass/var/view/main/Main.scss: -------------------------------------------------------------------------------- 1 | $circle-border-radius:50%; 2 | $base-border-color: #ddd; 3 | $lightest-color:#fff; 4 | $font-weight-normal: 400; 5 | $font-weight-bold: 500; 6 | 7 | $accordion-header-background-color: $lightest-color; 8 | $accordion-header-color: #333; 9 | 10 | $social-facebook-btn-background: #167abc; 11 | $social-twitter-btn-background: #03b4d5; 12 | $social-google-plus-btn-background: #e44959; 13 | $social-envelope-btn-background: #7754aa; 14 | -------------------------------------------------------------------------------- /modern/sass/var/view/profile/UserProfile.scss: -------------------------------------------------------------------------------- 1 | $like-comment-btn-background-color: #f4f4f4; 2 | $like-comment-btn-color: #979797; 3 | $article-comment-color: #eee; -------------------------------------------------------------------------------- /modern/src/Application.js.tpl.default: -------------------------------------------------------------------------------- 1 | /** 2 | * The main application class. An instance of this class is created by app.js when it 3 | * calls Ext.application(). This is the ideal place to handle application launch and 4 | * initialization details. 5 | */ 6 | Ext.define('{appName}.Application', { 7 | extend: 'Ext.app.Application', 8 | 9 | name: '{appName}', 10 | 11 | defaultToken : 'dashboard', 12 | 13 | mainView: '{appName}.view.main.Main', 14 | 15 | profiles: [ 16 | 'Phone', 17 | 'Tablet' 18 | ], 19 | 20 | stores: [ 21 | 'NavigationTree' 22 | ] 23 | }); 24 | -------------------------------------------------------------------------------- /modern/src/profile/Phone.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.profile.Phone', { 2 | extend: 'Ext.app.Profile', 3 | 4 | requires: [ 5 | '{appName}.view.phone.*' 6 | ], 7 | 8 | // Map phone profile views to generic xtype aliases: 9 | // 10 | views: { 11 | email: '{appName}.view.phone.email.Email', 12 | inbox: '{appName}.view.phone.email.Inbox', 13 | compose: '{appName}.view.phone.email.Compose', 14 | 15 | searchusers: '{appName}.view.phone.search.Users' 16 | }, 17 | 18 | isActive: function () { 19 | return Ext.platformTags.phone; 20 | }, 21 | 22 | launch: function () { 23 | // Add a class to the body el to identify the phone profile so we can 24 | // override CSS styles easily. The framework adds x-phone so we could 25 | // use it but this way the app controls a class that is always present 26 | // when this profile isActive, regardless of the actual device type. 27 | Ext.getBody().addCls('phone'); 28 | } 29 | }); 30 | -------------------------------------------------------------------------------- /modern/src/profile/Tablet.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.profile.Tablet', { 2 | extend: 'Ext.app.Profile', 3 | 4 | requires: [ 5 | '{appName}.view.tablet.*' 6 | ], 7 | 8 | // Map tablet/desktop profile views to generic xtype aliases: 9 | // 10 | views: { 11 | email: '{appName}.view.tablet.email.Email', 12 | inbox: '{appName}.view.tablet.email.Inbox', 13 | compose: '{appName}.view.tablet.email.Compose', 14 | 15 | searchusers: '{appName}.view.tablet.search.Users' 16 | }, 17 | 18 | isActive: function () { 19 | return !Ext.platformTags.phone; 20 | } 21 | }); 22 | -------------------------------------------------------------------------------- /modern/src/view/authentication/AuthBase.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.authentication.AuthBase', { 2 | extend: 'Ext.Panel', 3 | 4 | requires: [ 5 | 'Ext.layout.VBox' 6 | ], 7 | 8 | baseCls: 'auth-locked', 9 | 10 | layout: { 11 | type: 'vbox', 12 | align: 'center', 13 | pack: 'center' 14 | } 15 | }); 16 | -------------------------------------------------------------------------------- /modern/src/view/authentication/LockScreen.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.authentication.LockScreen', { 2 | extend: '{appName}.view.authentication.AuthBase', 3 | xtype: 'lockscreen', 4 | 5 | requires: [ 6 | 'Ext.field.Text' 7 | ], 8 | 9 | padding:20, 10 | 11 | items: [{ 12 | xtype: 'panel', 13 | 14 | items: [{ 15 | xtype: 'container', 16 | userCls: 'lockscreen-header', 17 | padding:20, 18 | 19 | layout: 'hbox', 20 | items: [{ 21 | xtype: 'img', 22 | src: 'resources/images/user-profile/2.png', 23 | height: 64, 24 | width: 64, 25 | userCls: 'circular' 26 | },{ 27 | xtype: 'container', 28 | html: 'Goff Smith
Project Manager', 29 | padding:15 30 | }] 31 | },{ 32 | padding:'20 20 0 20', 33 | html: 'It\\'s been awhile. Please enter your password to resume' 34 | },{ 35 | xtype: 'container', 36 | padding: 20, 37 | defaults: { 38 | margin:'0 0 10 0' 39 | }, 40 | items: [{ 41 | xtype: 'passwordfield', 42 | placeHolder: 'Password', 43 | ui: 'light' 44 | },{ 45 | xtype: 'button', 46 | text: 'Login', 47 | iconAlign: 'right', 48 | iconCls: 'x-fa fa-angle-right', 49 | width: '100%', 50 | ui: 'gray-button', 51 | handler: function(){ 52 | window.location.href = "#dashboard"; 53 | } 54 | },{ 55 | html: 'Sign in using a different account' 56 | }] 57 | }] 58 | 59 | }] 60 | }); 61 | -------------------------------------------------------------------------------- /modern/src/view/authentication/PasswordReset.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.authentication.PasswordReset', { 2 | extend: '{appName}.view.authentication.AuthBase', 3 | xtype: 'passwordreset', 4 | 5 | requires: [ 6 | 'Ext.field.Text' 7 | ], 8 | 9 | items: [{ 10 | xtype:'panel', 11 | padding:20, 12 | 13 | items: [{ 14 | html: 'Forgot Password', 15 | padding: '0 0 10 0' 16 | },{ 17 | xtype:'container', 18 | defaults: { 19 | margin:'0 0 10 0' 20 | }, 21 | items: [{ 22 | xtype: 'textfield', 23 | minWidth: 300, 24 | placeHolder: 'example@example.com', 25 | ui: 'light' 26 | },{ 27 | xtype: 'button', 28 | text: 'Reset Password', 29 | iconAlign: 'right', 30 | iconCls: 'x-fa fa-angle-right', 31 | ui: 'action', 32 | width: '100%', 33 | handler: function(){ 34 | window.location.href = "#dashboard"; 35 | } 36 | },{ 37 | html: 'Back to Login' 38 | }] 39 | }] 40 | }] 41 | }); 42 | -------------------------------------------------------------------------------- /modern/src/view/authentication/Register.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.authentication.Register', { 2 | extend: '{appName}.view.authentication.AuthBase', 3 | xtype: 'register', 4 | 5 | requires: [ 6 | 'Ext.field.Checkbox', 7 | 'Ext.field.Password', 8 | 'Ext.field.Text', 9 | 'Ext.layout.HBox' 10 | ], 11 | 12 | items: [{ 13 | xtype: 'panel', 14 | 15 | items: [{ 16 | padding: '20 0 0 20', 17 | html: 'Create an Account' 18 | },{ 19 | xtype: 'container', 20 | padding: 20, 21 | layout: 'vbox', 22 | defaults: { 23 | margin:'0 0 10 0' 24 | }, 25 | items: [{ 26 | xtype: 'textfield', 27 | placeHolder: 'Full Name', 28 | ui: 'light' 29 | },{ 30 | xtype: 'textfield', 31 | placeHolder: 'Username', 32 | ui: 'light' 33 | },{ 34 | xtype: 'textfield', 35 | placeHolder: 'Email', 36 | ui: 'light' 37 | },{ 38 | xtype: 'passwordfield', 39 | placeHolder: 'Password', 40 | ui: 'light' 41 | },{ 42 | layout: 'hbox', 43 | items: [{ 44 | xtype: 'checkboxfield' 45 | },{ 46 | html: 'I agree to the terms & conditions' 47 | }] 48 | },{ 49 | xtype: 'button', 50 | text: 'Signup', 51 | iconAlign: 'right', 52 | iconCls: 'x-fa fa-user-plus', 53 | ui: 'confirm', 54 | handler: function(){ 55 | window.location.href = "#dashboard"; 56 | } 57 | },{ 58 | xtype: 'button', 59 | text: 'Login with Facebook', 60 | iconAlign: 'right', 61 | iconCls: 'x-fa fa-facebook', 62 | ui: 'facebook', 63 | handler: function(){ 64 | window.location.href = "#dashboard"; 65 | } 66 | }] 67 | }] 68 | }] 69 | }); 70 | -------------------------------------------------------------------------------- /modern/src/view/charts/Charts.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.charts.Charts', { 2 | extend: 'Ext.Container', 3 | xtype: 'charts', 4 | 5 | requires: [ 6 | '{appName}.view.charts.ChartsModel' 7 | ], 8 | 9 | cls: 'dashboard', 10 | 11 | viewModel: { 12 | type: 'charts' 13 | }, 14 | 15 | scrollable: true, 16 | 17 | items: [ 18 | { 19 | xtype: 'chartsareapanel', 20 | userCls: 'big-50 small-100 dashboard-item shadow' 21 | }, 22 | { 23 | xtype: 'chartspie3dpanel', 24 | userCls: 'big-50 small-100 dashboard-item shadow' 25 | }, 26 | { 27 | xtype: 'chartspolarpanel', 28 | userCls: 'big-50 small-100 dashboard-item shadow' 29 | }, 30 | { 31 | xtype: 'chartsstackedpanel', 32 | userCls: 'big-50 small-100 dashboard-item shadow' 33 | }, 34 | { 35 | xtype: 'chartsbarpanel', 36 | userCls: 'big-50 small-100 dashboard-item shadow' 37 | }, 38 | { 39 | xtype: 'chartsgaugepanel', 40 | userCls: 'big-50 small-100 dashboard-item shadow' 41 | } 42 | ] 43 | }); 44 | -------------------------------------------------------------------------------- /modern/src/view/dashboard/Dashboard.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.dashboard.Dashboard', { 2 | extend: 'Ext.Container', 3 | xtype: 'admindashboard', 4 | 5 | controller: 'dashboard', 6 | viewModel: { 7 | type: 'dashboard' 8 | }, 9 | 10 | cls: 'dashboard', 11 | 12 | scrollable: true, 13 | 14 | items: [ 15 | { 16 | xtype: 'network', 17 | 18 | // 60% width when viewport is big enough, 19 | // 100% when viewport is small 20 | userCls: 'big-60 small-100 dashboard-item shadow' 21 | }, 22 | { 23 | xtype: 'hddusage', 24 | userCls: 'big-20 small-50 dashboard-item shadow' 25 | }, 26 | { 27 | xtype: 'earnings', 28 | userCls: 'big-20 small-50 dashboard-item shadow' 29 | }, 30 | { 31 | xtype: 'sales', 32 | userCls: 'big-20 small-50 dashboard-item shadow' 33 | }, 34 | { 35 | xtype: 'topmovies', 36 | userCls: 'big-20 small-50 dashboard-item shadow' 37 | }, 38 | { 39 | xtype: 'weather', 40 | userCls: 'big-40 small-100 dashboard-item shadow' 41 | }, 42 | { 43 | xtype: 'todo', 44 | height: 340, 45 | userCls: 'big-60 small-100 dashboard-item shadow' 46 | }, 47 | { 48 | xtype: 'services', 49 | height: 340, 50 | userCls: 'big-40 small-100 dashboard-item shadow' 51 | } 52 | ] 53 | }); 54 | -------------------------------------------------------------------------------- /modern/src/view/dashboard/Sales.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.dashboard.Sales', { 2 | extend: 'Ext.Panel', 3 | xtype: 'sales', 4 | ui: 'light', 5 | 6 | requires: [ 7 | 'Ext.chart.CartesianChart', 8 | 'Ext.chart.axis.Category', 9 | 'Ext.chart.axis.Numeric', 10 | 'Ext.chart.series.Bar' 11 | ], 12 | 13 | height: 130, 14 | layout: 'fit', 15 | 16 | title: 'Sales', 17 | cls: 'quick-graph-panel', 18 | header: { 19 | docked: 'bottom' 20 | }, 21 | platformConfig: { 22 | '!phone': { 23 | iconCls: 'x-fa fa-briefcase' 24 | } 25 | }, 26 | 27 | items: [ 28 | { 29 | xtype: 'cartesian', 30 | animation : !Ext.isIE9m && Ext.os.is.Desktop, 31 | background: '#8561c5', 32 | height: '100%', 33 | width: '100%', 34 | colors: [ 35 | '#ffffff' 36 | ], 37 | 38 | bind: '{["\{quarterlyGrowth\}"]}', 39 | 40 | axes: [ 41 | { 42 | type: 'category', 43 | fields: [ 44 | 'xvalue' 45 | ], 46 | hidden: true, 47 | position: 'bottom' 48 | }, 49 | { 50 | type: 'numeric', 51 | fields: [ 52 | 'yvalue' 53 | ], 54 | grid: { 55 | odd: { 56 | fill: '#e8e8e8' 57 | } 58 | }, 59 | hidden: true, 60 | position: 'left' 61 | } 62 | ], 63 | 64 | series: [ 65 | { 66 | type: 'bar', 67 | xField: 'xvalue', 68 | yField: [ 69 | 'yvalue' 70 | ] 71 | } 72 | ], 73 | 74 | interactions: [ 75 | { 76 | type: 'panzoom' 77 | } 78 | ] 79 | } 80 | ] 81 | }); 82 | -------------------------------------------------------------------------------- /modern/src/view/dashboard/Todos.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.dashboard.Todos', { 2 | extend: 'Ext.Panel', 3 | xtype: 'todo', 4 | 5 | requires: [ 6 | 'Ext.grid.plugin.MultiSelection', 7 | 'Ext.grid.Grid', 8 | 'Ext.field.Text', 9 | 'Ext.Button' 10 | ], 11 | 12 | cls: 'todo-list shadow', 13 | 14 | title: 'TODO List', 15 | bodyPadding:15, 16 | layout: 'vbox', 17 | items: [ 18 | { 19 | xtype: 'grid', 20 | flex: 1, 21 | width: '100%', 22 | userCls: 'dashboard-todo-list', 23 | hideHeaders: true, 24 | bind: { 25 | store: '{["\{todos\}"]}' 26 | }, 27 | 28 | plugins: { 29 | type: 'multiselection', 30 | 31 | selectionColumn: { 32 | hidden: false, 33 | width: 40 // Change column width from the default of 60px 34 | } 35 | }, 36 | 37 | columns: [ 38 | { 39 | text: 'Task', 40 | flex: 1, 41 | dataIndex: 'task' 42 | } 43 | ] 44 | }, 45 | { 46 | xtype: 'toolbar', 47 | padding: '10 0 0 0', 48 | items: [ 49 | { 50 | xtype: 'textfield', 51 | flex: 1, 52 | fieldLabel: 'Add Task', 53 | hideLabel: true, 54 | placeHolder: 'Add New Task' 55 | }, 56 | { 57 | xtype: 'button', 58 | ui: 'soft-green', 59 | iconCls: 'x-fa fa-plus', 60 | margin:'0 0 0 10' 61 | } 62 | ] 63 | } 64 | ] 65 | }); 66 | -------------------------------------------------------------------------------- /modern/src/view/dashboard/TopMovie.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.dashboard.TopMovie', { 2 | extend: 'Ext.Panel', 3 | xtype: 'topmovies', 4 | ui: 'light', 5 | 6 | requires: [ 7 | 'Ext.chart.PolarChart', 8 | 'Ext.chart.series.Pie', 9 | 'Ext.chart.series.sprite.PieSlice', 10 | 'Ext.chart.interactions.Rotate' 11 | ], 12 | 13 | height: 130, 14 | layout: 'fit', 15 | 16 | title: 'Top Movie', 17 | cls: 'quick-graph-panel', 18 | header: { 19 | docked: 'bottom' 20 | }, 21 | platformConfig: { 22 | '!phone': { 23 | iconCls: 'x-fa fa-video-camera' 24 | } 25 | }, 26 | 27 | items: [ 28 | { 29 | xtype: 'polar', 30 | animation : !Ext.isIE9m && Ext.os.is.Desktop, 31 | height: '100%', 32 | width: '100%', 33 | background: '#33abaa', 34 | 35 | colors: [ 36 | '#115fa6', 37 | '#94ae0a', 38 | '#a61120', 39 | '#ff8809', 40 | '#ffd13e', 41 | '#a61187', 42 | '#24ad9a', 43 | '#7c7474', 44 | '#a66111' 45 | ], 46 | 47 | radius: 100, 48 | 49 | bind: '{["\{topMovies\}"]}', 50 | 51 | series: [ 52 | { 53 | type: 'pie', 54 | colors: [ 55 | '#ffffff' 56 | ], 57 | label: { 58 | field: 'x', 59 | display: 'rotate', 60 | contrast: true, 61 | font: '12px Arial' 62 | }, 63 | xField: 'yvalue' 64 | } 65 | ], 66 | 67 | interactions: [ 68 | { 69 | type: 'rotate' 70 | } 71 | ] 72 | } 73 | ] 74 | }); 75 | -------------------------------------------------------------------------------- /modern/src/view/email/Actions.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.email.Actions', { 2 | extend: 'Ext.ActionSheet', 3 | xtype: 'emailactions', 4 | 5 | items: [{ 6 | text: 'Compose', 7 | handler: 'onComposeMessage' 8 | }, { 9 | text: 'Inbox', 10 | itemId: 'inbox', 11 | handler: 'onChangeFilter' 12 | }, { 13 | text: 'Sent Mail', 14 | itemId: 'sent', 15 | handler: 'onChangeFilter' 16 | }, { 17 | text: 'Spam', 18 | itemId: 'spam', 19 | handler: 'onChangeFilter' 20 | }, { 21 | text: 'Trash', 22 | itemId: 'trash', 23 | handler: 'onChangeFilter' 24 | }] 25 | }); 26 | -------------------------------------------------------------------------------- /modern/src/view/email/EmailController.js.tpl.default: -------------------------------------------------------------------------------- 1 | /** 2 | * Base class for email controllers for phone and tablet. 3 | */ 4 | Ext.define('{appName}.view.email.EmailController', { 5 | extend: 'Ext.app.ViewController', 6 | 7 | //doCompose: function (to) { 8 | // // 9 | //}, 10 | actionsVisible: false, 11 | 12 | onChangeFilter: function (sender) { 13 | console.log('Show ' + sender.getItemId()); 14 | }, 15 | 16 | onComposeMessage: function () { 17 | this.doCompose(); 18 | }, 19 | 20 | onComposeTo: function (sender) { 21 | var rec = sender.getRecord(); 22 | this.doCompose(rec.get('name')); 23 | }, 24 | 25 | onSelectMessage: function (sender, record) { 26 | // 27 | }, 28 | 29 | hideActions: function () { 30 | var actions = this.actions; 31 | 32 | if (actions) { 33 | actions.hide(); 34 | } 35 | this.actionsVisible = false; 36 | }, 37 | 38 | showActions: function () { 39 | var me = this, 40 | actions = me.actions; 41 | 42 | if (!actions) { 43 | me.actions = actions = Ext.create({ 44 | xtype: 'emailactions', 45 | defaults: { 46 | scope: me 47 | }, 48 | enter: 'right', 49 | exit: 'right', 50 | top: 0, 51 | hidden: true, 52 | left: null, 53 | height: '100%', 54 | hideOnMaskTap: true, 55 | width: 250 56 | }); 57 | 58 | Ext.Viewport.add(actions); 59 | } 60 | 61 | actions.on('hide', 62 | function () { 63 | me.actionsVisible = false; 64 | }, 65 | null, 66 | { single: true } 67 | ); 68 | 69 | actions.show(); 70 | me.actionsVisible = true; 71 | } 72 | }); 73 | -------------------------------------------------------------------------------- /modern/src/view/faq/Items.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.faq.Items', { 2 | extend: 'Ext.Panel', 3 | xtype: 'faqitems', 4 | 5 | requires: [ 6 | 'Ext.dataview.DataView' 7 | ], 8 | 9 | controller: 'faqitems', 10 | 11 | bodyPadding: '0 20 20 20', 12 | 13 | config: { 14 | store: null 15 | }, 16 | 17 | items: [{ 18 | xtype: 'dataview', 19 | scrollable: false, 20 | 21 | listeners: { 22 | itemtap: 'onItemTap' 23 | }, 24 | 25 | itemTpl: '
' + 26 | '
' + 27 | '
' + 28 | '
{question}
' + 29 | '
' + 30 | '
' + 31 | '
{answer}
' + 32 | '
' + 33 | '
' 34 | }], 35 | 36 | updateStore: function (store) { 37 | var grid = this.down('dataview'); 38 | grid.setStore(store); 39 | } 40 | }); 41 | -------------------------------------------------------------------------------- /modern/src/view/faq/List.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.faq.List', { 2 | extend: 'Ext.dataview.List', 3 | xtype: 'faq', 4 | 5 | container: { 6 | userCls: 'dashboard' 7 | }, 8 | 9 | store: { 10 | type: 'faq', 11 | autoLoad: true 12 | }, 13 | 14 | defaultType: 'faqitems', 15 | 16 | itemConfig: { 17 | //ui: 'light', // TODO - timing issue 18 | userCls: 'dashboard-item shadow', 19 | viewModel: true, 20 | 21 | bind: { 22 | ui: 'light', 23 | title: '{record\.name}', 24 | store: '{record\.questions}' 25 | } 26 | } 27 | }); 28 | -------------------------------------------------------------------------------- /modern/src/view/forms/Account.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.forms.Account', { 2 | extend: 'Ext.form.Panel', 3 | xtype: 'accountform', 4 | cls: 'wizardform', 5 | 6 | requires: [ 7 | 'Ext.field.Password', 8 | 'Ext.field.Text' 9 | ], 10 | 11 | title: 'Account', 12 | iconCls: 'x-fa fa-info', 13 | 14 | bodyPadding: '0 20 10 20', 15 | defaults: { 16 | margin: '0 0 10 0' 17 | }, 18 | 19 | items: [{ 20 | xtype: 'textfield', 21 | placeHolder: 'Username must be unique' 22 | }, { 23 | xtype: 'textfield', 24 | placeHolder: 'Email (ex: me@somewhere.com)', 25 | vtype: 'email' 26 | }, { 27 | xtype: 'passwordfield', 28 | placeHolder: 'Enter a password' 29 | }, { 30 | xtype: 'passwordfield', 31 | placeHolder: 'Passwords must match' 32 | }] 33 | }); 34 | -------------------------------------------------------------------------------- /modern/src/view/forms/Address.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.forms.Address', { 2 | extend: 'Ext.form.Panel', 3 | xtype: 'addressform', 4 | cls: 'wizardform', 5 | 6 | requires: [ 7 | 'Ext.field.Text' 8 | ], 9 | 10 | title: 'Address', 11 | iconCls: 'x-fa fa-home', 12 | 13 | bodyPadding: '0 20 10 20', 14 | defaultType: 'textfield', 15 | defaults: { 16 | margin: '0 0 10 0' 17 | }, 18 | 19 | items: [{ 20 | placeHolder: 'Phone Number' 21 | }, { 22 | placeHolder: 'Address' 23 | }, { 24 | placeHolder: 'City' 25 | }, { 26 | placeHolder: 'Postal / Zip Code' 27 | }] 28 | }); 29 | -------------------------------------------------------------------------------- /modern/src/view/forms/Finish.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.forms.Finish', { 2 | extend: 'Ext.Panel', 3 | xtype: 'finishform', 4 | cls: 'wizard-finish', 5 | 6 | title: 'Finish', 7 | iconCls: 'x-fa fa-heart', 8 | 9 | bodyPadding: '0 20 10 20', 10 | 11 | styleHtmlContent: true, 12 | html: 13 | '
Thank You
' + 14 | '
Lorem ipsum dolor sit amet, consectetuer adipiscing ' + 15 | 'elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam ' + 16 | 'erat volutpat.
' + 17 | '
' 18 | }); 19 | -------------------------------------------------------------------------------- /modern/src/view/forms/Profile.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.forms.Profile', { 2 | extend: 'Ext.form.Panel', 3 | xtype: 'profileform', 4 | cls: 'wizardform', 5 | 6 | requires: [ 7 | 'Ext.SegmentedButton', 8 | 'Ext.field.Text' 9 | ], 10 | 11 | title: 'Profile', 12 | iconCls: 'x-fa fa-user', 13 | 14 | bodyPadding: '0 20 10 20', 15 | defaults: { 16 | margin: '0 0 10 0' 17 | }, 18 | 19 | items: [{ 20 | xtype: 'textfield', 21 | placeHolder: 'First Name' 22 | }, { 23 | xtype: 'textfield', 24 | placeHolder: 'Last Name' 25 | }, { 26 | xtype: 'textfield', 27 | placeHolder: 'Company' 28 | }, { 29 | xtype: 'component', 30 | html: 'Member Type' 31 | }, { 32 | xtype: 'segmentedbutton', 33 | defaults: { 34 | flex: 1 35 | }, 36 | minWidth: '15em', 37 | 38 | platformConfig: { 39 | phone: { 40 | width: '100%' 41 | }, 42 | '!phone': { 43 | width: '50%' 44 | } 45 | }, 46 | 47 | items: [{ 48 | text: 'Free', 49 | pressed: true 50 | }, { 51 | text: 'Personal', 52 | minWidth: '4em' 53 | }, { 54 | text: 'Gold' 55 | }] 56 | }] 57 | }); 58 | -------------------------------------------------------------------------------- /modern/src/view/main/Main.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.main.Main', { 2 | extend: 'Ext.Container', 3 | requires: [ 4 | 'Ext.Button', 5 | 'Ext.list.Tree', 6 | 'Ext.navigation.View' 7 | ], 8 | 9 | controller: 'main', 10 | platformConfig: { 11 | phone: { 12 | controller: 'phone-main' 13 | } 14 | }, 15 | 16 | layout: 'hbox', 17 | 18 | items: [ 19 | { 20 | xtype: 'maintoolbar', 21 | docked: 'top', 22 | userCls: 'main-toolbar shadow' 23 | }, 24 | { 25 | xtype: 'container', 26 | userCls: 'main-nav-container', 27 | reference: 'navigation', 28 | scrollable: true, 29 | items: [ 30 | { 31 | xtype: 'treelist', 32 | reference: 'navigationTree', 33 | ui: 'navigation', 34 | store: 'NavigationTree', 35 | expanderFirst: false, 36 | expanderOnly: false, 37 | listeners: { 38 | itemclick: 'onNavigationItemClick', 39 | selectionchange: 'onNavigationTreeSelectionChange' 40 | } 41 | } 42 | ] 43 | }, 44 | { 45 | xtype: 'navigationview', 46 | flex: 1, 47 | reference: 'mainCard', 48 | userCls: 'main-container', 49 | navigationBar: false 50 | } 51 | ] 52 | }); 53 | -------------------------------------------------------------------------------- /modern/src/view/pages/BlankPage.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.pages.BlankPage', { 2 | extend: 'Ext.Container', 3 | xtype: 'pageblank', 4 | 5 | requires: [ 6 | 'Ext.layout.VBox' 7 | ], 8 | 9 | layout:{ 10 | type: 'vbox', 11 | pack:'center', 12 | align:'center' 13 | }, 14 | 15 | items: [ 16 | { 17 | cls: 'blank-page-container', 18 | html: '
' + 19 | '

Coming Soon!

Stay tuned for updates' 20 | } 21 | ] 22 | }); 23 | -------------------------------------------------------------------------------- /modern/src/view/pages/Error404.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.pages.Error404', { 2 | extend: '{appName}.view.pages.ErrorBase', 3 | xtype:'page404', 4 | 5 | items:[{ 6 | cls: 'error-page-top-text', 7 | html: '404' 8 | },{ 9 | cls: 'error-page-desc', 10 | html: '

Seems you\\'ve hit a wall!

Try going back to our ' + 11 | ' Home page

' 12 | }] 13 | }); 14 | -------------------------------------------------------------------------------- /modern/src/view/pages/Error500.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.pages.Error500', { 2 | extend: '{appName}.view.pages.ErrorBase', 3 | xtype:'page500', 4 | 5 | items:[{ 6 | cls: 'error-page-top-text', 7 | html: '500' 8 | },{ 9 | cls: 'error-page-desc', 10 | html: '

Something went wrong and server could not process your request.

' + 11 | '

Try going back to our Home page

' 12 | }] 13 | }); 14 | -------------------------------------------------------------------------------- /modern/src/view/pages/ErrorBase.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.pages.ErrorBase', { 2 | extend: 'Ext.Container', 3 | 4 | requires: [ 5 | 'Ext.layout.VBox' 6 | ], 7 | 8 | layout: { 9 | type:'vbox', 10 | align: 'center', 11 | pack: 'center' 12 | }, 13 | 14 | cls: 'error-page-container', 15 | 16 | defaults:{ 17 | xtype: 'label' 18 | } 19 | }); -------------------------------------------------------------------------------- /modern/src/view/phone/email/Compose.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.phone.email.Compose', { 2 | extend: 'Ext.form.Panel', 3 | // xtype: 'compose', -- set by profile 4 | cls: 'email-compose', 5 | 6 | requires: [ 7 | 'Ext.Button', 8 | 'Ext.field.Text', 9 | 'Ext.field.TextArea' 10 | ], 11 | 12 | layout: 'vbox', 13 | padding: 20, 14 | scrollable: false, 15 | 16 | title: 'Compose', 17 | 18 | tools: [{ 19 | iconCls: 'x-fa fa-send', 20 | handler: 'onSendMessage' 21 | }], 22 | 23 | items: [{ 24 | xtype: 'textfield', 25 | placeHolder: 'To', 26 | reference: 'toField', 27 | name: 'to', 28 | margin: '0 0 20 0' 29 | }, { 30 | xtype: 'textfield', 31 | placeHolder: 'Subject', 32 | name: 'subject', 33 | margin: '0 0 20 0' 34 | }, { 35 | xtype: 'textareafield', 36 | placeHolder: 'Content', 37 | name: 'message', 38 | flex: 1, 39 | margin: '0 0 10 0' 40 | }, { 41 | xtype: 'container', 42 | layout: 'hbox', 43 | height: 40, 44 | userCls: 'compose-email-tool', 45 | 46 | items: [{ 47 | xtype: 'component', 48 | flex: 1 49 | }, { 50 | xtype: 'button', 51 | ui: 'header', 52 | iconCls: 'x-fa fa-floppy-o' 53 | }, { 54 | xtype: 'button', 55 | ui: 'header', 56 | padding: '0 12', 57 | iconCls: 'x-fa fa-paperclip' 58 | }, { 59 | xtype: 'button', 60 | ui: 'header', 61 | padding: '0 12', 62 | iconCls: 'x-fa fa-trash', 63 | handler: 'onCloseMessage' 64 | }] 65 | }] 66 | }); 67 | -------------------------------------------------------------------------------- /modern/src/view/phone/email/Email.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.phone.email.Email', { 2 | extend: 'Ext.Container', 3 | 4 | controller: 'email-phone', 5 | viewModel: { 6 | type: 'email' 7 | }, 8 | 9 | layout: { 10 | type: 'hbox', 11 | align: 'stretch' 12 | }, 13 | 14 | listeners: { 15 | element: 'element', 16 | edgeswipeend: 'onSwipe' 17 | }, 18 | 19 | items: [ 20 | { 21 | xtype: 'button', 22 | iconCls:'x-fa fa-plus', 23 | ui: 'bright-blue round', 24 | userCls: 'pop-out', 25 | bind: { 26 | hidden: '{["\{composing\}"]}' 27 | }, 28 | width: 50, 29 | height: 50, 30 | 31 | // These cause the button to be floated / absolute positioned 32 | bottom: 10, 33 | right: 10, 34 | 35 | handler: 'onPlusButtonTap', 36 | listeners: { 37 | scope: 'controller', 38 | element: 'element', 39 | longpress: 'onLongPressCompose' 40 | } 41 | }, 42 | { 43 | xtype: 'inbox', 44 | flex: 1, 45 | bind: { 46 | store: '{["\{inbox\}"]}', 47 | hidden: '{["\{composing\}"]}' 48 | }, 49 | reference: 'messages', 50 | 51 | listeners: { 52 | select: 'onSelectMessage' 53 | } 54 | } 55 | ] 56 | }); 57 | -------------------------------------------------------------------------------- /modern/src/view/phone/email/EmailController.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.phone.email.EmailController', { 2 | extend: '{appName}.view.email.EmailController', 3 | 4 | alias: 'controller.email-phone', 5 | 6 | closeComposer: function () { 7 | var me = this, 8 | composer = me.composer, 9 | view = me.getView(), 10 | viewModel = me.getViewModel(); 11 | 12 | if (composer) { 13 | view.remove(composer); 14 | me.composer = null; 15 | 16 | viewModel.set('composing', false); 17 | } 18 | }, 19 | 20 | onPlusButtonTap: function() { 21 | if (!this.actionsVisible) { 22 | this.doCompose(); 23 | } 24 | }, 25 | 26 | doCompose: function (to) { 27 | var me = this, 28 | composer = me.composer, 29 | view = me.getView(), 30 | viewModel = me.getViewModel(), 31 | toField; 32 | 33 | me.hideActions(); 34 | 35 | if (!composer) { 36 | me.composer = composer = view.add({ 37 | xtype: 'compose', 38 | flex: 1 39 | }); 40 | 41 | if (to) { 42 | toField = me.lookupReference('toField'); 43 | toField.setValue(to); 44 | } 45 | 46 | viewModel.set('composing', true); 47 | } 48 | }, 49 | 50 | onChangeFilter: function (sender) { 51 | this.hideActions(); 52 | this.callParent(arguments); 53 | }, 54 | 55 | onCloseMessage: function () { 56 | this.closeComposer(); 57 | }, 58 | 59 | onLongPressCompose: function (e) { 60 | this.showActions(); 61 | }, 62 | 63 | onSendMessage: function () { 64 | this.closeComposer(); 65 | }, 66 | 67 | onSwipe: function (event) { 68 | if (event.direction === 'left') { 69 | this.showActions(); 70 | } 71 | } 72 | }); 73 | -------------------------------------------------------------------------------- /modern/src/view/phone/email/Inbox.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.phone.email.Inbox', { 2 | extend: 'Ext.dataview.DataView', 3 | // xtype is assigned by the phone profile 4 | 5 | itemTpl: 6 | '
'+ 7 | '
'+ 8 | '
{from}
'+ 9 | '
'+ 10 | ''+ 11 | ''+ 12 | ''+ 13 | '{received_on\:date("M d")}'+ 14 | '
'+ 15 | '
'+ 16 | '
'+ 17 | '
{title}
'+ 18 | '
'+ 19 | ''+ 20 | ''+ 21 | ''+ 22 | ''+ 23 | ''+ 24 | '
'+ 25 | '
' + 26 | '
' 27 | }); 28 | -------------------------------------------------------------------------------- /modern/src/view/phone/search/Users.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.phone.search.Users', { 2 | extend: 'Ext.dataview.DataView', 3 | // xtype:'userssearch', set by phone profile 4 | 5 | itemTpl: 6 | '
'+ 7 | '
' + 8 | '' + 10 | '
'+ 11 | '
'+ 12 | '
{fullname}
'+ 13 | '
{email}
'+ 14 | '
{joinDate:date("M d")}
'+ 15 | '
'+ 16 | '
' 17 | }); 18 | -------------------------------------------------------------------------------- /modern/src/view/profile/ShareUpdate.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.profile.ShareUpdate', { 2 | extend: 'Ext.Panel', 3 | xtype: 'profileshare', 4 | 5 | requires: [ 6 | 'Ext.Button', 7 | 'Ext.field.Text', 8 | 'Ext.Toolbar' 9 | ], 10 | 11 | padding: 10, 12 | layout: 'fit', 13 | 14 | cls: 'share-panel', 15 | 16 | items: [ 17 | { 18 | xtype: 'textareafield', 19 | placeHolder: "What's on your mind?" 20 | }, 21 | { 22 | xtype: 'toolbar', 23 | docked: 'bottom', 24 | defaults : { 25 | margin:'0 10 5 0' 26 | }, 27 | 28 | items: [ 29 | { 30 | iconCls: 'x-fa fa-video-camera', 31 | ui: 'header' 32 | }, 33 | { 34 | iconCls: 'x-fa fa-camera', 35 | ui: 'header' 36 | }, 37 | { 38 | iconCls: 'x-fa fa-file', 39 | ui: 'header' 40 | }, 41 | '->', 42 | { 43 | text: 'Share', 44 | ui: 'soft-blue' 45 | } 46 | ] 47 | } 48 | ] 49 | }); 50 | -------------------------------------------------------------------------------- /modern/src/view/profile/UserProfile.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.profile.UserProfile', { 2 | extend: '{appName}.view.profile.UserProfileBase', 3 | xtype: 'profile', 4 | cls: 'userProfile-container dashboard', 5 | 6 | scrollable: 'y', 7 | 8 | items: [ 9 | { 10 | xtype: 'profileshare', 11 | 12 | userCls: 'big-100 small-100 dashboard-item shadow' 13 | }, 14 | { 15 | xtype: 'profilesocial', 16 | 17 | userCls: 'big-50 small-100 dashboard-item shadow' 18 | }, 19 | { 20 | xtype: 'profiledescription', 21 | 22 | userCls: 'big-50 small-100 dashboard-item shadow' 23 | }, 24 | { 25 | xtype: 'profilenotifications', 26 | 27 | userCls: 'big-50 small-100 dashboard-item shadow' 28 | }, 29 | { 30 | xtype: 'profiletimeline', 31 | 32 | userCls: 'big-50 small-100 dashboard-item shadow' 33 | } 34 | ] 35 | }); 36 | -------------------------------------------------------------------------------- /modern/src/view/search/All.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.search.All', { 2 | extend: 'Ext.dataview.DataView', 3 | xtype: 'allresults', 4 | 5 | cls: 'search-all', 6 | 7 | selectedCls: 'search-result-item-selected', 8 | 9 | itemTpl: '
' + 10 | '
{title}
'+ 11 | '
{url}
'+ 12 | '
{content}
'+ 13 | ' '+ 14 | '{title}' + 15 | ''+ 16 | '
' 17 | }); 18 | -------------------------------------------------------------------------------- /modern/src/view/search/Results.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.search.Results', { 2 | extend: 'Ext.tab.Panel', 3 | xtype:'searchresults', 4 | 5 | activeTab: 0, 6 | viewModel: { 7 | type: 'searchresults' 8 | }, 9 | 10 | items: [{ 11 | title: 'All', 12 | xtype: 'allresults', 13 | bind: { 14 | store: '{["\{results\}"]}' 15 | } 16 | },{ 17 | title: 'Users', 18 | xtype: 'searchusers', 19 | 20 | bind: { 21 | store: '{["\{users\}"]}' 22 | } 23 | },{ 24 | title: 'Messages', 25 | xtype: 'container', 26 | layout: 'fit', 27 | items: [{ 28 | xtype: 'inbox', 29 | hideHeaders: true, 30 | bind: '{["\{inbox\}"]}' 31 | }] 32 | }] 33 | }); 34 | -------------------------------------------------------------------------------- /modern/src/view/search/ResultsModel.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.search.ResultsModel', { 2 | extend: 'Ext.app.ViewModel', 3 | 4 | alias: 'viewmodel.searchresults', 5 | 6 | stores: { 7 | results: { 8 | type: 'searchresults' 9 | }, 10 | 11 | users: { 12 | type: 'searchusers' 13 | }, 14 | 15 | inbox: { 16 | type: 'inbox' 17 | } 18 | } 19 | }); 20 | -------------------------------------------------------------------------------- /modern/src/view/tablet/email/Compose.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.tablet.email.Compose', { 2 | extend: 'Ext.form.Panel', 3 | // xtype: 'compose', -- set by profile 4 | cls: 'email-compose', 5 | 6 | requires: [ 7 | 'Ext.Button', 8 | 'Ext.field.Text', 9 | 'Ext.field.TextArea' 10 | ], 11 | 12 | layout: 'vbox', 13 | padding: 20, 14 | 15 | title: 'Compose', 16 | scrollable: false, 17 | 18 | tools: [{ 19 | iconCls: 'x-fa fa-close', 20 | handler: 'onCloseMessage' 21 | }], 22 | 23 | items: [{ 24 | xtype: 'textfield', 25 | placeHolder: 'To', 26 | reference: 'toField', 27 | name: 'to', 28 | margin: '0 0 20 0' 29 | }, { 30 | xtype: 'textfield', 31 | placeHolder: 'Subject', 32 | name: 'subject', 33 | margin: '0 0 20 0' 34 | }, { 35 | xtype: 'textareafield', 36 | placeHolder: 'Content', 37 | name: 'message', 38 | flex: 1, 39 | margin: '0 0 10 0' 40 | }, { 41 | xtype: 'container', 42 | layout: 'hbox', 43 | height: 40, 44 | userCls: 'compose-email-tool', 45 | 46 | items: [{ 47 | xtype: 'button', 48 | ui: 'header', 49 | padding: '0 12', 50 | iconCls: 'x-fa fa-floppy-o' 51 | }, { 52 | xtype: 'button', 53 | ui: 'header', 54 | padding: '0 12', 55 | iconCls: 'x-fa fa-paperclip' 56 | }, { 57 | xtype: 'component', 58 | flex: 1 59 | }, { 60 | xtype: 'button', 61 | ui: 'decline', 62 | text: 'Discard', 63 | minWidth: '6rem', 64 | margin: '0 12 0 0', 65 | handler: 'onCloseMessage' 66 | }, { 67 | xtype: 'button', 68 | ui: 'confirm', 69 | text: 'Send', 70 | minWidth: '6rem', 71 | handler: 'onSendMessage' 72 | }] 73 | }] 74 | }); 75 | -------------------------------------------------------------------------------- /modern/src/view/tablet/email/EmailController.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.tablet.email.EmailController', { 2 | extend: '{appName}.view.email.EmailController', 3 | 4 | alias: 'controller.email-tablet', 5 | 6 | closeComposer: function () { 7 | var composer = this.composer; 8 | 9 | if (composer) { 10 | this.composer = null; 11 | composer.destroy(); 12 | } 13 | }, 14 | 15 | doCompose: function (to) { 16 | var me = this, 17 | composer = me.composer, 18 | view = me.getView(), 19 | toField; 20 | 21 | me.hideActions(); 22 | 23 | if (!composer) { 24 | me.composer = composer = Ext.Viewport.add({ 25 | xtype: 'compose', 26 | modal: true, 27 | centered: true, 28 | ownerCt: view, 29 | width: '80%', 30 | height: '80%' 31 | }); 32 | 33 | if (to) { 34 | toField = me.lookupReference('toField'); 35 | toField.setValue(to); 36 | } 37 | } 38 | 39 | composer.show(); 40 | }, 41 | 42 | onChangeFilter: function() { 43 | this.hideActions(); 44 | this.callParent(arguments); 45 | }, 46 | 47 | onSwipe: function (event) { 48 | if (this.lookup('controls').isHidden() && event.direction === 'left') { 49 | this.showActions(); 50 | } 51 | }, 52 | 53 | onCloseMessage: function () { 54 | this.closeComposer(); 55 | }, 56 | 57 | onSendMessage: function () { 58 | this.closeComposer(); 59 | } 60 | }); 61 | -------------------------------------------------------------------------------- /modern/src/view/widgets/FollowMessage.js.tpl.default: -------------------------------------------------------------------------------- 1 | /** 2 | * This class is a custom toolbar intended for use as a BioTile footer. 3 | */ 4 | Ext.define('{appName}.view.widgets.FollowMessage', { 5 | extend: 'Ext.Toolbar', 6 | xtype: 'followmessage', 7 | border: false, 8 | 9 | /** 10 | * @event follow 11 | */ 12 | /** 13 | * @event message 14 | */ 15 | 16 | layout: { 17 | pack: 'center' 18 | }, 19 | 20 | defaults: { 21 | margin: '2 6' 22 | }, 23 | 24 | items: [{ 25 | text: 'Follow', 26 | ui: 'soft-green', 27 | 28 | handler: function () { 29 | var parent = this.getParent(); 30 | parent.fireEvent('follow', parent); 31 | } 32 | }, { 33 | text: 'Message', 34 | ui: 'soft-blue', 35 | 36 | handler: function () { 37 | var parent = this.getParent(); 38 | parent.fireEvent('message', parent); 39 | } 40 | }] 41 | }); 42 | -------------------------------------------------------------------------------- /modern/src/view/widgets/SocialBar.js.tpl.default: -------------------------------------------------------------------------------- 1 | /** 2 | * This class is a custom toolbar intended for use as a BioTile footer. 3 | */ 4 | Ext.define('{appName}.view.widgets.SocialBar', { 5 | extend: 'Ext.Toolbar', 6 | xtype: 'socialbar', 7 | border: false, 8 | 9 | /** 10 | * @event facebook 11 | */ 12 | /** 13 | * @event twitter 14 | */ 15 | /** 16 | * @event googleplus 17 | */ 18 | /** 19 | * @event email 20 | */ 21 | 22 | layout: { 23 | pack: 'center' 24 | }, 25 | 26 | defaults: { 27 | border: false, 28 | margin: '2 3' 29 | }, 30 | 31 | items: [{ 32 | ui: 'facebook', 33 | iconCls: 'x-fa fa-facebook', 34 | 35 | handler: function () { 36 | var parent = this.getParent(); 37 | parent.fireEvent('facebook', parent); 38 | } 39 | }, { 40 | ui: 'soft-cyan', 41 | iconCls: 'x-fa fa-twitter', 42 | 43 | handler: function () { 44 | var parent = this.getParent(); 45 | parent.fireEvent('twitter', parent); 46 | } 47 | }, { 48 | ui: 'soft-red', 49 | iconCls: 'x-fa fa-google-plus', 50 | 51 | handler: function () { 52 | var parent = this.getParent(); 53 | parent.fireEvent('googleplus', parent); 54 | } 55 | }, { 56 | ui: 'soft-purple', 57 | iconCls: 'x-fa fa-envelope', 58 | 59 | handler: function () { 60 | var parent = this.getParent(); 61 | parent.fireEvent('email', parent); 62 | } 63 | }] 64 | }); 65 | -------------------------------------------------------------------------------- /modern/src/view/widgets/SocialStatus.js.tpl.default: -------------------------------------------------------------------------------- 1 | /** 2 | * This class is a custom toolbar intended for use as a BioTile footer. 3 | */ 4 | Ext.define('{appName}.view.widgets.SocialStatus', { 5 | extend: 'Ext.Toolbar', 6 | xtype: 'socialstatus', 7 | border: false, 8 | 9 | config: { 10 | format: '0,000', 11 | 12 | followers: null, 13 | 14 | following: null, 15 | 16 | likes: null 17 | }, 18 | 19 | referenceHolder: true, // all logic is our updaters, we'll hold the refs (no controller) 20 | 21 | items: [{ 22 | xtype: 'component', 23 | flex: 1, 24 | reference: 'following', 25 | userCls: 'social-status-category', 26 | html: '
Following
' + 27 | '
3
' 28 | }, { 29 | xtype: 'component', 30 | flex: 1, 31 | reference: 'followers', 32 | userCls: 'social-status-category', 33 | html: '
Followers
' + 34 | '
1
' 35 | }, { 36 | xtype: 'component', 37 | flex: 1, 38 | reference: 'likes', 39 | userCls: 'social-status-category', 40 | html: '
Likes
' + 41 | '
2
' 42 | }], 43 | 44 | updateFollowers: function (value) { 45 | this.setCount('followers', value); 46 | }, 47 | 48 | updateFollowing: function (value) { 49 | this.setCount('following', value); 50 | }, 51 | 52 | updateLikes: function (value) { 53 | this.setCount('likes', value); 54 | }, 55 | 56 | privates: { 57 | setCount: function (name, value) { 58 | var component = this.lookup(name), 59 | el = component.element.down('.social-status-count'), 60 | format = this.getFormat(); 61 | 62 | el.dom.textContent = Ext.util.Format.number(value, format); 63 | } 64 | } 65 | }); 66 | -------------------------------------------------------------------------------- /modern/src/view/widgets/WidgetsController.js.tpl.default: -------------------------------------------------------------------------------- 1 | Ext.define('{appName}.view.widgets.WidgetsController', { 2 | extend: 'Ext.app.ViewController', 3 | alias: 'controller.widgets', 4 | 5 | onFollow: function (sender) { 6 | // TODO 7 | }, 8 | 9 | onMessage: function (sender) { 10 | // TODO 11 | }, 12 | 13 | onContactFacebook: function (sender) { 14 | // TODO 15 | }, 16 | 17 | onContactTwitter: function (sender) { 18 | // TODO 19 | }, 20 | 21 | onContactGooglePlus: function (sender) { 22 | // TODO 23 | }, 24 | 25 | onContactEmail: function (sender) { 26 | // TODO 27 | } 28 | }); 29 | -------------------------------------------------------------------------------- /resources/images/checkbox.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/checkbox.png -------------------------------------------------------------------------------- /resources/images/company-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/company-logo.png -------------------------------------------------------------------------------- /resources/images/custom-bar.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/custom-bar.gif -------------------------------------------------------------------------------- /resources/images/error-page-background.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/error-page-background.jpg -------------------------------------------------------------------------------- /resources/images/flag-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/flag-icon.png -------------------------------------------------------------------------------- /resources/images/form/checkbox.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/form/checkbox.png -------------------------------------------------------------------------------- /resources/images/form/radio.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/form/radio.png -------------------------------------------------------------------------------- /resources/images/friends/f1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/friends/f1.png -------------------------------------------------------------------------------- /resources/images/friends/f10.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/friends/f10.png -------------------------------------------------------------------------------- /resources/images/friends/f11.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/friends/f11.png -------------------------------------------------------------------------------- /resources/images/friends/f12.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/friends/f12.png -------------------------------------------------------------------------------- /resources/images/friends/f13.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/friends/f13.png -------------------------------------------------------------------------------- /resources/images/friends/f14.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/friends/f14.png -------------------------------------------------------------------------------- /resources/images/friends/f15.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/friends/f15.png -------------------------------------------------------------------------------- /resources/images/friends/f16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/friends/f16.png -------------------------------------------------------------------------------- /resources/images/friends/f17.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/friends/f17.png -------------------------------------------------------------------------------- /resources/images/friends/f2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/friends/f2.png -------------------------------------------------------------------------------- /resources/images/friends/f3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/friends/f3.png -------------------------------------------------------------------------------- /resources/images/friends/f4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/friends/f4.png -------------------------------------------------------------------------------- /resources/images/friends/f5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/friends/f5.png -------------------------------------------------------------------------------- /resources/images/friends/f6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/friends/f6.png -------------------------------------------------------------------------------- /resources/images/friends/f7.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/friends/f7.png -------------------------------------------------------------------------------- /resources/images/friends/f8.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/friends/f8.png -------------------------------------------------------------------------------- /resources/images/friends/f9.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/friends/f9.png -------------------------------------------------------------------------------- /resources/images/icons/cloud-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/icons/cloud-icon.png -------------------------------------------------------------------------------- /resources/images/icons/hot-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/icons/hot-icon.png -------------------------------------------------------------------------------- /resources/images/icons/hot-icon1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/icons/hot-icon1.png -------------------------------------------------------------------------------- /resources/images/icons/new-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/icons/new-icon.png -------------------------------------------------------------------------------- /resources/images/icons/new-icon1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/icons/new-icon1.png -------------------------------------------------------------------------------- /resources/images/img1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/img1.jpg -------------------------------------------------------------------------------- /resources/images/img2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/img2.jpg -------------------------------------------------------------------------------- /resources/images/img3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/img3.jpg -------------------------------------------------------------------------------- /resources/images/img4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/img4.jpg -------------------------------------------------------------------------------- /resources/images/lock-screen-background.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/lock-screen-background.jpg -------------------------------------------------------------------------------- /resources/images/profile-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/profile-icon.png -------------------------------------------------------------------------------- /resources/images/radio.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/radio.png -------------------------------------------------------------------------------- /resources/images/user-profile/1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/1.png -------------------------------------------------------------------------------- /resources/images/user-profile/10.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/10.png -------------------------------------------------------------------------------- /resources/images/user-profile/11.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/11.png -------------------------------------------------------------------------------- /resources/images/user-profile/12.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/12.png -------------------------------------------------------------------------------- /resources/images/user-profile/13.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/13.png -------------------------------------------------------------------------------- /resources/images/user-profile/14.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/14.png -------------------------------------------------------------------------------- /resources/images/user-profile/15.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/15.png -------------------------------------------------------------------------------- /resources/images/user-profile/16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/16.png -------------------------------------------------------------------------------- /resources/images/user-profile/17.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/17.png -------------------------------------------------------------------------------- /resources/images/user-profile/18.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/18.png -------------------------------------------------------------------------------- /resources/images/user-profile/19.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/19.png -------------------------------------------------------------------------------- /resources/images/user-profile/1_.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/1_.png -------------------------------------------------------------------------------- /resources/images/user-profile/2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/2.png -------------------------------------------------------------------------------- /resources/images/user-profile/20.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/20.png -------------------------------------------------------------------------------- /resources/images/user-profile/2_.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/2_.png -------------------------------------------------------------------------------- /resources/images/user-profile/3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/3.png -------------------------------------------------------------------------------- /resources/images/user-profile/3_.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/3_.png -------------------------------------------------------------------------------- /resources/images/user-profile/4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/4.png -------------------------------------------------------------------------------- /resources/images/user-profile/4_.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/4_.png -------------------------------------------------------------------------------- /resources/images/user-profile/5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/5.png -------------------------------------------------------------------------------- /resources/images/user-profile/6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/6.png -------------------------------------------------------------------------------- /resources/images/user-profile/7.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/7.png -------------------------------------------------------------------------------- /resources/images/user-profile/8.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/8.png -------------------------------------------------------------------------------- /resources/images/user-profile/9.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/9.png -------------------------------------------------------------------------------- /resources/images/user-profile/mitul.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/mitul.jpg -------------------------------------------------------------------------------- /resources/images/user-profile/mitul1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syscobra/extjs-admin-dashboard-template/ce3c3280f5f8a1164894d50bb648468723359e4b/resources/images/user-profile/mitul1.jpg -------------------------------------------------------------------------------- /sass/Readme.md.tpl.default: -------------------------------------------------------------------------------- 1 | # ./sass 2 | 3 | This folder contains the styling for the application's views. 4 | 5 | ## Styling 6 | 7 | Sencha Cmd supports styling using Sass and integrates the styling from the theme 8 | and required packages (specified in `"app.json"`) with application-defined views. 9 | 10 | ### ./sass/etc 11 | 12 | This folder contains misc. support code for Sass builds (global functions, etc.). 13 | 14 | ### ./sass/src 15 | 16 | This folder contains Sass files defining CSS rules corresponding to classes 17 | included in the application's JavaScript code build. By default, files in this 18 | folder are mapped to the application's root namespace, '{appName}'. This is set in 19 | `"app.json"`: 20 | 21 | "sass": { 22 | "namespace": "{appName}" 23 | } 24 | 25 | ### ./sass/var 26 | 27 | This folder contains Sass files defining Sass variables corresponding to classes 28 | included in the application's JavaScript code build. By default, files in this 29 | folder are mapped to the application's root namespace, '{appName}' in the same way 30 | as `"{appName}/sass/src"`. 31 | 32 | ## Slicing 33 | 34 | Internet Explorer 8 and 9 do not support linear gradients and IE8 does not support 35 | border-radius. To compensate for this, Sencha Cmd provides "image slicing" using an 36 | internal WebKit based renderer. To enable this, there is a special web page that 37 | renders all components and states so they can be captured and turned into image 38 | sprites. 39 | 40 | ### ./sass/example 41 | 42 | This folder contains the web page used to present all components and states so they 43 | can be captured as an image and used to produce images for IE8 and 9. 44 | 45 | This web page is also helpful when loaded in Chrome to view all components in their 46 | styled form. 47 | -------------------------------------------------------------------------------- /sass/config.rb: -------------------------------------------------------------------------------- 1 | cur_dir = File.dirname(__FILE__) 2 | output_style = :nested 3 | -------------------------------------------------------------------------------- /sass/etc/all.scss: -------------------------------------------------------------------------------- 1 | /* 2 | * This is is imported by virtue of "sass.etc" in "app.json". 3 | */ 4 | -------------------------------------------------------------------------------- /sass/example/bootstrap.css.tpl.default: -------------------------------------------------------------------------------- 1 | /** 2 | * This file is generated by Sencha Cmd and should NOT be edited. It will 3 | * redirect to the most recently built example css file for the application to 4 | * support capture of theme background, frame, and corner images for non-CSS3 5 | * browsers. 6 | */ 7 | @import '../../bootstrap.css'; -------------------------------------------------------------------------------- /sass/example/custom.js.default: -------------------------------------------------------------------------------- 1 | /* 2 | * This file is generated as a starting point by Sencha Cmd - it will not be replaced or 3 | * updated by "sencha package upgrade". 4 | * 5 | * This file can be removed and the script tag in theme.html removed if this theme does 6 | * not need custom additional manifest or shortcut entries. These are documented in 7 | * ./packages/ext-theme-base/sass/example/render.js. 8 | */ 9 | 10 | //Ext.theme.addManifest(); 11 | 12 | //Ext.theme.addShortcuts(); 13 | -------------------------------------------------------------------------------- /sass/src/Application.scss: -------------------------------------------------------------------------------- 1 | // iOS native app status bar does not take up space, so we need to pad out the application by 20px 2 | // in order to bring the app below it. 3 | body.x-ios.x-webview.x-portrait { 4 | margin-top: 20px; 5 | } -------------------------------------------------------------------------------- /sass/src/view/dashboard/Weather.scss: -------------------------------------------------------------------------------- 1 | .weather-panel { 2 | background: #fff; 3 | } 4 | 5 | .weather-image-container { 6 | height: 80px; 7 | width: 100px; 8 | float: left; 9 | background: #82d9EA; 10 | text-align: center; 11 | padding-top: 20px; 12 | } 13 | 14 | .weather-details-container { 15 | color: $progress-bar-background-color; 16 | line-height: 20px; 17 | float: left; 18 | padding: 20px; 19 | 20 | :first-child{ 21 | margin-bottom: 4px; 22 | font-size: 30px; 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /sass/src/view/forms/SpecialOffer.scss: -------------------------------------------------------------------------------- 1 | .forms-specialoffer { 2 | background-color: $wizard-primary-background-color; 3 | color: #fff; 4 | text-align: center; 5 | position: relative; 6 | 7 | h3 { 8 | font-size: 24px; 9 | font-weight: 300; 10 | margin-bottom: 10px; 11 | } 12 | } 13 | 14 | .specialoffer-outer { 15 | position: absolute; 16 | top: 0; 17 | right: 0; 18 | bottom: 0; 19 | left: 0; 20 | padding: 0 1.4em; 21 | } 22 | 23 | .specialoffer-outer:before { 24 | content: ''; 25 | display: inline-block; 26 | vertical-align: middle; 27 | height: 100%; 28 | } 29 | 30 | .specialoffer-inner { 31 | display: inline-block; 32 | vertical-align: middle; 33 | } 34 | 35 | .specialoffer-icon-wrap { 36 | background-color: rgba(255, 255, 255, 0.1); 37 | padding: 1.2em; 38 | height: 100px; 39 | width: 100px; 40 | display: inline-block; 41 | } 42 | 43 | .specialoffer-text { 44 | font-weight: 400; 45 | margin: 1em 0; 46 | } 47 | 48 | .specialoffer-discount { 49 | font-weight: 700; 50 | font-size: 1.2em; 51 | } 52 | 53 | .specialoffer-link { 54 | padding: 1em 1.2em .3em; 55 | font-size: 1.2em; 56 | color: #fff; 57 | text-decoration: none; 58 | } 59 | 60 | .specialoffer-link:before { 61 | padding-right: 0.5em; 62 | } 63 | -------------------------------------------------------------------------------- /sass/src/view/main/Main.scss: -------------------------------------------------------------------------------- 1 | .shadow { 2 | @include box-shadow(0 1px 2px 0 rgba(0,0,0,0.2)); 3 | } 4 | 5 | .nav-tree-badge:after { 6 | position: absolute; 7 | height: 18px; 8 | width: 3.3em; 9 | display: inline-block; 10 | text-align: center; 11 | top: 50%; 12 | margin-top: -9px; 13 | right: 12px; 14 | color: #fff; 15 | font-weight: 600; 16 | font-size: 10px; 17 | line-height: 18px; 18 | } 19 | 20 | .nav-tree-badge-hot:after { 21 | content: "HOT"; 22 | background-color: #e3495a; 23 | } 24 | 25 | .nav-tree-badge-new:after { 26 | content: "NEW"; 27 | background-color: $color-soft-blue; 28 | } 29 | 30 | .pop-out { 31 | @include box-shadow(2px 2px 8px 2px #ccc); 32 | } 33 | 34 | .circular { 35 | border-radius: 50%; 36 | } 37 | 38 | -------------------------------------------------------------------------------- /sass/src/view/search/Results.scss: -------------------------------------------------------------------------------- 1 | .search-result-attachment { 2 | width: 160px; 3 | height: 100px; 4 | } 5 | -------------------------------------------------------------------------------- /sass/var/all.scss: -------------------------------------------------------------------------------- 1 | /* 2 | * This file defines variables used throughout the application for modern and 3 | * classic builds. 4 | */ 5 | 6 | $panel-navigation-background-color: #32404e; 7 | $panel-navigation-item-line-height: 64px; 8 | $panel-navigation-item-text-color: #ADB3B8; 9 | 10 | $progress-bar-background-color: #458fd2; 11 | 12 | //Form and Toolbar Button UI colors 13 | 14 | $color-blue: #167abc; 15 | $color-soft-cyan: #03b4d5; 16 | $color-soft-blue: #2eadf5; 17 | $color-soft-green: #9cc96b; 18 | $color-soft-orange: #ffc107; 19 | $color-soft-red: #e44959; 20 | $color-soft-purple: #925e8b; 21 | $color-gray: #949495; 22 | $color-green: #16b603; 23 | 24 | $chart-icon-background-color: #f1f1f1; 25 | 26 | $grid-item-edit-btn-color: #e9e9e9; 27 | $grid-item-close-btn-color: #fc8999; 28 | $grid-item-ban-btn-color: #ffc000; 29 | $legend-research: #6aa5db; 30 | $legend-marketing: #ee929c; 31 | 32 | $force-background-color: #56B750; 33 | 34 | //---------------------------------------------------- 35 | // Wizards 36 | 37 | $wizard-primary-background-color: #579ddb; 38 | $wizard-button-background-color: #579ddb; 39 | 40 | $wizard-two-primary-background-color: #986291; 41 | $wizard-two-button-background-color: #925e8b; 42 | 43 | $wizard-three-primary-background-color: #9cc96b; 44 | $wizard-three-button-background-color: #9cc96b; 45 | 46 | -------------------------------------------------------------------------------- /sass/var/view/main/Main.scss: -------------------------------------------------------------------------------- 1 | $base-color: #35baf6; 2 | --------------------------------------------------------------------------------