Add support for MathPlayer in IE9 and lower, plus add support for hover when maction is used, and support for the hover in the API calls

This commit is contained in:
Davide P. Cervone 2011-08-22 18:39:28 -04:00
parent fd587eb745
commit 9289568584
8 changed files with 87 additions and 142 deletions

View File

@ -30,7 +30,7 @@ if (!window.MathJax) {window.MathJax= {}}
if (!MathJax.Hub) { // skip if already loaded
MathJax.version = "1.1a";
MathJax.fileversion = "1.1.12";
MathJax.fileversion = "1.1.13";
/**********************************************************/
@ -1365,8 +1365,12 @@ MathJax.Hub = {
for (var i = 0, m = scripts.length; i < m; i++) {
var script = scripts[i];
if (script.type && this.config.inputJax[script.type.replace(/ *;(.|\n)*/,"")]) {
if (script.MathJax && script.MathJax.state !== STATE.PENDING)
{this.scriptAction[action](script)}
if (script.MathJax) {
if (script.MathJax.elementJax && script.MathJax.elementJax.hover) {
script.MathJax.elementJax.hover.clear(script.MathJax.elementJax);
}
if (script.MathJax.state !== STATE.PENDING) {this.scriptAction[action](script)}
}
if (!script.MathJax) {script.MathJax = {state: STATE.PENDING}}
if (script.MathJax.state !== STATE.PROCESSED) {math.push(script)}
}
@ -1911,6 +1915,7 @@ MathJax.Hub.Startup = {
return HUB.Process(script,callback);
},
Remove: function () {
if (this.hover) {this.hover.clear(this)}
this.outputJax.Remove(this);
HUB.signal.Post(["Remove Math",this.inputID]); // wait for this to finish?
this.Detach();
@ -1949,7 +1954,7 @@ MathJax.Hub.Startup = {
}
}
},{
version: "1.1",
version: "1.1.1",
directory: JAX.directory+"/element",
extensionDir: JAX.extensionDir,
ID: 0, // jax counter (for IDs)

View File

@ -23,7 +23,7 @@
*/
(function (HUB,HTML,AJAX,HTMLCSS,nMML) {
var VERSION = "1.1.2";
var VERSION = "1.1.3";
var CONFIG = HUB.CombineConfig("MathZoom",{
delay: 400, // mouse must be still this long (milliseconds)
@ -77,6 +77,7 @@
if (ZOOM.settings.ALT && !event.altKey) return true;
if (ZOOM.settings.CMD && !event.metaKey) return true;
if (ZOOM.settings.Shift && !event.shiftKey) return true;
if (!ZOOM[type]) return true;
return ZOOM[type](event,math);
},
@ -107,7 +108,7 @@
// Handle the actual zooming
//
Zoom: function (math,event) {
this.Remove();
this.Remove(); HOVER.ClearHoverTimer();
//
// Find the jax and its type
@ -288,53 +289,6 @@
};
//
// Handle IE events for NativeMML
//
HUB.Register.StartupHook("NativeMML Jax Ready", function () {
nMML = MathJax.OutputJax.NativeMML;
nMML.Augment({
MSIEmouseup: function (event,math,span) {
if (this.trapUp) {delete this.trapUp; return true}
if (this.MSIEzoomKeys(event)) {return true}
return false;
},
MSIEclick: function (event,math,span) {
if (this.trapClick) {delete this.trapClick; return true}
if (!this.MSIEzoomKeys(event)) return false;
if (!this.settings.zoom.match(/Click/)) return false;
return (ZOOM.Click(event,math) === false);
},
MSIEdblclick: function (event,math,span) {
if (!this.MSIEzoomKeys(event)) return false;
return (ZOOM.DblClick(event,math) === false);
},
/*
* MSIEmouseover: function (event,math,span) {
* if (this.settings.zoom !== "Hover") {return false}
* return !HOVER.Mouseover(event,math);
* // ZOOM.Timer(event,math); return true;
* },
* MSIEmouseout: function (event,math,span) {
* if (this.settings.zoom !== "Hover") {return false}
* return !HOVER.Mouseout(event,math);
* // ZOOM.ClearTimer(); return true;
* },
* MSIEmousemove: function (event,math,span) {
* if (this.settings.zoom !== "Hover") {return false}
* return !HOVER.Mousemove(event,math);
* // ZOOM.Timer(event,math); return true;
* },
*/
MSIEzoomKeys: function (event) {
if (this.settings.CTRL && !event.ctrlKey) return false;
if (this.settings.CMD && !event.metaKey) return false;
if (this.settings.ALT && !event.altKey) return false;
if (this.settings.Shift && !event.shiftKey) return false;
return true;
}
});
});
/*************************************************************/

View File

@ -49,7 +49,8 @@
".MathJax_Hover_Arrow": {
position:"absolute",
top:"-5px", right:"-9px",
// top:"-5px", right:"-9px",
top:"1px", right:"-11px",
width:"15px", height:"11px",
cursor:"pointer"
}
@ -78,7 +79,7 @@
// Call the output jax's event handler
//
Handler: function (event,type,math) {
if (AJAX.loadingMathMenu) {return False(event)}
if (AJAX.loadingMathMenu || AJAX.loadMathZoom) {return False(event)}
var jax = OUTPUT[math.jaxID];
if (!event) {event = window.event}
event.isContextMenu = (type === "ContextMenu");
@ -111,6 +112,7 @@
// Load the contextual menu code, if needed, and post the menu
//
ContextMenu: function (event,jax) {
HOVER.ClearHoverTimer();
if (jax.hover) {
if (jax.hover.remove) {clearTimeout(jax.hover.remove); delete jax.hover.remove}
jax.hover.nofade = true;
@ -183,16 +185,16 @@
span = JAX.getHoverSpan(jax,math),
bbox = JAX.getHoverBBox(jax,span,math);
var dx = 3.5/bbox.em, dy = 5/bbox.em, dd = 1/bbox.em; // frame size
jax.hover = {opacity:0};
jax.hover = {opacity:0, clear:this.ClearHover};
if (UI.msieBorderWidthBug) {dd = 0}
jax.hover.id = "MathJax-Hover-"+jax.inputID.replace(/.*-(\d+)$/,"$1");
var frame = HTML.Element("span",{
id:jax.hover.id, isMathJax: true,
style:{display:"inline-block", /*"z-index":1,*/ width:0, height:0, position:"relative"}
style:{display:"inline-block", width:0, height:0, position:"relative"}
},[["span",{
className:"MathJax_Hover_Frame", isMathJax: true,
style:{
display:"inline-block", position:"absolute",
display:"inline-block", position:"absolute", overflow:"visible",
top:bbox.Units(-bbox.h-dy-dd-(bbox.y||0)), left:bbox.Units(-dx-dd+(bbox.x||0)),
width:bbox.Units(bbox.w+2*dx), height:bbox.Units(bbox.h+bbox.d+2*dy),
opacity:0, filter:"alpha(opacity=0)"
@ -205,10 +207,12 @@
]]
]]
);
if (UI.msieZIndexBug) {frame.style.zIndex = 1}
if (bbox.width) {
frame.style.width = bbox.width;
frame.style.marginRight = "-"+bbox.width;
frame.firstChild.style.width = bbox.width;
frame.firstChild.firstChild.style.right = "-5px";
}
span.parentNode.insertBefore(frame,span);
if (span.style) {span.style.position = "relative"}
@ -246,6 +250,12 @@
if (!event) {event = window.event}
OUTPUT[this.jax].ContextMenu(event,this.math,true);
},
ClearHover: function (jax) {
if (jax.hover.remove) {clearTimeout(jax.hover.remove)}
if (jax.hover.timer) {clearTimeout(jax.hover.timer)}
HOVER.ClearHoverTimer();
delete jax.hover;
},
Em: function (m) {
if (Math.abs(m) < .0006) {return "0em"}
@ -314,16 +324,19 @@
};
if (MathJax.Hub.Browser.isMobile) {
var arrow = CONFIG.styles[".MathJax_Hover_Arrow"];
if (HUB.Browser.isMobile) {
arrow.width = "25px"; arrow.height = "18px";
arrow.top = "-11px"; arrow.right = "-15px";
}
HUB.Browser.Select({
MSIE: function (browser) {
var mode = (document.documentMode||0);
UI.msieBorderWidthBug = (document.compatMode === "BackCompat");
if ((document.documentMode||0) < 9) {EVENT.LEFTBUTTON = 1}
if (mode < 9) {EVENT.LEFTBUTTON = 1}
UI.msieZIndexBug = (mode < 8);
if (mode < 8 && !browser.isIE9) {arrow.top = arrow.right = "-1px"}
}
});

View File

@ -22,7 +22,7 @@
*/
MathJax.Hub.Register.StartupHook("HTML-CSS Jax Ready",function () {
var VERSION = "1.1.3";
var VERSION = "1.1.4";
var MML = MathJax.ElementJax.mml,
HTMLCSS = MathJax.OutputJax["HTML-CSS"];
@ -110,13 +110,12 @@ MathJax.Hub.Register.StartupHook("HTML-CSS Jax Ready",function () {
this.selection++;
if (this.selection > this.data.length) {this.selection = 1}
var math = this; while (math.type !== "math") {math = math.inherit}
MathJax.Hub.getJaxFor(math.inputID).Update();
if (!event) {event = window.event}
if (event.preventDefault) {event.preventDefault()}
if (event.stopPropagation) {event.stopPropagation()}
event.cancelBubble = true;
event.returnValue = false;
return false;
var jax = MathJax.Hub.getJaxFor(math.inputID), hover = !!jax.hover;
jax.Update(); if (hover) {
var span = document.getElementById(jax.inputID+"-Span");
MathJax.Extension.UIevents.Hover.Hover(jax,span);
}
return MathJax.Extension.UIevents.Event.False(event);
},
//

View File

@ -24,7 +24,7 @@
MathJax.OutputJax["HTML-CSS"] = MathJax.OutputJax({
id: "HTML-CSS",
version: "1.1.10",
version: "1.1.11",
directory: MathJax.OutputJax.directory + "/HTML-CSS",
extensionDir: MathJax.OutputJax.extensionDir + "/HTML-CSS",
autoloadDir: MathJax.OutputJax.directory + "/HTML-CSS/autoload",

View File

@ -389,9 +389,9 @@
var prev = script.previousSibling;
if (prev && String(prev.className).match(/^MathJax(_MathML|_Display)?$/))
{prev.parentNode.removeChild(prev)}
var math = script.MathJax.elementJax.root, span, div, frame;
var jax = script.MathJax.elementJax, math = jax.root, span, div, frame;
span = div = frame = this.Element("span",{
className:"MathJax", isMathJax:true, jaxID:"HTML-CSS",
className:"MathJax", isMathJax:true, jaxID:this.id, id:jax.inputID+"-Span",
oncontextmenu:EVENT.Menu, onmousedown: EVENT.Mousedown,
onmouseover:EVENT.Mouseover, onmouseout: EVENT.Mouseout, onmousemove: EVENT.Mousemove,
onclick:EVENT.Click, ondblclick:EVENT.DblClick

View File

@ -24,7 +24,7 @@
MathJax.OutputJax.NativeMML = MathJax.OutputJax({
id: "NativeMML",
version: "1.1.6",
version: "1.1.7",
directory: MathJax.OutputJax.directory + "/NativeMML",
extensionDir: MathJax.OutputJax.extensionDir + "/NativeMML",

View File

@ -47,9 +47,6 @@
this.Mouseover = HOVER.Mouseover;
this.Mouseout = HOVER.Mouseout;
this.Mousemove = HOVER.Mousemove;
this.MSIEmouseover = EVENT.Mouseover;
this.MSIEmouseout = EVENT.Mouseout;
this.MSIEmousemove = EVENT.Mousemove;
return AJAX.Styles(this.config.styles);
},
Config: function () {
@ -116,15 +113,22 @@ this.MSIEmousemove = EVENT.Mousemove;
var span = HTML.Element(type,{
className: "MathJax_MathML", style: {"font-size": this.config.scale+"%"}
},[["span",{
className:"MathJax_MathContainer", isMathJax: true, jaxID: "NativeMML",
className:"MathJax_MathContainer", isMathJax: true, jaxID:this.id,
style:{position:"relative", display:"inline-block", "white-space":"nowrap"}
}, [["span",{isMathJax:true, style:{display:"inline-block"}}]] // for Firefox hover and zoom
]]), container = span.firstChild;
if (isMSIE && this.config.showMathMenuMSIE) {container.style.display = "inline-block"}
math.toNativeMML(container.firstChild);
script.parentNode.insertBefore(span,script);
if (isMSIE) {
if (this.config.showMathMenuMSIE) {this.MSIEoverlay(span)}
if (container.addEventListener) {
container.addEventListener("contextmenu",EVENT.Menu,true);
container.addEventListener("mouseover",EVENT.Mouseover,true);
container.addEventListener("mouseout",EVENT.Mouseout,true);
container.addEventListener("mousedown",EVENT.Mousedown,true);
container.addEventListener("mouseup",EVENT.False,true);
container.addEventListener("click",EVENT.Click,true);
container.addEventListener("dblclick",EVENT.DblClick,true);
} else if (this.config.showMathMenuMSIE) {this.MSIEoverlay(container)}
} else {
container.oncontextmenu = EVENT.Menu;
container.onmouseover = EVENT.Mouseover;
@ -155,61 +159,44 @@ this.MSIEmousemove = EVENT.Mousemove;
//
MSIEoverlay: function (span) {
var math = span.firstChild;
span.style.position = "absolute"; // so we can measure height/depth
var HD = span.scrollHeight, W = span.offsetWidth;
var tmp = HTML.addElement(span,"img",{src:"about:blank",style:{width:0,height:HD+"px"}});
var D = span.scrollHeight - HD; span.removeChild(tmp);
span.style.position = ""; // back to normal
var top, left, isDisplay = (span.parentNode.nodeName.toLowerCase() === "div");
if (isDisplay && this.quirks) {top = -HD; left = Math.floor(-W/2)} else {top = D-HD, left = -W}
if (math.nodeName.toLowerCase() === "span") {math = math.firstChild}
var bbox = this.getHoverBBox(null,math,{});
HTML.addElement(span,"span",{
style:{display:"inline-block", width:0, height:0, position:"relative"}
},[["span",{
style:{display:"inline-block", position:"absolute", left:left+"px", top:top+"px",
width:math.offsetWidth+"px", height:HD+"px", cursor:"pointer",
"background-color":"white", filter:"alpha(opacity=0)"},
},[["span",{isMathJax: true, className: "MathJax_MathPlayer_Overlay",
style:{
display:"inline-block", position:"absolute",
left:bbox.Units(-bbox.w), top:bbox.Units(-bbox.h-(bbox.y||0)-1),
width:bbox.Units(bbox.w), height:bbox.Units(bbox.h+bbox.d), cursor:"pointer",
"background-color":"white", filter:"alpha(opacity=0)"
}
}]]);
HUB.Insert(span,{
msieMath: math,
onmousedown: this.MSIEevent, oncontextmenu: this.MSIEevent, onclick: this.MSIEevent,
onmouseup: this.MSIEevent, onmousemove: this.MSIEevent, ondblclick: this.MSIEevent,
onmouseover: this.MSIEevent, onmouseout: this.MSIEevent
}]]);
});
},
MSIEmath: function (span) {
// display="block" seems to produce an extra span, so need extra firstChild
var math = span.parentNode.previousSibling.firstChild;
return (math.nodeName.toLowerCase() === "span" ? math.firstChild : math);
MSIEevents: {
mousedown:"Mousedown", contextmenu:"ContextMenu", click:"Click",
mouseup:"Mouseup", mousemove:"Mousemove", dblclick: "DblClick",
mouseover:"Mouseover", mouseout:"Mouseout"
},
MSIEevent: function () {
var math = nMML.MSIEmath(this);
var event = window.event;
var action = nMML["MSIE"+event.type];
if (action && action.call(nMML,event,math,this)) {return false}
if (math.fireEvent) {math.fireEvent("on"+event.type,event)}
return false;
var type = nMML.MSIEevents[event.type];
if (nMML[type] && nMML[type](event,this) === false) {return false}
if (MathJax.Extension.MathZoom && MathJax.Extension.MathZoom.HandleEvent(event,type,this) === false) {return false}
if (event.srcElement.className === "MathJax_MathPlayer_Overlay" && this.msieMath.fireEvent)
{this.msieMath.fireEvent("on"+event.type,event)}
return EVENT.False(event);
},
MSIEmousedown: function (event,math,span) {
if (event[this.MENUKEY] && event.button === this.LEFTBUTTON && this.settings.context !== "MathJax") {
this.trapUp = this.trapClick = true;
this.ContextMenu(event,span,true);
return true;
}
if (this.MSIEzoomKeys && this.MSIEzoomKeys(event)) {this.trapUp = true; return true}
return false;
},
MSIEcontextmenu: function (event,math,span) {
if (this.settings.context === "MathJax") {
this.trapUp = this.trapClick = true;
this.ContextMenu(event,span);
return true;
}
return false;
},
// Other IE event handlers are in MathZoom.js
ContextMenu: function (event,math,force) {
if (this.config.showMathMenu && (this.settings.context === "MathJax" || force)) {
if (document.selection) {setTimeout("document.selection.empty()",0)}
if (this.msieEventBug) {event = window.event}
delete this.trapClick; delete this.trapUp;
return EVENT.ContextMenu(event,this.getJaxFromMath(math));
}
},
@ -224,13 +211,20 @@ this.MSIEmousemove = EVENT.Mousemove;
}
},
getJaxFromMath: function (math) {
if (math.className === "MathJax_MSIE_Overlay") {math = math.parentNode.parentNode}
return HUB.getJaxFor(math.parentNode.nextSibling);
},
getHoverSpan: function (jax,math) {return math.firstChild},
getHoverSpan: function (jax,math) {
if (math.className === "MathJax_MSIE_Overlay") {return math.parentNode}
return math.firstChild;
},
getHoverBBox: function (jax,span,math) {
span = span.parentNode;
span.appendChild(this.topImg); var h = this.topImg.offsetTop; span.removeChild(this.topImg);
return {w:span.offsetWidth, h:h, d:span.offsetHeight-h, Units:this.PX, em:1}
span.appendChild(this.topImg);
var h = this.topImg.offsetTop, d = span.offsetHeight-h, w = span.offsetWidth;
span.removeChild(this.topImg);
var x = (math.className === "MathJax_MSIE_Overlay" ? -w : 0);
return {w:w, h:h, d:d, x:x, Units:this.PX, em:1}
},
PX: function (n) {return n+"px"},
@ -359,26 +353,6 @@ this.MSIEmousemove = EVENT.Mousemove;
});
if (HUB.Browser.isFirefox) {
//
// Zoom and hover don't work well with display="block",
// so fake it with inline and an mstyle with displaystyle="true"
//
MML.math.Augment({
toNativeMML: function (parent) {
var tag = parent.appendChild(this.NativeMMLelement(this.type));
this.NativeMMLattributes(tag);
if (this.Get("display") === "block") {
tag.setAttribute("display","inline");
tag = tag.appendChild(this.NativeMMLelement("mstyle"));
tag.setAttribute("displaystyle","true");
}
for (var i = 0, m = this.data.length; i < m; i++) {
if (this.data[i]) {this.data[i].toNativeMML(tag)}
else {tag.appendChild(this.NativeMMLelement("mrow"))}
}
}
});
MML.mtable.Augment({
toNativeMML: function (parent) {
//