Implementing label editing form.

src/main/scala/app/LabelsController.scala

@@ -8,7 +8,7 @@ class LabelsController extends LabelsControllerBase
   with LabelsService with RepositoryService with AccountService with WritableRepositoryAuthenticator
 
 trait LabelsControllerBase extends ControllerBase {
-  self: LabelsService with WritableRepositoryAuthenticator =>
+  self: LabelsService with RepositoryService with WritableRepositoryAuthenticator =>
 
   case class LabelForm(labelName: String, color: String)
 
@@ -26,4 +26,15 @@ trait LabelsControllerBase extends ControllerBase {
     redirect("/%s/%s/issues".format(owner, repository))
   })
 
+  get("/:owner/:repository/issues/label/:labelId/edit")(writableRepository {
+    val owner      = params("owner")
+    val repository = params("repository")
+    val labelId    = params("labelId").toInt
+
+    getLabel(owner, repository, labelId) match {
+      case None    => NotFound()
+      case Some(l) => issues.html.labeledit(Some(l), getRepository(owner, repository, baseUrl).get)
+    }
+  })
+
 }

src/main/scala/service/LabelsService.scala

@@ -16,6 +16,11 @@ trait LabelsService {
       .sortBy(_.labelName asc)
       .list
 
+  def getLabel(owner: String, repository: String, labelId: Int): Option[Label] =
+    Query(Labels)
+      .filter(l => (l.userName is owner.bind) && (l.repositoryName is repository.bind) && (l.labelId is labelId.bind))
+      .firstOption
+
   def createLabel(owner: String, repository: String, labelName: String, color: String): Unit =
     Labels.ins insert (owner, repository, labelName, color)
 

src/main/twirl/issues/issues.scala.html

@@ -123,30 +123,27 @@ $(function(){
     }
   });
 
-  $('#editLabelForm').click(function(e){
-    e.stopPropagation();
-  });
-
   $('body').click(function(){
     hideEditLabelForm();
   });
 
   function showEditLabelForm(element){
-    var form = $('#editLabelForm');
-    form.detach();
-    form.find('input[name=editLabelName]').val($(element).attr('labelName'));
-    //form.find('input[name=editColor]').colorpicker('setValue', $(element).attr('color'));
-    form.find('input[name=editLabelId]').val($(element).attr('labelId'));
-    $(element).parent().append(form);
-    form.show();
+    $('#editLabelForm').remove();
+
+    $.ajax({
+      method: 'GET',
+      url: '@path/@repository.owner/@repository.name/issues/label/' + $(element).attr('labelId') + '/edit',
+      dataType: 'html',
+      success: function(data){
+        $(element).parent().append(data);
         $('ul#label-edit li').css('border', '1px solid white');
         $(element).parent().css('border', '1px solid #eee');
       }
+    });
+  }
 
   function hideEditLabelForm(){
-    var form = $('#editLabelForm');
-    form.find('input[name=editLabelId]').val('');
-    form.hide();
+    $('#editLabelForm').remove();
     $('ul#label-edit li').css('border', '1px solid white');
   }
 });

src/main/twirl/issues/labeledit.scala.html

@@ -1,31 +1,32 @@
 @(label: Option[model.Label], repository: service.RepositoryService.RepositoryInfo)(implicit context: app.Context)
 @import context._
 @defining((if(label.isEmpty) ("new", 190, 4) else ("edit", 180, 8))){ case (mode, width, margin) =>
+<div id="@(mode)LabelForm">
   <form method="POST" action="@path/@repository.owner/@repository.name/issues/label/@mode" validate="true" @if(mode == "edit"){ style="margin-bottom: 8px;"}>
     <span id="error-@(mode)LabelName" class="error"></span>
     <input type="text" name="@(mode)LabelName" id="@(mode)LabelName" style="width: @(width)px; margin-left: @(margin)px; margin-bottom: 0px;" value="@label.map(_.labelName)"@if(mode == "new"){ placeholder="New label name"}/>
-    <div id="@(mode)LabelForm"@if(mode == "new"){ style="display: none;"}>
     <span id="error-@(mode)Color" class="error"></span>
     <div class="input-append color bscp" data-color="#@label.map(_.color).getOrElse("888888")" data-color-format="hex" id="@(mode)Color" style="width: @(width)px; margin-bottom: 0px;">
-        <input type="text" class="span3" name="@(mode)Color" value="@label.map(_.color)" readonly style="width: @(width - 12)px; margin-left: @(margin)px;">
+      <input type="text" class="span3" name="@(mode)Color" value="#@label.map(_.color)" readonly style="width: @(width - 12)px; margin-left: @(margin)px;">
       <span class="add-on"><i style="background-color: #@label.map(_.color).getOrElse("888888");"></i></span>
     </div>
     <input type="submit" class="btn" style="margin-left: @(margin)px; margin-bottom: 0px;" value="@if(mode == "new"){Create} else {Save}"/>
-    </div>
+    @if(mode == "edit"){
+      <input type="hidden" name="editLabelId" value="@label.map(_.labelId)"/>
+    }
   </form>
   <script>
   @if(mode == "new"){
     $(function(){
       $('#newColor').colorpicker();
-
-      $('#newLabelName').focus(function(){
-        if($('#newLabelForm').css('display') == 'none'){
-          $('#newLabelForm').show();
-        }
-      });
     });
   } else {
     $('#editColor').colorpicker();
+
+    $('#editLabelForm').click(function(e){
+      e.stopPropagation();
+    });
   }
   </script>
+</div>
 }