|
1 | | -(function(angular, undefined) {'use strict'; |
2 | | - angular |
3 | | - .module('schemaForm') |
4 | | - .config(bootstrapDecoratorConfig) |
5 | | - .filter('sfCamelKey', sfCamelKeyFilter); |
| 1 | +// angular-templatecache-loader |
| 2 | +let textareaTemplate = require('./bootstrap/textarea.html'); |
| 3 | +let fieldsetTemplate = require('./bootstrap/fieldset.html'); |
| 4 | +let arrayTemplate = require('./bootstrap/array.html'); |
| 5 | +let tabarrayTemplate = require('./bootstrap/tabarray.html'); |
| 6 | +let tabsTemplate = require('./bootstrap/tabs.html'); |
| 7 | +let sectionTemplate = require('./bootstrap/section.html'); |
| 8 | +let actionsTemplate = require('./bootstrap/actions.html'); |
| 9 | +let selectTemplate = require('./bootstrap/select.html'); |
| 10 | +let checkboxTemplate = require('./bootstrap/checkbox.html'); |
| 11 | +let checkboxesTemplate = require('./bootstrap/checkboxes.html'); |
| 12 | +let submitTemplate = require('./bootstrap/submit.html'); |
| 13 | +let radiosTemplate = require('./bootstrap/radios.html'); |
| 14 | +let radiosInlineTemplate = require('./bootstrap/radios-inline.html'); |
| 15 | +let radiobuttonsTemplate = require('./bootstrap/radio-buttons.html'); |
| 16 | +let helpTemplate = require('./bootstrap/help.html'); |
| 17 | +let defaultTemplate = require('./bootstrap/default.html'); |
6 | 18 |
|
7 | | - bootstrapDecoratorConfig.$inject = [ |
8 | | - 'schemaFormProvider', 'schemaFormDecoratorsProvider', 'sfBuilderProvider', 'sfPathProvider', '$injector' |
9 | | - ]; |
| 19 | +angular |
| 20 | + .module('schemaForm') |
| 21 | + .config(bootstrapDecoratorConfig) |
| 22 | + .filter('sfCamelKey', sfCamelKeyFilter); |
10 | 23 |
|
11 | | - function bootstrapDecoratorConfig( |
12 | | - schemaFormProvider, decoratorsProvider, sfBuilderProvider, sfPathProvider, $injector) { |
13 | | - var base = 'decorators/bootstrap/'; |
| 24 | +bootstrapDecoratorConfig.$inject = [ |
| 25 | + 'schemaFormProvider', 'schemaFormDecoratorsProvider', 'sfBuilderProvider', 'sfPathProvider', '$injector' |
| 26 | +]; |
14 | 27 |
|
15 | | - var simpleTransclusion = sfBuilderProvider.builders.simpleTransclusion; |
16 | | - var ngModelOptions = sfBuilderProvider.builders.ngModelOptions; |
17 | | - var ngModel = sfBuilderProvider.builders.ngModel; |
18 | | - var sfField = sfBuilderProvider.builders.sfField; |
19 | | - var condition = sfBuilderProvider.builders.condition; |
20 | | - var array = sfBuilderProvider.builders.array; |
21 | | - var numeric = sfBuilderProvider.builders.numeric; |
| 28 | +function bootstrapDecoratorConfig( |
| 29 | + schemaFormProvider, decoratorsProvider, sfBuilderProvider, sfPathProvider, $injector) { |
| 30 | + var base = 'decorators/bootstrap/'; |
22 | 31 |
|
23 | | - // Tabs is so bootstrap specific that it stays here. |
24 | | - var tabs = function(args) { |
25 | | - if (args.form.tabs && args.form.tabs.length > 0) { |
26 | | - var tabContent = args.fieldFrag.querySelector('.tab-content'); |
| 32 | + var simpleTransclusion = sfBuilderProvider.builders.simpleTransclusion; |
| 33 | + var ngModelOptions = sfBuilderProvider.builders.ngModelOptions; |
| 34 | + var ngModel = sfBuilderProvider.builders.ngModel; |
| 35 | + var sfField = sfBuilderProvider.builders.sfField; |
| 36 | + var condition = sfBuilderProvider.builders.condition; |
| 37 | + var array = sfBuilderProvider.builders.array; |
| 38 | + var numeric = sfBuilderProvider.builders.numeric; |
27 | 39 |
|
28 | | - args.form.tabs.forEach(function(tab, index) { |
29 | | - var div = document.createElement('div'); |
30 | | - div.className = 'tab-pane'; |
31 | | - div.setAttribute('ng-disabled', 'form.readonly'); |
32 | | - div.setAttribute('ng-show', 'selected.tab === ' + index); |
33 | | - div.setAttribute('ng-class', '{active: selected.tab === ' + index + '}'); |
| 40 | + // Tabs is so bootstrap specific that it stays here. |
| 41 | + var tabs = function(args) { |
| 42 | + if (args.form.tabs && args.form.tabs.length > 0) { |
| 43 | + var tabContent = args.fieldFrag.querySelector('.tab-content'); |
34 | 44 |
|
35 | | - var childFrag = args.build(tab.items, args.path + '.tabs[' + index + '].items', args.state); |
36 | | - div.appendChild(childFrag); |
37 | | - tabContent.appendChild(div); |
38 | | - }); |
39 | | - } |
40 | | - }; |
| 45 | + args.form.tabs.forEach(function(tab, index) { |
| 46 | + var evalExpr = '(evalExpr(' + args.path + '.tabs[' + index + ']' + |
| 47 | + '.condition, { model: model, "arrayIndex": $index}))'; |
| 48 | + var div = document.createElement('div'); |
| 49 | + div.className = 'tab-pane'; |
| 50 | + div.setAttribute('ng-disabled', 'form.readonly'); |
| 51 | + div.setAttribute('ng-show', 'selected.tab === ' + index); |
| 52 | + div.setAttribute('ng-class', '{active: selected.tab === ' + index + '}'); |
| 53 | + if(!!tab.condition) { |
| 54 | + div.setAttribute('ng-if', evalExpr); |
| 55 | + }; |
41 | 56 |
|
42 | | - var selectPlaceholder = function(args) { |
43 | | - if (args.form.placeholder) { |
44 | | - var selectBox = args.fieldFrag.querySelector('select'); |
45 | | - var option = document.createElement('option'); |
46 | | - option.setAttribute('value', ''); |
47 | | - |
48 | | - /* We only want the placeholder to show when we do not have a value on the model. |
49 | | - * We make ngModel builder replace all so we can use $$value$$. |
50 | | - */ |
51 | | - option.setAttribute('sf-field-model', 'replaceAll'); |
| 57 | + var childFrag = args.build(tab.items, args.path + '.tabs[' + index + '].items', args.state); |
| 58 | + div.appendChild(childFrag); |
| 59 | + tabContent.appendChild(div); |
| 60 | + }); |
| 61 | + } |
| 62 | + }; |
52 | 63 |
|
53 | | - /* https://github.com/angular/angular.js/issues/12190#issuecomment-115277040 |
54 | | - * angular > 1.4 does a emptyOption.attr('selected', true) |
55 | | - * which does not like the ng-if comment. |
56 | | - */ |
57 | | - if (angular.version.major === 1 && angular.version.minor < 4) { |
58 | | - option.setAttribute('ng-if', '$$value$$ === undefined'); |
59 | | - } else { |
60 | | - option.setAttribute('ng-show', '$$value$$ === undefined'); |
61 | | - } |
| 64 | + var selectPlaceholder = function(args) { |
| 65 | + if (args.form.placeholder) { |
| 66 | + var selectBox = args.fieldFrag.querySelector('select'); |
| 67 | + var option = document.createElement('option'); |
| 68 | + option.setAttribute('value', ''); |
62 | 69 |
|
63 | | - option.textContent = args.form.placeholder; |
| 70 | + /* We only want the placeholder to show when we do not have a value on the model. |
| 71 | + * We make ngModel builder replace all so we can use $$value$$. |
| 72 | + */ |
| 73 | + option.setAttribute('sf-field-model', 'replaceAll'); |
64 | 74 |
|
65 | | - selectBox.appendChild(option); |
| 75 | + /* https://github.com/angular/angular.js/issues/12190#issuecomment-115277040 |
| 76 | + * angular > 1.4 does a emptyOption.attr('selected', true) |
| 77 | + * which does not like the ng-if comment. |
| 78 | + */ |
| 79 | + if (angular.version.major === 1 && angular.version.minor < 4) { |
| 80 | + option.setAttribute('ng-if', '$$value$$ === undefined'); |
| 81 | + } else { |
| 82 | + option.setAttribute('ng-show', '$$value$$ === undefined'); |
66 | 83 | } |
67 | | - }; |
68 | 84 |
|
69 | | - var defaults = [sfField, ngModel, ngModelOptions, condition]; |
70 | | - decoratorsProvider.defineDecorator('bootstrapDecorator', { |
71 | | - textarea: {template: base + 'textarea.html', builder: defaults}, |
72 | | - fieldset: {template: base + 'fieldset.html', builder: [sfField, simpleTransclusion, condition]}, |
73 | | - array: {template: base + 'array.html', builder: [sfField, ngModelOptions, ngModel, array, condition]}, |
74 | | - tabarray: {template: base + 'tabarray.html', builder: [sfField, ngModelOptions, ngModel, array, condition]}, |
75 | | - tabs: {template: base + 'tabs.html', builder: [sfField, ngModelOptions, tabs, condition]}, |
76 | | - section: {template: base + 'section.html', builder: [sfField, simpleTransclusion, condition]}, |
77 | | - conditional: {template: base + 'section.html', builder: [sfField, simpleTransclusion, condition]}, |
78 | | - actions: {template: base + 'actions.html', builder: defaults}, |
79 | | - select: {template: base + 'select.html', builder: defaults.concat(selectPlaceholder)}, |
80 | | - checkbox: {template: base + 'checkbox.html', builder: defaults}, |
81 | | - checkboxes: {template: base + 'checkboxes.html', builder: [sfField, ngModelOptions, ngModel, array, condition]}, |
82 | | - number: {template: base + 'default.html', builder: defaults.concat(numeric)}, |
83 | | - password: {template: base + 'default.html', builder: defaults}, |
84 | | - submit: {template: base + 'submit.html', builder: defaults}, |
85 | | - button: {template: base + 'submit.html', builder: defaults}, |
86 | | - radios: {template: base + 'radios.html', builder: defaults}, |
87 | | - 'radios-inline': {template: base + 'radios-inline.html', builder: defaults}, |
88 | | - radiobuttons: {template: base + 'radio-buttons.html', builder: defaults}, |
89 | | - help: {template: base + 'help.html', builder: defaults}, |
90 | | - 'default': {template: base + 'default.html', builder: defaults} |
91 | | - }, []); |
| 85 | + option.textContent = args.form.placeholder; |
| 86 | + |
| 87 | + selectBox.appendChild(option); |
| 88 | + } |
92 | 89 | }; |
93 | 90 |
|
94 | | - /** |
95 | | - * sfCamelKey Filter |
96 | | - */ |
97 | | - function sfCamelKeyFilter() { |
98 | | - return function(formKey) { |
99 | | - if (!formKey) { return ''; }; |
100 | | - var part, i, key; |
101 | | - key = formKey.slice(); |
102 | | - for (i = 0; i < key.length; i++) { |
103 | | - part = key[i].toLowerCase().split(''); |
104 | | - if (i && part.length) { part[0] = part[0].toUpperCase(); }; |
105 | | - key[i] = part.join(''); |
106 | | - }; |
107 | | - return key.join(''); |
| 91 | + var defaults = [sfField, ngModel, ngModelOptions, condition]; |
| 92 | + decoratorsProvider.defineDecorator('bootstrapDecorator', { |
| 93 | + textarea: {template: textareaTemplate, builder: defaults}, |
| 94 | + fieldset: {template: fieldsetTemplate, builder: [sfField, simpleTransclusion, condition]}, |
| 95 | + array: {template: arrayTemplate, builder: [sfField, ngModelOptions, ngModel, array, condition]}, |
| 96 | + tabarray: {template: tabarrayTemplate, builder: [sfField, ngModelOptions, ngModel, array, condition]}, |
| 97 | + tabs: {template: tabsTemplate, builder: [sfField, ngModelOptions, tabs, condition]}, |
| 98 | + section: {template: sectionTemplate, builder: [sfField, simpleTransclusion, condition]}, |
| 99 | + conditional: {template: sectionTemplate, builder: [sfField, simpleTransclusion, condition]}, |
| 100 | + actions: {template: actionsTemplate, builder: defaults}, |
| 101 | + select: {template: selectTemplate, builder: defaults.concat(selectPlaceholder)}, |
| 102 | + checkbox: {template: checkboxTemplate, builder: defaults}, |
| 103 | + checkboxes: {template: checkboxesTemplate, builder: [sfField, ngModelOptions, ngModel, array, condition]}, |
| 104 | + number: {template: defaultTemplate, builder: defaults.concat(numeric)}, |
| 105 | + password: {template: defaultTemplate, builder: defaults}, |
| 106 | + submit: {template: submitTemplate, builder: defaults}, |
| 107 | + button: {template: submitTemplate, builder: defaults}, |
| 108 | + radios: {template: radiosTemplate, builder: defaults}, |
| 109 | + 'radios-inline': {template: radiosInlineTemplate, builder: defaults}, |
| 110 | + radiobuttons: {template: radiobuttonsTemplate, builder: defaults}, |
| 111 | + help: {template: helpTemplate, builder: defaults}, |
| 112 | + 'default': {template: defaultTemplate, builder: defaults} |
| 113 | + }, []); |
| 114 | +}; |
| 115 | + |
| 116 | +/** |
| 117 | + * sfCamelKey Filter |
| 118 | + */ |
| 119 | +function sfCamelKeyFilter() { |
| 120 | + return function(formKey) { |
| 121 | + if (!formKey) { return ''; }; |
| 122 | + var part, i, key; |
| 123 | + key = formKey.slice(); |
| 124 | + for (i = 0; i < key.length; i++) { |
| 125 | + part = key[i].toLowerCase().split(''); |
| 126 | + if (i && part.length) { part[0] = part[0].toUpperCase(); }; |
| 127 | + key[i] = part.join(''); |
108 | 128 | }; |
| 129 | + return key.join(''); |
109 | 130 | }; |
110 | | - |
111 | | -})(angular, undefined); |
| 131 | +}; |
0 commit comments