Skip to content

Commit 4e72e9c

Browse files
refactor: Properly namespace all components / Examples fixup (google#4862)
Achieves consistency between using the overall library and using the components a la carte. * Refactor / Rename all components in source code / tests / docs / examples * Fix up checkbox examples to use form field instead of old checkbox wrapper, which has been removed. Noticed when scanning examples to ensure namespacing didn't break anything. * Add README for material-design-lite and vue example Resolves google#4837 [#131998891]
1 parent f535bc0 commit 4e72e9c

File tree

51 files changed

+261
-183
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

51 files changed

+261
-183
lines changed

demos/checkbox.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -139,7 +139,8 @@ <h2>Dark Theme</h2>
139139
<script>
140140
(function(global) {
141141
'use strict';
142-
var checkbox = new global.mdl.Checkbox(document.getElementById('mdl-js-checkbox'));
142+
var MDLCheckbox = global.mdl.checkbox.MDLCheckbox;
143+
var checkbox = new MDLCheckbox(document.getElementById('mdl-js-checkbox'));
143144
document.getElementById('make-ind').addEventListener('click', function() {
144145
checkbox.indeterminate = true;
145146
});

demos/drawer/temporary-drawer.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -113,7 +113,8 @@ <h1 class="mdl-typography--display1">Temporary Drawer</h1>
113113

114114
<script src="../assets/material-design-lite.js" charset="utf-8"></script>
115115
<script>
116-
var drawer = new mdl.TemporaryDrawer(document.querySelector('.mdl-temporary-drawer'));
116+
var MDLTemporaryDrawer = mdl.drawer.MDLTemporaryDrawer;
117+
var drawer = new MDLTemporaryDrawer(document.querySelector('.mdl-temporary-drawer'));
117118
document.querySelector('.demo-menu').addEventListener('click', function() {
118119
drawer.open = true;
119120
});

demos/icon-toggle.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -133,7 +133,7 @@ <h2>Disabled Icons</h2>
133133

134134
var nodes = document.querySelectorAll('.mdl-icon-toggle');
135135
for (var i = 0, node; node = nodes[i]; i++) {
136-
mdl.IconToggle.attachTo(node);
136+
mdl.iconToggle.MDLIconToggle.attachTo(node);
137137
}
138138

139139
var addToFavorites = document.getElementById('add-to-favorites');

demos/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,8 +36,8 @@
3636
<li><a href="icon-toggle.html">Icon Toggle</a></li>
3737
<li><a href="list.html">List</a></li>
3838
<li><a href="radio.html">Radio</a></li>
39-
<li><a href="snackbar.html">Snackbar</a></li>
4039
<li><a href="ripple.html">Ripple</a></li>
40+
<li><a href="snackbar.html">Snackbar</a></li>
4141
<li><a href="textfield.html">Text Field</a></li>
4242
<li><a href="theme.html">Theme</a></li>
4343
<li><a href="typography.html">Typography</a></li>

demos/radio.html

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -173,9 +173,8 @@ <h2>Disabled</h2>
173173
(function(global) {
174174
'use strict';
175175
var radios = document.querySelectorAll('.mdl-radio:not([data-demo-no-js])');
176-
var components = []
177-
for (var i = 0; i < radios.length; i++) {
178-
components.push(new global.mdl.Radio(radios[i]));
176+
for (var i = 0, radio; radio = radios[i]; i++) {
177+
global.mdl.radio.MDLRadio.attachTo(radio);
179178
}
180179
})(this);
181180
</script>

demos/ripple.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -126,7 +126,7 @@ <h2>Applied to <code>&lt;button&gt; element</h2>
126126
<script>
127127
(function(global) {
128128
[].forEach.call(document.querySelectorAll('.mdl-ripple-surface'), function(surface) {
129-
mdl.Ripple.attachTo(surface);
129+
mdl.ripple.MDLRipple.attachTo(surface);
130130
});
131131
})(this);
132132
</script>

demos/snackbar.html

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -113,8 +113,9 @@ <h2>Basic Example</h2>
113113
<script>
114114
(function(global) {
115115
'use strict';
116-
var snackbar = new global.mdl.Snackbar(document.getElementById('mdl-js-snackbar'));
117-
var rtlSnackbar = new global.mdl.Snackbar(document.getElementById('mdl-rtl-js-snackbar'));
116+
var MDLSnackbar = global.mdl.snackbar.MDLSnackbar;
117+
var snackbar = new MDLSnackbar(document.getElementById('mdl-js-snackbar'));
118+
var rtlSnackbar = new MDLSnackbar(document.getElementById('mdl-rtl-js-snackbar'));
118119
var messageInput = document.getElementById('message');
119120
var actionInput = document.getElementById('action');
120121
var multilineInput = document.getElementById('multiline');

demos/textfield.html

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -176,7 +176,7 @@ <h2>Full-Width Textfields</h2>
176176
'.mdl-textfield:not([data-demo-no-auto-js])'
177177
);
178178
for (var i = 0, tf; tf = tfs[i]; i++) {
179-
mdl.Textfield.attachTo(tf);
179+
mdl.textfield.MDLTextfield.attachTo(tf);
180180
}
181181
})();
182182
</script>
@@ -185,7 +185,7 @@ <h2>Full-Width Textfields</h2>
185185
var section = document.getElementById('demo-textfield-wrapper');
186186
var tfRoot = section.querySelector('.mdl-textfield');
187187
var helptext = section.querySelector('.mdl-textfield-helptext');
188-
var tf = new mdl.Textfield(tfRoot);
188+
var tf = new mdl.textfield.MDLTextfield(tfRoot);
189189

190190
document.getElementById('disable').addEventListener('change', function(evt) {
191191
var target = evt.target;
@@ -236,7 +236,7 @@ <h2>Full-Width Textfields</h2>
236236
(function() {
237237
var section = document.getElementById('demo-textfield-multiline-wrapper');
238238
var tfRoot = section.querySelector('.mdl-textfield');
239-
var tf = new mdl.Textfield(tfRoot);
239+
var tf = new mdl.textfield.MDLTextfield(tfRoot);
240240
document.getElementById('multi-disable').addEventListener('change', function(evt) {
241241
var target = evt.target;
242242
tf.disabled = target.checked;
@@ -264,8 +264,8 @@ <h2>Full-Width Textfields</h2>
264264
var section = document.getElementById('demo-fullwidth-wrapper');
265265
var tfRoot = section.querySelector('.mdl-textfield');
266266
var tfMultiRoot = section.querySelector('.mdl-textfield--multiline');
267-
var tf = new mdl.Textfield(tfRoot);
268-
var tfMulti = new mdl.Textfield(tfMultiRoot);
267+
var tf = new mdl.textfield.MDLTextfield(tfRoot);
268+
var tfMulti = new mdl.textfield.MDLTextfield(tfMultiRoot);
269269

270270
document.getElementById('fullwidth-disable').addEventListener('change', function(evt) {
271271
var target = evt.target;

examples/angular2/src/app/app.module.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import { RouterModule } from '@angular/router';
66
import { SeedApp } from './seed-app';
77
import { appRoutes } from './app.routs';
88
import { Home } from './components/home';
9+
import { FormFieldModule } from './components/form-field';
910
import { CheckboxModule } from './components/checkbox';
1011

1112

@@ -14,6 +15,7 @@ import { CheckboxModule } from './components/checkbox';
1415
BrowserModule,
1516
FormsModule,
1617
RouterModule.forRoot(appRoutes),
18+
FormFieldModule,
1719
CheckboxModule
1820
],
1921
declarations: [

examples/angular2/src/app/components/checkbox/index.ts

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,18 +2,16 @@ import { NgModule } from '@angular/core';
22
import { FormsModule } from '@angular/forms';
33

44
import { CheckboxComponent } from './checkbox';
5-
import { CheckboxWrapperComponent } from './checkbox-wrapper';
65
import { CheckboxLabelDirective } from './checkbox-label';
76

87
const CHECKBOX_COMPONENTS = [
98
CheckboxComponent,
10-
CheckboxLabelDirective,
11-
CheckboxWrapperComponent
9+
CheckboxLabelDirective
1210
];
1311

1412
@NgModule({
1513
imports: [FormsModule],
1614
exports: [CHECKBOX_COMPONENTS],
1715
declarations: [CHECKBOX_COMPONENTS],
1816
})
19-
export class CheckboxModule {}
17+
export class CheckboxModule {}

0 commit comments

Comments
 (0)