Skip to content

Commit 720e42c

Browse files
mauritslamersmauritslamers
authored
Merge pull request #8 from sproutcore/team/nicolasbadia/aki
 Adds support for new BT and makes Aki the default theme
2 parents 1b23186 + 65339f1 commit 720e42c

File tree

10 files changed

+67
-75
lines changed

10 files changed

+67
-75
lines changed

‎Buildfile‎

Lines changed: 0 additions & 11 deletions
This file was deleted.

‎resources/_theme.css‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,18 @@
11
/*
22
This defines the global $theme variable for use inside your CSS.
33
The $theme variable holds the CSS class names for your theme.
4-
4+
55
You can then theme your app by using CSS like this:
66
77
$theme.button {
88
color: blue;
99
@include slices('white-button.png', $left: 3, $right: 3);
1010
}
11-
11+
1212
Any _theme.css file is prepended to all files inside its directory,
1313
and any subdirectories that don't define their own _theme.css file.
14-
14+
1515
This allows you to give different directories different values for
1616
$theme if you wish.
1717
*/
18-
$theme: '.ace.showcase';
18+
$theme: '.aki.showcase';

‎resources/images/sproutcore-512.png‎

95.8 KB
Loading

‎resources/loading.rhtml‎

Lines changed: 0 additions & 9 deletions
This file was deleted.

‎resources/stylesheet.css‎

Lines changed: 8 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -2,28 +2,22 @@
22
@import "compass/css3/user-interface";
33

44

5-
$theme.sc-source-list.main-source-list {
6-
background-color: #FFF;
7-
8-
.sc-collection-item.even {
9-
background-color: #F7F7F7;
10-
}
11-
}
12-
135
$theme.main-detail-view {
14-
@include background-image(linear-gradient(rgba(255,255,255,0.0), rgba(0,0,0,0.2)));
15-
background-color: #a1a1a1;
6+
background: linear-gradient(rgba(255,255,255,0), rgba(0,0,0,0.2));
167

178
.sc-scroll-view {
18-
@include slice('images/pixels.png', $repeat: repeat);
9+
background-image: sc_static('images/pixels.png');
10+
background-repeat: repeat;
1911
background-color: #8fc4f8;
2012
}
2113
}
2214

2315
$theme.views-list-view {
16+
background: transparent;
2417
}
2518

2619
$theme.views-item-view {
20+
background: transparent;
2721
border-bottom: 1px solid #5d88b6;
2822
border-top: 1px solid #a5d1ff;
2923

@@ -78,8 +72,7 @@ $theme.views-item-view {
7872
}
7973

8074
$theme.demo-view {
81-
@include background-image(sc_static('cross.png'), sc_static('pixels.png'), linear-gradient(top, rgba(255,255,255,0), rgba(255,255,255,0.5)));
82-
background-color: #3a9bee;
75+
background: linear-gradient(rgba(255,255,255,0), rgba(0,0,0,0.2));
8376

8477
.sc-label-view {
8578
&.loading-label {
@@ -93,7 +86,8 @@ $theme.demo-view {
9386
}
9487

9588
$theme.welcome-view {
96-
@include slice('images/pixels.png', $repeat: repeat);
89+
background-image: sc_static('images/pixels.png');
90+
background-repeat: repeat;
9791
background-color: #8fc4f8;
9892
bottom: 0;
9993
left: 0;

‎resources/views_page.js‎

Lines changed: 13 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -45,32 +45,28 @@ Showcase.viewsPage = SC.Page.create({
4545
example: "SC.ButtonView.extend({ layout: { width: 100, height: 24, centerX: 0, centerY: 0 }, themeName: 'capsule', title: 'Click Me' });"
4646
}),
4747
Showcase.ViewsItemContent.create({
48-
title: 'Capsule: SC.SMALL_CONTROL_SIZE',
49-
example: "SC.ButtonView.extend({ controlSize: SC.SMALL_CONTROL_SIZE, layout: { width: 80, height: 18, centerX: 0, centerY: 0 }, themeName: 'capsule', title: 'Click Me' });"
48+
title: 'Dark',
49+
example: "SC.View.extend({ childViews: ['toggle', 'toggleOn', 'toggleOff'], toggle: SC.ButtonView.extend({ buttonBehavior: SC.TOGGLE_BEHAVIOR, layout: { width: 120, height: 24, centerX: -135, centerY: 0 }, themeName: 'dark', title: 'Toggle Me' }), toggleOn: SC.ButtonView.extend({ buttonBehavior: SC.TOGGLE_ON_BEHAVIOR, layout: { width: 120, height: 24, centerX: 0, centerY: 0 }, themeName: 'dark', title: 'Toggle On', value: false }), toggleOff: SC.ButtonView.extend({ buttonBehavior: SC.TOGGLE_OFF_BEHAVIOR, layout: { width: 120, height: 24, centerX: 135, centerY: 0 }, themeName: 'dark', title: 'Toggle Off', value: true }) });"
5050
}),
5151
Showcase.ViewsItemContent.create({
52-
title: 'Capsule: SC.HUGE_CONTROL_SIZE',
53-
example: "SC.ButtonView.extend({ controlSize: SC.HUGE_CONTROL_SIZE, layout: { width: 110, height: 30, centerX: 0, centerY: 0 }, themeName: 'capsule', title: 'Click Me' });"
52+
title: 'Info',
53+
example: "SC.View.extend({ childViews: ['toggle', 'toggleOn', 'toggleOff'], toggle: SC.ButtonView.extend({ buttonBehavior: SC.TOGGLE_BEHAVIOR, layout: { width: 120, height: 24, centerX: -135, centerY: 0 }, themeName: 'info', title: 'Toggle Me' }), toggleOn: SC.ButtonView.extend({ buttonBehavior: SC.TOGGLE_ON_BEHAVIOR, layout: { width: 120, height: 24, centerX: 0, centerY: 0 }, themeName: 'info', title: 'Toggle On', value: false }), toggleOff: SC.ButtonView.extend({ buttonBehavior: SC.TOGGLE_OFF_BEHAVIOR, layout: { width: 120, height: 24, centerX: 135, centerY: 0 }, themeName: 'info', title: 'Toggle Off', value: true }) });"
5454
}),
5555
Showcase.ViewsItemContent.create({
56-
title: 'Capsule: SC.JUMBO_CONTROL_SIZE',
57-
example: "SC.ButtonView.extend({ controlSize: SC.JUMBO_CONTROL_SIZE, layout: { width: 130, height: 44, centerX: 0, centerY: 0 }, themeName: 'capsule', title: 'Click Me' });"
56+
title: 'Success',
57+
example: "SC.View.extend({ childViews: ['toggle', 'toggleOn', 'toggleOff'], toggle: SC.ButtonView.extend({ buttonBehavior: SC.TOGGLE_BEHAVIOR, layout: { width: 120, height: 24, centerX: -135, centerY: 0 }, themeName: 'success', title: 'Toggle Me' }), toggleOn: SC.ButtonView.extend({ buttonBehavior: SC.TOGGLE_ON_BEHAVIOR, layout: { width: 120, height: 24, centerX: 0, centerY: 0 }, themeName: 'success', title: 'Toggle On', value: false }), toggleOff: SC.ButtonView.extend({ buttonBehavior: SC.TOGGLE_OFF_BEHAVIOR, layout: { width: 120, height: 24, centerX: 135, centerY: 0 }, themeName: 'success', title: 'Toggle Off', value: true }) });"
5858
}),
5959
Showcase.ViewsItemContent.create({
60-
title: 'Pointers',
61-
example: "SC.View.extend({ childViews: ['pointLeftButton', 'pointRightButton'], pointLeftButton: SC.ButtonView.extend({ layout: { width: 100, height: 24, centerX: -50, centerY: 0 }, themeName: 'point-left', title: 'Back' }), pointRightButton: SC.ButtonView.extend({ layout: { width: 100, height: 24, centerX: 50, centerY: 0 }, themeName: 'point-right', title: 'Forward' }) });"
60+
title: 'Warning',
61+
example: "SC.View.extend({ childViews: ['toggle', 'toggleOn', 'toggleOff'], toggle: SC.ButtonView.extend({ buttonBehavior: SC.TOGGLE_BEHAVIOR, layout: { width: 120, height: 24, centerX: -135, centerY: 0 }, themeName: 'warning', title: 'Toggle Me' }), toggleOn: SC.ButtonView.extend({ buttonBehavior: SC.TOGGLE_ON_BEHAVIOR, layout: { width: 120, height: 24, centerX: 0, centerY: 0 }, themeName: 'warning', title: 'Toggle On', value: false }), toggleOff: SC.ButtonView.extend({ buttonBehavior: SC.TOGGLE_OFF_BEHAVIOR, layout: { width: 120, height: 24, centerX: 135, centerY: 0 }, themeName: 'warning', title: 'Toggle Off', value: true }) });"
6262
}),
6363
Showcase.ViewsItemContent.create({
64-
title: 'Pointers: SC.SMALL_CONTROL_SIZE',
65-
example: "SC.View.extend({ childViews: ['pointLeftButton', 'pointRightButton'], pointLeftButton: SC.ButtonView.extend({ controlSize: SC.SMALL_CONTROL_SIZE, layout: { width: 80, height: 18, centerX: -40, centerY: 0 }, themeName: 'point-left', title: 'Back' }), pointRightButton: SC.ButtonView.extend({ controlSize: SC.SMALL_CONTROL_SIZE, layout: { width: 80, height: 18, centerX: 40, centerY: 0 }, themeName: 'point-right', title: 'Forward' }) });"
64+
title: 'Danger',
65+
example: "SC.View.extend({ childViews: ['toggle', 'toggleOn', 'toggleOff'], toggle: SC.ButtonView.extend({ buttonBehavior: SC.TOGGLE_BEHAVIOR, layout: { width: 120, height: 24, centerX: -135, centerY: 0 }, themeName: 'danger', title: 'Toggle Me' }), toggleOn: SC.ButtonView.extend({ buttonBehavior: SC.TOGGLE_ON_BEHAVIOR, layout: { width: 120, height: 24, centerX: 0, centerY: 0 }, themeName: 'danger', title: 'Toggle On', value: false }), toggleOff: SC.ButtonView.extend({ buttonBehavior: SC.TOGGLE_OFF_BEHAVIOR, layout: { width: 120, height: 24, centerX: 135, centerY: 0 }, themeName: 'danger', title: 'Toggle Off', value: true }) });"
6666
}),
6767
Showcase.ViewsItemContent.create({
68-
title: 'Pointers: SC.HUGE_CONTROL_SIZE',
69-
example: "SC.View.extend({ childViews: ['pointLeftButton', 'pointRightButton'], pointLeftButton: SC.ButtonView.extend({ controlSize: SC.HUGE_CONTROL_SIZE, layout: { width: 110, height: 30, centerX: -55, centerY: 0 }, themeName: 'point-left', title: 'Back' }), pointRightButton: SC.ButtonView.extend({ controlSize: SC.HUGE_CONTROL_SIZE, layout: { width: 110, height: 30, centerX: 55, centerY: 0 }, themeName: 'point-right', title: 'Forward' }) });"
70-
}),
71-
Showcase.ViewsItemContent.create({
72-
title: 'Pointers: SC.JUMBO_CONTROL_SIZE',
73-
example: "SC.View.extend({ childViews: ['pointLeftButton', 'pointRightButton'], pointLeftButton: SC.ButtonView.extend({ controlSize: SC.JUMBO_CONTROL_SIZE, layout: { width: 130, height: 44, centerX: -65, centerY: 0 }, themeName: 'point-left', title: 'Back' }), pointRightButton: SC.ButtonView.extend({ controlSize: SC.JUMBO_CONTROL_SIZE, layout: { width: 130, height: 44, centerX: 65, centerY: 0 }, themeName: 'point-right', title: 'Forward' }) });"
68+
title: 'Pointers',
69+
example: "SC.View.extend({ childViews: ['pointLeftButton', 'pointRightButton'], pointLeftButton: SC.ButtonView.extend({ layout: { width: 100, height: 24, centerX: -50, centerY: 0 }, themeName: 'point-left', title: 'Back' }), pointRightButton: SC.ButtonView.extend({ layout: { width: 100, height: 24, centerX: 50, centerY: 0 }, themeName: 'point-right', title: 'Forward' }) });"
7470
})
7571
]
7672
})
@@ -266,23 +262,7 @@ Showcase.viewsPage = SC.Page.create({
266262

267263
webViews: Showcase.webViews,
268264

269-
wellViews: SC.ScrollView.design({
270-
contentView: Showcase.ViewsListView.design({
271-
content: [
272-
Showcase.ViewsItemContent.create({
273-
title: 'Regular',
274-
example: "SC.WellView.extend({ layout: { left: 20, right: 20, top: 20, bottom: 20 }, nowShowing: 'blueSampleView', blueSampleView: SC.LabelView.extend({ classNames:['blue-sample-view'], value: 'Blue View' }), redSampleView: SC.LabelView.extend({ classNames:['red-sample-view'], value: 'Red View' }) });",
275-
supportAction: function() {
276-
var containerView = this.getPath('parentView.exampleBox.contentView');
277-
if (containerView.get('nowShowing') === 'blueSampleView') containerView.set('nowShowing', 'redSampleView');
278-
else containerView.set('nowShowing', 'blueSampleView');
279-
},
280-
supportTitle: 'Toggle nowShowing'
281-
})
282-
],
283-
exampleHeight: 315
284-
})
285-
}),
265+
wellViews: Showcase.wellViews,
286266

287267
workspaceViews: Showcase.workspaceViews
288268

‎sc_config‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
2+
BT.AppBuilder.create({
3+
title: 'Showcase',
4+
name: 'showcase',
5+
path: dirname(),
6+
theme: 'sproutcore:aki',
7+
favicon: 'favicon.ico'
8+
});

‎theme.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
//
1717
// NOTE: if you want to change the theme this one is based on, don't
1818
// forget to change the :css_theme property in your buildfile.
19-
Showcase.Theme = SC.AceTheme.create({
19+
Showcase.Theme = SC.AkiTheme.create({
2020
name: 'showcase'
2121
});
2222

‎views/slider_views.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -16,15 +16,15 @@ Showcase.sliderViews = SC.ScrollView.design({
1616
content: [
1717
Showcase.ViewsItemContent.create({
1818
title: 'Regular',
19-
example: "SC.SliderView.extend({ layout: { width: 250, height: 18, centerX: 0, centerY: 0 } })"
19+
example: "SC.SliderView.extend({ layout: { width: 250, height: 18, centerX: 0, centerY: 0 }, markSteps: true })"
2020
}),
2121
// Showcase.ViewsItemContent.create({
2222
// title: 'Tiny',
2323
// example: "SC.SliderView.extend({ controlSize: SC.TINY_CONTROL_SIZE, layout: { width: 250, height: 20, centerX: 0, centerY: 0 } })"
2424
// }),
2525
Showcase.ViewsItemContent.create({
2626
title: 'Small',
27-
example: "SC.SliderView.extend({ controlSize: SC.SMALL_CONTROL_SIZE, layout: { width: 250, height: 16, centerX: 0, centerY: 0 } })"
27+
example: "SC.SliderView.extend({ controlSize: SC.SMALL_CONTROL_SIZE, layout: { width: 250, height: 16, centerX: 0, centerY: 0 }, markSteps: true })"
2828
}),
2929
// Showcase.ViewsItemContent.create({
3030
// title: 'Large',
@@ -36,7 +36,7 @@ Showcase.sliderViews = SC.ScrollView.design({
3636
// }),
3737
Showcase.ViewsItemContent.create({
3838
title: 'Jumbo',
39-
example: "SC.SliderView.extend({ controlSize: SC.JUMBO_CONTROL_SIZE, layout: { width: 250, height: 24, centerX: 0, centerY: 0 } })"
39+
example: "SC.SliderView.extend({ controlSize: SC.JUMBO_CONTROL_SIZE, layout: { width: 250, height: 24, centerX: 0, centerY: 0 }, markSteps: true })"
4040
}),
4141
Showcase.ViewsItemContent.create({
4242
title: 'Continuous',

‎views/well_views.js‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
// ==========================================================================
2+
// Project: Showcase
3+
// Copyright: ©2012 7x7 Software, Inc.
4+
// License: Licensed under MIT license
5+
// ==========================================================================
6+
/*globals Showcase */
7+
sc_require('system/views_item_content.js');
8+
sc_require('views/views_list_view.js');
9+
10+
11+
/**
12+
This pre-configured view demonstrates SC.WellView.
13+
*/
14+
Showcase.wellViews = SC.ScrollView.design({
15+
contentView: Showcase.ViewsListView.design({
16+
content: [
17+
Showcase.ViewsItemContent.create({
18+
title: 'Regular',
19+
example: "SC.WellView.extend({ layout: { left: 20, right: 20, top: 20, bottom: 20 }, nowShowing: 'blueSampleView', blueSampleView: SC.LabelView.extend({ classNames:['blue-sample-view'], value: 'Blue View' }), redSampleView: SC.LabelView.extend({ classNames:['red-sample-view'], value: 'Red View' }) });",
20+
supportAction: function() {
21+
var containerView = this.getPath('parentView.exampleBox.contentView');
22+
if (containerView.get('nowShowing') === 'blueSampleView') containerView.set('nowShowing', 'redSampleView');
23+
else containerView.set('nowShowing', 'blueSampleView');
24+
},
25+
supportTitle: 'Toggle nowShowing'
26+
})
27+
],
28+
exampleHeight: 315
29+
})
30+
});

0 commit comments

Comments
 (0)