{assign var="pgLayout" value="file:./layouts/blank.tpl"}
{include_php file="shared_handle:estats/manageUserEstats"}

<h2 class="withBG">
	<div class="topRight hideShow">
		<a href="javascript:toggle('statsSettingsDiv', '', 'showHide');updateParentHeight();"><img id="statsSettingsDiv_img" src="blank.gif" class="showHide_on" alt="show/hide" border="0" /></a>
	</div>
	Change Stats Settings
</h2>

<div id="statsSettingsDiv">
<form name="new_estat" method="post" action="index.php">
<input type="hidden" name="pg" value="{$page.name}" />
<input type="hidden" name="no_expire" value="true" />
<input type="hidden" name="no_expire_keep_alive" value="category units description frequency confirmCustomEstat confirmCustomUnits return" />
<input type="hidden" name="return" value="{$smarty.request.return}" />

{* ***************************************** eStat Selector ***************************************** *}
{if $smarty.request.eStatAction eq ""}

{* display var=$allUnits *}
{* display var=$estats *}
{* display var=$userEstats *}
{* display var=$groupEstats *}

	<h3>Show or Hide Trackable Stats</h3>
	<p>Select the items from the list of available statistics below that you are interested in tracking.<br />
	If you want to track something that is not shown in the list below, click on the <b>'Add New eStat'</b> button.</p>

<script type="text/javascript" language="javascript">{literal}
	function toggleEstatCheckbox(esId) {
		esCB = document.getElementById('estat_'+esId);
		if (esCB.checked) {
			esCB.checked = false;
		} else {
			esCB.checked = true;
		}
	}
{/literal}</script>

	<table width="500">
	<tr>
		<td colspan="5"><hr /></td>
	</tr>
	<tr>
		<td>&nbsp;</td>
		<td align="center"><b>Title</b></td>
		<td align="center"><b>Custom Description</b></td>
		<td align="center"><b>Units</b></td>
		{if $acm->isDomainAdmin()}<td align="center"><b>Frequency</td>{/if}
	</tr>
	{foreach from=$estats item="estat"}
		<tr>
			<td>{if $groupEstats[$estat.id]}
				<input type="hidden" name="selectedEstats[{$estat.id}]" value="{$estat.name}" />
			    	<input id="estat_{$estat.id}" name="groupEstats[{$estat.id}]" type="checkbox" value="{$estat.name}" {if $userEstats[$estat.id] OR $groupEstats[$estat.id]} checked="checked"{/if} disabled="disabled" />
			    {else}
				<input id="estat_{$estat.id}" name="selectedEstats[{$estat.id}]" type="checkbox" value="{$estat.name}" {if $userEstats[$estat.id] OR $groupEstats[$estat.id]} checked="checked"{/if} />
			    {/if}</td>
			<td nowrap="nowrap"><a href="javascript://" onmouseover="xOpen('note_estat{$estat.id}');" onmouseout="xClose('note_estat{$estat.id}');" {if NOT $groupEstats[$estat.id]}onclick="toggleEstatCheckbox({$estat.id});"{/if}>{$estat.name|niceText}</a><br />
				<div id="note_estat{$estat.id}" style="display:none;" class="floatInfoBox"><small>{$estat.description|capitalize}{if $groupEstats[$estat.id]}<br /><i>Requested by:</i> <b>{$groupEstats[$estat.id].groupName|niceText}</b>{/if}</small></div></td>
			<td><input size="40" maxlength="32" type="text" name="estat_description[{$estat.id}]" value="{$userEstats[$estat.id].description}"{if $groupEstats[$estat.id]} disabled="disabled"{/if} /></td>
			<td>{if $groupEstats[$estat.id].unitId}
				{assign var="curUnitId" value=`$groupEstats[$estat.id].unitId`}
			    {elseif $userEstats[$estat.id].unitId}
				{assign var="curUnitId" value=`$userEstats[$estat.id].unitId`}
			    {else}
				{assign var="curUnitId" value=`$estat.defaultUnitId`}
			    {/if}
			<select name="estat_unit[{$estat.id}]"{if $groupEstats[$estat.id]} readonly="readonly" disabled="disabled"{/if}>
			{foreach from=$allEstatUnits[$estat.id] item='unitId'}
				<option value="{$unitId}"{if $curUnitId eq $unitId} selected="selected"{/if}>{$allUnits.$unitId.name|niceText}</option>
			{/foreach}
			</select>
			</td>
			{if $acm->isDomainAdmin()}
			<td>{if $groupEstats[$estat.id].frequency}
				{assign var="curFrequency" value=$groupEstats[$estat.id].frequency}
			    {elseif $userEstats[$estat.id].frequency}
				{assign var="curFrequency" value=$userEstats[$estat.id].frequency}
			    {else}
				{assign var="curFrequency" value=""}
			    {/if}
			<select name="estat_frequency[{$estat.id}]"{if $groupEstats[$estat.id]} disabled="disabled"{/if}>
				<option value="daily"{if $curFrequency eq "daily"} selected="selected"{/if}>Daily</option>
				<option value="weekly"{if $curFrequency eq "weekly"} selected="selected"{/if}>Weekly</option>
			</select>
			</td>
			{else}
			<td>
				<input type="hidden" name="estat_frequency[{$estat.id}]" value="daily" />
			</td>
			{/if}
		</tr>
	{/foreach}
	<tr>
		<td colspan="5"><hr /></td>
	</tr>
	<tr>
		<td colspan="5" nowrap="nowrap" align="center">
			<input name="eStatAction" type="submit" value="Save Tracking Changes" />
			<input name="eStatAction" type="submit" value="Add New eStat" />
		</td>
	</tr>
	</table>

{* ***************************************** Main Form ***************************************** *}
{elseif $smarty.request.eStatAction eq "Add New eStat" OR $smarty.request.eStatAction eq "Save New eStat"}

<h3>Add New Trackable eStat</h3>
<p>Fill out the following form to register a new "eStat" that you would like to track, it can be anything from how many times you sneeze to the amount of money you spend on fast food.<br />
If you have any problems or questions, feel free to <a href="?pg=contactUs">contact us</a>.</p>

<hr />
<table>
<tr>
	<td valign="top" align="right"><b>Tracking&nbsp;Category:</b></td>
	<td valign="top"><input type="text" name="category" maxlength="32" value="{$estatName}" /></td>
	<td>
		<ul>
		<li>Enter a title for what you want to track.</li>
		<li><i>ie:</i> weight, distance exercised, distance run, time slept.</li>
		<li>Do not put units of measure here.</li>
		<li>Use <b>'time'</b> instead of <b>'hours'</b> or <b>'distance'</b> instead of <b>'miles'</b>.</li>
	</ul></td>
</tr>
<tr>
	<td valign="top" align="right"><b>Description:</b></td>
	<td valign="top"><input type="text" name="description" maxlength="32" value="{$estatDescription}" /></td>
	<td>
		<ul>
		<li>Brief description of this stat <i>(optional)</i></li>
		</ul></td>
</tr>
<tr>
	<td valign="top" align="right"><b>Measurement&nbsp;Unit:</b></td>
	<td valign="top"><select name="units" onchange="checkToCreateNewUnit(this);">
		{foreach from=$allUnits item="unit"}
			<option value="{$unit.name}"{if $unit.id eq $estatUnits} selected="selected"{/if}>{$unit.name}</option>
		{/foreach}
		<option value="">- Create New -</option>
		</select><br />
		<div id="createNewUnitDiv" style="display:none;white-space:nowrap;">
		<input size="10" maxlength="32" id="newUnitInput" type="text" name="newUnit" value="" disabled="disabled" />
		<select id="newUnitDecimalsSelect" name="newUnitDecimals" disabled="disabled">
			<option value="0">0</option>
			<option value="1">1</option>
			<option value="2">2</option>
			<option value="3">3</option>
			<option value="4">4</option>
		</select>
		</div>
		<script type="text/javascript">{literal}
			function checkToCreateNewUnit(dropdown) {
				if (dropdown.value == '') {
					xGetElementById('createNewUnitDiv').style.display = 'block';
					xGetElementById('newUnitInput').disabled = false;
					xGetElementById('newUnitDecimalsSelect').disabled = false;
					xClose('existingUnitNotes');
					xOpen('newUnitNotes');
				} else {
					xGetElementById('createNewUnitDiv').style.display = 'none';
					xGetElementById('newUnitInput').disabled = true;
					xGetElementById('newUnitDecimalsSelect').disabled = true;	
					xClose('newUnitNotes');
					xOpen('existingUnitNotes');
				}
				updateParentHeight();
			}
		{/literal}</script>
	</td>
	<td>
		<ul id="existingUnitNotes" style="display:block;">
		<li>Select the measurement unit to use.</li>	
		<li>Or, Choose <b>'- Create New -'</b> if it doesn't exist.</li>
		</ul>
		<ul id="newUnitNotes" style="display:none;">
		<li>Enter a new measurement unit.</li>
		<li><i>ie:</i> pounds, kilograms, tons</li>
		<li>Select how many decimal places the unit can have.</li>
		</ul>
		</td>
</tr>
<tr>
	<td valign="top" align="right"><b>Frequency:</b></td>
	<td valign="top"><select name="frequency">
		<option value="daily"{if $estatFrequency eq "daily"} selected="selected"{/if}>Daily</option>
		<option value="weekly"{if $estatFrequency eq "weekly"} selected="selected"{/if}>Weekly</option>
	</select></td>
	<td>
 		<ul>
		<li>How often will it be entered</li>
		</ul></td>
</tr>
<tr>
	<td>&nbsp;</td>
	<td colspan="2">
		<input type="submit" name="eStatAction" value="Save New eStat" />&nbsp; 
		<input type="button" name="buttonAction" value="Cancel" onclick="location.replace('?pg={$page.name}');" />&nbsp;
	</td>
</tr>
</table>
{/if}

</form>
</div>
<span id="eStatsSinker">&nbsp;</span>
<script type="text/javascript">{literal}
	function xDef() {
		for(var i=0; i<arguments.length; ++i) {
			if(typeof(arguments[i])=='undefined') return false;
		}
		return true;
	}

	function xPageY(e) {
	  if (!(e=document.getElementById(e))) return 0;
	  var y = 0;
	  while (e) {
	    if (xDef(e.offsetTop)) y += e.offsetTop;
	    e = xDef(e.offsetParent) ? e.offsetParent : null;
	  }
	  return y;
	}

	function updateParentHeight() {
		parent.xHeight('profileUpdateIFrame', xPageY('eStatsSinker')+30);
		parent.xHeight('statsContainer', xPageY('eStatsSinker')+30);
	}

	updateParentHeight();

{/literal}</script>