WEB-INF/templates/time_script.tpl

   1 <script>
   2 // This script is shared by time.tpl, time_edit.tpl (both regular and mobile),
   3 // and also by WEB-INF/templates/mobile/timer.tpl.
   4 // This creates certain restrictions, such as the form name being "timeRecordForm",
   5 // variables such as $client_list, $project_list and others to be assigned in php files
   6 // for all pages. Things need to be tested together for all involved files.
   7
   8 // We need a few arrays to populate project and task dropdowns.
   9 // When client selection changes, the project dropdown must be re-populated with only relevant projects.
  10 // When project selection changes, the task dropdown must be repopulated similarly.
  11 // Format:
  12 // project_ids[143] = "325,370,390,400";  // Comma-separated list of project ids for client.
  13 // project_names[325] = "Time Tracker";   // Project name.
  14 // task_ids[325] = "100,101,302,303,304"; // Comma-separated list ot task ids for project.
  15 // task_names[100] = "Coding";            // Task name.
  16
  17 // Prepare an array of project ids for clients.
  18 var project_ids = new Array();
  19 {foreach $client_list as $client}
  20   project_ids[{$client.id}] = "{$client.projects}";
  21 {/foreach}
  22 // Prepare an array of project names.
  23 var project_names = new Array();
  24 {foreach $project_list as $project}
  25   project_names[{$project.id}] = "{$project.name|escape:'javascript'}";
  26 {/foreach}
  27 // We'll use this array to populate project dropdown when client is not selected.
  28 var idx = 0;
  29 var projects = new Array();
  30 {foreach $project_list as $project}
  31   projects[idx] = new Array("{$project.id}", "{$project.name|escape:'javascript'}");
  32   idx++;
  33 {/foreach}
  34
  35 // Prepare an array of task ids for projects.
  36 var task_ids = new Array();
  37 {foreach $project_list as $project}
  38   task_ids[{$project.id}] = "{$project.tasks}";
  39 {/foreach}
  40 // Prepare an array of task names.
  41 var task_names = new Array();
  42 {foreach $task_list as $task}
  43   task_names[{$task.id}] = "{$task.name|escape:'javascript'}";
  44 {/foreach}
  45
  46 {if $template_dropdown}
  47 var templates = new Array();
  48 {foreach $templates as $template}
  49   templates[{$template.id}] = "{$template.content|escape:'javascript'}";
  50 {/foreach}
  51
  52 // The fillNote function populates the Note field with a selected template body.
  53 function fillNote(id) {
  54   if (!id) return; // Do nothing.
  55   var template_body = templates[id];
  56   var note = document.getElementById("note");
  57   note.value = template_body;
  58 }
  59 {/if}
  60
  61 // Mandatory top options for project and task dropdowns.
  62 var empty_label_project = "{$i18n.dropdown.select|escape:'javascript'}";
  63 var empty_label_task = "{$i18n.dropdown.select|escape:'javascript'}";
  64
  65 // The fillDropdowns function populates the "project" and "task" dropdown controls
  66 // with relevant values.
  67 function fillDropdowns() {
  68   if(document.body.contains(document.timeRecordForm.client))
  69     fillProjectDropdown(document.timeRecordForm.client.value);
  70
  71   fillTaskDropdown(document.timeRecordForm.project.value);
  72 }
  73
  74 // The fillProjectDropdown function populates the project combo box with
  75 // projects associated with a selected client (client id is passed here as id).
  76 function fillProjectDropdown(id) {
  77   var str_ids = project_ids[id];
  78   var dropdown = document.getElementById("project");
  79   // Determine previously selected item.
  80   var selected_item = dropdown.options[dropdown.selectedIndex].value;
  81
  82   // Remove existing content.
  83   dropdown.length = 0;
  84   var project_reset = true;
  85   // Add mandatory top option.
  86   dropdown.options[0] = new Option(empty_label_project, '', true);
  87
  88   // Populate project dropdown.
  89   if (!id) {
  90     // If we are here, client is not selected.
  91     var len = projects.length;
  92     for (var i = 0; i < len; i++) {
  93       dropdown.options[i+1] = new Option(projects[i][1], projects[i][0]);
  94       if (dropdown.options[i+1].value == selected_item)  {
  95         dropdown.options[i+1].selected = true;
  96         project_reset = false;
  97       }
  98     }
  99   } else if (str_ids) {
 100     var ids = new Array();
 101     ids = str_ids.split(",");
 102     var len = ids.length;
 103
 104     for (var i = 0; i < len; i++) {
 105       var p_id = ids[i];
 106       dropdown.options[i+1] = new Option(project_names[p_id], p_id);
 107       if (dropdown.options[i+1].value == selected_item)  {
 108         dropdown.options[i+1].selected = true;
 109         project_reset = false;
 110       }
 111     }
 112   }
 113
 114   // If project selection was reset - clear the tasks dropdown.
 115   if (project_reset) {
 116     dropdown = document.getElementById("task");
 117     dropdown.length = 0;
 118     dropdown.options[0] = new Option(empty_label_task, '', true);
 119   }
 120 }
 121
 122 // The fillTaskDropdown function populates the task combo box with
 123 // tasks associated with a selected project (project id is passed here as id).
 124 function fillTaskDropdown(id) {
 125   var str_ids = task_ids[id];
 126
 127   var dropdown = document.getElementById("task");
 128   if (dropdown == null) return; // Nothing to do.
 129
 130   // Determine previously selected item.
 131   var selected_item = dropdown.options[dropdown.selectedIndex].value;
 132
 133   // Remove existing content.
 134   dropdown.length = 0;
 135   // Add mandatory top option.
 136   dropdown.options[0] = new Option(empty_label_task, '', true);
 137
 138   // Populate the dropdown from the task_names array.
 139   if (str_ids) {
 140     var ids = new Array();
 141     ids = str_ids.split(",");
 142     var len = ids.length;
 143
 144     var idx = 1;
 145     for (var i = 0; i < len; i++) {
 146       var t_id = ids[i];
 147       if (task_names[t_id]) {
 148         dropdown.options[idx] = new Option(task_names[t_id], t_id);
 149         idx++;
 150       }
 151     }
 152
 153     // If a previously selected item is still in dropdown - select it.
 154     if (dropdown.options.length > 0) {
 155       for (var i = 0; i < dropdown.options.length; i++) {
 156         if (dropdown.options[i].value == selected_item) {
 157           dropdown.options[i].selected = true;
 158         }
 159       }
 160     }
 161
 162     // Select a task if user is required to do so and there is only one task available.
 163     if ({$user->task_required} && dropdown.options.length == 2) { // 2 because of mandatory top option.
 164       dropdown.options[1].selected = true;
 165     }
 166   }
 167 }
 168
 169 // The formDisable function disables some fields depending on what we have in other fields.
 170 function formDisable(formField) {
 171   var formFieldValue = eval("document.timeRecordForm." + formField + ".value");
 172   var formFieldName = eval("document.timeRecordForm." + formField + ".name");
 173   var x;
 174
 175   if (((formFieldValue != "") && (formFieldName == "start")) || ((formFieldValue != "") && (formFieldName == "finish"))) {
 176     x = eval("document.timeRecordForm.duration");
 177     x.value = "";
 178     x.disabled = true;
 179     x.style.background = "#e9e9e9";
 180   }
 181
 182   if (((formFieldValue == "") && (formFieldName == "start") && (document.timeRecordForm.finish.value == "")) || ((formFieldValue == "") && (formFieldName == "finish") && (document.timeRecordForm.start.value == ""))) {
 183     x = eval("document.timeRecordForm.duration");
 184     x.value = "";
 185     x.disabled = false;
 186     x.style.background = "white";
 187   }
 188
 189   if ((formFieldValue != "") && (formFieldName == "duration")) {
 190     x = eval("document.timeRecordForm.start");
 191     x.value = "";
 192     x.disabled = true;
 193     x.style.background = "#e9e9e9";
 194     x = eval("document.timeRecordForm.finish");
 195     x.value = "";
 196     x.disabled = true;
 197     x.style.background = "#e9e9e9";
 198   }
 199
 200   if ((formFieldValue == "") && (formFieldName == "duration")) {
 201     x = eval("document.timeRecordForm.start");
 202     x.disabled = false;
 203     x.style.background = "white";
 204     x = eval("document.timeRecordForm.finish");
 205     x.disabled = false;
 206     x.style.background = "white";
 207   }
 208 }
 209
 210 // The setNow function fills a given field with current time.
 211 function setNow(formField) {
 212   var x = eval("document.timeRecordForm.start");
 213   x.disabled = false;
 214   x.style.background = "white";
 215   x = eval("document.timeRecordForm.finish");
 216   x.disabled = false;
 217   x.style.background = "white";
 218   var today = new Date();
 219   var time_format = '{$user->time_format}';
 220   var obj = eval("document.timeRecordForm." + formField);
 221   obj.value = today.strftime(time_format);
 222   formDisable(formField);
 223 }
 224
 225 function get_date() {
 226   var date = new Date();
 227   return date.strftime("%Y-%m-%d");
 228 }
 229
 230 function get_time() {
 231   var date = new Date();
 232   return date.strftime("%H:%M");
 233 }
 234 </script>