Merge pull request #1100 from mathjax/issue1088

Removing PNG from MathMenu and MathEvents.  Issue #1088.
This commit is contained in:
Davide P. Cervone 2015-04-14 11:00:25 -04:00
commit 6e2db6a08d
5 changed files with 120 additions and 52 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 469 B

View File

@ -1,6 +1,3 @@
/* -*- Mode: Javascript; indent-tabs-mode:nil; js-indent-level: 2 -*- */
/* vim: set ts=2 et sw=2 tw=80: */
/************************************************************* /*************************************************************
* *
* MathJax/extensions/HelpDialog.js * MathJax/extensions/HelpDialog.js
@ -34,7 +31,6 @@
var MENU = MathJax.Menu; var MENU = MathJax.Menu;
var CONFIG = HUB.CombineConfig("HelpDialog",{ var CONFIG = HUB.CombineConfig("HelpDialog",{
closeImg: AJAX.urlRev(OUTPUT.imageDir+"/CloseX-31.png"), // image for close "X" for mobiles
styles: { styles: {
"#MathJax_Help": { "#MathJax_Help": {
@ -61,6 +57,36 @@
overflow:"auto", "text-align":"left", "font-size":"80%", overflow:"auto", "text-align":"left", "font-size":"80%",
padding:".4em .6em", border:"1px inset", margin:"1em 0px", padding:".4em .6em", border:"1px inset", margin:"1em 0px",
"max-height":"20em", "max-width":"30em", "background-color":"#EEEEEE" "max-height":"20em", "max-width":"30em", "background-color":"#EEEEEE"
},
"#MathJax_HelpClose": {
position:"absolute", top:".2em", right:".2em",
cursor:"pointer",
display:"inline-block",
border:"2px solid #AAA",
"border-radius":"18px",
"-webkit-border-radius": "18px", // Safari and Chrome
"-moz-border-radius": "18px", // Firefox
"-khtml-border-radius": "18px", // Konqueror
"font-family":"'Courier New',Courier",
"font-size":"24px",
color:"#F0F0F0"
},
"#MathJax_HelpClose span": {
display:"block", "background-color":"#AAA", border:"1.5px solid",
"border-radius":"18px",
"-webkit-border-radius": "18px", // Safari and Chrome
"-moz-border-radius": "18px", // Firefox
"-khtml-border-radius": "18px", // Konqueror
"line-height":0,
padding:"8px 0 6px" // may need to be browser-specific
},
"#MathJax_HelpClose:hover": {
color:"white!important",
border:"2px solid #CCC!important"
},
"#MathJax_HelpClose:hover span": {
"background-color":"#CCC!important"
} }
} }
}); });
@ -122,11 +148,9 @@
] ]
]], ]],
["a",{href:"http://www.mathjax.org/"},["www.mathjax.org"]], ["a",{href:"http://www.mathjax.org/"},["www.mathjax.org"]],
["img", { ["span",{id: "MathJax_HelpClose", onclick: HELP.Remove},
src: CONFIG.closeImg, [["span",{},["\u00D7"]]]
style: {width:"21px", height:"21px", position:"absolute", top:".2em", right:".2em"}, ]
onclick: HELP.Remove
}]
])); ]));
LOCALE.setCSS(help); LOCALE.setCSS(help);
var doc = (document.documentElement||{}); var doc = (document.documentElement||{});

View File

@ -43,9 +43,8 @@
hcolor: "#83A" // haze color hcolor: "#83A" // haze color
}, },
button: { button: {
x: -4, y: -3, // menu button offsets x: -6, y: -3, // menu button offsets
wx: -2, // button offset for full-width equations wx: -2 // button offset for full-width equations
src: AJAX.urlRev(OUTPUT.imageDir+"/MenuArrow-15.png") // button image
}, },
fadeinInc: .2, // increment for fade-in fadeinInc: .2, // increment for fade-in
fadeoutInc: .05, // increment for fade-out fadeoutInc: .05, // increment for fade-out
@ -69,10 +68,33 @@
display: "inline-block", position:"absolute" display: "inline-block", position:"absolute"
}, },
".MathJax_Hover_Arrow": { ".MathJax_Menu_Button .MathJax_Hover_Arrow": {
position:"absolute", position:"absolute",
width:"15px", height:"11px", cursor:"pointer",
cursor:"pointer" display:"inline-block",
border:"2px solid #AAA",
"border-radius":"4px",
"-webkit-border-radius": "4px", // Safari and Chrome
"-moz-border-radius": "4px", // Firefox
"-khtml-border-radius": "4px", // Konqueror
"font-family":"'Courier New',Courier",
"font-size":"9px",
color:"#F0F0F0"
},
".MathJax_Menu_Button .MathJax_Hover_Arrow span": {
display:"block",
"background-color":"#AAA",
border:"1px solid",
"border-radius":"3px",
"line-height":0,
padding:"4px"
},
".MathJax_Hover_Arrow:hover": {
color:"white!important",
border:"2px solid #CCC!important"
},
".MathJax_Hover_Arrow:hover span": {
"background-color":"#CCC!important"
} }
} }
}; };
@ -334,17 +356,17 @@
]] ]]
); );
var button = HTML.Element("span",{ var button = HTML.Element("span",{
isMathJax: true, id:jax.hover.id+"Menu", isMathJax: true, id:jax.hover.id+"Menu", className:"MathJax_Menu_Button",
style:{display:"inline-block", "z-index": 1, width:0, height:0, position:"relative"} style:{display:"inline-block", "z-index": 1, width:0, height:0, position:"relative"}
},[["img",{ },[["span",{
className: "MathJax_Hover_Arrow", isMathJax: true, math: math, className: "MathJax_Hover_Arrow", isMathJax: true, math: math,
src: CONFIG.button.src, onclick: this.HoverMenu, jax:JAX.id, onclick: this.HoverMenu, jax:JAX.id,
style: { style: {
left:this.Px(bbox.w+dx+dd+(bbox.x||0)+CONFIG.button.x), left:this.Px(bbox.w+dx+dd+(bbox.x||0)+CONFIG.button.x),
top:this.Px(-bbox.h-dy-dd-(bbox.y||0)-CONFIG.button.y), top:this.Px(-bbox.h-dy-dd-(bbox.y||0)-CONFIG.button.y),
opacity:0, filter:"alpha(opacity=0)" opacity:0, filter:"alpha(opacity=0)"
} }
}]] },[["span",{isMathJax:true},"\u25BC"]]]]
); );
if (bbox.width) { if (bbox.width) {
frame.style.width = button.style.width = bbox.width; frame.style.width = button.style.width = bbox.width;
@ -502,14 +524,16 @@
}; };
// /*
// Mobile screens are small, so use larger version of arrow * //
// * // Mobile screens are small, so use larger version of arrow
if (HUB.Browser.isMobile) { * //
var arrow = CONFIG.styles[".MathJax_Hover_Arrow"]; * if (HUB.Browser.isMobile) {
arrow.width = "25px"; arrow.height = "18px"; * var arrow = CONFIG.styles[".MathJax_Hover_Arrow"];
CONFIG.button.x = -6; * arrow.width = "25px"; arrow.height = "18px";
} * CONFIG.button.x = -6;
* }
*/
// //
// Set up browser-specific values // Set up browser-specific values

View File

@ -48,7 +48,6 @@
var CONFIG = HUB.CombineConfig("MathMenu",{ var CONFIG = HUB.CombineConfig("MathMenu",{
delay: 150, // the delay for submenus delay: 150, // the delay for submenus
closeImg: AJAX.urlRev(OUTPUT.imageDir+"/CloseX-31.png"), // image for close "X" for mobiles
showRenderer: true, // show the "Math Renderer" menu? showRenderer: true, // show the "Math Renderer" menu?
showMathPlayer: true, // show the "MathPlayer" menu? showMathPlayer: true, // show the "MathPlayer" menu?
@ -121,8 +120,8 @@
}, },
".MathJax_MenuArrow": { ".MathJax_MenuArrow": {
position:"absolute", right:".5em", color:"#666666", position:"absolute", right:".5em", "padding-top":".25em", color:"#666666",
"font-family": (isMSIE ? "'Arial unicode MS'" : null) "font-family": (isMSIE ? "'Arial unicode MS'" : null), "font-size": ".75em"
}, },
".MathJax_MenuActive .MathJax_MenuArrow": {color:"white"}, ".MathJax_MenuActive .MathJax_MenuArrow": {color:"white"},
".MathJax_MenuArrow.RTL": {left:".5em", right:"auto"}, ".MathJax_MenuArrow.RTL": {left:".5em", right:"auto"},
@ -159,11 +158,43 @@
color: (isPC ? "HighlightText" : "white") color: (isPC ? "HighlightText" : "white")
}, },
".MathJax_Menu_Close": { "#MathJax_AboutClose": {
position:"absolute", top:".2em", right:".2em"
width: "31px", height: "31px", },
top:"-15px", left:"-15px" ".MathJax_Menu .MathJax_MenuClose": {
top:"-10px", left:"-10px"
},
".MathJax_MenuClose": {
position:"absolute",
cursor:"pointer",
display:"inline-block",
border:"2px solid #AAA",
"border-radius":"18px",
"-webkit-border-radius": "18px", // Safari and Chrome
"-moz-border-radius": "18px", // Firefox
"-khtml-border-radius": "18px", // Konqueror
"font-family":"'Courier New',Courier",
"font-size":"24px",
color:"#F0F0F0"
},
".MathJax_MenuClose span": {
display:"block", "background-color":"#AAA", border:"1.5px solid",
"border-radius":"18px",
"-webkit-border-radius": "18px", // Safari and Chrome
"-moz-border-radius": "18px", // Firefox
"-khtml-border-radius": "18px", // Konqueror
"line-height":0,
padding:"8px 0 6px" // may need to be browser-specific
},
".MathJax_MenuClose:hover": {
color:"white!important",
border:"2px solid #CCC!important"
},
".MathJax_MenuClose:hover span": {
"background-color":"#CCC!important"
} }
} }
}); });
@ -210,9 +241,9 @@
for (var i = 0, m = this.items.length; i < m; i++) {this.items[i].Create(menu)} for (var i = 0, m = this.items.length; i < m; i++) {this.items[i].Create(menu)}
if (MENU.isMobile) { if (MENU.isMobile) {
HTML.addElement(menu,"span",{ HTML.addElement(menu,"span",{
className: "MathJax_Menu_Close", menu: parent, className: "MathJax_MenuClose", menu: parent,
ontouchstart: MENU.Close, ontouchend: FALSE, onmousedown: MENU.Close, onmouseup: FALSE ontouchstart: MENU.Close, ontouchend: FALSE, onmousedown: MENU.Close, onmouseup: FALSE
},[["img",{src: CONFIG.closeImg, style:{width:"100%",height:"100%"}}]]); },[["span",{},"\u00D7"]]);
} }
div.appendChild(menu); div.appendChild(menu);
@ -371,14 +402,7 @@
}, },
saveCookie: function () {HTML.Cookie.Set("menu",this.cookie)}, saveCookie: function () {HTML.Cookie.Set("menu",this.cookie)},
getCookie: function () {this.cookie = HTML.Cookie.Get("menu")}, getCookie: function () {this.cookie = HTML.Cookie.Get("menu")}
//
// Preload images so they show up with the menu
//
getImages: function () {
if (MENU.isMobile) {var close = new Image(); close.src = CONFIG.closeImg}
}
}); });
@ -485,8 +509,8 @@
*/ */
MENU.ITEM.SUBMENU = MENU.ITEM.Subclass({ MENU.ITEM.SUBMENU = MENU.ITEM.Subclass({
menu: null, // the submenu menu: null, // the submenu
marker: (isPC && !HUB.Browser.isSafari ? "\u25B6" : "\u25B8"), // the menu arrow marker: "\u25BA", // the submenu arrow
markerRTL: (isPC && !HUB.Browser.isSafari ? "\u25B0" : "\u25C2"), markerRTL: "\u25C4", // the submenu arrow for RTL
Init: function (name,def) { Init: function (name,def) {
if (!(name instanceof Array)) {name = [name,name]} // make [id,label] pair if (!(name instanceof Array)) {name = [name,name]} // make [id,label] pair
@ -665,11 +689,8 @@
"background-color":"#E4E4E4", padding:".4em .6em", border:"1px inset" "background-color":"#E4E4E4", padding:".4em .6em", border:"1px inset"
}},jax],["br"],["br"], }},jax],["br"],["br"],
["a",{href:"http://www.mathjax.org/"},["www.mathjax.org"]], ["a",{href:"http://www.mathjax.org/"},["www.mathjax.org"]],
["img", { ["span",{className:"MathJax_MenuClose",id:"MathJax_AboutClose",onclick:MENU.About.Remove},
src: CONFIG.closeImg, [["span",{},"\u00D7"]]]
style: {width:"21px", height:"21px", position:"absolute", top:".2em", right:".2em"},
onclick: MENU.About.Remove
}]
]); ]);
MathJax.Localization.setCSS(about); MathJax.Localization.setCSS(about);
var doc = (document.documentElement||{}); var doc = (document.documentElement||{});
@ -1191,7 +1212,6 @@
CALLBACK.Queue( CALLBACK.Queue(
HUB.Register.StartupHook("End Config",{}), // wait until config is complete HUB.Register.StartupHook("End Config",{}), // wait until config is complete
["getImages",MENU],
["Styles",AJAX,CONFIG.styles], ["Styles",AJAX,CONFIG.styles],
["Post",HUB.Startup.signal,"MathMenu Ready"], ["Post",HUB.Startup.signal,"MathMenu Ready"],
["loadComplete",AJAX,"[MathJax]/extensions/MathMenu.js"] ["loadComplete",AJAX,"[MathJax]/extensions/MathMenu.js"]