Project import generated by Copybara.
GitOrigin-RevId: d9e9e3fb4e31372ec1fb43b178994ca78fa8fe70
diff --git a/templates/tracker/field-create-page.ezt b/templates/tracker/field-create-page.ezt
new file mode 100644
index 0000000..9b0bc11
--- /dev/null
+++ b/templates/tracker/field-create-page.ezt
@@ -0,0 +1,402 @@
+[define title]Add a Field[end]
+[define category_css]css/ph_detail.css[end]
+[include "../framework/header.ezt" "showtabs"]
+
+<a href="/p/[projectname]/adminLabels">‹ 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>
+ <option value="date_type" [is initial_type "date_type"]selected="selected"[end]>Date</option>
+ <option value="url_type" [is initial_type "url_type"]selected="selected"[end]>URL</option>
+ <option value="approval_type" [is initial_type "approval_type"]selected="selected"[end]>Approval</option>
+ </select>
+ </td>
+ </tr>
+
+ <tr class="js-make_phase_subfield">
+ <th>Issue Gate field:</th>
+ <td>
+ <input id="phase_input" type="checkbox" name="is_phase_field" class="acob"
+ [if-any initial_is_phase_field]checked="checked"[end]>
+ <label for="phase_input">This field can only belong to issue gates.</label>
+ </td>
+ </tr>
+
+ [if-any approval_names]
+ <tr class="js-make_approval_subfield">
+ <th>Parent Approval:</th>
+ <td>
+ <select id="parent_input" name="parent_approval_name">
+ <option value="" [is initial_parent_approval_name ""]selected[end]>Not an approval's subfield</option>
+ [for approval_names]
+ <option value="[approval_names]"
+ [is initial_parent_approval_name approval_names]selected[end]
+ >[approval_names]</option>
+ [end]
+ </select>
+ </td>
+ </tr>
+ [end]
+
+ [# TODO(jojwang): monorail:3241, evaluate how to use applicable/importance for approval subfields]
+ <tr id="applicable_row">
+ <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 id="importance_row">
+ <th>Importance:</th>
+ <td>
+ <select id="importance" name="importance">
+ <option value="required" [is initial_importance "required"]selected[end]>Required when applicable</option>
+ <option value="normal" [is initial_importance "normal"]selected[end]>Offered when applicable</option>
+ <option value="niche" [is initial_importance "niche"]selected[end]>Under "Show all fields" when applicable</option>
+ </select>
+ </td>
+ </tr>
+
+ <tr id="multi_row">
+ <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>
+ <span class="fielderror" style="margin-left: 1em">
+ [if-any errors.min_value][errors.min_value][end]</span><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>
+
+ <tr id="date_row" style="display:none">
+ <th>Action:</th>
+ <td>
+ When this date arrives:
+ <select name="date_action">
+ <option value="no_action" [is initial_date_action "no_action"]selected="selected"[end]
+ >No action</option>
+ [# TODO(jrobbins): owner-only option.]
+ <option value="ping_participants" [is initial_date_action "ping_participants"]selected="selected"[end]
+ >Post a "ping" comment and notify all issue participants</option>
+ </select>
+ </td>
+ </tr>
+
+ <tr id="approval_row" style="display:none">
+ <th>Approvers:</th>
+ <td>
+ <input id="member_approvers" name="approver_names" size="75" value="[initial_approvers]"
+ autocomplete="off">
+ <span class="fielderror" style="margin-left:1em">
+ [if-any errors.approvers][errors.approvers][end]
+ </span>
+ </td>
+ </tr>
+
+ <tr id="approval_row2" style="display:none">
+ <th>Survey:</th>
+ <td>
+ Any information feature owners need to provide for the approval team should be requested here.
+ <textarea name="survey" rows="4" cols="75">[initial_survey]</textarea>
+ </td>
+ </tr>
+
+ <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 id="field_restriction">
+ <th>Restriction
+ <i id="editors_tooltip" class="material-icons inline-icon" style="font-size:14px; vertical-align: text-bottom"
+ title="Project owners and field admins can always edit the values of a custom field.">
+ info_outline</i> :
+ </th>
+ <td style="display:flex; align-items:center">
+ <input id="editors_checkbox" type="checkbox" name="is_restricted_field" class="acob"
+ [if-any initial_is_restricted_field]checked="checked"[end]>
+ Restrict users that can edit values of this custom field.
+ </td>
+ </tr>
+ <tr id="editors_input" style="display:none">
+ <th>Editors:</th>
+ <td>
+ <input id="member_editors" name="editor_names" size="75" value="[initial_editors]"
+ autocomplete="off" class="acob" disabled>
+ <span class="fielderror" style="margin-left:1em">
+ [if-any errors.field_editors][errors.field_editors][end]
+ </span>
+ </td>
+ </tr>
+
+ <tr>
+ <td></td>
+ <td>
+ <input id="submit_btn" type="submit" name="submit" value="Create field">
+ </td>
+ </tr>
+
+</table>
+</form>
+
+<script type="text/javascript" nonce="[nonce]">
+runOnLoad(function() {
+ var submit = document.getElementById('submit_btn');
+ submit.disabled = 'disabled';
+ var fieldname = document.getElementById('fieldname');
+ var oldName = '';
+ fieldname.focus();
+
+ var fieldNameRE = /^[[]a-z]([[]-_]?[[]a-z0-9])*$/i;
+
+ function checkFieldName() {
+ name = fieldname.value;
+ if (name != oldName) {
+ oldName = name;
+ feedback = document.getElementById('fieldnamefeedback');
+ submit.disabled = 'disabled';
+ if (name == '') {
+ feedback.textContent = 'Please choose a field name';
+ } else if (!fieldNameRE.test(name)) {
+ feedback.textContent = 'Invalid field name';
+ } else if (name.length > 30) {
+ feedback.textContent = 'Field name is too long';
+ } else {
+ _checkFieldNameOnServer('[projectname]', name, CS_env.token);
+ }
+ }
+ }
+
+ setInterval(checkFieldName, 700);
+
+ function updateForm(new_type) {
+ let choices_row = document.getElementById('choices_row');
+ choices_row.style.display = (new_type == 'enum_type') ? '' : 'none';
+
+ // Approval fields cannot be subfields of approvals.
+ let approval_subfield_display = (new_type == 'approval_type') ? 'none' : '';
+ let approval_subfield_rows = document.getElementsByClassName('js-make_approval_subfield');
+ Array.prototype.forEach.call(approval_subfield_rows, row => {
+ row.style.display = approval_subfield_display;
+ });
+
+ // Enum and Approval fields cannot be gate subfields.
+ let gate_subfield_display = (new_type == 'enum_type' || new_type == 'approval_type') ? 'none': '';
+ let phase_subfield_rows = document.getElementsByClassName('js-make_phase_subfield');
+ Array.prototype.forEach.call(phase_subfield_rows, row => {
+ row.style.display = gate_subfield_display;
+ });
+
+ // Prevent users from making a field a Gate and Approval subfield.
+ if ($('parent_input')) {
+ let phase_input = $('phase_input');
+ let parent_input = $('parent_input');
+ parent_input.addEventListener('change', () => {
+ if (parent_input.value === '') {
+ phase_input.disabled = false;
+ } else {
+ phase_input.disabled = true;
+ }
+ });
+ phase_input.addEventListener('change', () => {
+ if (phase_input.checked) {
+ parent_input.disabled = true;
+ } else {
+ parent_input.disabled = false;
+ }
+ });
+ };
+
+ let int_row = document.getElementById('int_row');
+ int_row.style.display = (new_type == 'int_type') ? '' : 'none';
+
+ let str_row = document.getElementById('str_row');
+ str_row.style.display = (new_type == 'str_type') ? '' : 'none';
+
+ let 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;
+
+ let date_row_display = (new_type == 'date_type') ? '' : 'none';
+ document.getElementById('date_row').style.display = date_row_display;
+
+ let approval_row_display = (new_type == 'approval_type') ? '' : 'none';
+ let approval_row_hide = (new_type == 'approval_type') ? 'none' : '';
+ let new_type_is_approval = (new_type == 'approval_type');
+ document.getElementById(
+ 'multi_row').style.display = approval_row_hide;
+ document.getElementById(
+ 'importance_row').style.display = approval_row_hide;
+ document.getElementById(
+ 'applicable_row').style.display = approval_row_hide;
+ document.getElementById(
+ 'field_restriction').style.display = approval_row_hide;
+ if (new_type_is_approval) {
+ document.getElementById('editors_input').style.display = 'none';
+ } else {
+ if (document.getElementById('editors_checkbox').checked) {
+ document.getElementById('editors_input').style.display = '';
+ } else {
+ document.getElementById('editors_input').style.display = 'none';
+ }
+ }
+ document.getElementById(
+ 'editors_checkbox').disabled = new_type_is_approval;
+ document.getElementById(
+ 'member_editors').disabled = new_type_is_approval || !document.getElementById('editors_checkbox').checked;
+ document.getElementById('approval_row').style.display = approval_row_display;
+ document.getElementById('approval_row2').style.display = approval_row_display;
+ }
+
+ let type_select = document.getElementById('field_type');
+ updateForm(type_select.value);
+ type_select.addEventListener("change", function() {
+ updateForm(type_select.value);
+ });
+
+ let needs_perm_span = document.getElementById('needs_perm_span');
+ let 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);
+
+ //Enable editors input only when restricting the field.
+ document.getElementById('editors_checkbox').onchange = function() {
+ let member_editors = document.getElementById('member_editors');
+ let editors_input = document.getElementById('editors_input');
+ if (this.checked) {
+ editors_input.style.display = '';
+ } else {
+ editors_input.style.display = 'none';
+ }
+ member_editors.disabled = !this.checked;
+ };
+
+ let needs_member = document.getElementById("needs_member");
+ if (needs_member)
+ needs_member.addEventListener("change", function() {
+ enableNeedsPerm(needs_member.checked);
+ });
+
+ let acobElements = document.getElementsByClassName("acob");
+ for (let i = 0; i < acobElements.length; ++i) {
+ let el = acobElements[[]i];
+ el.addEventListener("focus", function(event) {
+ _acrob(null);
+ _acof(event);
+ });
+ }
+
+ $('member_approvers').addEventListener("focus", function(event) {
+ _acof(event);
+ });
+
+});
+</script>
+
+
+[include "../framework/footer.ezt"]