keycloak-aplcache

diff --git a/admin-ui/src/main/resources/META-INF/resources/admin/js/app.js b/admin-ui/src/main/resources/META-INF/resources/admin/js/app.js
index 4112776..fd9640a 100755
--- a/admin-ui/src/main/resources/META-INF/resources/admin/js/app.js
+++ b/admin-ui/src/main/resources/META-INF/resources/admin/js/app.js
@@ -640,35 +640,36 @@ module.directive('collapsed', function() {
 module.directive('onoffswitch', function() {
     return {
         restrict: "EA",
-        require: 'ngModel',
         replace: true,
         scope: {
+            name: '@',
+            id: '@',
             ngModel: '=',
-            ngDisabled: '=',
-            ngBind: '=',
-            name: '=',
-            id: '=',
-            onText: '@onText',
-            offText: '@offText'
+            kcOnText: '@onText',
+            kcOffText: '@offText'
         },
+        // TODO - The same code acts differently when put into the templateURL. Find why and move the code there.
+        //templateUrl: "templates/kc-switch.html",
+        template: "<span><div class='onoffswitch' tabindex='0'><input type='checkbox' ng-model='ngModel' class='onoffswitch-checkbox' name='{{name}}' id='{{id}}'><label for='{{id}}' class='onoffswitch-label'><span class='onoffswitch-inner'><span class='onoffswitch-active'>{{kcOnText}}</span><span class='onoffswitch-inactive'>{{kcOffText}}</span></span><span class='onoffswitch-switch'></span></label></div></span>",
         compile: function(element, attrs) {
+            /*
+            We don't want to propagate basic attributes to the root element of directive. Id should be passed to the
+            input element only to achieve proper label binding (and validity).
+            */
+            element.removeAttr('name');
+            element.removeAttr('id');
+
             if (!attrs.onText) { attrs.onText = "ON"; }
             if (!attrs.offText) { attrs.offText = "OFF"; }
-            if (!attrs.ngDisabled) { attrs.ngDisabled = false; }
-
-            var html = "<span><div class=\"onoffswitch\" data-ng-class=\"{disabled: ngDisabled}\" tabindex=\"0\" onkeydown=\"var code = event.keyCode || event.which; if (code === 32 || code === 13) { event.stopImmediatePropagation(); event.preventDefault(); $(event.target).find('input').click();}\">" +
-                "<input type=\"checkbox\" data-ng-model=\"ngModel\" ng-disabled=\"ngDisabled\"" +
-                " class=\"onoffswitch-checkbox\" name=\"" + attrs.name + "\" id=\"" + attrs.id + "\">" +
-                "<label for=\"" + attrs.id + "\" class=\"onoffswitch-label\">" +
-                "<span class=\"onoffswitch-inner\">" +
-                "<span class=\"onoffswitch-active\">{{onText}}</span>" +
-                "<span class=\"onoffswitch-inactive\">{{offText}}</span>" +
-                "</span>" +
-                "<span class=\"onoffswitch-switch\"></span>" +
-                "</label>" +
-                "</div></span>";
-
-            element.replaceWith($(html));
+
+            element.bind('keydown', function(e){
+                var code = e.keyCode || e.which;
+                if (code === 32 || code === 13) {
+                    e.stopImmediatePropagation();
+                    e.preventDefault();
+                    $(e.target).find('input').click();
+                }
+            });
         }
     }
 });

diff --git a/admin-ui/src/main/resources/META-INF/resources/admin/templates/kc-switch.html b/admin-ui/src/main/resources/META-INF/resources/admin/templates/kc-switch.html
new file mode 100644
index 0000000..7f28598
--- /dev/null
+++ b/admin-ui/src/main/resources/META-INF/resources/admin/templates/kc-switch.html
@@ -0,0 +1,12 @@
+<span>
+    <div class='onoffswitch' tabindex='0'>
+        <input type='checkbox' ng-model='ngModel' class='onoffswitch-checkbox' name='{{name}}' id='{{id}}'>
+        <label for='{{id}}' class='onoffswitch-label'>
+                <span class='onoffswitch-inner'>
+                    <span class='onoffswitch-active'>{{kcOnText}}</span>
+                    <span class='onoffswitch-inactive'>{{kcOffText}}</span>
+                </span>
+            <span class='onoffswitch-switch'></span>
+        </label>
+    </div>
+</span>
\ No newline at end of file

diff --git a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/admin-console.css b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/admin-console.css
index ee0e75b..7d88549 100644
--- a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/admin-console.css
+++ b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/admin-console.css
@@ -355,8 +355,8 @@ header .navbar {
     color: #FFFFFF;
     padding-left: 10px;
 }
-.onoffswitch.disabled .onoffswitch-inner .onoffswitch-active,
-.onoffswitch.disabled .onoffswitch-inner .onoffswitch-inactive {
+.onoffswitch-checkbox:disabled + .onoffswitch-label .onoffswitch-inner .onoffswitch-active,
+.onoffswitch-checkbox:disabled + .onoffswitch-label .onoffswitch-inner .onoffswitch-inactive {
     background-image: none;
     background-color: #e5e5e5;
     color: #9d9fa1;