WEB-INF/templates/time_script.tpl

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