Work in progress

webapp/sources/rudder/rudder-web/src/main/javascript/rudder/angular/passwordForm.js

@@ -89,10 +89,7 @@ passwordModule.controller("passwordController", function($scope) {
       $scope.current.isScript = isScript;
     }
     defaultHash = currentHash
-    if (current === undefined) {
-      currentAction = "change"
-      $scope.action = "change";
-    }
+
     if (currentAction === "change") {
       $scope.newPassword.password=current;
       $scope.newPassword.hash = currentHash;
@@ -114,7 +111,7 @@ passwordModule.controller("passwordController", function($scope) {
     }
     $scope.hashes = hashes;
     $scope.displayedPass = $scope.current.password;
-    $scope.action = currentAction;
+    $scope.action = currentAction === undefined ? "change" : currentAction;
     $scope.otherPasswords = otherPasswords;
     $scope.canBeDeleted = canBeDeleted;
     $scope.scriptEnabled = scriptEnabled;

webapp/sources/rudder/rudder-web/src/main/javascript/rudder/directive-inputs.js

@@ -36,6 +36,7 @@
 
 // Dict containing all directive input data
 var directiveInputs = new Object();
+var passwordForms   = new Object();
 
 function newInputText(id, value, prefix, featureEnabled){
   // New input data
@@ -93,4 +94,304 @@ function updateResult(element){
   var newValue       = inputModel.feature ? (inputModel.prefix + value) : value;
   var inputResult    = $("#" + formId + "-value");
   inputResult.val(newValue);
-}
+}
+
+// Password field
+class PasswordForm {
+  // Current password, and 'other passwords' defined if there is a 'slave' field, displayedPass is the pass we currently display
+  current =
+    { password : undefined
+    , hash     : "md5"
+    , show     : false
+    , isScript : false
+    };
+
+  otherPasswords = undefined;
+  displayedPass  = undefined;
+
+  // New password if we want to change it
+  newPassword =
+    { password : undefined
+    , hash     : "md5"
+    , show     : false
+    , isScript : false
+    };
+
+  // Possible hashes defined for this password input
+  hashes        = {};
+  #defaultHash  = undefined;
+
+  // Default value
+  action        = "keep";
+  formType      = "withHashes";
+  canBeDeleted  = false;
+  scriptEnabled = false;
+
+  // Result (the value that will be sent back to Lift form), initialized as undefined, but will be update directly and on every change of action and the new password (so will be changed on init)
+  result = undefined;
+
+  constructor(currentValue, currentHash, isScript, currentAction, hashes, otherPasswords, canBeDeleted, scriptEnabled, previousHash, previousAlgo, previousIsScript) {
+
+    this.#defaultHash  = currentHash;
+
+    if (currentAction === "keep") {
+      this.current.password = currentValue;
+      this.current.hash     = currentHash;
+      this.current.isScript = isScript;
+
+    } else if (currentAction === "change") {
+      this.newPassword.password = currentValue;
+      this.newPassword.hash     = currentHash;
+      this.newPassword.isScript = isScript;
+
+      if (isScript) {
+        this.formType = "script";
+      } else if (currentHash === "pre-hashed") {
+        this.formType = "preHashed";
+      } else if (currentHash === "plain") {
+        this.formType = "clearText";
+      } else {
+        this.formType = "withHashes";
+      }
+
+      this.current.password = previousPass;
+      this.current.hash     = previousHash;
+      this.current.isScript = previousIsScript;
+    }
+
+    this.hashes         = hashes;
+    this.displayedPass  = this.current.password;
+    this.action         = currentAction === undefined ? "change" : currentAction;
+    this.otherPasswords = otherPasswords;
+    this.canBeDeleted   = canBeDeleted;
+    this.scriptEnabled  = scriptEnabled;
+  }
+
+  updateResult() {
+    // Keep and delete, use current password as base
+    let result = this.action === "change" ? Object.assign({}, this.newPassword) : Object.assign({}, this.current)
+
+    if (result.hash === "plain" && result.isScript) {
+      result.password = "evaljs:" + result.password;
+    }
+
+    // Action will allow to differentiate between 'delete' and 'keep' and is used for 'change' too
+    result.action = this.action
+    this.result   = JSON.stringify(result);
+  }
+
+  displayCurrentHash() {
+    if (this.current.hash === "plain") {
+      return "Clear text password";
+    } else if (this.current.hash === "pre-hashed") {
+      return "Pre hashed password";
+    } else {
+      return this.hashes[this.current.hash] + " hash";
+    }
+  }
+
+  changeDisplayPass(password) {
+    console.log("-_-_-_-_-_-_-_-_")
+    console.log(password)
+    this.displayedPass = password;
+  }
+
+  passwordForm(formType) {
+    this.newPassword.isScript = false;
+    if(formType === "withHashes") {
+      // If no hash was set put it to default hash
+      this.newPassword.hash = defaultHash;
+    } else if (formType === "clearText") {
+      this.newPassword.hash = "plain";
+    } else if (formType === "preHashed") {
+      this.newPassword.hash = "pre-hashed";
+    } else if (formType === "script") {
+      this.newPassword.hash = "plain";
+      this.newPassword.isScript = true;
+    }
+    this.formType = formType;
+  }
+
+  changeAction(action) {
+    this.action = action;
+    if (action === "change") {
+      if (this.current.isScript) {
+        this.formType = "script";
+        this.newPassword = this.current;
+      } else if (this.current.hash === "pre-hashed") {
+        this.formType = "preHashed";
+      } else if (this.current.hash === "plain") {
+        this.formType = "clearText";
+      } else {
+        this.formType = "withHashes";
+      }
+      this.newPassword.hash = this.current.hash;
+    }
+  }
+
+  // Do not display current password if undefined or if you want to delete password
+  displayCurrent() {
+    return this.current.password !== undefined && this.action !== 'delete';
+  }
+}
+
+function displayCurrentActionSection(formId){
+  // Get passwordForm data
+  var passwordForm = passwordForms[formId];
+  if (passwordForm === undefined) return false;
+
+  var container = $('#' + formId);
+  container.find('.action-section').hide();
+
+  var actionSection = "";
+  var current = passwordForm.current
+
+  switch(passwordForm.action){
+    case "delete" :
+      actionSection = currentAction;
+      break;
+
+    case "change" :
+      actionSection = currentAction;
+      break;
+
+    default:
+      if(passwordForm.current.password !== undefined){
+        actionSection = "default";
+        var passwdContainer, inputPasswd;
+        if(current.isScript){
+          passwdContainer = container.find(".is-script").show();
+          container.find(".is-passwd").hide();
+
+          // ACTION BUTTONS
+          var btnChange = passwdContainer.find("[data-action='change']");
+          var btnKeep   = passwdContainer.find("[data-action='keep']  ");
+          var btnDelete = passwdContainer.find("[data-action='delete']");
+          if(passwordForm.action === "change"){
+            btnChange.hide();
+            btnKeep.show();
+          }else{
+            btnChange.show();
+            btnKeep.hide();
+          }
+          if(passwordForm.canBeDeleted){
+            btnDelete.show();
+          }else{
+            btnDelete.hide();
+          }
+          $("[data-action]").each(function(){
+            var action = $(this).attr("data-action");
+            $(this).on('click', function(){
+              passwordForm.changeAction(action);
+            });
+          });
+
+          //
+          inputPasswd = passwdContainer.find(".toggle-type");
+          inputPasswd.val(passwordForm.current.password);
+          inputPasswd.on("input", function(){
+            var newVal = this.value;
+            console.log(newVal);
+            passwordForm.current.password = newVal;
+          });
+        } else {
+
+          // DISPLAY CURRENT HASH
+          $("[current-hash]").html(passwordForm.displayCurrentHash());
+
+          passwdContainer = container.find(".is-passwd").show();
+          container.find(".is-script").hide();
+          if(current.show){
+            inputPasswd = passwdContainer.find(".toggle-type.current-show").show();
+            passwdContainer.find(".toggle-type.current-hide").hide();
+          } else {
+            inputPasswd = passwdContainer.find(".toggle-type.current-hide").show();
+            passwdContainer.find(".toggle-type.current-show").hide();
+          }
+          inputPasswd.val(passwordForm.displayedPass);
+          inputPasswd.on("input", function(){
+            var newVal = this.value;
+            console.log(newVal);
+            passwordForm.current.password = newVal;
+            passwordForm.displayedPass = newVal;
+          });
+
+          // DROPDOWN TOGGLE
+          var btnToggle = container.find(".dropdown-toggle");
+          var ulToggle  = container.find(".dropdown-menu");
+          if(passwordForm.otherPasswords !== undefined){
+            btnToggle.show();
+            var li = $("<li>");
+            var a  = $("<a>").text("Default").on('click', function(){
+              passwordForm.changeDisplayPass(passwordForm.otherPasswords[current.password]);
+            });
+            li.append(a);
+            ulToggle.append(li)
+            for (pwd in passwordForm.otherPasswords){
+              li = $("<li>");
+              a  = $("<a>").text(pwd).on('click', function(){
+                passwordForm.changeDisplayPass(passwordForm.otherPasswords[pwd]);
+              });
+              li.append(a);
+              ulToggle.append(li)
+            }
+          }else{
+            btnToggle.hide();
+          }
+
+          // ACTION BUTTONS
+          var btnChange = passwdContainer.find("[data-action='change']");
+          var btnKeep   = passwdContainer.find("[data-action='keep']  ");
+          var btnDelete = passwdContainer.find("[data-action='delete']");
+          if(passwordForm.action === "change"){
+            btnChange.hide();
+            btnKeep.show();
+          }else{
+            btnChange.show();
+            btnKeep.hide();
+          }
+          if(passwordForm.canBeDeleted){
+            btnDelete.show();
+          }else{
+            btnDelete.hide();
+          }
+          $("[data-action]").each(function(){
+            var action = $(this).attr("data-action");
+            $(this).on('click', function(){
+              passwordForm.changeAction(action);
+            });
+          });
+
+          //
+        }
+      }else{
+        createErrorNotification("Error while loading password form")
+      }
+  }
+
+  container.find('.action-section.action-' + actionSection).show();
+
+  console.log("=========");
+  console.log(passwordForm);
+  console.log(container.find('.action-section'))
+  return true;
+}
+
+function revealPassword(btn){
+  var formId = $(btn).parents().find(".password-app").attr("id");
+  var passwordForm = passwordForms[formId];
+
+  var reveal    = !passwordForm.current.show
+  var iconClass = reveal ? "glyphicon glyphicon-eye-close" : "glyphicon glyphicon-eye-open"
+
+  $(btn).toggleClass("revealed").find(".glyphicon").attr("class", iconClass);
+  passwordForms[formId].current.show = reveal;
+}
+/* ===
+ -- Show correct section acocrding to the current action.
+ -- Actions can be:
+ --   - default
+ --   - change
+ --   - delete
+
+=== */

webapp/sources/rudder/rudder-web/src/main/scala/com/normation/rudder/web/model/DirectiveFieldEditors.scala

@@ -808,7 +808,7 @@ class PasswordField(
   def toForm = {
     val hashes                                  = JsObj(algos.filterNot(x => x == PLAIN || x == PreHashed).map(a => (a.prefix, Str(a.name))): _*)
     val formId                                  = Helpers.nextFuncName
-    val valueInput                              = SHtml.text("", s => parseClient(s), ("ng-model", "result"), ("ng-hide", "true"))
+    val valueInput                              = SHtml.text("", s => parseClient(s), ("class", "input-result"))
     val otherPasswords                          =
       if (slavesValues().size == 0) "undefined" else JsObj(slavesValues().view.mapValues(Str(_)).toSeq: _*).toJsCmd
     val (scriptEnabled, isScript, currentValue) = scriptSwitch().getOrElse(Disabled) match {
@@ -846,23 +846,23 @@ class PasswordField(
 
     val initScript = {
       Script(OnLoad(JsRaw(s"""
-       angular.bootstrap("#${formId}", ['password']);
-       var scope = angular.element($$("#${formId}-controller")).scope();
-       scope.$$apply(function(){
-         scope.init(
-             ${currentValue.map(Str(_).toJsCmd).getOrElse("undefined")}
-           , ${currentAlgo.map(x => Str(x.prefix).toJsCmd).getOrElse("undefined")}
-           , ${isScript}
-           , ${Str(currentAction).toJsCmd}
-           , ${hashes.toJsCmd}
-           , ${otherPasswords}
-           , ${canBeDeleted}
-           , ${scriptEnabled}
-           , ${prevHash.map(Str(_).toJsCmd).getOrElse("undefined")}
-           , ${prevAlgo.map(x => Str(x.prefix).toJsCmd).getOrElse("undefined")}
-           , ${previousScript}
-         );
-       });""")))
+       var passwordForm = new PasswordForm(
+         ${currentValue.map(Str(_).toJsCmd).getOrElse("undefined")}
+         , ${currentAlgo.map(x => Str(x.prefix).toJsCmd).getOrElse("undefined")}
+         , ${isScript}
+         , ${Str(currentAction).toJsCmd}
+         , ${hashes.toJsCmd}
+         , ${otherPasswords}
+         , ${canBeDeleted}
+         , ${scriptEnabled}
+         , ${prevHash.map(Str(_).toJsCmd).getOrElse("undefined")}
+         , ${prevAlgo.map(x => Str(x.prefix).toJsCmd).getOrElse("undefined")}
+         , ${previousScript}
+       );
+       passwordForms["${formId}"] = passwordForm;
+       console.log(passwordForms);
+       displayCurrentActionSection("${formId}");
+       """)))
     }
 
     val form = (".password-section *+" #> valueInput).apply(PasswordField.xml(formId)) ++ initScript

webapp/sources/rudder/rudder-web/src/main/style/rudder/rudder-directives.css

@@ -286,6 +286,9 @@
 .directive-input-group .btn-group.input-feature + textarea.form-control{
   border-top-left-radius: 0 !important;
 }
+.password-app .input-result{
+  display: none !important;
+}
 
 /* === OVERRIDE TEMPLATE === */
 .main-header.no-header,