PHP Classes

File: xbl.xml

Recommend this page to a friend!
  Classes of Herman Veluwenkamp   HV WDDX Metadata   xbl.xml   Download  
File: xbl.xml
Role: Auxiliary data
Content type: text/plain
Description: XBL describing Calendar and Timepicker Widget.
Class: HV WDDX Metadata
Generates XUL and HTML forms based on XML config.
Author: By
Last change: Put label on popup menu.
Date: 20 years ago
Size: 19,621 bytes
 

Contents

Class file image Download
<bindings xmlns="http://www.mozilla.org/xbl" xmlns:xbl="http://www.mozilla.org/xbl" xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <binding id="time"> <content> <xul:textbox xbl:inherits="value,readonly" anonid="time"/> <!-- **** DELETE MENU LABEL IF YOU HAVE AN IMAGE --> <xul:menu class="timepicker-popup" label="Time Picker"> <xul:menupopup xpopupanchor="bottomleft" xpopupalign="topright"> <xul:timepicker xbl:inherits="value"/> </xul:menupopup> </xul:menu> </content> <implementation> <constructor><![CDATA[ this.time = document.getAnonymousElementByAttribute(this, "anonid", "time"); ]]></constructor> <property name="value" onget="return this.time.value;" onset="this.time.value = val; return val;"/> </implementation> </binding> <binding id="date"> <content> <xul:textbox xbl:inherits="value,readonly" anonid="date" flex="0"/> <!-- **** DELETE MENU LABEL IF YOU HAVE AN IMAGE --> <xul:menu class="datepicker-popup" label="Date Picker"> <xul:menupopup> <xul:datepicker xbl:inherits="value"/> </xul:menupopup> </xul:menu> </content> <implementation> <constructor><![CDATA[ this.date = document.getAnonymousElementByAttribute(this, "anonid", "date"); if (this.value=='0000-00-00') this.setAttribute('value', ''); ]]></constructor> <property name="value" onget="return this.date.value;" onset="this.date.value = val; return val;"/> </implementation> </binding> <binding id="textboxmulti"> <content> <xul:textbox type="text" anonid="input" multiline="true" xbl:inherits="flex,rows,cols,wrap,readonly,style"/> </content> <implementation> <constructor><![CDATA[ this.input=document.getAnonymousElementByAttribute(this, "anonid", "input"); if (this.hasAttribute('value')) this.input.value = this.getAttribute('value'); ]]></constructor> <property name="value" onset="this.input.value=val;" onget="return this.input.value;"/> </implementation> </binding> <!-- DATE PICKER --> <binding id="datepicker"> <content> <xul:vbox class="datepicker-mainbox" flex="1"> <xul:hbox class="datepicker-month-box"> <xul:text class="datepicker-button-month" value="&lt;&lt;" increment="-12"/> <xul:text class="datepicker-button-month" value="&lt; " increment="-1"/> <xul:spacer flex="1"/> <xul:text class="datepicker-month-name" value="Month"/> <xul:spacer flex="1"/> <xul:text class="datepicker-button-month" value="&gt;" increment="1"/> <xul:text class="datepicker-button-month" value="&gt;&gt;" increment="12"/> </xul:hbox> <xul:vbox class="datepicker-box" flex="1"> <xul:hbox class="datepicker-row-head" equalsize="always"> <xul:text class="datepicker-header" flex="1" value="M"/> <xul:text class="datepicker-header" flex="1" value="T"/> <xul:text class="datepicker-header" flex="1" value="W"/> <xul:text class="datepicker-header" flex="1" value="T"/> <xul:text class="datepicker-header" flex="1" value="F"/> <xul:text class="datepicker-header" flex="1" value="S"/> <xul:text class="datepicker-header" flex="1" value="S"/> </xul:hbox> <xul:hbox class="datepicker-row-body" equalsize="always" flex="1"> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> </xul:hbox> <xul:hbox class="datepicker-row-body" equalsize="always" flex="1"> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> </xul:hbox> <xul:hbox class="datepicker-row-body" equalsize="always" flex="1"> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> </xul:hbox> <xul:hbox class="datepicker-row-body" equalsize="always" flex="1"> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> </xul:hbox> <xul:hbox class="datepicker-row-body" equalsize="always" flex="1"> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> </xul:hbox> <xul:hbox class="datepicker-row-body" equalsize="always" flex="1"> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> <xul:text class="datepicker-day" flex="1"/> </xul:hbox> </xul:vbox> </xul:vbox> </content> <implementation> <constructor><![CDATA[ var box_month = document.getAnonymousNodes(this)[0].childNodes[0]; this.month_decrement = box_month.childNodes[1]; this.month_decrement.datepicker = this; this.month_increment = box_month.childNodes[5]; this.month_increment.datepicker = this; this.year_decrement = box_month.childNodes[0]; this.year_decrement.datepicker = this; this.year_increment = box_month.childNodes[6]; this.year_increment.datepicker = this; this.node_month = box_month.childNodes[3]; if (this.value) { date_array = this.value.split('-'); year = date_array[0]; month = date_array[1]-1; day = date_array[2]; // if year is zero the use current date as default. date may be set to 0000-00-00 from database. if (year==0) this.date = new Date(); else this.date = new Date(year, month, day); //this.date = new Date(year, month, day); } else { this.date = new Date(); } //dump(this.date); this.showDate(this.date); ]]></constructor> <property name="value" onget="return this.getAttribute('value');" onset="return this.setAttribute('value', val);"/> <method name="showDate"> <parameter name="some_date"/> <body><![CDATA[ //dump('showDate - some_date = '+some_date); this.display_date = some_date; var a_month = new Date(some_date.toString()); a_month.setDate(1); // first day var selected_year = this.date.getFullYear(); var selected_month = this.date.getMonth(); var selected_date = this.date.getDate(); // UPDATE THE MONTH var month = this.getMonthName(a_month) + " " + a_month.getFullYear(); this.node_month.setAttribute("value", month); var box_datepicker = document.getAnonymousNodes(this)[0].childNodes[1]; var first_weekday = (a_month.getDay() + 6) % 7; // start on monday var node_date = new Date(a_month.getTime()); node_date.setDate(node_date.getDate()-first_weekday); for (var k = 1; k < box_datepicker.childNodes.length; k++) { var row = box_datepicker.childNodes[k]; for (var i = 0; i < 7; i++) { node_day = row.childNodes[i]; node_day.setAttribute("selected", "false"); // clear old attributes if (a_month.getMonth() != node_date.getMonth()) { node_day.setAttribute("othermonth", "true"); } else { node_day.setAttribute("othermonth", ""); } // HIGHLIGHT THE SELECTED DATE if ((selected_year == node_date.getFullYear()) && (selected_month == node_date.getMonth()) && (selected_date == node_date.getDate())) { node_day.setAttribute("selected", "true"); } node_day.date = node_date; node_day.datepicker = this; node_day.setAttribute("value", node_date.getDate()); node_date = new Date(node_date.getTime()); node_date.setDate(node_date.getDate() + 1); } } ]]></body> </method> <method name="monthClicked"> <parameter name="increment"/> <body><![CDATA[ var month= this.display_date.getMonth()+increment; this.display_date.setMonth(month); this.showDate(this.display_date); ]]></body> </method> <method name="dayClicked"> <parameter name="some_day"/> <body><![CDATA[ this.date = some_day.date; this.value = this.date.getFullYear() + '-' + (this.date.getMonth() + 1) + '-' + this.date.getDate(); this.showDate(this.date); try { this.parentNode.parentNode.parentNode.value = this.value; this.parentNode.parentNode.parentNode.setAttribute('value', this.value); this.parentNode.hidePopup(); } catch(e) {}; //dump(this.value); ]]></body> </method> <method name="getMonthName"> <parameter name="a_month"/> <body><![CDATA[ var monthNames = new Array(12); monthNames[0] = "January"; monthNames[1] = "February"; monthNames[2] = "March"; monthNames[3] = "April"; monthNames[4] = "May"; monthNames[5] = "June"; monthNames[6] = "July"; monthNames[7] = "August"; monthNames[8] = "September"; monthNames[9] = "October"; monthNames[10] = "November"; monthNames[11] = "December"; var index = a_month.getMonth(); return monthNames[index]; ]]></body> </method> </implementation> </binding> <binding id="datepicker-button-month" inherits="dir"> <handlers> <handler event="click"><![CDATA[ this.datepicker.monthClicked(parseInt(this.getAttribute('increment'))); ]]></handler> </handlers> <implementation/> </binding> <binding id="datepicker-day" extends="xul:text"> <handlers> <handler event="click" action="this.datepicker.dayClicked(this)"/> </handlers> <implementation/> </binding> <!-- TIMEPICKER --> <binding id="timepicker"> <content> <xul:vbox> <xul:hbox equalsize="always" flex="1"> <xul:text class="timepicker-head" value="AM"/> <xul:text class="timepicker-head" value="PM"/> <xul:text class="timepicker-head" value="Minute"/> </xul:hbox> <xul:hbox class="timepicker-box" flex="1"> <xul:vbox class="timepicker-hour-col" equalsize="always" flex="1"> <xul:text class="timepicker-hour" flex="1" value="00" onclick="clickHour(0);"/> <xul:text class="timepicker-hour" flex="1" value="01" onclick="clickHour(1);"/> <xul:text class="timepicker-hour" flex="1" value="02" onclick="clickHour(2);"/> <xul:text class="timepicker-hour" flex="1" value="03" onclick="clickHour(3);"/> <xul:text class="timepicker-hour" flex="1" value="04" onclick="clickHour(4);"/> <xul:text class="timepicker-hour" flex="1" value="05" onclick="clickHour(5);"/> <xul:text class="timepicker-hour" flex="1" value="06" onclick="clickHour(6);"/> <xul:text class="timepicker-hour" flex="1" value="07" onclick="clickHour(7);"/> <xul:text class="timepicker-hour" flex="1" value="08" onclick="clickHour(8);"/> <xul:text class="timepicker-hour" flex="1" value="09" onclick="clickHour(9);"/> <xul:text class="timepicker-hour" flex="1" value="10" onclick="clickHour(10);"/> <xul:text class="timepicker-hour" flex="1" value="11" onclick="clickHour(11);"/> </xul:vbox> <xul:vbox class="timepicker-hour-col" equalsize="always" flex="1"> <xul:text class="timepicker-hour" flex="1" value="12" onclick="clickHour(12);"/> <xul:text class="timepicker-hour" flex="1" value="13" onclick="clickHour(13);"/> <xul:text class="timepicker-hour" flex="1" value="14" onclick="clickHour(14);"/> <xul:text class="timepicker-hour" flex="1" value="15" onclick="clickHour(15);"/> <xul:text class="timepicker-hour" flex="1" value="16" onclick="clickHour(16);"/> <xul:text class="timepicker-hour" flex="1" value="17" onclick="clickHour(17);"/> <xul:text class="timepicker-hour" flex="1" value="18" onclick="clickHour(18);"/> <xul:text class="timepicker-hour" flex="1" value="19" onclick="clickHour(19);"/> <xul:text class="timepicker-hour" flex="1" value="20" onclick="clickHour(20);"/> <xul:text class="timepicker-hour" flex="1" value="21" onclick="clickHour(21);"/> <xul:text class="timepicker-hour" flex="1" value="22" onclick="clickHour(22);"/> <xul:text class="timepicker-hour" flex="1" value="23" onclick="clickHour(23);"/> </xul:vbox> <xul:vbox class="timepicker-minute-col" equalsize="always" flex="1"> <xul:text class="timepicker-minute" flex="1" value=":00" onclick="clickMinute(0);"/> <xul:text class="timepicker-minute" flex="1" value=":05" onclick="clickMinute(5);"/> <xul:text class="timepicker-minute" flex="1" value=":10" onclick="clickMinute(10);"/> <xul:text class="timepicker-minute" flex="1" value=":15" onclick="clickMinute(15);"/> <xul:text class="timepicker-minute" flex="1" value=":20" onclick="clickMinute(20);"/> <xul:text class="timepicker-minute" flex="1" value=":25" onclick="clickMinute(25);"/> <xul:text class="timepicker-minute" flex="1" value=":30" onclick="clickMinute(30);"/> <xul:text class="timepicker-minute" flex="1" value=":35" onclick="clickMinute(35);"/> <xul:text class="timepicker-minute" flex="1" value=":40" onclick="clickMinute(40);"/> <xul:text class="timepicker-minute" flex="1" value=":45" onclick="clickMinute(45);"/> <xul:text class="timepicker-minute" flex="1" value=":50" onclick="clickMinute(50);"/> <xul:text class="timepicker-minute" flex="1" value=":55" onclick="clickMinute(55);"/> </xul:vbox> </xul:hbox> </xul:vbox> </content> <implementation> <constructor><![CDATA[ timepicker_box = document.getAnonymousNodes(this)[0].childNodes[1]; this.col_hour_am = timepicker_box.childNodes[0]; this.col_hour_pm = timepicker_box.childNodes[1]; this.col_minute = timepicker_box.childNodes[2]; if (this.value) { time = this.value.split(':'); hour = time[0]; minute = time[1]; this.selectMinute(minute); this.selectHour(hour); } ]]></constructor> <property name="value" onget="return this.getAttribute('value');" onset="return this.setAttribute('value', val);"/> <method name="selectMinute"> <parameter name="minute"/> <body><![CDATA[ minute_index = parseInt((minute / 5) + 0.5); if (this.selected_minute) this.selected_minute.className="timepicker-minute"; this.col_minute.childNodes[minute_index].className = "timepicker-minute-selected"; this.selected_minute = this.col_minute.childNodes[minute_index]; ]]></body> </method> <method name="selectHour"> <parameter name="hour"/> <body><![CDATA[ if (this.selected_hour) this.selected_hour.className="timepicker-hour"; if (hour < 12) { this.col_hour_am.childNodes[hour].className = "timepicker-hour-selected"; this.selected_hour = this.col_hour_am.childNodes[hour]; } if (hour >= 12) { this.col_hour_pm.childNodes[hour-12].className = "timepicker-hour-selected"; this.selected_hour = this.col_hour_pm.childNodes[hour-12]; } ]]></body> </method> <method name="clickMinute"> <parameter name="minute"/> <body><![CDATA[ this.selectMinute(minute); time = this.value.split(':'); hour = (time[0]==undefined || time[0] == '') ? '00' : time[0]; if (minute < 10) minute = '0' + minute; this.value = hour + ':' + minute; //dump(this.value); try { this.parentNode.parentNode.parentNode.value = this.value; this.parentNode.parentNode.parentNode.setAttribute('value', this.value); this.parentNode.hidePopup(); } catch(e) {} ]]></body> </method> <method name="clickHour"> <parameter name="hour"/> <body><![CDATA[ this.selectHour(hour); var time = this.value.split(':'); minute = (time[1]==undefined) ? '00' : time[1]; if (hour < 10) hour = '0' + hour; this.value = hour + ':' + minute; if (this.parentNode.parentNode.parentNode.nodeName=='time') this.parentNode.parentNode.parentNode.setAttribute('value', this.value); ]]></body> </method> </implementation> </binding> </bindings>