<!-- BEGIN DYNAMIC BLOCK: createticketfilter -->
<script type="text/javascript">
    var newFilterIndex = 0;
    var calButtonIndex = 0;
    var searchVisible = false;
    
    function defineCalendar(inputid, buttonid){
    	Calendar.setup({
                            inputField      : inputid,
                            ifFormat        : '{dateFormat}',
                            showsTime       : false,
                            button          : buttonid,
                            weekNumbers     : false,
                            step            : 1
                        });
    }
    
    function addFilter()
    {  
       var newFilterRow = $('filterRowTemplate').cloneNode(true);
        newFilterRow.setAttribute('id', 'filterRow_N' + newFilterIndex);
        newFilterIndex++;
        newFilterRow.style.display = isIE? 'block' : 'table-row';
        newFilterRow.removeAttribute('style');

        // have to insert the new node into the dom before we modify it, or else things won't work out as expected. 
        var newFilterRow = $('filterTableBody').appendChild(newFilterRow);
        var inputs = newFilterRow.getElementsByTagName("input");
        var images = newFilterRow.getElementsByTagName("img");

        calButtonIndex++;

        images[0].setAttribute('id', 'calButton_' + calButtonIndex)
        inputs[1].setAttribute('id', 'startdate_' + calButtonIndex)
        defineCalendar('startdate_' + calButtonIndex, 'calButton_' + calButtonIndex);

        images[1].setAttribute('id', 'cal2Button_' + calButtonIndex)
        inputs[2].setAttribute('id', 'enddate_' + calButtonIndex)
        defineCalendar(inputs[2].id, 'cal2Button_' + calButtonIndex);

        images[2].setAttribute('id', 'cal3Button_' + calButtonIndex)
        inputs[3].setAttribute('id', 'startdate2_' + calButtonIndex)
        defineCalendar(inputs[3].id, 'cal3Button_' + calButtonIndex);

        images[3].setAttribute('id', 'cal4Button_' + calButtonIndex)
        inputs[4].setAttribute('id', 'enddate2_' + calButtonIndex)
        defineCalendar(inputs[4].id, 'cal4Button_' + calButtonIndex);
    }

    onLoadFunctions.push(addFilter);

    function removeFilter(tr)
    {
        tr.parentNode.removeChild(tr);
        newFilterIndex--;

        if (newFilterIndex == 2) {
            $("tdMatchType").style.display = "none";
        }
    }
    
    function ActiveSelect(flag,tr)
    {
        if (flag == "") {
            return;
        }

        var selects = tr.getElementsByTagName("select");
        var inputs = tr.getElementsByTagName("input");
        var divs = tr.getElementsByTagName("div");
        divs[0].style.display = 'none';
        divs[1].style.display = 'none';
        divs[2].style.display = 'none';
        for (var i = 0; i < inputs.length-1; i++) {
             inputs[i].disabled = true;
             inputs[i].style.display = 'none';
        }
        // display "remove" button
        inputs[inputs.length - 1].style.display = "";

        if(flag != ''){
        	selects[1].style.display = '';
        	selects[1].disabled = false;
        	selects[1].options[0].text = '[lh]Is[/lh]';
        	selects[1].options[1].text = '[lh]Is Not[/lh]';
        } else{
        	selects[1].style.display = 'none';
        	selects[1].disabled = true;
        }
        for (var i = 2; i < selects.length; i++) {
             if (selects[i].name == flag) {
                selects[i].disabled = false;
                selects[i].style.display = 'inline';
            } else {
                selects[i].disabled = true;
                selects[i].style.display = 'none';
            } 
        }
        if (flag =="content[]"){
                inputs[0].style.display = 'inline';
                inputs[0].disabled = false;
                selects[1].options[0].text = '[lh]Contain[/lh]';
                selects[1].options[1].text = '[lh]Not contain[/lh]';
        }
        if (flag =="datesubmitted[]"){tr.style.diaplay = '';
                selects[1].style.display = 'none';
                selects[1].disabled = true;
                divs[0].style.display = '';
                inputs[1].style.display = 'inline';
                inputs[1].disabled = false;
                inputs[2].style.display = 'inline';
                inputs[2].disabled = false;
                
        } 
        if (flag =="datelastlog[]"){
        		
                selects[1].style.display = 'none';
                selects[1].disabled = true;
                divs[1].style.display = '';
                inputs[3].style.display = 'inline';
                inputs[3].disabled = false;
                inputs[4].style.display = 'inline';
                inputs[4].disabled = false;
        }
        if (flag == "timeelapsed[]"){
                divs[2].style.display = 'inline';
                inputs[5].style.display = 'inline';
                inputs[5].disabled = false;
                selects[1].options[0].text = '[lh]Greater than[/lh]';
                selects[1].options[1].text = '[lh]Less than[/lh]';
        }
        if (flag == "timeSinceLastReply[]"){
                divs[3].style.display = 'inline';
                inputs[6].style.display = 'inline';
                inputs[6].disabled = false;
                selects[1].options[0].text = '[lh]Greater than[/lh]';
                selects[1].options[1].text = '[lh]Less than[/lh]';
        }
        document.forms['filtersForm'].search.style.opacity = 100;
        document.forms['filtersForm'].search.disabled = false;

        if (newFilterIndex > 1) {
            $("tdMatchType").style.display = "";
        }

        // show next line accepting new conditions
        addFilter();
    }
    
    function showHideSearch()
    {
        if (searchVisible) {
            $('ticketfilterdiv').style.display = 'none';
            searchVisible = false;
        } else {
            if (bolUseEffects) {
                new Effect.SlideDown('ticketfilterdiv', {duration: 0.2});
            } else {
                $('ticketfilterdiv').style.display = '';
            }
            searchVisible = true;
        }
    }
</script>

<table style="width:100%;" cellpadding='3' border='0' cellspacing='0'>
		<tr class="formLabel">
			<td><a href="javascript:void(0);" onClick="showHideSearch();" style="cursor:pointer" onmouseover="return overlib('[ljh]show/hide conditions[/ljh]',FIXY,_mousePosY+5,FIXX,_mousePosX+13,DELAY,310,BGCOLOR, '#FFCC00', FGCOLOR, '#FFFFCC',BORDER,1,TEXTCOLOR,'#000000');" onmouseout="return nd();"'>
			[l]Create Ticket Filter[/l]</span></a></td>
	    </tr>
</table>
<div name="ticketfilterdiv" id="ticketfilterdiv" style="display:none">				
<form name="filtersForm" method="POST" action="index.php?fuse=support&action=CreateTicketFilter">
<table width="100%" cellpadding="0" cellspacing="0" border="0">   
<tr class="formField">
        <td style="padding:0;">
            <table id="filtersTable" cellpadding="2" cellspacing="1" border="0">
            <tbody id="filterTableBody" >           
                <tr id="filterRowTemplate" style="display:none" >
                    <td align="left">
                        <select id="fieldId[]" name="fieldId[]" onchange="ActiveSelect(this.value,this.parentNode.parentNode);">
                            <option value=''>--- [l]Select condition[/l] ---&nbsp;&nbsp;&nbsp;&nbsp;<option>    
                            <option value='staff[]'>[l]Assigned to[/l]</option>
                            <option value='ticketstatus[]'>[l]Status[/l]</option>
                            <option value='priority[]'>[l]Priority[/l]</option>
                            <option value='type[]'>[l]Ticked type[/l]</option>
                            <option value='department[]'>[l]Department[/l]</option>
                            <option value=''>-----------------</option>
                            <option value='content[]'>[l]That Contain[/l]</option>
                            <option value=''>-----------------</option>
                            <option value='datesubmitted[]'>Date Submitted</option>
                            <option value='datelastlog[]'>Date Last Log</option>
                            <option value='timeelapsed[]'>Time Elapsed</option>
                            <option value='timeSinceLastReply[]'>Time Since Last Reply</option>
                        </select>
                    </td>
                    <td>
                        <select name="condition[]" id="condition[]" style="display:none" disabled>
                            <option value="is">[l]Is[/l]</option>
                            <option value="not">[l]Is Not[/l]</option>
                        </select>
                        <select name="staff[]" id="staff[]" style="display:none" disabled>
                            <option value=0>[l]Not Assigned[/l]</option>
                            <!-- BEGIN DYNAMIC BLOCK: staffList -->
                            <option value="{staffId}">{staffLabel}</option>
                            <!-- END DYNAMIC BLOCK: staffList -->
                        </select>
                        <select id="ticketstatus[]" name="ticketstatus[]" style="display:none" disabled>
                            <option value="1">Open</option>
                            <option value="2">[l]Waiting on tech[/l]</option>
                            <option value="3">[l]Waiting on customer[/l]</option>
                            <option value="-1">Closed</option>
                        </select>
           
                        <select name="priority[]" id="priority[]" style="display:none" disabled>
                            <option value=3>[l]Low[/l]</option>
                            <option value=2>[l]Medium[/l]</option>
                            <option value=1>[l]High[/l]</option>
                        </select>
           
                        <select name="type[]" id="type[]" style="display:none" disabled>
                            <!-- BEGIN DYNAMIC BLOCK: typeList -->
                            <option value="{typeId}">{typeLabel}</option>
                            <!-- END DYNAMIC BLOCK: typeList -->
                        </select> 
           
                        <select name="department[]" id="department[]" style="display:none" disabled>
                        	<option value="-1">-----</option>
                            <!-- BEGIN DYNAMIC BLOCK: depList -->
                                <option value="{depId}">{depLabel}</option>
                            <!-- END DYNAMIC BLOCK: depList -->
                        </select>
                        <input name="content[]" id="content[]" size="26" value="" style="display:none" disabled/>
                        <div name="datesub" id="datesub" style="display:none">   
                        &nbsp;[l]Start Date[/l]:
                        <input class="body" type="text" size="12" MAXLENGTH=10 name="startdate[]" id="startdate[]" value="{startDateValue}" disabled />
                        <img id="calButton" src="images/dynCalendar.gif" style="cursor:pointer"/>
                        <link rel="stylesheet" type="text/css" href="newedge/javascript/jscalendar/calendar-win2k-cold-1.css" />
                        &nbsp;
                        [l]End Date[/l]:
                        <input class="body" type="text" size="12" MAXLENGTH="10" name="enddate[]" id="enddate[]" value="{endDateValue}" disabled />
                        <img id="cal2Button" src="images/dynCalendar.gif" style="cursor:pointer"/>
                       </div>
                       <div name="datelast" id="datelast" style="display:none">   
                        &nbsp;[l]Start Date[/l]:
                        <input class=body type=text size=12 MAXLENGTH=10 name="startdate2[]" id="startdate2[]" value='{startDateValue}' disabled />
                        <img id="cal3Button" src="images/dynCalendar.gif" style="cursor:pointer"/>
                        <link rel="stylesheet" type="text/css" href="newedge/javascript/jscalendar/calendar-win2k-cold-1.css" />
                        &nbsp;
                        [l]End Date[/l]:
                        <input class=body type=text size=12 MAXLENGTH=10 name="enddate2[]" id="enddate2[]" value='{endDateValue}' disabled />
                        <img id="cal4Button" src="images/dynCalendar.gif" style="cursor:pointer"/>
                        <link rel="stylesheet" type="text/css" href="newedge/javascript/jscalendar/calendar-win2k-cold-1.css" />
                       </div>
                       <div id="telapsed" name="telapsed" style="display:none">
                        <input name="timeelapsed[]" id="timeelapsed[]" size="4" value="3" style="display:none" disabled/>[l]Hours[/l]
                       </div>
                       <div id="telapsedLastReply" name="telapsed" style="display:none">
                        <input name="timeSinceLastReply[]" id="timeSinceLastReply[]" size="4" value="3" style="display:none" disabled/>[l]Hours[/l]
                       </div>
                    </td>
                    <td><input type="button" class="button_medium" name="remove" value="[lh]remove[/lh]" onclick="removeFilter(this.parentNode.parentNode)" style="display:none" /></td>
                </tr>
            </tbody>
            </table>
            <table>
                <tr>
                     <td id="tdMatchType" align="left" style="display:none">[l]Match type[/l]:
                        <select name="match" id="match">
                            <option value="AND" selected="true">[l]Against all conditions (AND)[/l]&nbsp;&nbsp;&nbsp;</option>
                            <option value="OR">[l]Against any condition (OR)[/l]&nbsp;&nbsp;&nbsp;</option>
                        </select>
                    </td>
                    <td align="left">   
                        &nbsp;&nbsp;<input name="search" type="submit" class="button_large" value="[lh]Search[/lh]" disabled style="opacity: 0.4;" />&nbsp;&nbsp;
                     </td>
                </tr>
            </table>

        </td>
    </tr>
</table>
</form>
</div>

<!-- END DYNAMIC BLOCK: createticketfilter -->
