Permalink
Browse files

Merge branch '07_create_icon_buttons'

Conflicts:
	public/app/views/actioncard.js
  • Loading branch information...
2 parents f941b50 + 46f3955 commit 62fd8a173b05edcb7f26859c8d7a8c4f096421b5 @nelstrom committed Mar 8, 2011
@@ -6,11 +6,6 @@ ToolbarDemo.views.Viewport = Ext.extend(Ext.TabPanel, {
pack: 'center'
}
},
- dock: 'bottom',
- cardSwitchAnimation: {
- type: 'fade',
- duration: 10
- },
initComponent: function() {
Ext.apply(this, {
items: [
@@ -1,5 +1,5 @@
ToolbarDemo.views.Aboutcard = Ext.extend(Ext.Panel, {
id: 'aboutcard',
+ styleHtmlContent: true,
html: 'Made from coffee'
});
-
@@ -1,90 +1,79 @@
-(function() {
-
- topbar = new Ext.Toolbar({
- title: 'Top toolbar',
- dock: 'top',
- items: [
- {
- text: 'back',
- ui: 'back'
- },
- { xtype: 'spacer' },
- {
- text: 'edit',
- ui: 'action'
+ToolbarDemo.views.topbar = new Ext.Toolbar({
+ title: "Buttons",
+ items: [
+ {
+ iconCls: 'delete', iconMask: true, ui: "plain",
+ handler: function() {
+ ToolbarDemo.views.homecard.tab.setBadge("");
}
- ]
- });
-
- options = new Ext.Toolbar({
- dock: 'top',
- items: [
- {
- xtype: 'segmentedbutton',
- items: [
- { text: 'one' },
- { text: 'two' },
- { text: 'three' },
- ]
+ },
+ { xtype: 'spacer' },
+ {
+ iconCls: 'star', iconMask: true, ui: "plain",
+ handler: function() {
+ var hometab = ToolbarDemo.views.homecard.tab,
+ badgenumber = parseInt(hometab.badgeText),
+ nextnumber = isNaN(badgenumber) ? 1 : badgenumber+1;
+ hometab.setBadge(nextnumber);
}
- ]
- });
-
- textButtonShapes = new Ext.Toolbar({
- dock: 'bottom',
- items: [
- { text: 'back', ui: 'back' },
- { text: 'normal', ui: 'normal' },
- { text: 'small', ui: 'small' },
- { text: 'round', ui: 'round' },
- { text: 'forward', ui: 'forward' },
- ]
- });
+ }
+ ]
+});
- textButtonColors = new Ext.Toolbar({
- dock: 'bottom',
- items: [
- { text: 'normal' },
- { text: 'action', ui: 'action' },
- { text: 'confirm', ui: 'confirm' },
- { text: 'decline', ui: 'decline' },
- ]
- });
+ToolbarDemo.views.textButtonShapes = new Ext.Toolbar({
+ dock: 'bottom',
+ items: [
+ { text: 'back', ui: 'back' },
+ { text: 'normal', ui: 'normal' },
+ { text: 'small', ui: 'small' },
+ { text: 'round', ui: 'round' },
+ { text: 'forward', ui: 'forward' },
+ ]
+});
- mixedTextButtons = new Ext.Toolbar({
- dock: 'bottom',
- items: [
- { text: 'action', ui: 'action-round' },
- { text: 'action', ui: 'action-small' },
- { text: 'confirm', ui: 'confirm-round' },
- { text: 'confirm', ui: 'confirm-small' },
- { text: 'decline', ui: 'decline-round' },
- { text: 'decline', ui: 'decline-small' },
- ]
- });
+ToolbarDemo.views.textButtonColors = new Ext.Toolbar({
+ dock: 'bottom',
+ items: [
+ { text: 'normal' },
+ { text: 'action', ui: 'action' },
+ { text: 'confirm', ui: 'confirm' },
+ { text: 'decline', ui: 'decline' },
+ ]
+});
- imageButtons = new Ext.Toolbar({
- dock: 'bottom',
- items: [
- { iconCls: 'star', iconMask: true },
- { iconCls: 'star', iconMask: true, ui: 'action' },
- { iconCls: 'star', iconMask: true, ui: 'confirm' },
- { iconCls: 'star', iconMask: true, ui: 'decline' },
- { iconCls: 'star', iconMask: true, ui: 'plain' },
- ]
- });
+ToolbarDemo.views.mixedTextButtons = new Ext.Toolbar({
+ dock: 'bottom',
+ items: [
+ { text: 'action', ui: 'action-round' },
+ { text: 'action', ui: 'action-small' },
+ { text: 'confirm', ui: 'confirm-round' },
+ { text: 'confirm', ui: 'confirm-small' },
+ { text: 'decline', ui: 'decline-round' },
+ { text: 'decline', ui: 'decline-small' },
+ ]
+});
- ToolbarDemo.views.Actioncard = Ext.extend(Ext.Panel, {
- title: "action",
- iconCls: "action",
- dockedItems: [
- topbar,
- options,
- textButtonShapes,
- textButtonColors,
- mixedTextButtons,
- imageButtons
- ]
- });
+ToolbarDemo.views.imageButtons = new Ext.Toolbar({
+ dock: 'bottom',
+ items: [
+ { iconCls: 'star', iconMask: true },
+ { iconCls: 'star', iconMask: true, ui: 'action' },
+ { iconCls: 'star', iconMask: true, ui: 'confirm' },
+ { iconCls: 'star', iconMask: true, ui: 'decline' },
+ { iconCls: 'star', iconMask: true, ui: 'plain' },
+ ]
+});
-})();
+ToolbarDemo.views.Actioncard = Ext.extend(Ext.Panel, {
+ title: "action",
+ iconCls: "action",
+ styleHtmlContent: true,
+ html: "placeholder text",
+ dockedItems: [
+ ToolbarDemo.views.topbar,
+ // ToolbarDemo.views.textButtonShapes,
+ // ToolbarDemo.views.textButtonColors,
+ // ToolbarDemo.views.mixedTextButtons,
+ // ToolbarDemo.views.imageButtons
+ ]
+});
@@ -1,4 +1,5 @@
ToolbarDemo.views.Bookmarkcard = Ext.extend(Ext.Panel, {
id: 'bookmarkcard',
+ styleHtmlContent: true,
html: 'Your bookmarks here'
});
@@ -1,19 +1,14 @@
ToolbarDemo.views.Homecard = Ext.extend(Ext.TabPanel, {
title: "home",
iconCls: "home",
- tabBar: {
- dock: 'top'
- },
styleHtmlContent: true,
- dockedItems: [{
- xtype: 'toolbar',
- title: 'Tabs and toolbars'
- }],
items: [{
- title: 'one',
- html: 'one'
+ title: 'TabPanels',
+ scroll: 'vertical',
+ html: '<p>The TabPanel provides a familiar tabbed interface that enables you to switch between different panels. It comes in two distinct flavours. When the tab bar is top-docked, each tab takes on the appearance of a button with a text label. But if you dock the tab bar to the bottom, then each tab button can be assigned an icon, as well as a text label. The icons are styled with an active and inactive state, which has a native look and feel.</p>'
},{
- title: 'two',
- html: 'two'
+ title: 'Toolbars',
+ scroll: 'vertical',
+ html: '<p>Toolbars can be used as a title bar or as a container for buttons, or you can mix and match both of these functions.</p>'
}]
});
@@ -1,13 +1,10 @@
-ToolbarDemo.views.Searchcard = Ext.extend(Ext.form.FormPanel, {
+ToolbarDemo.views.Searchcard = Ext.extend(Ext.Panel, {
title: "search",
iconCls: "search",
+ styleHtmlContent: true,
+ html: "placeholder text",
dockedItems: [{
- xtype: 'toolbar',
- title: 'Search'
- }],
- items: [{
- xtype: 'searchfield',
- name : 'query',
- label: 'Find'
+ xtype: "toolbar",
+ title: "Search"
}]
});
@@ -3,8 +3,8 @@ ToolbarDemo.views.Settingscard = Ext.extend(Ext.form.FormPanel, {
iconCls: "settings",
scroll: "vertical",
dockedItems: [{
- xtype: 'toolbar',
- title: 'Settings'
+ xtype: "toolbar",
+ title: "Settings"
}],
items: [
{

0 comments on commit 62fd8a1

Please sign in to comment.