mirror of
https://github.com/rn10950/RetroZilla.git
synced 2024-11-14 11:40:13 +01:00
838 lines
27 KiB
XML
838 lines
27 KiB
XML
|
<!-- ***** BEGIN LICENSE BLOCK *****
|
||
|
- Version: MPL 1.1/GPL 2.0/LGPL 2.1
|
||
|
-
|
||
|
- The contents of this file are subject to the Mozilla Public License Version
|
||
|
- 1.1 (the "License"); you may not use this file except in compliance with
|
||
|
- the License. You may obtain a copy of the License at
|
||
|
- http://www.mozilla.org/MPL/
|
||
|
-
|
||
|
- Software distributed under the License is distributed on an "AS IS" basis,
|
||
|
- WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
|
||
|
- for the specific language governing rights and limitations under the
|
||
|
- License.
|
||
|
-
|
||
|
- The Original Code is Mozilla XForms support.
|
||
|
-
|
||
|
- The Initial Developer of the Original Code is
|
||
|
- IBM Corporation.
|
||
|
- Portions created by the Initial Developer are Copyright (C) 2006
|
||
|
- the Initial Developer. All Rights Reserved.
|
||
|
-
|
||
|
- Contributor(s):
|
||
|
- Doron Rosenberg <doronr@us.ibm.com>
|
||
|
- Alexander Surkov <surkov@dc.baikal.ru>
|
||
|
- Allan Beaufour <allan@beaufour.dk>
|
||
|
-
|
||
|
- Alternatively, the contents of this file may be used under the terms of
|
||
|
- either the GNU General Public License Version 2 or later (the "GPL"), or
|
||
|
- the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
|
||
|
- in which case the provisions of the GPL or the LGPL are applicable instead
|
||
|
- of those above. If you wish to allow use of your version of this file only
|
||
|
- under the terms of either the GPL or the LGPL, and not to allow others to
|
||
|
- use your version of this file under the terms of the MPL, indicate your
|
||
|
- decision by deleting the provisions above and replace them with the notice
|
||
|
- and other provisions required by the GPL or the LGPL. If you do not delete
|
||
|
- the provisions above, a recipient may use your version of this file under
|
||
|
- the terms of any one of the MPL, the GPL or the LGPL.
|
||
|
-
|
||
|
- ***** END LICENSE BLOCK ***** -->
|
||
|
|
||
|
<!DOCTYPE bindings [
|
||
|
<!ENTITY % xformsDTD SYSTEM "chrome://xforms/locale/xforms.dtd">
|
||
|
%xformsDTD;
|
||
|
]>
|
||
|
|
||
|
<!--
|
||
|
The file contains auxiliary controls implementations for XHTML context. The
|
||
|
controls are inherited from bindings defined in 'widgets.xml' file.
|
||
|
-->
|
||
|
|
||
|
<bindings id="widgetsBindingsForXHTML"
|
||
|
xmlns="http://www.mozilla.org/xbl"
|
||
|
xmlns:html="http://www.w3.org/1999/xhtml"
|
||
|
xmlns:xbl="http://www.mozilla.org/xbl"
|
||
|
xmlns:mozType="http://www.mozilla.org/projects/xforms/2005/type">
|
||
|
|
||
|
|
||
|
<!-- CALENDAR WIDGETS -->
|
||
|
|
||
|
<!-- COMPACT CALENDAR -->
|
||
|
<binding id="calendar-compact"
|
||
|
extends="chrome://xforms/content/widgets.xml#calendar-compact-base">
|
||
|
|
||
|
<resources>
|
||
|
<stylesheet src="chrome://xforms/skin/widgets-xhtml.css"/>
|
||
|
</resources>
|
||
|
|
||
|
<content xmlns:wairole="http://www.w3.org/2005/01/wai-rdf/GUIRoleTaxonomy#">
|
||
|
<html:table role="wairole:grid">
|
||
|
<html:tbody anonid="dayContainer"/>
|
||
|
</html:table>
|
||
|
</content>
|
||
|
|
||
|
<implementation>
|
||
|
<!-- interface -->
|
||
|
|
||
|
<!-- Set type and label for the day control element -->
|
||
|
<method name="setDayControl">
|
||
|
<parameter name="aControl"/>
|
||
|
<parameter name="aType"/>
|
||
|
<parameter name="aLabel"/>
|
||
|
<body>
|
||
|
aControl.textContent = aLabel;
|
||
|
aControl.setAttribute("class", aType);
|
||
|
</body>
|
||
|
</method>
|
||
|
|
||
|
<!-- Select day control element -->
|
||
|
<method name="selectDayControl">
|
||
|
<parameter name="aControl"/>
|
||
|
<body>
|
||
|
if (aControl)
|
||
|
aControl.setAttribute("selected", "selected");
|
||
|
</body>
|
||
|
</method>
|
||
|
|
||
|
<!-- Unselect day control element -->
|
||
|
<method name="unselectDayControl">
|
||
|
<parameter name="aControl"/>
|
||
|
<body>
|
||
|
if (aControl)
|
||
|
aControl.removeAttribute("selected");
|
||
|
</body>
|
||
|
</method>
|
||
|
|
||
|
<!-- Return true if node is control element for a day -->
|
||
|
<method name="isDayControl">
|
||
|
<parameter name="aNode"/>
|
||
|
<body>
|
||
|
if (aNode.localName != "td" || aNode.namespaceURI != this.XHTML_NS)
|
||
|
return false;
|
||
|
return true;
|
||
|
</body>
|
||
|
</method>
|
||
|
|
||
|
<method name="buildUI">
|
||
|
<body>
|
||
|
<![CDATA[
|
||
|
var dayOfWeekNames = this.getDaysOfWeekNames();
|
||
|
var row = this.ownerDocument.createElementNS(this.XHTML_NS, "tr");
|
||
|
|
||
|
// create days of a week names
|
||
|
var header;
|
||
|
for (var i = 0; i < 7; i++) {
|
||
|
header = this.ownerDocument.createElementNS(this.XHTML_NS, "th");
|
||
|
header.setAttribute("role", "wairole:columnheader");
|
||
|
header.textContent = dayOfWeekNames[i];
|
||
|
row.appendChild(header);
|
||
|
}
|
||
|
this.dayContainer.appendChild(row);
|
||
|
|
||
|
// create days
|
||
|
var cell;
|
||
|
for (var i = 0; i < 6; i++) {
|
||
|
row = document.createElementNS(this.XHTML_NS, "tr");
|
||
|
|
||
|
for (var y = 0; y < 7; y++) {
|
||
|
cell = this.ownerDocument.createElementNS(this.XHTML_NS, "td");
|
||
|
cell.setAttribute("role", "wairole:gridcell");
|
||
|
cell.setAttribute("tabindex", "-1");
|
||
|
this._dayElements.push(cell);
|
||
|
row.appendChild(cell);
|
||
|
}
|
||
|
this.dayContainer.appendChild(row);
|
||
|
}
|
||
|
]]>
|
||
|
</body>
|
||
|
</method>
|
||
|
|
||
|
<property name="XHTML_NS" readonly="true"
|
||
|
onget="return 'http://www.w3.org/1999/xhtml';"/>
|
||
|
|
||
|
<!-- Return container of controls for days -->
|
||
|
<property name="dayContainer" readonly="true">
|
||
|
<getter>
|
||
|
if (!this._dayContainer)
|
||
|
this._dayContainer = this.ownerDocument.
|
||
|
getAnonymousElementByAttribute(this, "anonid", "dayContainer");
|
||
|
return this._dayContainer;
|
||
|
</getter>
|
||
|
</property>
|
||
|
<field name="_dayContainer">null</field>
|
||
|
</implementation>
|
||
|
|
||
|
<handlers>
|
||
|
<handler event="keydown" keycode="VK_SPACE">
|
||
|
var target = event.originalTarget;
|
||
|
if (this.isDayControl(target))
|
||
|
this.processAction(target.getAttribute("class"), target.textContent);
|
||
|
</handler>
|
||
|
<handler event="mousedown" button="0">
|
||
|
var target = event.originalTarget;
|
||
|
if (this.isDayControl(target))
|
||
|
this.processAction(target.getAttribute("class"), target.textContent);
|
||
|
</handler>
|
||
|
</handlers>
|
||
|
</binding>
|
||
|
|
||
|
|
||
|
<!-- FULL CALENDAR -->
|
||
|
<binding id="calendar-full" extends="#calendar-compact">
|
||
|
<content xmlns:wairole="http://www.w3.org/2005/01/wai-rdf/GUIRoleTaxonomy#">
|
||
|
<html:table role="wairole:grid">
|
||
|
<html:tbody anonid="dayContainer">
|
||
|
<html:tr>
|
||
|
<html:td colspan="1">
|
||
|
<html:input type="button" anonid="back-button"
|
||
|
class="-moz-date-back-button"
|
||
|
title="&xforms.datepicker.prevMonth.title;"/>
|
||
|
</html:td>
|
||
|
<html:td colspan="5" align="center">
|
||
|
<html:span anonid="date-label"/>
|
||
|
</html:td>
|
||
|
<html:td colspan="1">
|
||
|
<html:input type="button" anonid="fwd-button"
|
||
|
class="-moz-date-fwd-button"
|
||
|
title="&xforms.datepicker.nextMonth.title;"/>
|
||
|
</html:td>
|
||
|
</html:tr>
|
||
|
</html:tbody>
|
||
|
</html:table>
|
||
|
</content>
|
||
|
|
||
|
<implementation>
|
||
|
<!-- interface -->
|
||
|
<!-- Update UI -->
|
||
|
<method name="refresh">
|
||
|
<parameter name="aCurrentDay"/>
|
||
|
<parameter name="aDaysRefreshOnly"/>
|
||
|
<body>
|
||
|
this.refreshInternal(aCurrentDay, aDaysRefreshOnly);
|
||
|
var dateLabel =
|
||
|
new Date(this.year, this.month - 1).toLocaleFormat("%B %Y");
|
||
|
this.dateLabel.textContent = dateLabel;
|
||
|
</body>
|
||
|
</method>
|
||
|
|
||
|
<!-- private -->
|
||
|
<method name="getFocusedElement">
|
||
|
<body>
|
||
|
var selection = this.ownerDocument.defaultView.getSelection();
|
||
|
if (!selection)
|
||
|
return null;
|
||
|
|
||
|
var focused = selection.focusNode;
|
||
|
if (!focused)
|
||
|
return null;
|
||
|
|
||
|
// focusNode returns html:td if focused element is inside table cell
|
||
|
// (see bug 365900).
|
||
|
if (focused.localName != "input") {
|
||
|
input = focused.getElementsByTagNameNS(this.XHTML_NS, "input")[0];
|
||
|
if (input)
|
||
|
return input;
|
||
|
}
|
||
|
|
||
|
return focused;
|
||
|
</body>
|
||
|
</method>
|
||
|
|
||
|
<property name="dateLabel" readonly="true">
|
||
|
<getter>
|
||
|
if (!this._dateLabel) {
|
||
|
this._dateLabel = this.ownerDocument.
|
||
|
getAnonymousElementByAttribute(this, "anonid", "date-label");
|
||
|
}
|
||
|
return this._dateLabel;
|
||
|
</getter>
|
||
|
</property>
|
||
|
<field name="_dateLabel">null</field>
|
||
|
|
||
|
<property name="backButton" readonly="true">
|
||
|
<getter>
|
||
|
if (!this._backButton) {
|
||
|
this._backButton = this.ownerDocument.
|
||
|
getAnonymousElementByAttribute(this, "anonid", "back-button");
|
||
|
}
|
||
|
return this._backButton;
|
||
|
</getter>
|
||
|
</property>
|
||
|
<field name="_backButton">null</field>
|
||
|
|
||
|
<property name="fwdButton" readonly="true">
|
||
|
<getter>
|
||
|
if (!this._fwdButton) {
|
||
|
this._fwdButton = this.ownerDocument.
|
||
|
getAnonymousElementByAttribute(this, "anonid", "fwd-button");
|
||
|
}
|
||
|
return this._fwdButton;
|
||
|
</getter>
|
||
|
</property>
|
||
|
<field name="_fwdButton">null</field>
|
||
|
</implementation>
|
||
|
|
||
|
<handlers>
|
||
|
<handler event="keypress" phase="capturing">
|
||
|
<![CDATA[
|
||
|
var target = event.originalTarget;
|
||
|
|
||
|
switch (event.keyCode) {
|
||
|
case event.DOM_VK_DOWN:
|
||
|
if (target == this.backButton || target == this.fwdButton)
|
||
|
this.focus();
|
||
|
break;
|
||
|
|
||
|
case event.DOM_VK_UP:
|
||
|
if (this.isDayControl(target)) {
|
||
|
if (this.currentDayIndex - 3 <= 0) {
|
||
|
this.backButton.focus();
|
||
|
} else if (this.currentDayIndex - 7 <= 0) {
|
||
|
this.fwdButton.focus();
|
||
|
}
|
||
|
}
|
||
|
break;
|
||
|
|
||
|
case event.DOM_VK_LEFT: case event.DOM_VK_RIGHT:
|
||
|
if (target == this.backButton)
|
||
|
this.fwdButton.focus();
|
||
|
else if (target == this.fwdButton)
|
||
|
this.backButton.focus();
|
||
|
break;
|
||
|
}
|
||
|
]]>
|
||
|
</handler>
|
||
|
|
||
|
<handler event="click" button="0">
|
||
|
switch (event.originalTarget) {
|
||
|
case this.backButton:
|
||
|
this.processAction("prevMonth", null, true);
|
||
|
break;
|
||
|
case this.fwdButton:
|
||
|
this.processAction("nextMonth", null, true);
|
||
|
break;
|
||
|
}
|
||
|
</handler>
|
||
|
|
||
|
<handler event="keypress" keycode="VK_TAB">
|
||
|
if (!this.hasAttribute("internaltabhandling"))
|
||
|
return;
|
||
|
|
||
|
event.preventDefault();
|
||
|
|
||
|
var focused = getFocusedElement();
|
||
|
if (!focused)
|
||
|
return;
|
||
|
|
||
|
if (focused == this.backButton) {
|
||
|
this.fwdButton.focus();
|
||
|
} else if (focused == this.fwdButton) {
|
||
|
this.focus();
|
||
|
} else {
|
||
|
this.backButton.focus();
|
||
|
}
|
||
|
</handler>
|
||
|
|
||
|
<handler event="keypress" keycode="VK_TAB" modifiers="shift">
|
||
|
if (!this.hasAttribute("internaltabhandling"))
|
||
|
return;
|
||
|
|
||
|
event.preventDefault();
|
||
|
|
||
|
var focused = getFocusedElement();
|
||
|
if (!focused)
|
||
|
return;
|
||
|
|
||
|
if (focused == this.backButton) {
|
||
|
this.focus();
|
||
|
} else if (focused == this.fwdButton) {
|
||
|
this.backButton.focus();
|
||
|
} else {
|
||
|
this.fwdButton.focus();
|
||
|
}
|
||
|
</handler>
|
||
|
</handlers>
|
||
|
</binding>
|
||
|
|
||
|
|
||
|
<binding id="slider">
|
||
|
<resources>
|
||
|
<stylesheet src="chrome://xforms/skin/widgets-xhtml.css"/>
|
||
|
</resources>
|
||
|
|
||
|
<content>
|
||
|
<html:span anonid="minlabel"/>
|
||
|
<!-- XXX: width and height set by CSS, see bug 350870. -->
|
||
|
<html:canvas tabindex="0" anonid="canvas" width="260" height="40"
|
||
|
xbl:inherits="tabindex=mozType:tabindex"/>
|
||
|
<html:span anonid="maxlabel"/>
|
||
|
</content>
|
||
|
|
||
|
<implementation>
|
||
|
<!-- interface -->
|
||
|
|
||
|
<!-- Get/set lower bound of values. -->
|
||
|
<property name="min"
|
||
|
onget="return parseFloat(this.getAttribute('min'));"
|
||
|
onset="this.setMin(val, true);"/>
|
||
|
|
||
|
<!-- Get/set upper bound of values. -->
|
||
|
<property name="max"
|
||
|
onget="return parseFloat(this.getAttribute('max'));"
|
||
|
onset="this.setMax(val, true);"/>
|
||
|
|
||
|
<!-- Get/set step of values. -->
|
||
|
<property name="step"
|
||
|
onget="return parseFloat(this.getAttribute('step'));"
|
||
|
onset="this.setStep(val, true);"/>
|
||
|
|
||
|
<!-- Get/set value. -->
|
||
|
<property name="value">
|
||
|
<getter>
|
||
|
return parseFloat(this.getAttribute("value"));
|
||
|
</getter>
|
||
|
<setter>
|
||
|
<![CDATA[
|
||
|
var value = parseFloat(val);
|
||
|
if (isNaN(value) || value < this.min)
|
||
|
value = this.min;
|
||
|
else if (value > this.max)
|
||
|
value = this.max;
|
||
|
|
||
|
var boxobj = this.sliderController;
|
||
|
if (this.value != value)
|
||
|
this.eraseSlider(boxobj.getXCoordFromValue(this.value));
|
||
|
this.drawSlider(boxobj.getXCoordFromValue(value));
|
||
|
this.setAttribute("value", value);
|
||
|
]]>
|
||
|
</setter>
|
||
|
</property>
|
||
|
|
||
|
<!-- Set min/max/step/value -->
|
||
|
<method name="set">
|
||
|
<parameter name="aMin"/>
|
||
|
<parameter name="aMax"/>
|
||
|
<parameter name="aStep"/>
|
||
|
<parameter name="aValue"/>
|
||
|
<body>
|
||
|
if (!isNaN(parseFloat(aMin)) ||
|
||
|
!isNaN(parseFloat(aMax)) ||
|
||
|
!isNaN(parseFloat(aStep))) {
|
||
|
this.setMin(aMin, false);
|
||
|
this.setMax(aMax, false);
|
||
|
this.setStep(aStep, false);
|
||
|
this.drawScale();
|
||
|
}
|
||
|
if (!isNaN(aValue))
|
||
|
this.value = aValue;
|
||
|
</body>
|
||
|
</method>
|
||
|
|
||
|
<method name="focus">
|
||
|
<body>
|
||
|
this.canvas.focus();
|
||
|
return true;
|
||
|
</body>
|
||
|
</method>
|
||
|
|
||
|
<!-- private -->
|
||
|
<method name="setMin">
|
||
|
<parameter name="aValue"/>
|
||
|
<parameter name="aRefresh"/>
|
||
|
<body>
|
||
|
if (!isNaN(parseFloat(aValue))) {
|
||
|
this.setAttribute("min", aValue);
|
||
|
this.minLabel.textContent = aValue;
|
||
|
if (aRefresh) {
|
||
|
this.drawScale();
|
||
|
this.value = this.value;
|
||
|
}
|
||
|
}
|
||
|
</body>
|
||
|
</method>
|
||
|
|
||
|
<method name="setMax">
|
||
|
<parameter name="aValue"/>
|
||
|
<parameter name="aRefresh"/>
|
||
|
<body>
|
||
|
if (!isNaN(parseFloat(aValue))) {
|
||
|
this.setAttribute("max", aValue);
|
||
|
this.maxLabel.textContent = aValue;
|
||
|
if (aRefresh) {
|
||
|
this.drawScale();
|
||
|
this.value = this.value;
|
||
|
}
|
||
|
}
|
||
|
</body>
|
||
|
</method>
|
||
|
|
||
|
<method name="setStep">
|
||
|
<parameter name="aValue"/>
|
||
|
<parameter name="aRefresh"/>
|
||
|
<body>
|
||
|
if (!isNaN(parseFloat(aValue))) {
|
||
|
this.setAttribute("step", aValue);
|
||
|
if (aRefresh) {
|
||
|
this.drawScale();
|
||
|
this.value = this.value;
|
||
|
}
|
||
|
}
|
||
|
</body>
|
||
|
</method>
|
||
|
|
||
|
<property name="sliderController" readonly="true">
|
||
|
<getter>
|
||
|
<![CDATA[
|
||
|
return {
|
||
|
slider: this,
|
||
|
|
||
|
get min() { return this.slider.min; },
|
||
|
get max() { return this.slider.max; },
|
||
|
get step() { return this.slider.step; },
|
||
|
|
||
|
// Return width of slider.
|
||
|
get sliderWidth() { return 5; },
|
||
|
|
||
|
// Return margin of slider bar.
|
||
|
get barMargin() { return this.sliderWidth + 1; },
|
||
|
|
||
|
// Return width/height of scale bar.
|
||
|
get barWidth() { return this.boxObject.width - this.barMargin * 2; },
|
||
|
get barHeight() { return this.boxObject.height; },
|
||
|
|
||
|
// Return count of steps.
|
||
|
get stepCount() {
|
||
|
var adjMax = this.max - ((this.max - this.min) % this.step);
|
||
|
return (adjMax - this.min) / this.step;
|
||
|
},
|
||
|
|
||
|
// Return distance between neighbor values.
|
||
|
get stepIndent() {
|
||
|
var k = this.barWidth / (this.max - this.min);
|
||
|
return this.step * k;
|
||
|
},
|
||
|
|
||
|
// Return count of scale points.
|
||
|
get scalePointCount() { return this.stepCount; },
|
||
|
|
||
|
// Return distance between neighbour scale points.
|
||
|
get scalePointIndent() {
|
||
|
var k = this.barWidth / (this.max - this.min);
|
||
|
return this.step * k;
|
||
|
},
|
||
|
|
||
|
// Takes a value and calculates the x position.
|
||
|
getXCoordFromValue: function(aValue) {
|
||
|
if (isNaN(aValue) || isNaN(this.max) || isNaN(this.min)) {
|
||
|
// During initialization, it is possible that aValue will be
|
||
|
// NaN. Math type stuff has issues with NaN, so we'll bow out
|
||
|
// early if we find that is the case.
|
||
|
return NaN;
|
||
|
}
|
||
|
var k = this.barWidth / (this.max - this.min);
|
||
|
var pos = aValue - this.min;
|
||
|
return Math.round(pos * k) + this.barMargin;
|
||
|
},
|
||
|
|
||
|
// Takes a event and calculates the x position.
|
||
|
getXCoordFromEvent: function(aEvent) {
|
||
|
var boxobj = this.boxObject;
|
||
|
var x = aEvent.clientX - boxobj.x;
|
||
|
if (x < this.barMargin) {
|
||
|
x = this.barMargin;
|
||
|
} else if (x > this.barWidth + this.barMargin) {
|
||
|
x = this.barWidth + this.barMargin;
|
||
|
}
|
||
|
return x;
|
||
|
},
|
||
|
|
||
|
// Takes a x position and calculates value.
|
||
|
getValueFromXCoord: function(aX) {
|
||
|
return Math.round(aX / this.stepIndent) * this.step + this.min;
|
||
|
},
|
||
|
|
||
|
// Return nearest x position of steps grid.
|
||
|
getFittedXCoord: function(aX) {
|
||
|
return this.getXCoordFromValue(this.getValueFromXCoord(aX));
|
||
|
},
|
||
|
|
||
|
get boxObject() {
|
||
|
return this.slider.ownerDocument.
|
||
|
getBoxObjectFor(this.slider.canvas);
|
||
|
}
|
||
|
};
|
||
|
]]>
|
||
|
</getter>
|
||
|
</property>
|
||
|
|
||
|
<!-- Draw slider. -->
|
||
|
<method name="drawSlider">
|
||
|
<parameter name="aPos"/>
|
||
|
<body>
|
||
|
<![CDATA[
|
||
|
if (isNaN(aPos)) {
|
||
|
// aPos could be NaN if getXCoordFromValue returns NaN, for example
|
||
|
return;
|
||
|
}
|
||
|
var boxobj = this.sliderController;
|
||
|
if (boxobj.barHeight <= 0 || boxobj.barWidth <=0)
|
||
|
return;
|
||
|
|
||
|
this.context.save();
|
||
|
this.context.lineWidth = 1;
|
||
|
|
||
|
this.context.beginPath();
|
||
|
var h1 = boxobj.barHeight - Math.round(boxobj.barHeight / 5);
|
||
|
var h2 = h1 - Math.round(boxobj.barHeight / 10);
|
||
|
var h3 = Math.round(boxobj.barHeight / 5);
|
||
|
|
||
|
this.context.moveTo(aPos, h1);
|
||
|
this.context.lineTo(aPos - boxobj.sliderWidth, h2);
|
||
|
this.context.lineTo(aPos - boxobj.sliderWidth, h3);
|
||
|
this.context.lineTo(aPos + boxobj.sliderWidth, h3);
|
||
|
this.context.lineTo(aPos + boxobj.sliderWidth, h2);
|
||
|
this.context.closePath();
|
||
|
|
||
|
this.context.strokeStyle =this.currStrokeStyle;
|
||
|
this.context.stroke();
|
||
|
|
||
|
this.context.fillStyle = this.fillStyle;
|
||
|
this.context.fill();
|
||
|
|
||
|
this.context.restore();
|
||
|
]]>
|
||
|
</body>
|
||
|
</method>
|
||
|
|
||
|
<!-- Erase slider. -->
|
||
|
<method name="eraseSlider">
|
||
|
<parameter name="aPos"/>
|
||
|
<body>
|
||
|
<![CDATA[
|
||
|
if (isNaN(aPos)) {
|
||
|
// aPos could be NaN if getXCoordFromValue returns NaN, for example
|
||
|
return;
|
||
|
}
|
||
|
var boxobj = this.sliderController;
|
||
|
if (boxobj.barHeight <= 0 || boxobj.barWidth <= 0)
|
||
|
return;
|
||
|
|
||
|
// clear old slider
|
||
|
this.context.
|
||
|
clearRect(aPos - boxobj.sliderWidth -1, 0,
|
||
|
boxobj.sliderWidth * 2 + 2,
|
||
|
boxobj.barHeight - Math.round(boxobj.barHeight / 5) + 1);
|
||
|
|
||
|
// (re)draw horisontal bar
|
||
|
this.context.lineWidth = 1;
|
||
|
this.context.fillStyle = this.fillStyle;
|
||
|
this.context.strokeStyle = this.strokeStyle;
|
||
|
|
||
|
// XXX: only needs to be redrawn for old slider pos
|
||
|
mid = Math.round(boxobj.barHeight / 2);
|
||
|
this.context.fillRect(boxobj.barMargin, mid - 1, boxobj.barWidth, 3);
|
||
|
this.context.strokeRect(boxobj.barMargin, mid - 1, boxobj.barWidth, 3);
|
||
|
]]>
|
||
|
</body>
|
||
|
</method>
|
||
|
|
||
|
<!-- Draw scale. -->
|
||
|
<method name="drawScale">
|
||
|
<body>
|
||
|
<![CDATA[
|
||
|
this.context.lineWidth = 1;
|
||
|
this.context.fillStyle = this.fillStyle;
|
||
|
this.context.strokeStyle = this.strokeStyle;
|
||
|
|
||
|
var boxobj = this.sliderController;
|
||
|
if (boxobj.barHeight <= 0 || boxobj.barWidth <=0)
|
||
|
return;
|
||
|
|
||
|
var mid = Math.round(boxobj.barHeight / 2);
|
||
|
this.context.fillRect(boxobj.barMargin, mid - 1, boxobj.barWidth, 3);
|
||
|
this.context.strokeRect(boxobj.barMargin, mid - 1, boxobj.barWidth, 3);
|
||
|
|
||
|
var h = boxobj.barHeight - Math.round(boxobj.barHeight / 5) + 1;
|
||
|
for (var i = 0; i <= boxobj.scalePointCount; ++i) {
|
||
|
var pos = Math.round(i * boxobj.scalePointIndent) +
|
||
|
boxobj.barMargin;
|
||
|
this.context.moveTo(pos, h);
|
||
|
this.context.lineTo(pos, boxobj.barHeight);
|
||
|
this.context.closePath();
|
||
|
this.context.stroke();
|
||
|
}
|
||
|
]]>
|
||
|
</body>
|
||
|
</method>
|
||
|
|
||
|
<!-- Return canvas drawing context. -->
|
||
|
<property name="context" readonly="true">
|
||
|
<getter>
|
||
|
if (!this._context) {
|
||
|
this._context = this.canvas.getContext("2d");
|
||
|
this._context.globalAlpha = 1.0;
|
||
|
}
|
||
|
return this._context;
|
||
|
</getter>
|
||
|
</property>
|
||
|
<field name="_context">null</field>
|
||
|
|
||
|
<!-- These styles are used to draw the slider.
|
||
|
XXX: The "skin", should be set via CSS, see bug 350870.
|
||
|
-->
|
||
|
<field name="strokeStyle" readonly="true">"#8f9ca4"</field>
|
||
|
<field name="strokeStyleMove" readonly="true">"red"</field>
|
||
|
<field name="currStrokeStyle" readonly="true">this.strokeStyle</field>
|
||
|
<field name="fillStyle" readonly="true">"#eff3f1"</field>
|
||
|
|
||
|
<method name="dispatchChangeEvent">
|
||
|
<body>
|
||
|
// We fire 'ValueChange' event because this event is handled by
|
||
|
// accessibility to know when value of widget is changed.
|
||
|
var event = this.ownerDocument.createEvent("Events");
|
||
|
event.initEvent("ValueChange", false, false);
|
||
|
this.dispatchEvent(event);
|
||
|
</body>
|
||
|
</method>
|
||
|
|
||
|
<property name="minLabel" readonly="true">
|
||
|
<getter>
|
||
|
if (!this._minlabel) {
|
||
|
this._minlabel = this.ownerDocument.
|
||
|
getAnonymousElementByAttribute(this, "anonid", "minlabel");
|
||
|
}
|
||
|
return this._minlabel;
|
||
|
</getter>
|
||
|
</property>
|
||
|
<field name="_minlabel">null</field>
|
||
|
|
||
|
<property name="maxLabel" readonly="true">
|
||
|
<getter>
|
||
|
if (!this._maxlabel) {
|
||
|
this._maxlabel = this.ownerDocument.
|
||
|
getAnonymousElementByAttribute(this, "anonid", "maxlabel");
|
||
|
}
|
||
|
return this._maxlabel;
|
||
|
</getter>
|
||
|
</property>
|
||
|
<field name="_maxlabel">null</field>
|
||
|
|
||
|
<property name="canvas" readonly="true">
|
||
|
<getter>
|
||
|
if (!this._canvas) {
|
||
|
this._canvas = this.ownerDocument.
|
||
|
getAnonymousElementByAttribute(this, "anonid", "canvas");
|
||
|
}
|
||
|
return this._canvas;
|
||
|
</getter>
|
||
|
</property>
|
||
|
<field name="_canvas">null</field>
|
||
|
</implementation>
|
||
|
|
||
|
<handlers>
|
||
|
<!-- Capture events. -->
|
||
|
<handler event="mousedown">
|
||
|
<![CDATA[
|
||
|
var handler = {
|
||
|
slider: this,
|
||
|
boxobj: this.sliderController,
|
||
|
ownerDoc: this.ownerDocument,
|
||
|
|
||
|
prevX: null,
|
||
|
handleEvent: function(aEvent) {
|
||
|
if (!this.prevX) {
|
||
|
this.prevX = this.boxobj.getXCoordFromValue(this.slider.value);
|
||
|
}
|
||
|
var x = this.boxobj.getXCoordFromEvent(aEvent);
|
||
|
this.slider.eraseSlider(this.prevX);
|
||
|
|
||
|
switch (aEvent.type) {
|
||
|
case "mousemove":
|
||
|
this.slider.currStrokeStyle = this.slider.strokeStyleMove;
|
||
|
this.slider.drawSlider(x);
|
||
|
this.prevX = x;
|
||
|
break;
|
||
|
|
||
|
case "mouseup":
|
||
|
// release events
|
||
|
this.ownerDoc.removeEventListener("mousemove", this, true);
|
||
|
this.ownerDoc.removeEventListener("mouseup", this, true);
|
||
|
|
||
|
this.slider.currStrokeStyle = this.slider.strokeStyle;
|
||
|
|
||
|
this.slider.eraseSlider(x);
|
||
|
this.slider.drawSlider(this.boxobj.getFittedXCoord(x));
|
||
|
|
||
|
this.slider.setAttribute("value",
|
||
|
this.boxobj.getValueFromXCoord(x));
|
||
|
this.slider.dispatchChangeEvent();
|
||
|
break;
|
||
|
}
|
||
|
}
|
||
|
};
|
||
|
|
||
|
this.ownerDocument.addEventListener("mousemove", handler, true);
|
||
|
this.ownerDocument.addEventListener("mouseup", handler, true);
|
||
|
]]>
|
||
|
</handler>
|
||
|
|
||
|
<handler event="keypress">
|
||
|
nsIEvent = Components.interfaces.nsIDOMKeyEvent;
|
||
|
switch (event.keyCode) {
|
||
|
case nsIEvent.DOM_VK_RIGHT:
|
||
|
case nsIEvent.DOM_VK_DOWN:
|
||
|
this.value += this.step;
|
||
|
break;
|
||
|
case nsIEvent.DOM_VK_LEFT:
|
||
|
case nsIEvent.DOM_VK_UP:
|
||
|
this.value -= this.step;
|
||
|
break;
|
||
|
|
||
|
// delta is at least as large as step and no more than 20% of the
|
||
|
// scale.
|
||
|
case nsIEvent.DOM_VK_PAGE_DOWN:
|
||
|
var delta =
|
||
|
parseInt((this.max - this.min) / 5 / this.step) * this.step;
|
||
|
this.value += delta ? delta : this.step;
|
||
|
break;
|
||
|
case nsIEvent.DOM_VK_PAGE_UP:
|
||
|
var delta =
|
||
|
parseInt((this.max - this.min) / 5 / this.step) * this.step;
|
||
|
this.value -= delta ? delta : this.step;
|
||
|
break;
|
||
|
|
||
|
case nsIEvent.DOM_VK_END:
|
||
|
this.value = this.max;
|
||
|
break;
|
||
|
case nsIEvent.DOM_VK_HOME:
|
||
|
this.value = this.min;
|
||
|
break;
|
||
|
default:
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
this.dispatchChangeEvent();
|
||
|
</handler>
|
||
|
</handlers>
|
||
|
</binding>
|
||
|
|
||
|
|
||
|
<!-- DROPMARKER -->
|
||
|
<binding id="dropmarker">
|
||
|
<content tabindex="-1"/>
|
||
|
|
||
|
<resources>
|
||
|
<stylesheet src="chrome://xforms/skin/widgets-xhtml.css"/>
|
||
|
</resources>
|
||
|
|
||
|
<implementation implements="nsIAccessibleProvider">
|
||
|
<property name="accessibleType" readonly="true">
|
||
|
<getter>
|
||
|
return Components.interfaces.nsIAccessibleProvider.XFormsDropmarkerWidget;
|
||
|
</getter>
|
||
|
</property>
|
||
|
</implementation>
|
||
|
</binding>
|
||
|
|
||
|
</bindings>
|
||
|
|