Merge remote-tracking branch 'upstream/master'

2014-05-21 10:56:21 -04:00
commit 0d9e14d4c7
@@ -24,7 +24,7 @@
                <td>${event.date?datetime}</td>
                <td>${event.event}</td>
                <td>${event.ipAddress}</td>
-                <td>${event.client}</td>
+                <td>${event.client!}</td>
                <td><#list event.details as detail>${detail.key} = ${detail.value} <#if detail_has_next>, </#if></#list></td>
            </tr>
        </#list>
@@ -7,7 +7,7 @@
        </div>
    </div>

-    <table class="table">
+    <table class="table table-striped table-bordered">
        <thead>
        <tr>
            <td>IP</td>
@@ -27,18 +27,14 @@
                <td>${session.lastAccess?datetime}</td>
                <td>${session.expires?datetime}</td>
                <td>
-                    <ul style="list-style: none; ">
-                        <#list session.applications as app>
-                            <li>${app}</li>
-                        </#list>
-                    </ul>
+                    <#list session.applications as app>
+                        ${app}<br/>
+                    </#list>
                </td>
                <td>
-                    <ul style="list-style: none; ">
-                        <#list session.clients as client>
-                            <li>${client}</li>
-                        </#list>
-                    </ul>
+                    <#list session.clients as client>
+                        ${client}<br/>
+                    </#list>
                </td>
            </tr>
        </#list>
@@ -91,7 +91,7 @@ header .navbar {
    background-color: #c7e5f0;
    border-color: #56bae0;
    font-weight: bold;
-    background-image: url(../img/icon-sidebar-active.svg);
+    background-image: url(../img/icon-sidebar-active.png);
    background-repeat: no-repeat;
    background-position: right center;
 }
@@ -15,7 +15,7 @@
    <script src="lib/angular/angular.js"></script>
    <script src="lib/angular/angular-resource.js"></script>
    <script src="lib/angular/angular-route.js"></script>
-    <script src="lib/angular/ui-bootstrap-tpls-0.4.0.js"></script>
+    <script src="lib/angular/ui-bootstrap-tpls-0.11.0.js"></script>

    <script src="lib/jquery/jquery.idletimer.js" type="text/javascript"></script>
    <script src="lib/jquery/jquery.idletimeout.js" type="text/javascript"></script>
@@ -39,6 +39,7 @@
 </head>

 <body class="admin-console" data-ng-controller="GlobalCtrl" data-ng-cloak>
+
 <div id="idletimeout">
    You will be logged off in <strong><span></span> seconds</strong> due to inactivity.
    <a id="idletimeout-resume" href="#">Click here to continue using this web page</a>.
@@ -2,9 +2,40 @@

 var module = angular.module('keycloak.services', [ 'ngResource', 'ngRoute' ]);

-module.service('Dialog', function($dialog) {
+module.service('Dialog', function($modal) {
 	var dialog = {};

+    var openDialog = function(title, message, btns) {
+        var controller = function($scope, $modalInstance, title, message, btns) {
+            $scope.title = title;
+            $scope.message = message;
+            $scope.btns = btns;
+
+            $scope.ok = function () {
+                $modalInstance.close();
+            };
+            $scope.cancel = function () {
+                $modalInstance.dismiss('cancel');
+            };
+        };
+
+        return $modal.open({
+            templateUrl: 'templates/kc-modal.html',
+            controller: controller,
+            resolve: {
+                title: function() {
+                    return title;
+                },
+                message: function() {
+                    return message;
+                },
+                btns: function() {
+                    return btns;
+                }
+            }
+        }).result;
+    }
+
 	var escapeHtml = function(str) {
 		var div = document.createElement('div');
 		div.appendChild(document.createTextNode(str));
@@ -13,64 +44,53 @@ module.service('Dialog', function($dialog) {

 	dialog.confirmDelete = function(name, type, success) {
 		var title = 'Delete ' + escapeHtml(type.charAt(0).toUpperCase() + type.slice(1));
-		var msg = '<span class="primary">Are you sure you want to permanently delete the ' + escapeHtml(type) + ' <strong>' + escapeHtml(name) + '</strong>?</span>';
-		var btns = [ {
-			result : 'cancel',
-			label : 'Cancel',
-            cssClass : 'btn btn-default'
-		}, {
-			result : 'ok',
-			label : 'Delete',
-			cssClass : 'btn btn-danger'
-		} ];
+		var msg = 'Are you sure you want to permanently delete the ' + type + ' ' + name + '?';
+        var btns = {
+            ok: {
+                label: 'Delete',
+                cssClass: 'btn btn-danger'
+            },
+            cancel: {
+                label: 'Cancel',
+                cssClass: 'btn btn-default'
+            }
+        }

-		$dialog.messageBox(title, msg, btns).open().then(function(result) {
-			if (result == "ok") {
-				success();
-			}
-		});
+        openDialog(title, msg, btns).then(success);
 	}

    dialog.confirmGenerateKeys = function(name, type, success) {
        var title = 'Generate new keys for realm';
-        var msg = '<span class="primary">Are you sure you want to permanently generate new keys for <strong>' + name + '</strong>?</span>';
-        var btns = [ {
-            result : 'cancel',
-            label : 'Cancel',
-            cssClass : 'btn btn-default'
-        }, {
-            result : 'ok',
-            label : 'Generate new keys',
-            cssClass : 'btn btn-danger'
-        } ];
-
-        $dialog.messageBox(title, msg, btns).open().then(function(result) {
-            if (result == "ok") {
-                success();
+        var msg = 'Are you sure you want to permanently generate new keys for ' + name + '?';
+        var btns = {
+            ok: {
+                label: 'Generate Keys',
+                cssClass: 'btn btn-danger'
+            },
+            cancel: {
+                label: 'Cancel',
+                cssClass: 'btn btn-default'
            }
-        });
+        }
+
+        openDialog(title, msg, btns).then(success);
    }

    dialog.confirm = function(title, message, success, cancel) {
        var title = title;
        var msg = '<span class="primary">' + message + '"</span>';
-        var btns = [ {
-            result : 'cancel',
-            label : 'Cancel',
-            cssClass : 'btn btn-default'
-        }, {
-            result : 'ok',
-            label : title,
-            cssClass : 'btn btn-danger'
-        } ];
-
-        $dialog.messageBox(title, msg, btns).open().then(function(result) {
-            if (result == "ok") {
-                success();
-            } else {
-                cancel && cancel();
+        var btns = {
+            ok: {
+                label: title,
+                cssClass: 'btn btn-danger'
+            },
+            cancel: {
+                label: 'Cancel',
+                cssClass: 'btn btn-default'
            }
-        });
+        }
+
+        openDialog(title, msg, btns).then(success).reject(cancel);
    }

 	return dialog
@@ -37,17 +37,13 @@
                    </div>
                </div>

-                <div class="form-group clearfix block">
+                <div class="form-group clearfix block" data-ng-show="authProvider.providerName">
                    <label class="col-sm-2 control-label" for="passwordUpdateSupported">Password Update Supported</label>
                    <div class="col-sm-4">
                        <input ng-model="authProvider.passwordUpdateSupported" name="passwordUpdateSupported" id="passwordUpdateSupported" onoffswitch />
                    </div>
                </div>

-            </fieldset>
-
-            <fieldset>
-                <legend data-ng-show="authProvider.providerName"><span class="text">{{authProvider.providerName|capitalize}}'s provider options</span></legend>
                <div data-ng-repeat="option in authProviderOptionNames" class="form-group">
                    <label class="col-sm-2 control-label">{{option|capitalize}} </label>

@@ -28,7 +28,14 @@
            <tr ng-repeat="authProvider in authenticationProviders">
                <td><a href="#/realms/{{realm.realm}}/auth-settings/{{$index}}">{{authProvider.providerName|capitalize}}</a></td>
                <td>{{authProvider.passwordUpdateSupported}}</td>
-                <td>{{authProvider.config}}</td>
+                <td>
+                    <table class="table table-striped table-bordered" data-ng-show="authProvider.config">
+                        <tr data-ng-repeat="(key, value) in authProvider.config">
+                            <td>{{key}}</td>
+                            <td>{{value}}</td>
+                        </tr>
+                    </table>
+                </td>
            </tr>
            <tr data-ng-show="!authenticationProviders || authenticationProviders.length == 0">
                <td>No authentication providers available</td>
@@ -1,14 +1,11 @@
-<div class="modal-dialog" tabindex="-1" role="dialog">
-    <div class="modal-content">
-        <div class="modal-header">
-            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
-                <span class="pficon pficon-close"></span>
-            </button>
-            <h4 class="modal-title" id="myModalLabel">{{ title }}</h4>
-        </div>
-        <div class="modal-body"><p ng-bind-html-unsafe="message"></p></div>
-        <div class="modal-footer">
-            <button ng-repeat="btn in buttons" ng-click="close(btn.result)" class="" ng-class="btn.cssClass">{{ btn.label }}</button>
-        </div>
-    </div>
+<div class="modal-header">
+    <button type="button" class="close" ng-click="cancel()">
+        <span class="pficon pficon-close"></span>
+    </button>
+    <h4 class="modal-title">{{title}}</h4>
+</div>
+<div class="modal-body">{{message}}</div>
+<div class="modal-footer">
+    <button type="button" data-ng-class="btns.cancel.cssClass" ng-click="cancel()">{{btns.cancel.label}}</button>
+    <button type="button" data-ng-class="btns.ok.cssClass" ng-click="ok()">{{btns.ok.label}}</button>
 </div>
@@ -1,6 +1,6 @@
 <ul class="nav nav-tabs nav-tabs-pf">
    <li ng-class="{active: !path[2]}"><a href="#/realms/{{realm.realm}}">General</a></li>
-    <li ng-class="{active: path[2] == 'social'}" data-ng-show="realm.social && access.viewRealm"><a href="#/realms/{{realm.realm}}/social-settings">Social</a></li>
+    <li ng-class="{active: path[2] == 'social-settings'}" data-ng-show="realm.social && access.viewRealm"><a href="#/realms/{{realm.realm}}/social-settings">Social</a></li>
    <li ng-class="{active: path[2] == 'roles'}" data-ng-show="access.viewRealm"><a href="#/realms/{{realm.realm}}/roles">Roles</a></li>
    <li ng-class="{active: path[2] == 'default-roles'}" data-ng-show="access.viewRealm"><a href="#/realms/{{realm.realm}}/default-roles">Default Roles</a></li>
    <li ng-class="{active: path[2] == 'required-credentials'}" data-ng-show="access.viewRealm"><a href="#/realms/{{realm.realm}}/required-credentials">Credentials</a></li>
@@ -310,7 +310,7 @@ form .btn + .btn {
    background-color: #c7e5f0;
    border-color: #56bae0;
    font-weight: bold;
-    background-image: url(../img/icon-sidebar-active.svg);
+    background-image: url(../img/icon-sidebar-active.png);
    background-repeat: no-repeat;
    background-position: right center;
 }
@@ -522,7 +522,7 @@ legend .kc-icon-collapse {

 .header .navbar-primary li > .select-kc {
    background-color: #555A5E;
-    background-image: url("../img/sprite-arrow-down.svg");
+    background-image: url("../img/sprite-arrow-down.png");
    background-position: right -26px;
    background-repeat: no-repeat;
    border: 1px solid #676C6E;
@@ -1,7 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
-<svg version="1.0" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 width="23px" height="14px" viewBox="0 0 23 14" enable-background="new 0 0 23 14" xml:space="preserve">
-<polyline fill="none" stroke="#009AD8" stroke-miterlimit="10" points="1,13 7,7 1,1 "/>
-</svg>
@@ -1,8 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
-<svg version="1.0" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 width="22px" height="52px" viewBox="0 0 22 52" enable-background="new 0 0 22 52" xml:space="preserve">
-<polygon fill="#828487" points="11,16 6.818,11.818 7.525,11.111 11,14.586 14.475,11.111 15.182,11.818 "/>
-<polygon fill="#DBDADA" points="11,42 6.818,37.818 7.525,37.111 11,40.586 14.475,37.111 15.182,37.818 "/>
-</svg>
@@ -1,6 +1,2 @@
@import url("../lib/patternfly/css/patternfly.css");
-@import url("../lib/select2-3.4.1/select2.css");
-
-@import url("admin-console.css");
-@import url("tables.css");
-@import url("sprites.css");
+@import url("../lib/select2-3.4.1/select2.css");
@@ -1,175 +0,0 @@
-/**
- * @license AngularJS v1.0.7
- * (c) 2010-2012 Google, Inc. http://angularjs.org
- * License: MIT
- */
-(function(window, angular, undefined) {
-'use strict';
-
-var directive = {};
-
-directive.dropdownToggle =
-          ['$document', '$location', '$window',
-  function ($document,   $location,   $window) {
-    var openElement = null, close;
-    return {
-      restrict: 'C',
-      link: function(scope, element, attrs) {
-        scope.$watch(function dropdownTogglePathWatch(){return $location.path();}, function dropdownTogglePathWatchAction() {
-          close && close();
-        });
-
-        element.parent().bind('click', function(event) {
-          close && close();
-        });
-
-        element.bind('click', function(event) {
-          event.preventDefault();
-          event.stopPropagation();
-
-          var iWasOpen = false;
-
-          if (openElement) {
-            iWasOpen = openElement === element;
-            close();
-          }
-
-          if (!iWasOpen){
-            element.parent().addClass('open');
-            openElement = element;
-
-            close = function (event) {
-              event && event.preventDefault();
-              event && event.stopPropagation();
-              $document.unbind('click', close);
-              element.parent().removeClass('open');
-              close = null;
-              openElement = null;
-            }
-
-            $document.bind('click', close);
-          }
-        });
-      }
-    };
-  }];
-
-
-directive.tabbable = function() {
-  return {
-    restrict: 'C',
-    compile: function(element) {
-      var navTabs = angular.element('<ul class="nav nav-tabs"></ul>'),
-          tabContent = angular.element('<div class="tab-content"></div>');
-
-      tabContent.append(element.contents());
-      element.append(navTabs).append(tabContent);
-    },
-    controller: ['$scope', '$element', function($scope, $element) {
-      var navTabs = $element.contents().eq(0),
-          ngModel = $element.controller('ngModel') || {},
-          tabs = [],
-          selectedTab;
-
-      ngModel.$render = function() {
-        var $viewValue = this.$viewValue;
-
-        if (selectedTab ? (selectedTab.value != $viewValue) : $viewValue) {
-          if(selectedTab) {
-            selectedTab.paneElement.removeClass('active');
-            selectedTab.tabElement.removeClass('active');
-            selectedTab = null;
-          }
-          if($viewValue) {
-            for(var i = 0, ii = tabs.length; i < ii; i++) {
-              if ($viewValue == tabs[i].value) {
-                selectedTab = tabs[i];
-                break;
-              }
-            }
-            if (selectedTab) {
-              selectedTab.paneElement.addClass('active');
-              selectedTab.tabElement.addClass('active');
-            }
-          }
-
-        }
-      };
-
-      this.addPane = function(element, attr) {
-        var li = angular.element('<li><a href></a></li>'),
-            a = li.find('a'),
-            tab = {
-              paneElement: element,
-              paneAttrs: attr,
-              tabElement: li
-            };
-
-        tabs.push(tab);
-
-        attr.$observe('value', update)();
-        attr.$observe('title', function(){ update(); a.text(tab.title); })();
-
-        function update() {
-          tab.title = attr.title;
-          tab.value = attr.value || attr.title;
-          if (!ngModel.$setViewValue && (!ngModel.$viewValue || tab == selectedTab)) {
-            // we are not part of angular
-            ngModel.$viewValue = tab.value;
-          }
-          ngModel.$render();
-        }
-
-        navTabs.append(li);
-        li.bind('click', function(event) {
-          event.preventDefault();
-          event.stopPropagation();
-          if (ngModel.$setViewValue) {
-            $scope.$apply(function() {
-              ngModel.$setViewValue(tab.value);
-              ngModel.$render();
-            });
-          } else {
-            // we are not part of angular
-            ngModel.$viewValue = tab.value;
-            ngModel.$render();
-          }
-        });
-
-        return function() {
-          tab.tabElement.remove();
-          for(var i = 0, ii = tabs.length; i < ii; i++ ) {
-            if (tab == tabs[i]) {
-              tabs.splice(i, 1);
-            }
-          }
-        };
-      }
-    }]
-  };
-};
-
-directive.table = function() {
-  return {
-    restrict: 'E',
-    link: function(scope, element, attrs) {
-      element[0].className = 'table table-bordered table-striped code-table';
-    }
-  };
-};
-
-directive.tabPane = function() {
-  return {
-    require: '^tabbable',
-    restrict: 'C',
-    link: function(scope, element, attrs, tabsCtrl) {
-      element.bind('$remove', tabsCtrl.addPane(element, attrs));
-    }
-  };
-};
-
-
-angular.module('bootstrap', []).directive(directive);
-
-
-})(window, window.angular);
@@ -10,9 +10,9 @@
        <div id="kc-code">
            <#if code.success>
                <p>Please copy this code and paste it into your application:</p>
-                <textarea id="code">${code.code}</textarea>
+                <textarea id="code" class="${properties.kcTextareaClass!}">${code.code}</textarea>
            <#else>
-                <p>${code.error}</p>
+                <p id="error">${code.error}</p>
            </#if>
        </div>
    </#if>
@@ -186,6 +186,10 @@ ol#kc-totp-settings li:first-of-type {
    width: 125px;
 }

+.zocial:hover {
+    color: #fff !important;
+}
+
 .zocial.facebook,
 .zocial.github,
 .zocial.google,
@@ -23,5 +23,6 @@ kcInputClass=form-control
 kcInputWrapperClass=col-xs-12 col-sm-12 col-md-8 col-lg-9
 kcFormOptionsClass=col-xs-4 col-sm-5 col-md-offset-4 col-md-4 col-lg-offset-3 col-lg-5
 kcFormButtonsClass=col-xs-8 col-sm-7 col-md-4 col-lg-4 submit
+kcTextareaClass=form-control

 kcInfoAreaClass=col-xs-12 col-sm-4 col-md-4 col-lg-6 details