WEB-INF/templates/mobile/timer.tpl

   1 <script>
   2 // We need a few arrays to populate project and task dropdowns.
   3 // When client selection changes, the project dropdown must be re-populated with only relevant projects.
   4 // When project selection changes, the task dropdown must be repopulated similarly.
   5 // Format:
   6 // project_ids[143] = "325,370,390,400";  // Comma-separated list of project ids for client.
   7 // project_names[325] = "Time Tracker";   // Project name.
   8 // task_ids[325] = "100,101,302,303,304"; // Comma-separated list ot task ids for project.
   9 // task_names[100] = "Coding";            // Task name.
  10
  11 //Prepare an array of projects ids for clients.
  12 project_ids = new Array();
  13 {foreach $client_list as $client}
  14   project_ids[{$client.id}] = "{$client.projects}";
  15 {/foreach}
  16 // Prepare an array of project names.
  17 project_names = new Array();
  18 {foreach $project_list as $project}
  19   project_names[{$project.id}] = "{$project.name|escape:'javascript'}";
  20 {/foreach}
  21 // We'll use this array to populate project dropdown when client is not selected.
  22 var idx = 0;
  23 projects = new Array();
  24 {foreach $project_list as $project}
  25   projects[idx] = new Array("{$project.id}", "{$project.name|escape:'javascript'}");
  26   idx++;
  27 {/foreach}
  28
  29 // Prepare an array of task ids for projects.
  30 task_ids = new Array();
  31 {foreach $project_list as $project}
  32   task_ids[{$project.id}] = "{$project.tasks}";
  33 {/foreach}
  34 // Prepare an array of task names.
  35 task_names = new Array();
  36 {foreach $task_list as $task}
  37   task_names[{$task.id}] = "{$task.name|escape:'javascript'}";
  38 {/foreach}
  39
  40 // Mandatory top options for project and task dropdowns.
  41 empty_label_project = '{$i18n.dropdown.select|escape:'javascript'}';
  42 empty_label_task = '{$i18n.dropdown.select|escape:'javascript'}';
  43
  44 // The populateDropdowns function populates the "project" and "task" dropdown controls
  45 // with relevant values.
  46 function fillDropdowns() {
  47   if(document.body.contains(document.timeRecordForm.client))
  48     fillProjectDropdown(document.timeRecordForm.client.value);
  49
  50   fillTaskDropdown(document.timeRecordForm.project.value);
  51 }
  52
  53 // The fillProjectDropdown function populates the project combo box with
  54 // projects associated with a selected client (client id is passed here as id).
  55 function fillProjectDropdown(id) {
  56   var str_ids = project_ids[id];
  57
  58   var dropdown = document.getElementById("project");
  59   // Determine previously selected item.
  60   var selected_item = dropdown.options[dropdown.selectedIndex].value;
  61
  62   // Remove existing content.
  63   dropdown.length = 0;
  64   var project_reset = true;
  65   // Add mandatory top option.
  66   dropdown.options[0] = new Option(empty_label_project, '', true);
  67
  68   // Populate project dropdown.
  69   if (!id) {
  70     // If we are here, client is not selected.
  71         var len = projects.length;
  72     for (var i = 0; i < len; i++) {
  73       dropdown.options[i+1] = new Option(projects[i][1], projects[i][0]);
  74       if (dropdown.options[i+1].value == selected_item)  {
  75         dropdown.options[i+1].selected = true;
  76         project_reset = false;
  77       }
  78     }
  79   } else if (str_ids) {
  80     var ids = new Array();
  81     ids = str_ids.split(",");
  82     var len = ids.length;
  83
  84     for (var i = 0; i < len; i++) {
  85       var p_id = ids[i];
  86       dropdown.options[i+1] = new Option(project_names[p_id], p_id);
  87       if (dropdown.options[i+1].value == selected_item)  {
  88         dropdown.options[i+1].selected = true;
  89         project_reset = false;
  90       }
  91     }
  92   }
  93
  94   // If project selection was reset - clear the tasks dropdown.
  95   if (project_reset) {
  96     dropdown = document.getElementById("task");
  97     dropdown.length = 0;
  98     dropdown.options[0] = new Option(empty_label_task, '', true);
  99   }
 100 }
 101
 102 // The fillTaskDropdown function populates the task combo box with
 103 // tasks associated with a selected project (project id is passed here as id).
 104 function fillTaskDropdown(id) {
 105   var str_ids = task_ids[id];
 106
 107   var dropdown = document.getElementById("task");
 108   if (dropdown == null) return; // Nothing to do.
 109
 110   // Determine previously selected item.
 111   var selected_item = dropdown.options[dropdown.selectedIndex].value;
 112
 113   // Remove existing content.
 114   dropdown.length = 0;
 115   // Add mandatory top option.
 116   dropdown.options[0] = new Option(empty_label_task, '', true);
 117
 118   // Populate the dropdown from the task_names array.
 119   if (str_ids) {
 120     var ids = new Array();
 121     ids = str_ids.split(",");
 122     var len = ids.length;
 123
 124     var idx = 1;
 125     for (var i = 0; i < len; i++) {
 126       var t_id = ids[i];
 127       if (task_names[t_id]) {
 128         dropdown.options[idx] = new Option(task_names[t_id], t_id);
 129         idx++;
 130       }
 131     }
 132
 133     // If a previously selected item is still in dropdown - select it.
 134         if (dropdown.options.length > 0) {
 135       for (var i = 0; i < dropdown.options.length; i++) {
 136         if (dropdown.options[i].value == selected_item) {
 137           dropdown.options[i].selected = true;
 138         }
 139       }
 140     }
 141   }
 142 }
 143
 144 function get_date() {
 145   var date = new Date();
 146   return date.strftime("%Y-%m-%d");
 147 }
 148
 149 function get_time() {
 150   var date = new Date();
 151   return date.strftime("%H:%M");
 152 }
 153 </script>
 154
 155 <style>
 156 .not_billable td {
 157         color: #ff6666;
 158 }
 159 </style>
 160
 161 <p><span id="hour">00</span><span id="separator">:</span><span id="min">00</span>
 162
 163
 164 <script>
 165 var timerID = null;
 166 var startDate = null;
 167 var endDate = null;
 168 var delta = null;
 169 var separatorVisible = true;
 170
 171 function toggleSeparator() {
 172   document.getElementById('separator').style.visibility = separatorVisible ? 'hidden' : 'visible';
 173   separatorVisible = !separatorVisible;
 174 }
 175
 176 function updateTimer() {
 177   if (startDate == null) startDate = new Date();
 178   endDate = new Date();
 179   delta = new Date(endDate - startDate);
 180
 181   var hours = delta.getUTCHours();
 182   if (hours < 10) hours = '0'+hours;
 183   document.getElementById('hour').innerHTML = hours;
 184
 185   var minutes = delta.getUTCMinutes();
 186   if (minutes <  10) minutes = '0'+minutes;
 187   document.getElementById('min').innerHTML = minutes;
 188
 189   // Toggle visibility of separator for 100 ms.
 190   toggleSeparator();
 191   setTimeout('toggleSeparator()', 100);
 192 }
 193
 194 function startTimer() {
 195   if (timerID) return;
 196
 197   updateTimer();
 198   timerID = setInterval('updateTimer()', 1000);
 199 }
 200
 201 function stopTimer() {
 202   clearInterval(timerID);
 203   timerID = null;
 204 }
 205 </script>
 206
 207 {if $uncompleted}
 208 <script>
 209 startDate = new Date();
 210 startDate.setHours({substr($uncompleted['start'], 0, 2)});
 211 startDate.setMinutes({substr($uncompleted['start'], 3, 2)});
 212 startDate.setSeconds(0);
 213 updateTimer();
 214 startTimer();
 215 </script>
 216 {/if}
 217
 218 <!--
 219 <table cellspacing="3" cellpadding="0" border="0" width="100%">
 220 <tr>
 221   <td align="center">
 222     {if $time_records}
 223       <table border='0' cellpadding='4' cellspacing='1' width="100%">
 224       {foreach $time_records as $record}
 225       <tr bgcolor="{cycle values="#ccccce,#f5f5f5"}" {if !$record.billable} class="not_billable" {/if}>
 226 {if ($smarty.const.MODE_PROJECTS == $user->tracking_mode || $smarty.const.MODE_PROJECTS_AND_TASKS == $user->tracking_mode)}
 227         <td valign='top'>{$record.project|escape:'html'}</td>
 228 {/if}
 229         <td align='right' valign='top'>{if $record.duration == '0:00'}<font color="#ff0000">{/if}{$record.duration}{if $record.duration == '0:00'}</font>{/if}
 230         <td align='center'>{if $record.invoice_id}&nbsp;{else}<a href='time_edit.php?id={$record.id}'>{$i18n.label.edit}</a>{/if}</td>
 231       </tr>
 232       {/foreach}
 233           </table>
 234           <table border='0'>
 235       <tr>
 236         <td align='right'>{$i18n.label.day_total}:</td>
 237         <td>{$day_total}</td>
 238       </tr>
 239       </table>
 240     {/if}
 241   </td>
 242 </tr>
 243 </table>
 244 -->
 245
 246 {$forms.timerRecordForm.open}
 247 <table cellspacing="4" cellpadding="7" border="0">
 248 <tr>
 249   <td>
 250   <table width = "100%">
 251   <tr>
 252         <td valign="top">
 253     <table border="0">
 254 {if in_array('cl', explode(',', $user->plugins))}
 255     <tr><td>{$i18n.label.client}:</td></tr>
 256     <tr><td>{$forms.timerRecordForm.client.control}</td></tr>
 257 {/if}
 258 {if in_array('iv', explode(',', $user->plugins))}
 259     <tr><td><label>{$forms.timerRecordForm.billable.control}{$i18n.form.time.billable}</label></td></tr>
 260 {/if}
 261 {if ($custom_fields && $custom_fields->fields[0])}
 262       <tr><td>{$custom_fields->fields[0]['label']|escape:'html'}:</td></tr>
 263       <tr><td>{$forms.timerRecordForm.cf_1.control}</td></tr>
 264 {/if}
 265 {if ($smarty.const.MODE_PROJECTS == $user->tracking_mode || $smarty.const.MODE_PROJECTS_AND_TASKS == $user->tracking_mode)}
 266     <tr><td>{$i18n.label.project}:</td></tr>
 267     <tr><td>{$forms.timerRecordForm.project.control}</td></tr>
 268 {/if}
 269 {if ($smarty.const.MODE_PROJECTS_AND_TASKS == $user->tracking_mode)}
 270     <tr><td>{$i18n.label.task}:</td></tr>
 271     <tr><td>{$forms.timerRecordForm.task.control}</td></tr>
 272 {/if}
 273     </table>
 274     </td>
 275   </tr>
 276   <tr>
 277     <td colspan="2" height="50" align="center">{$forms.timerRecordForm.btn_start.control} {$forms.timerRecordForm.btn_stop.control}</td>
 278   </tr>
 279   </table>
 280   </td>
 281 </tr>
 282 </table>
 283 {$forms.timerRecordForm.close}
 284
 285 <table cellspacing="3" cellpadding="0" border="0" width="100%">
 286 <tr>
 287   <td align="center">
 288     {if $time_records}
 289     <table border='0'>
 290       <tr>
 291         <td align='right'>{$i18n.label.day_total}:</td>
 292         <td>{$day_total}</td>
 293       </tr>
 294       <tr>
 295         <td align='right'>{$i18n.label.week_total}:</td>
 296         <td>{$week_total}</td>
 297       </tr>
 298     </table>
 299     {/if}
 300   </td>
 301 </tr>
 302 </table>