Open Source Monorail

appengine/monorail/templates/tracker/field-create-page.ezt

Index: appengine/monorail/templates/tracker/field-create-page.ezt
diff --git a/appengine/monorail/templates/tracker/field-create-page.ezt b/appengine/monorail/templates/tracker/field-create-page.ezt
new file mode 100644
index 0000000000000000000000000000000000000000..1234e02ac252f6019d27754f28029beaf3ed8155
--- /dev/null
+++ b/appengine/monorail/templates/tracker/field-create-page.ezt
@@ -0,0 +1,237 @@
+[define title]Add a Field[end]
+[define category_css]css/ph_detail.css[end]
+[include "../framework/master-header.ezt" "showtabs"]
+
+<a href="/p/[projectname]/adminLabels">&lsaquo; Back to field list</a><br><br>
+
+
+<h4>Add a custom field</h4>
+
+<form action="create.do" method="POST">
+<input type="hidden" name="token" value="[form_token]">
+
+<table cellspacing="8" class="rowmajor vt">
+  <tr>
+    <th width="1%">Name:</th>
+    <td>
+      <input id="fieldname" name="name" size="30" value="[initial_field_name]" class="acob">
+      <span id="fieldnamefeedback" class="fielderror" style="margin-left:1em">
+          [if-any errors.field_name][errors.field_name][end]
+      </span>
+    </td>
+  </tr>
+
+  <tr>
+    <th>Description:</th>
+    <td>
+      <textarea name="docstring" rows="4" cols="75">[initial_field_docstring]</textarea>
+    </td>
+  </tr>
+
+  <tr>
+    <th>Type:</th>
+    <td>
+      <select id="field_type" name="field_type">
+        <option value="enum_type" [is initial_type "enum_type"]selected="selected"[end]>Enum</option>
+        <option value="int_type" [is initial_type "int_type"]selected="selected"[end]>Integer</option>
+        <option value="str_type" [is initial_type "str_type"]selected="selected"[end]>String</option>
+        <option value="user_type" [is initial_type "user_type"]selected="selected"[end]>User</option>
+      </select>
+    </td>
+  </tr>
+
+  <tr>
+    <th>Applicable:</th>
+    <td>When issue type is:
+      <select id="applicable_type" name="applicable_type">
+        <option value="" [is initial_applicable_type ""]selected="selected"[end]>Anything</option>
+        <option disabled="disabled">----</option>
+        [for well_known_issue_types]
+          <option value="[well_known_issue_types]" [is initial_applicable_type well_known_issue_types]selected="selected"[end]>[well_known_issue_types]</option>
+        [end]
+      </select>
+      [# TODO(jrobbins): AND with free-form applicability predicate.]
+    </td>
+  </tr>
+
+  <tr>
+    <th>Required:</th>
+    <td>
+        <input type="checkbox" id="is_required" name="is_required" class="acob"
+               [if-any initial_is_required]checked="checked"[end]>
+        <label for="is_required">Required when applicable</label>
+    </td>
+  </tr>
+
+  <tr>
+    <th>Multivalued:</th>
+    <td>
+      <input type="checkbox" name="is_multivalued" class="acob"
+             [if-any initial_is_multivalued]checked="checked"[end]>
+    </td>
+  </tr>
+
+  <tr id="choices_row" style="display:none">
+    <th>Choices:</th>
+    <td>
+      <textarea id="choices" name="choices" rows="10" cols="75" style="tab-size:12"
+                >[initial_choices]</textarea>
+    </td>
+  </tr>
+
+  <tr id="int_row" style="display:none">
+    <th>Validation:</th>
+    <td>
+      Min value: <input type="number" name="min_value" style="text-align:right; width: 4em">
+      Max value: <input type="number" name="max_value" style="text-align:right; width: 4em"><br>
+    </td>
+  </tr>
+
+  <tr id="str_row" style="display:none">
+    <th>Validation:</th>
+    <td>
+      Regex: <input type="text" name="regex" size="30"><br>
+    </td>
+  </tr>
+
+  <tr id="user_row" style="display:none">
+    <th>Validation:</th>
+    <td>
+      <input type="checkbox" name="needs_member" id="needs_member" class="acob"
+             [if-any initial_needs_member]checked[end]>
+      <label for="needs_member">User must be a project member</label><br>
+      <span id="needs_perm_span" style="margin-left:1em">
+        Required permission:
+        <input type="text" name="needs_perm" id="needs_perm" size="20"
+               value="[initial_needs_perm]" class="acob">
+      </span><br>
+    </td>
+  </tr>
+  <tr id="user_row2" style="display:none">
+    <th>Permissions:</th>
+    <td>
+      The users named in this field is granted this permission on this issue:<br>
+      [# TODO(jrobbins): one-click way to specify View vs. EditIssue vs. any custom perm.]
+      <input type="text" name="grants_perm" id="grants_perm" class="acob"
+             size="20" value="[initial_grants_perm]" autocomplete="off">
+    </td>
+  </tr>
+  <tr id="user_row3" style="display:none">
+    <th>Notification:</th>
+    <td>
+      The users named in this field will be notified via email whenever:<br>
+      <select name="notify_on">
+        <option value="never" [is initial_notify_on "0"]selected="selected"[end]
+                >No notifications</option>
+        <option value="any_comment" [is initial_notify_on "1"]selected="selected"[end]
+                >Any change or comment is added</option>
+      </select>
+    </td>
+  </tr>
+
+  <th>Admins:</th>
+    <td>
+      <input id="member_admins" name="admin_names" size="75" value="[initial_admins]"
+             autocomplete="off" class="acob">
+      <span class="fielderror" style="margin-left:1em">
+          [if-any errors.field_admins][errors.field_admins][end]
+      </span>
+    </td>
+  </tr>
+
+  <tr>
+    <td></td>
+    <td>
+      <input id="submit_btn" type="submit" name="submit" value="Create field">
+    </td>
+  </tr>
+
+</table>
+</form>
+
+[include "../framework/footer-script.ezt"]
+
+<script type="text/javascript" nonce="[nonce]">
+runOnLoad(function() {
+  _fetchOptions('[projectname]', 'issueOptions',
+                CS_env.token, [project.cached_content_timestamp]);
+
+  _onload();
+  var submit = document.getElementById('submit_btn');
+  submit.disabled = 'disabled';
+  var fieldname = document.getElementById('fieldname');
+  var oldName = '';
+  fieldname.focus();
+
+  var fieldNameRE = /^[[]a-zA-Z]([[]-_]?[[]a-zA-Z0-9])*$/;
+
+  function checkFieldName() {
+    name = fieldname.value;
+    if (name != oldName) {
+      oldName = name;
+      feedback = document.getElementById('fieldnamefeedback');
+      submit.disabled = 'disabled';
+      if (name == '') {
+        feedback.innerText = 'Please choose a field name';
+      } else if (!fieldNameRE.test(name)) {
+        feedback.innerText = 'Invalid field name';
+      } else if (name.length > 30) {
+        feedback.innerText = 'Field name is too long';
+      } else {
+        _checkFieldNameOnServer('[projectname]', name, CS_env.token);
+      }
+    }
+  }
+
+  setInterval(checkFieldName, 700);
+
+  function updateForm(new_type) {
+    var choices_row = document.getElementById('choices_row');
+    choices_row.style.display = (new_type == 'enum_type') ? '' : 'none';
+
+    var int_row = document.getElementById('int_row');
+    int_row.style.display = (new_type == 'int_type') ? '' : 'none';
+
+    var str_row = document.getElementById('str_row');
+    str_row.style.display = (new_type == 'str_type') ? '' : 'none';
+
+    var user_row_display = (new_type == 'user_type') ? '' : 'none';
+    document.getElementById('user_row').style.display = user_row_display;
+    document.getElementById('user_row2').style.display = user_row_display;
+    document.getElementById('user_row3').style.display = user_row_display;
+  }
+
+  var type_select = document.getElementById('field_type');
+  updateForm(type_select.value);
+  type_select.addEventListener("change", function() {
+       updateForm(type_select.value);
+  });
+
+  var needs_perm_span = document.getElementById('needs_perm_span');
+  var needs_perm = document.getElementById('needs_perm');
+  function enableNeedsPerm(enable) {
+    needs_perm_span.style.color = enable ? 'inherit' : '#999';
+    needs_perm.disabled = enable ? '' : 'disabled';
+    if (!enable) needs_perm.value = '';
+  }
+  enableNeedsPerm(false);
+
+  var needs_member = document.getElementById("needs_member");
+  if (needs_member)
+    needs_member.addEventListener("change", function() {
+       enableNeedsPerm(needs_member.checked);
+    });
+
+  var acobElements = document.getElementsByClassName("acob");
+  for (var i = 0; i < acobElements.length; ++i) {
+     var el = acobElements[[]i];
+     el.addEventListener("focus", function(event) {
+         _acrob(null);
+         _acof(event);
+     });
+  }
+});
+</script>
+
+
+[include "../framework/master-footer.ezt"]