Skip to content

Commit e3fc8ac

Browse files
GuiPavarinaGuiPavarina
committed
Refactored examples for better visualization
1 parent ebd8bdd commit e3fc8ac

File tree

9 files changed

+437
-431
lines changed

9 files changed

+437
-431
lines changed

‎CONTRIBUTING.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,5 +26,5 @@ With new features we love to see updates to the docs as well as tests, that make
2626
easy and fast for us to merge it!
2727

2828
Also consider running any code through the **JavaScript Code Style** checker [jscs](https://github.com/mdevils/node-jscs)
29-
(or even better use it in your editor) using the .jscsrc file in the repo root, which should be picked up by the IDE. You can also us `gulp jscs` to
29+
(or even better use it in your editor) using the .jscsrc file in the repo root, which should be picked up by the IDE. You can also use `gulp jscs` to
3030
check your code.

‎README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ gulp minify
2121
```
2222

2323
Start favorite http server (http-server or puer for instance) and open
24-
`examples/material-example.html`
24+
`examples/index.html`
2525

2626
There is also a `gulp watch` task that minifys on change.
2727

‎examples/app/app.config.js

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
angular
2+
.module('test')
3+
.config(function($mdThemingProvider, $mdDateLocaleProvider) {
4+
$mdThemingProvider.setDefaultTheme('default');
5+
$mdThemingProvider.alwaysWatchTheme(true);
6+
$mdDateLocaleProvider.formatDate = function(date) {
7+
console.info(moment(date).format('YYYY-MM-DD'));
8+
return moment(date).format('YYYY-MM-DD');
9+
};
10+
});

‎examples/app/app.controller.js

Lines changed: 245 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,245 @@
1+
angular
2+
.module('test')
3+
.controller('TestCtrl', function($scope, $http, $location, $timeout, $q) {
4+
5+
$scope.tests = [
6+
{ name: "Material Flex Grid", data: 'data/grid.json' },
7+
{ name: "Simple", data: 'data/simple.json' },
8+
{ name: "Basic JSON Schema Type", data: 'data/types.json' },
9+
{ name: "Autocomplete", data: 'data/autocomplete.json' },
10+
{ name: "Switch", data: 'data/switch.json'},
11+
{ name: "TitleMap Examples", data: 'data/titlemaps.json' },
12+
/*{ name: "Complex Key Support", data: 'data/complex-keys.json' },*/
13+
/*{ name: "Array", data: 'data/array.json' },*/
14+
/*{ name: "Tab Array", data: 'data/tabarray.json' },*/
15+
{ name: "Tabs", data: 'data/tabs.json' },
16+
{ name: "Kitchen Sink", data: 'data/sink.json' },
17+
{ name: "Hack: Conditional required", data: 'data/conditional-required.json' },
18+
];
19+
20+
/////////////////////////////////////////////////////////////////////////
21+
//// Autocomplete code //////////////////////////////////////////////////
22+
$scope.arnieFlix = loadFlix();
23+
$scope.searchText = null;
24+
$scope.simulateQuery = false;
25+
$scope.querySearch = querySearch;
26+
/**
27+
* Search for arnieFlix... use $timeout to simulate
28+
* remote dataservice call.
29+
*/
30+
function querySearch (query) {
31+
var results = query ? $scope.arnieFlix.filter( createFilterFor(query) ) : $scope.arnieFlix,
32+
deferred;
33+
if ($scope.simulateQuery) {
34+
deferred = $q.defer();
35+
$timeout(function () { deferred.resolve( results ); }, Math.random() * 1000, false);
36+
return deferred.promise;
37+
} else {
38+
return results;
39+
}
40+
};
41+
42+
/**
43+
* Create filter function for a query string
44+
*/
45+
function createFilterFor(query) {
46+
var lowercaseQuery = angular.lowercase(query);
47+
return function filterFn(item) {
48+
return (item.value.indexOf(lowercaseQuery) === 0);
49+
};
50+
};
51+
52+
function loadFlix() {
53+
var films = [
54+
{ "year": undefined, "title": "The Legend of Conan" },
55+
{ "year": undefined, "title": "Triplets" },
56+
{ "year": 2015, "title": "Terminator Genisys" },
57+
{ "year": 2015, "title": "Maggie" },
58+
{ "year": 2014, "title": "The Expendables 3" },
59+
{ "year": 2014, "title": "Sabotage" },
60+
{ "year": 2013, "title": "Escape Plan" },
61+
{ "year": 2013, "title": "The Last Stand" },
62+
{ "year": 2012, "title": "The Expendables 2" },
63+
{ "year": 2010, "title": "The Expendables" },
64+
{ "year": 2005, "title": "The Kid & I" },
65+
{ "year": 2004, "title": "Around the World in 80 Days" },
66+
{ "year": 2003, "title": "Welcome to the Jungle" },
67+
{ "year": 2003, "title": "Terminator 3: Rise of the Machines" },
68+
{ "year": 2002, "title": "Collateral Damage" },
69+
{ "year": 2000, "title": "The 6th Day" },
70+
{ "year": 1999, "title": "End of Days" },
71+
{ "year": 1997, "title": "Batman & Robin" },
72+
{ "year": 1996, "title": "Jingle All the Way" },
73+
{ "year": 1996, "title": "Eraser" },
74+
{ "year": 1994, "title": "Junior" },
75+
{ "year": 1994, "title": "True Lies" },
76+
{ "year": 1993, "title": "Last Action Hero" },
77+
{ "year": 1993, "title": "Dave" },
78+
{ "year": 1991, "title": "Terminator 2: Judgment Day" },
79+
{ "year": 1990, "title": "Kindergarten Cop" },
80+
{ "year": 1990, "title": "Total Recall" },
81+
{ "year": 1988, "title": "Twins" },
82+
{ "year": 1988, "title": "Red Heat" },
83+
{ "year": 1987, "title": "The Running Man" },
84+
{ "year": 1987, "title": "Predator" },
85+
{ "year": 1986, "title": "Raw Deal" },
86+
{ "year": 1985, "title": "Commando" },
87+
{ "year": 1985, "title": "Red Sonja" },
88+
{ "year": 1984, "title": "The Terminator" },
89+
{ "year": 1984, "title": "Conan the Destroyer" },
90+
{ "year": 1982, "title": "Conan the Barbarian" },
91+
{ "year": 1980, "title": "The Jayne Mansfield Story" },
92+
{ "year": 1979, "title": "Scavenger Hunt" },
93+
{ "year": 1979, "title": "The Villain" },
94+
{ "year": 1976, "title": "Stay Hungry" },
95+
{ "year": 1974, "title": "Happy Anniversary and Goodbye" },
96+
{ "year": 1973, "title": "The Long Goodbye" },
97+
{ "year": 1969, "title": "Hercules in New York" },
98+
{ "year": 1969, "title": "Hercules" }
99+
];
100+
return films.map( function (film) {
101+
film.name = film.title;
102+
film.value = film.title.toLowerCase();
103+
return film;
104+
});
105+
};
106+
107+
// $scope.autocompleteTmpl = `
108+
// <span class="item-year">
109+
// <span> {{item.year}} </span>
110+
// </span>
111+
// <span class="item-title">
112+
// <strong>{{item.title}}</strong>
113+
// </span>`;
114+
//// Autocomplete code end //////////////////////////////////////////////
115+
/////////////////////////////////////////////////////////////////////////
116+
117+
$scope.navbarMode = 'default';
118+
//$scope.hasFlash = swfobject.hasFlashPlayerVersion('9');
119+
120+
// Load data from gist.
121+
if (false || $location.path().length > 4) {
122+
$scope.navbarMode = 'loaded';
123+
var gistId = $location.path().replace('/','');
124+
$scope.loading = true;
125+
$http.get('https://api.github.com/gists/' + gistId).success(function(res) {
126+
$scope.error = null;
127+
$scope.tests.unshift({name: 'Gist'});
128+
$scope.selectedTest = $scope.tests[0];
129+
$scope.loadedData = {
130+
created: moment(res.created_at).fromNow(),
131+
user: res.user !== null ? res.user.login : 'Anonymous'
132+
}
133+
$scope.loading = false;
134+
$scope.schemaJson = res.files['schema.json'].content;
135+
$scope.formJson = res.files['form.json'].content;
136+
$scope.modelData = JSON.parse(res.files['model.json'].content);
137+
}).error(function() {
138+
$scope.loadedData = 'dummy';
139+
$scope.error = 'Failed to load gist.';
140+
$scope.selectedTest = $scope.tests[0];
141+
});
142+
} else {
143+
$scope.selectedTest = $scope.tests[0];
144+
}
145+
146+
$scope.$watch('selectedTest',function(val){
147+
if (val && val.data !== undefined) {
148+
$http.get(val.data).then(function(res) {setNewData(res.data);});
149+
}
150+
});
151+
152+
$scope.itParses = true;
153+
$scope.itParsesForm = true;
154+
155+
156+
$scope.$watch('schemaJson',function(val,old){
157+
if (val && val !== old) {
158+
try {
159+
$scope.schema = JSON.parse($scope.schemaJson);
160+
$scope.itParses = true;
161+
} catch (e){
162+
$scope.itParses = false;
163+
}
164+
}
165+
});
166+
167+
$scope.$watch('formJson',function(val,old){
168+
if (val && val !== old) {
169+
try {
170+
$scope.form = JSON.parse($scope.formJson);
171+
$scope.itParsesForm = true;
172+
} catch (e){
173+
$scope.itParsesForm = false;
174+
}
175+
}
176+
});
177+
178+
var setNewData = function(data) {
179+
$scope.schema = data.schema;
180+
$scope.form = data.form;
181+
$scope.schemaJson = JSON.stringify($scope.schema,undefined,2);
182+
$scope.formJson = JSON.stringify($scope.form,undefined,2);
183+
$scope.modelData = data.model || {};
184+
};
185+
186+
$scope.pretty = function(){
187+
return typeof $scope.modelData === 'string' ? $scope.modelData : JSON.stringify($scope.modelData, undefined, 2);
188+
};
189+
190+
$scope.log = function(msg){
191+
console.log("Simon says",msg);
192+
};
193+
194+
$scope.sayNo = function() {
195+
alert('Noooooooo');
196+
};
197+
198+
$scope.say = function(msg) {
199+
alert(msg);
200+
};
201+
202+
$scope.save = function() {
203+
// To be able to save invalid json and point out errors, we
204+
// don't save the schema/form but rather the ones in the input.
205+
206+
$scope.navbarMode = 'saved';
207+
208+
var gist = {
209+
"description": "A saved configuration for a schema form example, http://textalk.github.io/angular-schema-form/examples/bootstrap-example.html",
210+
"public": true,
211+
"files": {
212+
"schema.json": {
213+
"content": $scope.schemaJson
214+
},
215+
"form.json": {
216+
"content": $scope.formJson
217+
},
218+
"model.json": {
219+
"content": JSON.stringify($scope.modelData, undefined, 2)
220+
}
221+
}
222+
};
223+
224+
$http.post('https://api.github.com/gists', gist).success(function(data) {
225+
$scope.error = null;
226+
$location.path('/' + data.id);
227+
$scope.savedGistData = {
228+
data: data,
229+
url: $location.absUrl()
230+
};
231+
}).error(function() {
232+
$scope.error = 'Failed to save gist.';
233+
});
234+
};
235+
236+
$scope.submitForm = function(form) {
237+
// First we broadcast an event so all fields validate themselves
238+
$scope.$broadcast('schemaFormValidate');
239+
// Then we check if the form is valid
240+
if (form.$valid) {
241+
alert('You did it!');
242+
}
243+
};
244+
245+
});

‎examples/app/app.js

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
// @license magnet:?xt=urn:btih:d3d9a9a6595521f9666a5e94cc830dab83b65699&dn=expat.txt Expat
2+
angular.module('test', [
3+
'schemaForm', 'ngMaterial', 'ui.ace','ngMessages'
4+
]);

0 commit comments

Comments
 (0)