Fix enum properties not being rendered as select element

dist/js/jsonforms.js

@@ -1,3 +1,7 @@
+(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
+/*! jsonforms - v0.0.1 - 2015-08-04 Copyright (c) EclipseSource Muenchen GmbH and others. */ 
+'use strict';
+// Source: dist/js/jsonforms.js
 /// <reference path="../typings/angularjs/angular.d.ts"/>
 var jsonforms;
 (function (jsonforms) {
@@ -150,10 +154,16 @@ var ControlRenderer = (function () {
     }
     ControlRenderer.prototype.render = function (element, schema, instance, path, dataProvider) {
         var control = {};
-        control["schemaType"] = element['scope']['type'];
+        if (element["scope"]["enum"]) {
+            control["schemaType"] = "enum";
+            control["options"] = element["scope"]["enum"];
+        }
+        else {
+            control["schemaType"] = element["scope"]["type"];
+        }
         control["bindings"] = instance;
         control["path"] = this.refResolver.normalize(this.refResolver.get(path));
-        control["label"] = element['label'];
+        control["label"] = element["label"];
         // TODO: create unique ID?
         control["id"] = path;
         return {
@@ -581,4 +591,23 @@ jsonFormsDirectives.directive('control', function () {
 }).directive('recelement', ['RecursionHelper', function (recHelper) {
         return new RecElement(recHelper);
     }]);
-//# sourceMappingURL=jsonforms.js.map
+
+// Source: temp/templates.js
+angular.module('jsonForms').run(['$templateCache', function($templateCache) {
+$templateCache.put('templates/control.html',
+    "<div ng-switch on=\"control.schemaType\" class=\"form-group top-buffer\"><label for=\"control.id\" ng-class=\"control.labelclass\">{{control.label}}</label><div ng-class=\"control.inputclass\"><div ng-switch-when=\"array\" name=\"control.label\"><div class=\"row\"><div ui-grid=\"control.tableOptions.gridOptions\" ui-grid-auto-resize ui-grid-pagination class=\"grid\"></div></div></div><input ng-switch-when=\"string\" type=\"text\" ng-model=\"control.bindings[control.path]\" id=\"control.id\" class=\"form-control qb-control qb-control-string\" name=\"control.displayname\"> <input ng-switch-when=\"number\" type=\"text\" ng-model=\"control.bindings[control.path]\" ui-validate=\"'topValidateNumber($value, control)'\" id=\"control.id\" class=\"form-control qb-control qb-control-number\" name=\"control.displayname\"> <input ng-switch-when=\"integer\" type=\"text\" ng-model=\"control.bindings[control.path]\" ui-validate=\"'topValidateInteger($value, control)'\" id=\"control.id\" class=\"form-control qb-control qb-control-integer\" name=\"control.displayname\"><div ng-switch-when=\"boolean\" class=\"checkbox-inline\" for=\"control.value\"><input type=\"checkbox\" ng-model=\"control.bindings[control.path]\" name=\"control.displayname\" id=\"control.id\" class=\"qb-control qb-control-boolean\">&nbsp;</div><div ng-switch-when=\"date-time\" class=\"input-group\"><input type=\"text\" datepicker-popup=\"dd.MM.yyyy\" ng-model=\"control.bindings[control.path]\" close-text=\"Close\" is-open=\"control.isOpen\" id=\"control.id\" class=\"form-control qb-control qb-control-datetime\" n ame=\"control.displayname\"> <span class=\"input-group-btn\"><button type=\"button\" class=\"btn btn-default\" ng-click=\"topOpenDate($event,control)\"><i class=\"glyphicon glyphicon-calendar\"></i></button></span></div><select ng-switch-when=\"enum\" ng-model=\"control.bindings[control.path]\" ng-options=\"option as option for option in control.options\" id=\"control.id\" class=\"form-control qb-control qb-control-enum\" name=\"control.label\"></select><alert ng-repeat=\"alert in control.alerts\" type=\"{{alert.type}}\" class=\"top-buffer-s qb-alert\">{{alert.msg}}</alert></div></div>"
+  );
+
+
+  $templateCache.put('templates/element.html',
+    "<recursive><div ng-if=\"element.type=='Label'\" class=\"col-sm-{{element.size}} qb-label\">{{element.elements[0].text}}</div><control ng-if=\"element.type=='Control'\" control=\"element.elements[0]\" bindings=\"element.elements[0].bindings\" top-open-date=\"topOpenDate\" top-validate-number=\"topValidateNumber\" top-validate-integer=\"topValidateInteger\" class=\"col-sm-{{element.size}}\"></control><!-- this should be moved to control.html ? --><fieldset ng-if=\"element.type=='HorizontalLayout'\" class=\"col-sm-{{element.size}}\"><div class=\"row\"><recelement ng-repeat=\"child in element.elements\" element=\"child\" bindings=\"bindings\" top-open-date=\"topOpenDate\" top-validate-number=\"topValidateNumber\" top-validate-integer=\"topValidateInteger\"></recelement></div></fieldset><fieldset ng-if=\"element.type=='VerticalLayout'\" class=\"col-sm-{{element.size}}\"><recelement ng-repeat=\"child in element.elements\" element=\"child\" bindings=\"bindings\" top-open-date=\"topOpenDate\" top-validate-number=\"topValidateNumber\" top-validate-integer=\"topValidateInteger\"></recelement></fieldset></recursive>"
+  );
+
+
+  $templateCache.put('templates/form.html',
+    "<div><form role=\"form\" class=\"qb-form rounded\"><recelement ng-repeat=\"child in elements\" element=\"child\" bindings=\"bindings\" top-open-date=\"openDate\" top-validate-number=\"validateNumber\" top-validate-integer=\"validateInteger\"></recelement></form></div>"
+  );
+
+}]);
+
+},{}]},{},[1]);

js/renderers/control.ts

@@ -10,10 +10,15 @@ class ControlRenderer implements jsonforms.services.IRenderer {
     render(element:jsonforms.services.UISchemaElement, schema, instance, path: string, dataProvider) {
 
         var control = {};
-        control["schemaType"] = element['scope']['type'];
+        if (element["scope"]["enum"]) {
+            control["schemaType"] = "enum";
+            control["options"] = element["scope"]["enum"];
+        } else {
+            control["schemaType"] = element["scope"]["type"];
+        }
         control["bindings"] = instance;
         control["path"] = this.refResolver.normalize(this.refResolver.get(path));
-        control["label"] = element['label'];
+        control["label"] = element["label"];
         // TODO: create unique ID?
         control["id"] = path;
 

tests/unit-tests/directives_test.js

@@ -31,7 +31,30 @@ describe('jsonforms directive', function() {
     //    expect(el.html()).toContain("form");
     //}));
 
-
+    it("should render a labeled select field", inject(function ($rootScope, $compile) {
+        var scope = $rootScope.$new();
+        scope.schema = {
+            "type": "object",
+            "properties": {
+                "gender": {
+                    "type": "string",
+                    "enum": ["Male", "Female"]
+                }
+            }
+        };
+        scope.data = { gender: 'Female'};
+        scope.uiSchema = {
+            "type": "Control",
+            "label": "Gender",
+            "scope": { "$ref": "#/properties/gender" }
+        };
+        var el = $compile('<jsonforms schema="schema" data="data" ui-schema="uiSchema">')(scope);
+        scope.$digest();
+        // should test for more complex logic here
+        expect(el.find("label").text()).toEqual("Gender");
+        expect(el.find("select")).toBeDefined();
+    }));
+
     it("should throw an error in case the data attribute is missing", inject(function($rootScope, $compile) {
         var scope = $rootScope.$new();
         scope.schema = {};