(refs #28)Upload avatar part is separated from account editing form.

src/main/scala/app/AccountController.scala

@@ -105,6 +105,7 @@ trait AccountControllerBase extends ControllerBase with FlashMapSupport {
     } else NotFound
   }
 
+  // TODO Merge with UserManagementController
   private def updateImage(userName: String, fileId: Option[String]): Unit = {
     fileId.map { fileId =>
       val filename = "avatar." + FileUtil.getExtension(FileUploadUtil.getUploadedFilename(fileId).get)

src/main/scala/app/UserManagementController.scala

@@ -1,23 +1,30 @@
 package app
 
 import service._
-import util.AdminAuthenticator
+import util.{FileUploadUtil, FileUtil, AdminAuthenticator}
 import util.StringUtil._
 import jp.sf.amateras.scalatra.forms._
+import org.apache.commons.io.FileUtils
+import util.Directory._
+import scala.Some
 
 class UserManagementController extends UserManagementControllerBase with AccountService with AdminAuthenticator
 
 trait UserManagementControllerBase extends ControllerBase { self: AccountService with AdminAuthenticator =>
   
-  case class UserNewForm(userName: String, password: String, mailAddress: String, isAdmin: Boolean, url: Option[String])
+  case class UserNewForm(userName: String, password: String, mailAddress: String, isAdmin: Boolean,
-  case class UserEditForm(userName: String, password: Option[String], mailAddress: String, isAdmin: Boolean, url: Option[String])
+                         url: Option[String], fileId: Option[String])
+
+  case class UserEditForm(userName: String, password: Option[String], mailAddress: String, isAdmin: Boolean,
+                          url: Option[String], fileId: Option[String], clearImage: Boolean)
 
   val newForm = mapping(
     "userName"    -> trim(label("Username"     , text(required, maxlength(100), identifier, uniqueUserName))),
     "password"    -> trim(label("Password"     , text(required, maxlength(20)))),
     "mailAddress" -> trim(label("Mail Address" , text(required, maxlength(100), uniqueMailAddress()))),
     "isAdmin"     -> trim(label("User Type"    , boolean())),
-    "url"         -> trim(label("URL"          , optional(text(maxlength(200)))))
+    "url"         -> trim(label("URL"          , optional(text(maxlength(200))))),
+    "fileId"      -> trim(label("File ID"      , optional(text())))
   )(UserNewForm.apply)
 
   val editForm = mapping(
@@ -25,7 +32,9 @@ trait UserManagementControllerBase extends ControllerBase { self: AccountService
     "password"    -> trim(label("Password"     , optional(text(maxlength(20))))),
     "mailAddress" -> trim(label("Mail Address" , text(required, maxlength(100), uniqueMailAddress("userName")))),
     "isAdmin"     -> trim(label("User Type"    , boolean())),
-    "url"         -> trim(label("URL"          , optional(text(maxlength(200)))))
+    "url"         -> trim(label("URL"          , optional(text(maxlength(200))))),
+    "fileId"      -> trim(label("File ID"      , optional(text()))),
+    "clearImage"  -> trim(label("Clear image"  , boolean()))
   )(UserEditForm.apply)
   
   get("/admin/users")(adminOnly {
@@ -38,6 +47,7 @@ trait UserManagementControllerBase extends ControllerBase { self: AccountService
   
   post("/admin/users/_new", newForm)(adminOnly { form =>
     createAccount(form.userName, encrypt(form.password), form.mailAddress, form.isAdmin, form.url)
+    updateImage(form.userName, form.fileId)
     redirect("/admin/users")
   })
   
@@ -55,10 +65,31 @@ trait UserManagementControllerBase extends ControllerBase { self: AccountService
         isAdmin      = form.isAdmin,
         url          = form.url))
 
+      if(form.clearImage){
+        account.image.map { image =>
+          new java.io.File(getUserUploadDir(userName), image).delete()
+          updateAvatarImage(userName, None)
+        }
+      } else {
+        updateImage(userName, form.fileId)
+      }
+
       redirect("/admin/users")
     } getOrElse NotFound
   })
 
+  // TODO Merge with AccountController?
+  private def updateImage(userName: String, fileId: Option[String]): Unit = {
+    fileId.map { fileId =>
+      val filename = "avatar." + FileUtil.getExtension(FileUploadUtil.getUploadedFilename(fileId).get)
+      FileUtils.moveFile(
+        FileUploadUtil.getTemporaryFile(fileId),
+        new java.io.File(getUserUploadDir(userName), filename)
+      )
+      updateAvatarImage(userName, Some(filename))
+    }
+  }
+
   // TODO Merge with AccountController?
   private def uniqueUserName: Constraint = new Constraint(){
     def validate(name: String, value: String): Option[String] =

src/main/twirl/account/edit.scala.html

@@ -41,19 +41,7 @@
       <div class="span6">
         <fieldset>
           <label for="avatar"><strong>Image (Optional)</strong></label>
-          <div id="avatar" class="muted">
+          @helper.html.uploadavatar(account)
-            @if(account.nonEmpty && account.get.image.nonEmpty){
-              <img src="@path/@account.get.userName/_avatar" style="with: 120px; height: 120px;"/>
-            } else {
-              <div id="clickable">No Image</div>
-            }
-          </div>
-          @if(account.nonEmpty && account.get.image.nonEmpty){
-            <label>
-              <input type="checkbox" name="clearImage"/> Clear image
-            </label>
-          }
-          <input type="hidden" name="fileId" value=""/>
         </fieldset>
       </div>
     </div>
@@ -67,38 +55,3 @@
     </fieldset>
   </form>
 }
-<script>
-$(function(){
-  var dropzone = new Dropzone('div#clickable', {
-    url: '@path/upload/image',
-    previewsContainer: 'div#avatar',
-    paramName: 'file',
-    parallelUploads: 1,
-    thumbnailWidth: 120,
-    thumbnailHeight: 120
-  });
-
-  dropzone.on("success", function(file, id){
-    $('div#clickable').remove();
-    $('input[name=fileId]').val(id);
-  });
-});
-</script>
-<style type="text/css">
-div.dz-filename, div.dz-size, div.dz-progress, div.dz-success-mark, div.dz-error-mark, div.dz-error-message {
-  display: none;
-}
-
-div#clickable {
-  width: 100%;
-  text-align: center;
-  line-height: 120px;
-}
-
-div#avatar {
-  background-color: #f8f8f8;
-  border: 1px dashed silver;
-  width: 120px;
-  height: 120px;
-}
-</style>

src/main/twirl/admin/users/edit.scala.html

@@ -3,40 +3,50 @@
 @html.main(if(account.isEmpty) "New User" else "Update User"){
   @admin.html.menu("users"){
     <form method="POST" action="@if(account.isEmpty){@path/admin/users/_new} else {@path/admin/users/@account.get.userName/_edit}" validate="true">
-      <fieldset>
+      <div class="row-fluid">
-        <label for="userName"><strong>Username</strong></label>
+        <div class="span6">
-        <input type="text" name="userName" id="userName" value="@account.map(_.userName)"@if(account.isDefined){ readonly}/>
+          <fieldset>
-        <span id="error-userName" class="error"></span>
+            <label for="userName"><strong>Username</strong></label>
-      </fieldset>
+            <input type="text" name="userName" id="userName" value="@account.map(_.userName)"@if(account.isDefined){ readonly}/>
-      <fieldset>
+            <span id="error-userName" class="error"></span>
-        <label for="password"><strong>Password</strong>
+          </fieldset>
-          @if(account.isDefined){
+          <fieldset>
-            (Input to change password)
+            <label for="password"><strong>Password</strong>
-          }
+              @if(account.isDefined){
-        </label>
+                (Input to change password)
-        <input type="password" name="password" id="password" value="" autocomplete="off"/>
+              }
-        <span id="error-password" class="error"></span>
+            </label>
-      </fieldset>
+            <input type="password" name="password" id="password" value="" autocomplete="off"/>
-      <fieldset>
+            <span id="error-password" class="error"></span>
-        <label for="mailAddress"><strong>Mail Address</strong></label>
+          </fieldset>
-        <input type="text" name="mailAddress" id="mailAddress" value="@account.map(_.mailAddress)"/>
+          <fieldset>
-        <span id="error-mailAddress" class="error"></span>
+            <label for="mailAddress"><strong>Mail Address</strong></label>
-      </fieldset>
+            <input type="text" name="mailAddress" id="mailAddress" value="@account.map(_.mailAddress)"/>
-      <fieldset>
+            <span id="error-mailAddress" class="error"></span>
-        <label><strong>User Type</strong></label>
+          </fieldset>
-        <label for="userType_Normal">
+          <fieldset>
-          <input type="radio" name="isAdmin" id="userType_Normal" value="false"@if(account.isEmpty || !account.get.isAdmin){ checked}/> Normal
+            <label><strong>User Type</strong></label>
-        </label>
+            <label for="userType_Normal">
-        <label for="userType_Admin">
+              <input type="radio" name="isAdmin" id="userType_Normal" value="false"@if(account.isEmpty || !account.get.isAdmin){ checked}/> Normal
-          <input type="radio" name="isAdmin" id="userType_Admin" value="true"@if(account.isDefined && account.get.isAdmin){ checked}/> Administrator
+            </label>
-        </label>
+            <label for="userType_Admin">
-      </fieldset>
+              <input type="radio" name="isAdmin" id="userType_Admin" value="true"@if(account.isDefined && account.get.isAdmin){ checked}/> Administrator
-      <fieldset>
+            </label>
-        <label><strong>URL (Optional)</strong></label>
+          </fieldset>
-        <input type="text" name="url" id="url" style="width: 400px;" value="@account.map(_.url)"/>
+          <fieldset>
-        <span id="error-url" class="error"></span>
+            <label><strong>URL (Optional)</strong></label>
-      </fieldset>
+            <input type="text" name="url" id="url" style="width: 400px;" value="@account.map(_.url)"/>
-      <fieldset>
+            <span id="error-url" class="error"></span>
+          </fieldset>
+        </div>
+        <div class="span6">
+          <fieldset>
+            <label for="avatar"><strong>Image (Optional)</strong></label>
+            @helper.html.uploadavatar(account)
+          </fieldset>
+        </div>
+      </div>
+      <fieldset class="margin">
         <input type="submit" class="btn btn-success" value="@if(account.isEmpty){Create User} else {Update User}"/>
         <a href="@path/admin/users" class="btn">Cancel</a>
       </fieldset>

src/main/twirl/admin/users/list.scala.html

@@ -14,6 +14,7 @@
               <a href="@path/admin/users/@account.userName/_edit">Edit</a>
             </div>
             <div class="strong">
+              @helper.html.avatar(account.userName, 20)
               <a href="@url(account.userName)">@account.userName</a>
               @if(account.isAdmin){
                 (Administrator)

src/main/twirl/helper/activities.scala.html

@@ -8,9 +8,7 @@
     <div class="block">
       <div class="muted small">@datetime(activity.activityDate)</div>
       <div class="strong">
-        @if(avatar){
+        @helper.html.avatar(activity.activityUserName, 16)
-          @helper.html.avatar(activity.activityUserName, 16)
-        }
         @activityMessage(activity.message)
       </div>
       @activity.additionalInfo.map { additionalInfo =>

src/main/twirl/helper/uploadavatar.scala.html

@@ -0,0 +1,50 @@
+@(account: Option[model.Account])(implicit context: app.Context)
+@import context._
+<div id="avatar" class="muted">
+  @if(account.nonEmpty && account.get.image.nonEmpty){
+    <img src="@path/@account.get.userName/_avatar" style="with: 120px; height: 120px;"/>
+  } else {
+    <div id="clickable">No Image</div>
+  }
+</div>
+@if(account.nonEmpty && account.get.image.nonEmpty){
+  <label>
+    <input type="checkbox" name="clearImage"/> Clear image
+  </label>
+}
+<input type="hidden" name="fileId" value=""/>
+<script>
+$(function(){
+  var dropzone = new Dropzone('div#clickable', {
+    url: '@path/upload/image',
+    previewsContainer: 'div#avatar',
+    paramName: 'file',
+    parallelUploads: 1,
+    thumbnailWidth: 120,
+    thumbnailHeight: 120
+  });
+
+  dropzone.on("success", function(file, id){
+    $('div#clickable').remove();
+    $('input[name=fileId]').val(id);
+  });
+});
+</script>
+<style type="text/css">
+div.dz-filename, div.dz-size, div.dz-progress, div.dz-success-mark, div.dz-error-mark, div.dz-error-message {
+  display: none;
+}
+
+div#clickable {
+  width: 100%;
+  text-align: center;
+  line-height: 120px;
+}
+
+div#avatar {
+  background-color: #f8f8f8;
+  border: 1px dashed silver;
+  width: 120px;
+  height: 120px;
+}
+</style>