<@markup id="css" >
<#-- CSS Dependencies -->
<@link href='' group="workflow"/>
<@link href='' group="workflow"/>
<@link href='' group="workflow"/>
</@>

<@markup id="js">
<#-- JavaScript Dependencies -->
<@script src="${url.context}/res/components/workflow/workflow-actions.js" group="workflow"/>
<@script src="${url.context}/res/components/workflow/workflow-list-all.js" group="workflow"/>

<@script src="${url.context}/res/yui/yahoo-dom-event/yahoo-dom-event.js" group="workflow"/>
<@script src="${url.context}/res/yui/calendar/calendar-min.js" group="workflow"/>
</@>

<@markup id="widgets">
<@createWidgets group="workflow"/>
</@>

<@markup id="html">
<@uniqueIdDiv>
<#import "workflow.lib.ftl" as workflow/>
<#import "filter/filter.lib.ftl" as filter/>
<#assign el=args.htmlid?html>

<@markup id="head">

<style type="text/css">

#dueFromCalendarContainer { display:none; position:absolute; z-index:1}
</style>
</@>

<script type="text/javascript">

var yuiInit = function() {

function startSelectHandler(type,args,obj) {
alert('test');

/*
var selected = args[0];
var selDate = this.toDate(selected[0]);
var incMonth = selDate.getMonth()+1;
window.location = replaceQueryString(replaceQueryString(window.location.href,'start', selDate.getFullYear()+'_'+incMonth+'_'+selDate.getDate()),'send','no');
*/

}

var dueFromCalendar = new YAHOO.widget.Calendar("dueFromCalendar","dueFromCalendarContainer", { title:"choose:", close:true } );

// This doesnt seems to be working
dueFromCalendar.selectEvent.subscribe(startSelectHandler, dueFromCalendar, true);

dueFromCalendar.render();

// Listener to show the 1-up Calendar when the button is clicked
YAHOO.util.Event.addListener("dueFromCalendar", "click", dueFromCalendar.show, dueFromCalendar, true);

};

YAHOO.util.Event.onDOMReady(yuiInit);

</script>

<@markup id="body">



<div style=" 25px; 25px;">
<table>
<tr><th colspan="5"><b>Search</b></td></tr>

<tr>
<td align='right'>Due date:</td>
<td width='450px'>

<input type="text" id="${el}-dueFrom" name="txtdueFromCalendar" />
<a tabindex="0" id="dueFromCalendar">
<img tabindex="0" class="datepicker-icon" src="/share/res/components/form/images/calendar.png">
</a>
<div id="dueFromCalendarContainer"></div>
</td>
<td align='right'>Data Limite a: </td>
<td width='450px' colspan="2"><input type="text" id="${el}-dueTo" /> (dd-mm-aaaa) </td>
</tr>
</table>
</div>
<div id="${el}-body" class="workflow-list">
<div class="yui-g workflow-list-bar flat-button">
<div class="yui-u first">
<h2 id="${el}-filterTitle" class="thin">
&nbsp;
</h2>
</div>
<div class="yui-u">
<div id="${el}-paginator" class="paginator">&nbsp;</div>
</div>
</div>
<div id="${el}-workflows" class="workflows"></div>
</div>
</@>
</@>
</@>