fix GUI

server/src/main/java/io/druid/server/coordinator/rules/ForeverLoadRule.java

@@ -57,7 +57,8 @@ public class ForeverLoadRule extends LoadRule
   @Override
   public int getNumReplicants(String tier)
   {
-    return tieredReplicants.get(tier);
+    Integer retVal = tieredReplicants.get(tier);
+    return (retVal == null) ? 0 : retVal;
   }
 
   @Override

server/src/main/resources/static/css/rules.css

@@ -36,8 +36,9 @@
   margin: 0 10px 0 10px;
 }
 
-.delete_rule {
+.delete_rule, .add_tier {
   border-style : none;
   color:#555;
   background-color:#eee;
+  cursor: pointer;
 }

server/src/main/resources/static/js/rules-0.0.1.js

@@ -19,6 +19,7 @@ function makeRuleDiv(rule) {
   } else {
     retVal += makeRuleComponents(rule.type) + makeRuleBody(rule);
   }
+
   retVal += "</div>";
   return retVal;
 }
@@ -56,15 +57,15 @@ function makeRuleBody(rule) {
       case "loadByPeriod":
         retVal += makeLoadByPeriod(rule);
         break;
+      case "loadForever":
+        retVal += makeLoadForever(rule);
+        break;
       case "dropByInterval":
         retVal += makeDropByInterval(rule);
         break;
       case "dropByPeriod":
         retVal += makeDropByPeriod(rule);
         break;
-      case "loadForever":
-        retVal += makeLoadForever(rule);
-        break;
       case "dropForever":
         retVal += "";
         break;
@@ -80,42 +81,67 @@ function makeRuleBody(rule) {
 }
 
 function makeLoadByInterval(rule) {
-   return "<span class='rule_label'>interval</span><input type='text' class='long_text' name='interval' " + "value='" + rule.interval + "'/>" +
+  var retVal = "";
-          "<span class='rule_label'>replicants</span><input type='text' class='short_text' name='replicants' " + "value='" + rule.replicants + "'/>" +
+  retVal += "<span class='rule_label'>interval</span><input type='text' class='long_text' name='interval' " + "value='" + rule.interval + "'/>";
-          makeTiersDropdown(rule)
+  retVal += "<button type='button' class='add_tier'>Add Another Tier</button>";
-   ;
+  if (rule.tieredReplicants === undefined) {
+    retVal += makeTierLoad(null, 0);
+  }
+  for (var tier in rule.tieredReplicants) {
+    retVal += makeTierLoad(tier, rule.tieredReplicants[tier]);
+  }
+  return retVal;
 }
 
 function makeLoadByPeriod(rule) {
-  return "<span class='rule_label'>period</span><input type='text' name='period' " + "value='" + rule.period + "'/>" +
+  var retVal = "";
-         "<span class='rule_label'>replicants</span><input type='text' class='short_text' name='replicants' " + "value='" + rule.replicants + "'/>" +
+  retVal += "<span class='rule_label'>period</span><input type='text' name='period' " + "value='" + rule.period + "'/>";
-         makeTiersDropdown(rule)
+  retVal += "<button type='button' class='add_tier'>Add Another Tier</button>";
-  ;
+  if (rule.tieredReplicants === undefined) {
-}
+    retVal += makeTierLoad(null, 0);
-
+  }
-function makeDropByInterval(rule) {
+  for (var tier in rule.tieredReplicants) {
-   return "<span class='rule_label'>interval</span><input type='text' name='interval' " + "value='" + rule.interval + "'/>";
+    retVal += makeTierLoad(tier, rule.tieredReplicants[tier]);
-}
+  }
-
+  return retVal;
-function makeDropByPeriod(rule) {
-   return "<span class='rule_label'>period</span><input type='text' name='period' " + "value='" + rule.period + "'/>";
 }
 
 function makeLoadForever(rule) {
-  return "<span class='rule_label'>replicants</span><input type='text' class='short_text' name='replicants' " + "value='" + rule.replicants + "'/>" +
+  var retVal = "";
-         makeTiersDropdown(rule)
+  retVal += "<button type='button' class='add_tier'>Add Another Tier</button>";
-  ;
+  if (rule.tieredReplicants === undefined) {
+    retVal += makeTierLoad(null, 0);
+  }
+  for (var tier in rule.tieredReplicants) {
+    retVal += makeTierLoad(tier, rule.tieredReplicants[tier]);
+  }
+  return retVal;
+}
+
+function makeTierLoad(tier, val) {
+  return "<div class='rule_tier'>" +
+         "<span class='rule_label'>replicants</span><input type='text' class='short_text' name='replicants' " + "value='" + val + "'/>" +
+                      makeTiersDropdown(tier) +
+         "</div>";
+}
+
+function makeDropByInterval(rule) {
+  return "<span class='rule_label'>interval</span><input type='text' name='interval' " + "value='" + rule.interval + "'/>";
+}
+
+function makeDropByPeriod(rule) {
+  return "<span class='rule_label'>period</span><input type='text' name='period' " + "value='" + rule.period + "'/>";
 }
 
 function makeJSON() {
   return "<span class='rule_label'>JSON</span><input type='text' class='very_long_text' name='JSON'/>";
 }
 
-function makeTiersDropdown(rule) {
+function makeTiersDropdown(selTier) {
   var retVal = "<span class='rule_label'>tier</span><select class='tiers' name='tier'>"
 
   $.each(tiers, function(index, tier) {
-    if (rule.tier === tier) {
+    if (selTier === tier) {
       retVal += "<option selected='selected' value='" + tier + "'>" + tier + "</option>";
     } else {
       retVal += "<option value='" + tier + "'>" + tier + "</option>";
@@ -142,7 +168,7 @@ function getRules() {
 
 function domToRule(domRule) {
   var ruleType = $($(domRule).find(".rule_dropdown_types:first")).val();
-  var inputs = $($(domRule).find(".rule_body:first")).children(":not(span)");
+  var inputs = $($(domRule).find(".rule_body:first")).children("input");
 
   // Special case for free form JSON
   if (ruleType === "JSON") {
@@ -155,6 +181,17 @@ function domToRule(domRule) {
     var name = $(input).attr("name");
     rule[name] = $(input).val();
   });
+
+  var theTiers = $($(domRule).find(".rule_body:first")).children(".rule_tier");
+
+  var tieredReplicants = {};
+  $.each(theTiers, function(index, theTier) {
+    var tierName = $(theTier).find("select").val();
+    var replicants = $(theTier).find("[name=replicants]").val();
+    tieredReplicants[tierName] = replicants;
+  });
+  rule.tieredReplicants = tieredReplicants;
+
   return rule;
 }
 
@@ -251,6 +288,10 @@ $(document).ready(function() {
     $(event.target).parent(".rule").remove();
   });
 
+  $(".add_tier").live("click", function(event) {
+    $(event.target).parent().append(makeTierLoad(null, 0));
+  });
+
   $("#create_new_rule").click(function (event) {
     $('#rules_list').prepend(makeRuleDiv());
   });