
<animation>
<title>Calendar</title>
<script>
<![CDATA[

var calendar_do={

current_date:0,
current_cell:0,
current_obj:0,


edit:function()
{
var f=$("calendar_slide").parentNode.getElementsByTagName("form")[0].getElementsByTagName("input");
var t="t_"+f[0].value+"_"+f[1].value+"_"+f[2].value+"_"+f[3].value;
 if(document.getElementById(t)){$(t).parentNode.removeChild($(t));}
$(calendar_do.current_cell).style.display="block";
$(calendar_do.current_cell).innerHTML='<div tooltip="Doubleclick to remove" ondblclick="this.parentNode.removeChild(this);calendar_do.calsave($(\''+calendar_do.current_cell+'\'),\''+calendar_do.current_date+'\')" data_release="calendar_do.calsave($(\''+calendar_do.current_cell+'\'),\''+calendar_do.current_date+'\')"  data_clone="true" style="background-color:white;margin-bottom:3px;" id="'+t+'"><span>'+t.split("_")[1]+':'+t.split("_")[2]+' to '+t.split("_")[3]+':'+t.split("_")[4]+'</span><br/>'+$("calendar_edit_content").value+'</div>'+$(calendar_do.current_cell).innerHTML;
calendar_do.SelectSwap();
$("calendar_edit_content").value=$(calendar_do.current_cell).innerHTML;
$("c_saved").setAttribute("action","http://www.widgetplus.com/remotewidget.asp?xin.calendarSave('"+xin.login+"','"+xin.pass+"')");
$("c_saved").submit();
setTimeout(calendar_do.checkAll, 2000);
},

SelectEdit:function(obj,num, arg, ID)
{
if($("days_"+ID.toLowerCase()))
{
if(arg=="today")
{
calendar_do.current_date=num+":"+xin.calendar.month+":"+xin.calendar.year;
$("c_date").value=calendar_do.current_date;
calendar_do.current_cell="days_"+ID.toLowerCase();
}
if(arg=="day")
{
calendar_do.current_date=num+":"+xin.calendar.month+":"+xin.calendar.year;
$("c_date").value=calendar_do.current_date;
calendar_do.current_cell="days_"+ID.toLowerCase();
}
$("calendar_edit_content").value="";
calendar_do.SelectSwap();
}
else{alert("Open the cell first.");}
},


SelectSwap:function(arg)
{
var obj=$("calendar_slide").parentNode.getElementsByTagName("form")[0];

if(arg)
{
    obj.style.display="none";
	$("calendar_slide").style.display="block";
}
 else if(obj.style.display!=="none")
{
    obj.style.display="none";
	$("calendar_slide").style.display="block";
}
else
{
    obj.style.display="inline";
	$("calendar_slide").style.display="none";
}

},

SelectDay:function(obj,num, arg, ID)
{
calendar_do.SelectSwap(1);
$("cal_display_sun").innerHTML="";
$("cal_display_sun").style.width="1";
$("cal_display_mon").innerHTML="";
$("cal_display_mon").style.width="1";
$("cal_display_tue").innerHTML="";
$("cal_display_tue").style.width="1";
$("cal_display_wed").innerHTML="";
$("cal_display_wed").style.width="1";
$("cal_display_thu").innerHTML="";
$("cal_display_thu").style.width="1";
$("cal_display_fri").innerHTML="";
$("cal_display_fri").style.width="1";
$("cal_display_sat").innerHTML="";
$("cal_display_sat").style.width="1";

if(arg=="today")
{
var mID=num+":"+xin.calendar.month+":"+xin.calendar.year;
xin.calendar.fetch(mID,"calendar_do.setCal",1);
}
if(arg=="day")
{
var mID=num+":"+xin.calendar.month+":"+xin.calendar.year;
xin.calendar.fetch(mID,"calendar_do.setCal",1);
}
if(arg=="forward"){calendar_do.checkAll();}
if(arg=="back"){calendar_do.checkAll();}
},

setCal:function(str,xdate,arg)
{
var num=0;
var the_day="";
if(arg==1){cstyle="";}
var days=['Sun','Mon','Tue','Wed','Thu','Fri','Sat'];
var cellID=xin.calendar.month+"_"+xdate.split(":")[0]+"_"+xin.calendar.year;
    cellID=cellID.toLowerCase();
var tab=$(cellID);
for(var i=0; i < 3;i++)
{
if(tab.nodeName.toLowerCase()!=="tr"){tab=tab.parentNode;}
 else{break;}
}
var t=tab.getElementsByTagName("td");
for(var i=0; i < t.length; i++)
{
try{if(t[i].getAttribute("id")==cellID){the_day=days[i];break;}}catch(er){}
}
if(str)
{
$("cal_display_"+the_day.toLowerCase()).style.width="200";
$("cal_display_"+the_day.toLowerCase()).innerHTML="<button tooltip=\"There are "+(unescape(str).split("data_clone").length-1)+" entries.\" onclick=\"calendar_do.swap('cal_display_"+the_day.toLowerCase()+"')\" title=\""+xdate+"\" class=\"cal_title\">"+the_day+"</button><div id=\"days_"+cellID+"\" title=\""+xdate+"\">"+unescape(str).replace(/border|BORDER/g,"noline")+"</div>";
}
else if(xdate)
{
$("cal_display_"+the_day.toLowerCase()).style.width="200";
$("cal_display_"+the_day.toLowerCase()).innerHTML="<button onclick=\"calendar_do.swap('cal_display_"+the_day.toLowerCase()+"')\" title=\""+xdate+"\" class=\"cal_title\">"+the_day+"</button><div id=\"days_"+cellID+"\" title=\""+xdate+"\" style=\"display:none\"></div>";
}
},


calsave:function(obj,xdate)
{
calendar_do.current_obj=obj;
calendar_do.current_date=xdate;
setTimeout(calendar_do.final_save,500);
},

final_save:function()
{
try
{
$("calendar_edit_content").value=calendar_do.current_obj.innerHTML;
$("c_date").value=calendar_do.current_date;
$("c_saved").setAttribute("action","http://www.widgetplus.com/remotewidget.asp?xin.calendarSave('widget_login','widget_pass')");
$("c_saved").submit();
}
catch(er){}
},

swap:function(arg)
{
var obj=$(arg).getElementsByTagName("div")[0];
if(obj.style.display!=="none")
{
obj.style.display="none";
}
else
{
obj.style.display="block";
}
},

onLoaded:function()
{
xin.calendar.fetch(xin.calendar.today+":"+xin.calendar.month+":"+xin.calendar.year,"calendar_do.setCal",1);
calendar_do.checkAll();
},

SelectWeek:function(obj,num, arg, ID)
{
if(arg=="today" || arg=="day")
{
var days=['Sun','Mon','Tue','Wed','Thu','Fri','Sat'];
var selected="";
var t=$(ID).parentNode.getElementsByTagName("td");
var tab=$(ID);
for(var i=0; i < 5;i++)
{
if(tab.nodeName.toLowerCase()!=="table"){tab=tab.parentNode;}
 else{break;}
}
var tab=tab.getElementsByTagName("td");
for(var i=0; i < t.length; i++)
{
if(t[i].getAttribute("id"))
{
t[i].style.border="silver 1px solid";
}
}
for(var i=0; i < t.length; i++)
{
if(t[i].getAttribute("id"))
{
var m=t[i].getAttribute("id").split("_");
var month=m[0];
var day=m[1];
var year=m[2];
var mID=day+":"+month+":"+year;
t[i].style.border="orange 1px solid";
xin.calendar.fetch(mID,"calendar_do.setCal",2);
}
}
}
},

checkAll:function()
{
var tab=$("cal").getElementsByTagName("table")[0];
var t=tab.getElementsByTagName("td");
for(var i=0; i < t.length; i++)
{
if(t[i].getAttribute("id"))
{
var m=t[i].getAttribute("id").split("_");
var month=m[0];
var day=m[1];
var year=m[2];
var mID=day+":"+month+":"+year;
xin.calendar.fetch(mID,"calendar_do.checkCal",t[i].getAttribute("id"));
}
}
},

checkCal:function(str,xdate,arg)
{
if(str && str!=="")
{
if($(arg).className!=="today")
{
 $(arg).style.backgroundColor="#6699cc";
}
$(arg).firstChild.setAttribute("tooltip","There are "+(unescape(str).split("data_clone").length-1)+" entries.");
}
},

flipTo:function()
{
var month=document.getElementById('a_month').getAttribute("title");
var year=document.getElementById('a_year').getAttribute("title");

xin.calendar.num=month;
xin.calendar.year=year;
xin.calendar.buildCal();
setTimeout(calendar_do.checkAll,100);
self.focus();
},

slide:function(num)
{
num=num-25;
var obj=$("calendar_slide");
num2=parseInt(obj.style.height);
num3=obj.getElementsByTagName("table")[0].offsetHeight;
	obj.getElementsByTagName("div")[0].style.top=-(Math.round((num3/num2)*num));
}
}


function init_calendar(){xin.calendar.init('cal','calendar_do.SelectDay:calendar_do.SelectWeek:calendar_do.SelectEdit','calendar_do.onLoaded');}

]]>
</script>
 <style>
<!--

.cal_table  div
 {
padding:4px;
 }
 
.cal_table  span
 {
display:block;
color:white;
font-style:italic;
width:100px;
text-align:center;
background-color:#6699cc;
border-bottom:gray 1px dotted;
padding:2px;
margin-top:-2px;
 }
 
 .cal
 {
 margin:0px;
 margin-top:0px;
 font-family:verdana;
 font-size:11px;
 color:gray;
 border:0px solid;
 width:200px;
 height:190;
 _height:200;
 background-color:white;
 position:relative;
 padding:0;
 top:0;
 }


.cal table {border:0px solid;margin:0px;margin-left:auto;margin-right:auto;}
.cal_table {border:gray 1px solid;background-image:url(http://www.widgetplus.com/shade.jpg);background-repeat:repeat-x;background-position:bottom left;background-color:white;}
.cal_table .menu {border-bottom:gray 1px solid;background-image:url(http://www.widgetplus.com/shade.jpg);background-repeat:repeat-x;background-position:bottom left;padding:2px;}
.calendar
{
width:200px;
border:gray 1px solid;
background-image:url(http://www.naltabyte.se/silver.jpg);
background-repeat:repeat-x;
background-position:bottom left;
}
.month_display
{
border:0px solid;
margin:1px;
font-family:verdana;
background-color:white;
color:gray;
font-size:10px;
width:70px;
height:17px;
}
.calendararrows
{
border:0px solid;
margin-right:1px;
font-family:verdana;
background-color:white;
color:black;
font-size:10px;
display:inline;
margin-left:15px;
width:40px;
height:17px;
}
.month 
{
font-size:12px;
font-family: verdana;
color:silver;
background-color:white;
border-bottom:gray 1px dotted;
}
.daysofweek 
{
font-size:12px;
font-family: verdana;
color:#6699cc;
border:0px solid;
font-weight:bold;
}
.weekenddays 
{
font-size:12px;
font-family: verdana;
color:orange;
border:0px solid;
font-weight:bold;
}
.days a
{
cursor:pointer;
font-size: 12px;
font-family:verdana;
color:silver;
border:0px solid;
text-decoration:none;
padding: 2px;
}
.today 
{
 cursor:pointer;
 border:inset 1px;
 background-color:gray;
 }
.today a
{
 font-family:verdana;
 text-decoration:none;
 font-size:11px;
 color:white;
 }
.cal_title
{
width:180px;
_width:170px;
padding:2px;
margin:1px;
border:silver 1px solid;
border-top:0px solid;
border-right:0px solid;
border-left:0px solid;
background-color:white;
background-image:url(http://www.widgetplus.com/shade.jpg);
background-repeat:repeat-x;
color:#6699cc;
font-family:verdana;
font-size:12px;
text-align:center;
}
#calendar_slide{margin:3px;margin-top:0px;width:190px;height:190px;_height:200px;overflow:hidden;border:gray 1px solid;background-color:white;}
.select_menu{cursor:pointer;text-align:left;display:block;margin:0px;font-family:verdana;font-size:11px;color:gray;width:120px;height:18px;padding:2px;border:silver 1px solid;background-image:url(http://www.widgetplus.com/shade.jpg);background-repeat:repeat-x;background-position:bottom left;}
.select_menu input {border:0px solid;width:100px;height:17px;}

-->
</style>
<div id="calendar">

 <table class="cal_table" cellpadding="0" cellspacing="0" border="0" style="background-color:white">
<tr>
<td colspan="2" class="menu">

<table>
<tr>
<td>
<div class="select_menu" style="height:18px;width:110" menu="Jan^$('a_month').setAttribute('title','1');$('a_month').value='Jan';calendar_do.flipTo()^^http://www.naltabyte.se/generic/calendar.png::
           Feb^$('a_month').setAttribute('title','2');$('a_month').value='Feb';calendar_do.flipTo()^^http://www.naltabyte.se/generic/calendar.png::
           Mar^$('a_month').setAttribute('title','3');$('a_month').value='Mar';calendar_do.flipTo()^^http://www.naltabyte.se/generic/calendar.png::
           Apr^$('a_month').setAttribute('title','4');$('a_month').value='Apr';calendar_do.flipTo()^^http://www.naltabyte.se/generic/calendar.png::
           May^$('a_month').setAttribute('title','5');$('a_month').value='May';calendar_do.flipTo()^^http://www.naltabyte.se/generic/calendar.png::
           Jun^$('a_month').setAttribute('title','6');$('a_month').value='Jun';calendar_do.flipTo()^^http://www.naltabyte.se/generic/calendar.png::
           Jul^$('a_month').setAttribute('title','7');$('a_month').value='Jul';calendar_do.flipTo()^^http://www.naltabyte.se/generic/calendar.png::
           Aug^$('a_month').setAttribute('title','8');$('a_month').value='Aug';calendar_do.flipTo()^^http://www.naltabyte.se/generic/calendar.png::
           sep^$('a_month').setAttribute('title','9');$('a_month').value='Sep';calendar_do.flipTo()^^http://www.naltabyte.se/generic/calendar.png::
           Oct^$('a_month').setAttribute('title','10');$('a_month').value='Oct';calendar_do.flipTo()^^http://www.naltabyte.se/generic/calendar.png::
           Nov^$('a_month').setAttribute('title','11');$('a_month').value='Nov';calendar_do.flipTo()^^http://www.naltabyte.se/generic/calendar.png::
           Dec^$('a_month').setAttribute('title','12');$('a_month').value='Dec';calendar_do.flipTo()^^http://www.naltabyte.se/generic/calendar.png">
<input type="text" title="1" value="Month" id="a_month" />^
</div>
</td>
<td style="padding:2px">
<div class="select_menu" style="height:18px;width:110" menu="2008^$('a_year').setAttribute('title','2008');$('a_year').value='2008';calendar_do.flipTo()^^http://www.naltabyte.se/generic/calendar.png::
           2007^$('a_year').setAttribute('title','2007');$('a_year').value='2007';calendar_do.flipTo()^^http://www.naltabyte.se/generic/calendar.png::
           2006^$('a_year').setAttribute('title','2006');$('a_year').value='2006';calendar_do.flipTo()^^http://www.naltabyte.se/generic/calendar.png">
<input type="text" title="2008" value="Year" id="a_year" />^
</div>
</td>
</tr>
</table>

</td>
</tr>
<tr valign="top">
<td>
<div id="cal" onready="xin.calendar.init('cal','calendar_do.SelectDay:calendar_do.SelectWeek:calendar_do.SelectEdit','calendar_do.onLoaded')">
The calendar is loading..
 </div>
</td>
<td align="center">

<table border="0" cellpadding="0" cellspacing="0" style="margin:0px;margin-top:3px">
<tr valign="top">
<td>


<div style="padding:0;border:inset 1px;background-color:#dddddd;width:18px;height:197px;_height:200px;overflow:hidden;">
<div id="slide_scroll" resize="true" minlimit="25" resize_y="false" slider="calendar_do.slide" style="border:0;margin:0;margin-left:auto;margin-right:auto;padding:0;background-image:url(http://www.widgetplus.com/themes/scroll_y.png);background-position:bottom left;background-repeat:no-repeat;width:15px;height:25px;overflow:hidden;cursor:pointer">
</div>
</div>

</td>
<td>

<div id="calendar_slide" style="margin:3px;margin-top:0px;width:190px;height:190px;_height:200px;overflow:hidden;border:gray 1px solid;background-color:white">

<div class="cal" style="font-family:verdana;font-size:11px;position:relative;top:0">
<table cellspacing="0" cellpadding="0" border="0">
<tr valign="top">
<td id="cal_display_sun"></td></tr><tr>
<td id="cal_display_mon"></td></tr><tr>
<td id="cal_display_tue"></td></tr><tr>
<td id="cal_display_wed"></td></tr><tr>
<td id="cal_display_thu"></td></tr><tr>
<td id="cal_display_fri"></td></tr><tr>
<td id="cal_display_sat"></td>
</tr>
</table>
 </div>
 </div>


<form id="c_saved" name="calendar_saved" method="post" action="" 
   style="display:none;margin:3px;margin-top:0px;width:190px;height:190px;_height:200px;overflow:hidden;border:gray 1px solid;background-color:white">
   <i style="font-family:verdana;font-size:12px;color:gray;margin-right:5px;margin-left:5px">From</i> <input type="text" value="01" style="width:20px;border:silver 1px solid" />
   :<input type="text" value="01" style="width:20px;border:silver 1px solid" />
   <i style="font-family:verdana;font-size:12px;color:gray;margin-right:5px;margin-left:5px">To</i> <input type="text" value="01" style="width:20px;border:silver 1px solid" />
   :<input type="text" value="01" style="width:20px;border:silver 1px solid" />
<textarea id="calendar_edit_content" name="calendar_content" style="display:block;margin:3px;padding:2px;font-family:verdana;font-size:11px;color:black;background-color:white;width:180px;height:130px;">
</textarea>
<input onclick="calendar_do.edit()" type="button" value="Save entry" class="ibut" style="margin:3px;border:gray 1px solid" />
<input type="hidden" name="calendar_date" id="c_date" />
</form>
 
</td>
</tr>
</table>

</td>
</tr>
</table>


</div>
</animation>
