diff options
| -rw-r--r-- | src/directives.js | 2 | ||||
| -rw-r--r-- | src/widgets2.js | 85 |
2 files changed, 87 insertions, 0 deletions
diff --git a/src/directives.js b/src/directives.js index 0e99d633..13cd4b59 100644 --- a/src/directives.js +++ b/src/directives.js @@ -119,3 +119,5 @@ angular.directive("watch", function(expression, element){ //widget related //ng-validate, ng-required, ng-formatter //ng-error + +//ng-scope ng-controller???? diff --git a/src/widgets2.js b/src/widgets2.js new file mode 100644 index 00000000..0d7bbd49 --- /dev/null +++ b/src/widgets2.js @@ -0,0 +1,85 @@ +// <input type="text" name="bla" ng-action=""> -> <ng:textinput name="" ng-action=""/> +angular.widget("inputtext", function(element) { + var expression = element.attr('name'); + var formatter = this.formatter(element.attr('formatter')); + var validator = this.validator(element.attr('validator')); + + function validate(value) { + var error = validator(element); + if (error) { + element.addClass("ng-error"); + scope.markInvalid(this); //move out of scope + } else { + scope.clearInvalid(this); + } + } + + + element.keyup(this.withScope(function(){ + this.$evalSet(expression, formatter.parse(element.val())); + validate(element.val()); + })); + + return {watch: expression, apply: function(newValue){ + element.val(formatter.format(newValue)); + validate(element.val()); + }}; + +}); + +angular.widget("inputfile", function(element) { + +}); + +angular.widget("inputradio", function(element) { + +}); + + +// <ng:colorpicker name="chosenColor" > +angular.widget("colorpicker", function(element) { + var name = element.attr('datasource'); + var formatter = this.formatter(element.attr('ng-formatter')); + + element.colorPicker(this.withScope(function(selectedColor){ + this.$evalSet(name, formatter.parse(selectedColor)); + })); + + return function(){ + this.$watch(expression, function(cmyk){ + element.setColor(formatter.format(cmyk)); + }); + } +}); + +angular.widget("template", function(element) { + var srcExpression = element.attr('src'); + var self = this; + return {watch:srcExpression, apply:function(src){ + $.load(src, function(html){ + self.destroy(element); + element.html(html); + self.compile(element); + }); + }}; +}); + + +/** + * + * { + * withScope: //safely executes, with a try/catch. applies scope + * compile: + * widget: + * directive: + * validator: + * formatter: + * + * + * config: + * loadCSS: + * loadScript: + * loadTemplate: + * } + * + **/ |
