RetroZilla/layout/style/xbl-marquee/xbl-marquee.xml
2015-10-20 23:03:22 -04:00

406 lines
14 KiB
XML

<?xml version="1.0"?>
<!-- ***** 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 Netscape's XBL Marquee Emulation code.
-
- The Initial Developer of the Original Code is
- Netscape Communications Corporation.
- Portions created by the Initial Developer are Copyright (C) 2002
- the Initial Developer. All Rights Reserved.
-
- Contributor(s):
- Doron Rosenberg <doron@netscape.com>
- L. David Baron <dbaron@dbaron.org>
-
- 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 LGPL or the GPL. 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 ***** -->
<bindings id="marqueeBindings"
xmlns="http://www.mozilla.org/xbl"
xmlns:html="http://www.w3.org/1999/xhtml"
xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
xmlns:xbl="http://www.mozilla.org/xbl">
<binding id="marquee" inheritstyle="false">
<resources>
<stylesheet src="chrome://xbl-marquee/content/xbl-marquee.css"/>
</resources>
<implementation>
<field name="defaultScrollAmount">6</field>
<property name="scrollAmount">
<getter>
if (this.hasAttribute("scrollamount"))
return this.getAttribute("scrollamount");
return this.defaultScrollAmount; //default value is 6 pixels
</getter>
<setter>
this.setAttribute("scrollamount", val);
</setter>
</property>
<field name="defaultScrollDelay">85</field>
<property name="scrollDelay">
<getter>
<![CDATA[
var rv = this.defaultScrollDelay; //default value is 85 ms
if (this.hasAttribute("scrolldelay")) {
rv = this.getAttribute("scrolldelay");
//marquee doesn't allow anything shorter than 40 ms
if (rv < 40)
rv = 40;
}
return rv;
]]>
</getter>
<setter>
this.setAttribute("scrolldelay", val);
// since we changed the scrolldelay, restart the marquee
this._doMove(false);
</setter>
</property>
<field name="defaultDirection">"left"</field>
<property name="direction">
<getter>
return this.directionField;
</getter>
<setter>
// if val is false, don't change anything
if (val) {
// in case direction is swapped between horizontal/vertical, use
// setAttribute to make the xbl bindings change.
this.setAttribute("direction", val);
// since we changed the direction, set startNewDirection to true
this.startNewDirection = true;
this.directionField = val.toLowerCase();
// pass in aSkipSettingNewPosition as true
this._doMove(true);
}
</setter>
</property>
<field name="directionField">"left"</field>
<field name="defaultBehavior">"scroll"</field>
<property name="behavior">
<getter>
return this.behaviorField;
</getter>
<setter>
this.behaviorField = val ? val.toLowerCase() : this.defaultBehavior;
</setter>
</property>
<field name="behaviorField">"scroll"</field>
<field name="dirsign">1</field>
<field name="startAt">0</field>
<field name="stopAt">0</field>
<field name="newPosition">0</field>
<field name="runId">0</field>
<field name="originalHeight">0</field>
<field name="startNewDirection">true</field>
<property name="outerDiv"
onget="return document.getAnonymousNodes(this)[0]"
/>
<property name="innerDiv"
onget="return document.getAnonymousElementByAttribute(this, 'anonid', 'innerDiv');"
/>
<property name="height"
onget="return this.getAttribute('height');"
/>
<property name="width">
<getter>
<![CDATA[
var rv = "1px";
if (this.hasAttribute("width"))
rv = this.getAttribute("width");
else if (this.offsetWidth) {
// if the element has an offsetWidth, don't set a width
rv = "";
} else if (this.offsetParent) {
var myElem = this.offsetParent;
// lets walk up the offsetParent tree looking for an
// element with a width.
while (myElem.offsetParent && (myElem.offsetWidth <= 0))
myElem = myElem.offsetParent;
if (myElem)
rv = myElem.offsetWidth + "px";
}
return rv;
]]>
</getter>
</property>
<!-- For sniffing purposes -->
<field name="nsMarqueeVersion">"0.9.7"</field>
<method name="start">
<body>
<![CDATA[
this._doMove(false);
]]>
</body>
</method>
<method name="stop">
<body>
<![CDATA[
if (this.runId != 0)
clearTimeout(this.runId);
this.runId = 0;
]]>
</body>
</method>
<method name="_doMove">
<parameter name="aSkipSettingNewPosition"/>
<body>
<![CDATA[
this.stop();
//startNewDirection is true at first load and whenever the direction is changed
if (this.startNewDirection) {
this.startNewDirection = false; //we only want this to run once every scroll direction change
if ((this.directionField == "up") || (this.directionField == "down"))
{
// "", 0 and empty height should default to 200px
var height =
(this.getAttribute("height") != "0" &&
this.getAttribute("height")) ||
(document.defaultView.getComputedStyle(this,"").height != "0px" &&
document.defaultView.getComputedStyle(this,"").height) ||
"200px";
// support % heights
if (/%/.test(height)) {
height = parseInt('0' + height, 10);
height = (height/100) * this.outerDiv.offsetHeight;
}
this.outerDiv.style.height = height;
this.innerDiv.style.padding = height + " 0";
this.innerDiv.style.whiteSpace = "";
}
else {
this.outerDiv.style.height = "";
this.innerDiv.style.padding = "0px";
this.innerDiv.style.whiteSpace = "nowrap";
}
switch (this.directionField)
{
case "up":
this.dirsign = 1;
this.startAt = (this.behaviorField == 'alternate') ? this.originalHeight : 0;
this.stopAt = this.innerDiv.offsetHeight - parseInt(this.outerDiv.style.height)
- ((this.behaviorField == 'alternate') ? this.originalHeight : 0);
break;
case "down":
this.dirsign = -1;
this.startAt = this.innerDiv.offsetHeight - parseInt(this.outerDiv.style.height)
- ((this.behaviorField == 'alternate') ? this.originalHeight : 0);
this.stopAt = (this.behaviorField == 'alternate') ? this.originalHeight : 0;
break;
case "right":
this.dirsign = -1;
this.stopAt = (this.behaviorField != 'alternate') ? this.innerDiv.offsetLeft - this.outerDiv.offsetWidth : this.innerDiv.offsetWidth;
this.startAt = this.outerDiv.offsetWidth
+ ((this.behaviorField != 'alternate') ? (this.innerDiv.offsetWidth + this.stopAt) : 0);
break;
case "left":
default:
this.dirsign = 1;
this.startAt = (this.behaviorField != 'alternate') ? (this.innerDiv.offsetLeft - this.outerDiv.offsetWidth) : this.innerDiv.offsetWidth;
this.stopAt = this.outerDiv.offsetWidth
+ ((this.behaviorField != 'alternate') ? (this.innerDiv.offsetWidth + this.startAt) : 0);
}
// if the direction attribute is changed, don't reset the starting position
if (!aSkipSettingNewPosition)
this.newPosition = this.startAt;
} //end if
this.newPosition = parseInt(this.newPosition) + (this.dirsign * this.scrollAmount);
if ((this.dirsign == 1 && this.newPosition > this.stopAt) ||
(this.dirsign == -1 && this.newPosition < this.stopAt))
{
if (this.behaviorField == "alternate")
{
// lets start afresh
this.startNewDirection = true;
// swap direction
const swap = {left: "right", down: "up", up: "down", right: "left"};
this.directionField = swap[this.directionField];
}
else
{
this.newPosition = this.startAt;
}
}
if (!this.startNewDirection) {
if ((this.directionField == "up") || (this.directionField == "down"))
this.outerDiv.scrollTop = this.newPosition;
else
this.outerDiv.scrollLeft = this.newPosition;
}
var myThis = this;
var lambda = function myTimeOutFunction(){myThis.start();}
this.runId = window.setTimeout(lambda, this.scrollDelay);
]]>
</body>
</method>
<method name="init">
<body>
<![CDATA[
var height;
if (this.hasAttribute('height')) {
height = this.getAttribute('height');
this.outerDiv.style.height = height + "px";
}
this.outerDiv.style.width = this.width;
// Some sites access the element via the evil IE way of elementID.foo()
if (this.hasAttribute('id'))
window[this.getAttribute('id')] = this;
// Website can define a background color via the bgcolor attribute
if (this.hasAttribute("bgcolor"))
this.outerDiv.style.backgroundColor = this.getAttribute("bgcolor");
// store the original height before we add padding
this.originalHeight = this.innerDiv.offsetHeight;
this._doMove(false);
]]>
</body>
</method>
<constructor>
<![CDATA[
// for performance, we store the lowercased direction/behavior in a field.
// default to "left"
this.directionField = this.hasAttribute("direction") ? this.getAttribute("direction").toLowerCase() : this.defaultDirection;
// default to "scroll"
this.behaviorField = this.hasAttribute("behavior") ? this.getAttribute("behavior").toLowerCase() : this.defaultBehavior;
var myThis = this;
var lambda = function myScopeFunction() { myThis.init(); }
// init needs to be run after the page has loaded in order to calculate
// the correct height/width
window.addEventListener("load", lambda, false);
]]>
</constructor>
</implementation>
<handlers>
<handler event="DOMAttrModified" phase="target">
<![CDATA[
var attrName = event.attrName.toLowerCase();
var oldValue = event.prevValue.toLowerCase();
var newValue = event.newValue.toLowerCase();
// only if a new value is specified
if (oldValue != newValue && newValue) {
if (attrName == "direction") {
this.startNewDirection = true;
this.directionField = newValue;
this._doMove(true);
} else if (attrName == "behavior") {
this.behaviorField = newValue;
}
}
]]>
</handler>
</handlers>
</binding>
<binding id="marquee-horizontal"
extends="chrome://xbl-marquee/content/xbl-marquee.xml#marquee"
inheritstyle="false">
<content>
<html:div xbl:inherits="" style="overflow: -moz-scrollbars-none">
<xul:hbox style="margin: 0 100%; -moz-user-select: text;">
<html:div anonid="innerDiv">
<children/>
</html:div>
</xul:hbox>
</html:div>
</content>
</binding>
<binding id="marquee-vertical"
extends="chrome://xbl-marquee/content/xbl-marquee.xml#marquee">
<content>
<html:div xbl:inherits="" style="overflow: -moz-scrollbars-none">
<html:div anonid="innerDiv">
<children/>
</html:div>
</html:div>
</content>
</binding>
</bindings>