{include file="header.tpl.html" extra_title="Issue #$issue_id - Add Time Tracking"}

{if $time_add_result != ''}
    <br />
    <center>
    <span class="default"><b>
    {if $time_add_result == -1}
        {t}An error occurred while trying to run your query{/t}
    {elseif $time_add_result == 1}
        {t}Thank you, the time tracking entry was added successfully.{/t}
    {/if}
    </b></span>
    </center>
    <script language="JavaScript">
    <!--
    {if $current_user_prefs.close_popup_windows == '1'}
    setTimeout('closeAndRefresh()', 2000);
    {/if}
    //-->
    </script>
    <br />
    {if not $current_user_prefs.close_popup_windows}
    <center>
      <span class="default"><a class="link" href="javascript:void(null);" onClick="javascript:closeAndRefresh();">{t}Continue{/t}</a></span>
    </center>
    {/if}
{else}
{literal}
<script language="JavaScript">
<!--

/**
 * Make javascript Date() object from datetime form selection.
 *
 * @param	Object	f		Form object.
 * @param	String	name	Form element prefix for date.
 */
function makeDate(f, name) {
	var d = new Date();
	d.setFullYear(f.elements[name + '[Year]'].value);
	d.setMonth(f.elements[name + '[Month]'].value - 1);
	d.setDate(f.elements[name + '[Day]'].value);
	d.setHours(f.elements[name + '[Hour]'].value);
	d.setMinutes(f.elements[name + '[Minute]'].value);
	d.setSeconds(0);
	return d;
}

function validateTimeForm(f)
{
    if (isWhitespace(f.summary.value)) {
        selectField(f, 'summary');
        alert('{/literal}{t escape=js}Please enter the summary for this new time tracking entry.{/t}{literal}');
        return false;
    }
    if (f.category.options[f.category.selectedIndex].value == '') {
        selectField(f, 'category');
        alert('{/literal}{t escape=js}Please choose the time tracking category for this new entry.{/t}{literal}');
        return false;
    }
    if ((isWhitespace(f.time_spent.value)) || (!isNumberOnly(f.time_spent.value))) {
        selectField(f, 'time_spent');
        alert('{/literal}{t escape=js}Please enter integers (or floating point numbers) on the time spent field.{/t}{literal}');
        return false;
    }
    if (!isValidDate(f, 'date')) {
        alert('{/literal}{t escape=js}Please select a valid date of work.{/t}{literal}');
        return false;
    }

	var now = new Date();
	var d1 = makeDate(f, 'date');
	if (d1 > now) {
		alert('{/literal}{t}Start time in the future.{/t}{literal}');
		return false;
	}
	var d2 = makeDate(f, 'date2');
	if (d2 > now) {
		alert('{/literal}{t}End time in the future.{/t}{literal}');
		return false;
	}
	return true;
}

/**
 * @param	Object	f		Form object
 * @param	Integer	type	The type of update occouring.
 *							0 = Duration was updated.
 *							1 = Start time was updated.
 *							2 = End time was updated.
 *							11 = Start time refresh icon was clicked.
 *							12 = End time refresh icon was clicked.
 * @param String element Name of the element changed
 */
function calcDateDiff(f, type, element)
{
	var duration = f.elements['time_spent'].value;
	// enforce 5 minute granuality.
	duration = Math.floor(duration / 5) * 5;

	var d1 = makeDate(f, 'date');
	var d2 = makeDate(f, 'date2');

	var minute = 1000 * 60;
	/*
	- if time is adjusted, duration is calculated,
	- if duration is adjusted, the end time is adjusted,
	- clicking refresh icon on either icons will make that time current date
	  and recalculate duration.
	*/

	if (type == 0) { // duration
		d1.setTime(d2.getTime() - duration * minute);
	} else if (type == 1) { // start time
		if (element == 'date[Year]' || element == 'date[Month]' || element == 'date[Day]') {
			d2.setTime(d1.getTime() + duration * minute);
		} else {
			duration = (d2.getTime() - d1.getTime()) / minute;
		}
	} else if (type == 2) { // end time
		duration = (d2.getTime() - d1.getTime()) / minute;
	} else if (type == 11) { // refresh start time
		d2.setTime(d1.getTime() + duration * minute);
	} else if (type == 12) { // refresh end time
		d1.setTime(d2.getTime() - duration * minute);
	}

	/* refill form after calculation */
	updateTimeFields(f.name, 'date[Year]', 'date[Month]', 'date[Day]', 'date[Hour]', 'date[Minute]', d1)
	updateTimeFields(f.name, 'date2[Year]', 'date2[Month]', 'date2[Day]', 'date2[Hour]', 'date2[Minute]', d2)

	duration = parseInt(duration);
	if (duration > 0) {
		f.elements['time_spent'].value = duration;
	}

}
//-->
</script>
{/literal}
<table align="center" width="100%" cellpadding="3">
  <tr>
    <td>
      <table width="100%" bgcolor="{$cell_color}" border="0" cellspacing="0" cellpadding="0" align="center">
      <form name="add_time_form" onSubmit="javascript:return validateTimeForm(this);" method="post" action="{$smarty.server.PHP_SELF}">
      <input type="hidden" name="cat" value="add_time">
      <input type="hidden" name="issue_id" value="{$issue_id}">
        <tr>
          <td width="100%">
            <table bgcolor="#FFFFFF" width="100%" cellspacing="1" cellpadding="2">
              {if $current_role > $roles.viewer}
              <tr>
                <td colspan="2" class="default"><b>{t}Record Time Worked{/t}:</b></td>
              </tr>
              <tr>
                <td bgcolor="{$internal_color}" class="default_white" width="190" nowrap><b>{t}Summary{/t}:</b></td>
                <td bgcolor="{$light_color}" width="100%"><input class="default" type="text" name="summary" size="40">{include file="error_icon.tpl.html" field="summary"}</td>
              </tr>
              <tr>
                <td bgcolor="{$internal_color}" class="default_white" width="190" nowrap><b>{t}Category{/t}:</b></td>
                <td bgcolor="{$light_color}" width="100%">
                  <select name="category" class="default">
                    <option value="">{t}Please choose a category{/t}</option>
                    {html_options options=$time_categories}
                  </select>
                  {include file="error_icon.tpl.html" field="category"}
                </td>
              </tr>

              <tr>
                <td bgcolor="{$internal_color}" class="default_white" width="190" nowrap><b>{t}Time Spent{/t}:</b></td>
                <td bgcolor="{$light_color}" width="100%"><input class="default" type="text" size="5" name="time_spent" class="default" onChange="calcDateDiff(this.form, 0)"> <span class="default">({t}in minutes{/t})</span>{include file="error_icon.tpl.html" field="time_spent"}</td>
              </tr>

              <tr>
                <td bgcolor="{$internal_color}" class="default_white" width="190" nowrap><b>{t}Work started{/t}:</b></td>
                <td bgcolor="{$light_color}" width="100%">
                  {html_select_date start_year='-1' day_value_format='%02d' field_array='date' prefix='' all_extra=' class="default" onChange="calcDateDiff(this.form, 1, this.name)"'}&nbsp;
                  {html_select_time minute_interval=5 field_array='date' prefix='' all_extra=' class="default" onChange="calcDateDiff(this.form, 1)"' display_seconds=false}
                  <a href="javascript:void(null);" onClick="javascript:updateTimeFields('add_time_form', 'date[Year]', 'date[Month]', 'date[Day]', 'date[Hour]', 'date[Minute]');calcDateDiff(getForm('add_time_form'), 11)"><img src="images/icons/refresh.gif" border="0"></a>
                </td>
              </tr>

              <tr>
                <td bgcolor="{$internal_color}" class="default_white" width="190" nowrap><b>Work ended:</b></td>
                <td bgcolor="{$light_color}" width="100%">
                  {html_select_date start_year='-1' day_value_format='%02d' field_array='date2' prefix='' all_extra=' class="default" onChange="calcDateDiff(this.form, 2)"'}&nbsp;
                  {html_select_time minute_interval=5 field_array='date2' prefix='' all_extra=' class="default" onChange="calcDateDiff(this.form, 2)"' display_seconds=false}
                  <a href="javascript:void(null);" onClick="javascript:updateTimeFields('add_time_form', 'date2[Year]', 'date2[Month]', 'date2[Day]', 'date2[Hour]', 'date2[Minute]'); calcDateDiff(getForm('add_time_form'), 12)"><img src="images/icons/refresh.gif" border="0"></a>
                </td>
              </tr>

              <tr>
                <td colspan="2" bgcolor="{$internal_color}" align="center" width="100%" nowrap>
                  <input type="submit" value="{t}Add Time Entry{/t}" class="button">
                </td>
              </tr>
              {/if}
            </table>
          </td>
        </tr>
      </form>
      </table>
    </td>
  </tr>
</table>
<script language="JavaScript">
<!--
updateTimeFields('add_time_form', 'date[Year]', 'date[Month]', 'date[Day]', 'date[Hour]', 'date[Minute]');
updateTimeFields('add_time_form', 'date2[Year]', 'date2[Month]', 'date2[Day]', 'date2[Hour]', 'date2[Minute]');
//-->
</script>
{include file="app_info.tpl.html"}
{/if}
{include file="footer.tpl.html"}
