UNPKG

node-geogebra

Version:

Generate graphics with geogebra from nodejs

1,514 lines (1,381 loc) 131 kB
<!DOCTYPE html> <html lang="<!--LANG-->"> <head> <meta charset="utf-8" /> <title><!--APP NAME--> - GeoGebra</title> <link rel="shortcut icon" href="//cdn.geogebra.org/apps/icons/graphing.ico" type="image/x-icon"> <link rel="icon" href="//cdn.geogebra.org/apps/icons/graphing.ico" type="image/x-icon"> <meta property="og:title" content="<!--APP NAME--> - GeoGebra" /> <link rel="preconnect" href="https://cdn.geogebra.org"> <link rel="preconnect" href="https://www.google-analytics.com"> <script type="text/javascript"> // for IE9 if (!window.console) window.console = {}; if (!window.console.log) window.console.log = function () { }; var latestVersion="5.0.488.0"; var module = "web3d"; var lookAndFeel = ""; var prerelease = false; var debug = false; var startDelay = 0; var marginTop = 0; var analyticsVersion = 'V'+latestVersion; var appOnline=true; var translation = {}; var codebase = "https://cdn.geogebra.org/apps/latest/"; </script> <script>prerelease=false;appID="graphing";appOnline=true;</script><!--LANGUAGE LINKS--> <script> function e(id){ return document.getElementById(id); } function c(className){ return document.getElementsByClassName(className)[0]; } var finalLang = null; function setParamFromURL(paramName){ if(getURLparam(paramName)){ e("ggw").setAttribute("data-param-"+paramName,getURLparam(paramName)); } } function changeMetaTitle(titleBase){ var title = titleBase.match(/GeoGebra/) ? titleBase : titleBase + " - GeoGebra"; var tags = document.head.getElementsByTagName("meta"); for(k in tags){ if(tags[k].getAttribute && tags[k].getAttribute("property")=="og:title"){ tags[k].setAttribute("content", title); } } document.title = title; } function perspective(id, name){ if(e("ggw")){ e("ggw").className="geogebraweb"; e("ggw").setAttribute("data-param-appname", window.appID || "classic"); e("ggw").setAttribute("data-param-marginTop", marginTop); if(id){ if((id+"").substring(0,4) == "exam") { e("ggw").setAttribute("data-param-enableGraphing","true"); } if(id == "exam-simple"){ e("ggw").setAttribute("data-param-enableGraphing","false"); e("ggw").setAttribute("data-param-enableCAS","false"); e("ggw").setAttribute("data-param-enable3D","false"); } if(id == "exam-graphing"){ e("ggw").setAttribute("data-param-enableCAS","false"); e("ggw").setAttribute("data-param-enable3D","false"); } if(id == "exam-cas"){ e("ggw").setAttribute("data-param-enableCAS","true"); e("ggw").setAttribute("data-param-enable3D","false"); } e("ggw").setAttribute("data-param-perspective",id); } setParamFromURL("filename"); setParamFromURL("rounding"); if(location.pathname.match(/lti/)){ e("ggw").setAttribute("data-param-showAppsPicker","false"); e("appsPicker") && e("appsPicker").style.setProperty("display", "none"); c("GeoGebraHeader") && c("GeoGebraHeader").remove(); e("ggw").setAttribute("data-param-marginTop",0); } if(window.ggbRerun){ ggbRerun(); } }else{ if(id){ ggbApplet.setPerspective(id+""); } } var label = e(name); if(label){ parentTable(label).className += " perspectiveHighlighted"; } if(name && window.history && window.history.pushState && name != "picker" && location.host.indexOf("geogebra") >= 0 && location.href.indexOf("?") < 0 && !location.pathname.match(/\/.*\/.+/) && !isLocalhost()){ var unbundled = name == "graphing" || name == "geometry" || name == "whiteboard" || name == "notes" || name == "3d"; if(name != "classic" && (location.pathname.indexOf("classic") > 0 || !unbundled)){ name = "classic#" + name; } history.pushState({}, "GeoGebra", "/"+name); } return false; } function div(styleName){ var ret = document.createElement("div"); ret.className = styleName; return ret; } function getLocalStorage(key){ try{ if(location.host && window.localStorage){ return localStorage.getItem(key); } } catch(e){ //local storage not supported } return false; } function setLocalStorage(key, value){ try{ if(location.host && window.localStorage){ return localStorage.setItem(key, value); } } catch(e){ //local storage not supported } } function getCookie(cookieName){ var docCookie = document.cookie; if (docCookie && docCookie != '') { var crumbs = docCookie.split('; '); for ( var i = 0; i < crumbs.length; ++i) { var name, value; var eqIdx = crumbs[i].indexOf('='); if (eqIdx == -1) { //empty } else { name = crumbs[i].substring(0, eqIdx); value = crumbs[i].substring(eqIdx + 1); if (name == cookieName) { try { value = decodeURIComponent(value); } catch (e) { // ignore error, keep undecoded value } return value; } } } } return false; } function parentTable(ret){ var parent = ret; while(parent = parent.parentElement){ if(parent.tagName == "TABLE"){ return parent; } } return ret; } function button(id, perspectiveId, caption){ var shortId = id.replace("perspective",""); if(getPerspective() == shortId){ changeMetaTitle(caption); } var ret = e(id); if (!ret) { return; } var parent = parentTable(ret); parent.addEventListener("click",function(){ if(e("ggw")){ e("ggw").setAttribute("data-param-showAppsPicker","false"); } changeMetaTitle(ret.innerText); perspective(perspectiveId,id.replace("perspective","")); }); ret.innerHTML = caption; } function setPickerLabels(dict){ button("graphing", 1, dict["Graphing"] || "Graphing"); button("geometry", 2, dict["Perspective.Geometry"] || "Geometry"); button("cas", 4, dict["Perspective.CAS"] || "CAS Calculator"); button("spreadsheet", 3, dict["Perspective.Spreadsheet"] || "Spreadsheet Calc"); button("perspective3d", 5, dict["GeoGebra3DGrapher.short"] || "3D Calculator"); button("probability", 6, dict["Perspective.Probability"] || "Probability Calc"); button("exam","exam", dict["exam_menu_entry"] || "Exam Calculator"); e("create").innerHTML = dict["CreateYourOwn"] || "GeoGebra Classic"; if(e("download")){ e("download").innerHTML = dict["Download"] || "Download"; } if(e("tutorialLink")){ e("tutorialLink").href = "https://www.geogebra.org/m/"+dict["TutorialClassic"]; } } function showInLang(lang){ var props = __GGB__keysVar[lang]; if(window.appID === "graphing"){ changeMetaTitle(props.menu["GraphingCalculator"] || "Graphing Calculator"); } if(window.appID === "geometry"){ changeMetaTitle(props.menu["Geometry"] || "Geometry"); } if(window.appID === "3D"){ changeMetaTitle(props.menu["Graphing3D"] || "3D Graphing Calculator"); } if(!window.appID && !getPerspective()){ changeMetaTitle(props.menu["math_apps"] || "GeoGebra Classic"); } document.body.parentNode.style.overflow = "auto"; if(e("ggbPage")){ e("ggbPage").style.display = ""; } if(finalLang && finalLang != lang){ console.log("wrong lang"); return; } if(e("ggbPage")){ setPickerLabels(props.menu); } } function showInEnglish(){ if(!window.__GGB__keysVar && e("ggbPage")){ setPickerLabels({}); e("ggbPage").style.display=""; } } var langs = ["af", "ar", "ar-MA", "ar-TN", "bg", "bs", "ca", "ca-XV", "cs", "cy", "da", "de-AT", "de", "el", "en-AU", "en-GB", "en", "eo", "es-ES", "es", "es-UY", "et", "eu", "fa", "fi", "fr", "gl", "hi", "hr", "hu", "hy", "in", "is", "it", "he", "ja", "yi", "ka", "kk", "km", "kn", "ko", "lt", "lv", "mk", "ml", "mn", "mr", "ms", "ne", "nl-NL", "nl", "no", "nb", "nn", "pl", "pt", "pt-PT", "ro", "ru", "si", "sk", "sl", "sq", "sr", "sv", "ta", "tg", "th", "fil", "tr", "ty", "ug", "uk", "ur", "vi", "xh", "zh-CN", "zh-TW"]; function validLang(lang){ lang=lang.replace("_","-").replace("tl","fil").replace("ji","yi").replace("no-NO-NY","nn"); if(lang.substring(0,2) == "no"){ lang = "nb"; } if(lang.substring(0,2) == "zh"){ lang = lang.indexOf("TW") > 0 || lang.indexOf("Hant") > 0 ? "zh-TW" : "zh-CN"; } if(langs.indexOf(lang) >= 0){ return lang; } lang = lang.substring(0,2); if(langs.indexOf(lang) >= 0){ return lang; } return "en"; } function getURLparam(param){ var parts = location.href.split("?"); if(parts.length<2){ return null; } params=parts[1].split("&"); for(var i=0;i<params.length;i++){ if(params[i].indexOf(param + "=")==0){ return params[i].substring(param.length + 1); } } return null; } function switchLang(lang){ var storedTranslation = {}; if(getLocalStorage("translation")){ try { storedTranslation = JSON.parse(localStorage.translation); } catch(e){ console.log(e.message); } } if(storedTranslation[lang] && storedTranslation["version"] == latestVersion){ window.__GGB__keysVar = {}; window.__GGB__keysVar[lang] = storedTranslation[lang]; window.__GGB__keysVar["version"] = storedTranslation["version"]; showInLang(lang); } else{ var l10n = document.createElement("script"); document.head.appendChild(l10n); l10n.onload = function(){ showInLang(lang); if(window.__GGB__keysVar[lang]){ var obj = {}; obj["version"] = latestVersion; obj[lang] = window.__GGB__keysVar[lang]; setLocalStorage("translation", JSON.stringify(obj)); } } l10n.setAttribute("src", codebase + module+"/js/properties_keys_"+lang+".js"); } } function insertScript(){ var app = document.createElement("script"); app.setAttribute("src",codebase+module+"/js/webfont.js"); document.head.appendChild(app); app = document.createElement("script"); app.setAttribute("src",codebase+module+"/"+module+".nocache.js"); window.setTimeout(function(){ document.head.appendChild(app); },startDelay); } function isLocalhost(){ return location.protocol.match(/(chrome|app|file:)/) || location.host.match(/^([0-9.]*|(autotest|deploy).*geogebra.org|localhost)(:.+)?$/); } function showStartScreen(){ var lang = getURLparam("lang") || getCookie("GeoGebraLangUI") || getLocalStorage("GeoGebraLangUI") || navigator.language || "en"; window.setTimeout(showInEnglish, 1000); switchLang(validLang(lang)); } function installWorker(){ window.GGBT_offlineRequestHandler = (function() { "use strict"; function isServiceWorkerSupported() { return 'serviceWorker' in navigator && location.protocol === "https:"; } function registerServiceWorker() { //TODO: will be cool for offline working. Not ready for push messages yet, too small browser support, too many quirks if (navigator.serviceWorker.controller) { console.log("service worker already controlling the page"); } else { navigator.serviceWorker.register('/sworker.js', { scope: '/' }); } } function initServiceWorker() { if (isServiceWorkerSupported()) { registerServiceWorker(); } else { console.log("service workers not supported"); } } return { initServiceWorker : initServiceWorker, }; })(); window.GGBT_offlineRequestHandler.initServiceWorker(); } function setPrerelease(prereleaseParam){ document.body.className += "prerelease"; e("ggw").setAttribute("data-param-prerelease",prereleaseParam); e("ggw").setAttribute("data-param-showlogging",true); } function setDebug(debugParam){ e("ggw").setAttribute("data-param-showlogging",debugParam); } function getPerspective(){ if(getURLparam("perspective")){ return getURLparam("perspective"); } var parts = location.pathname.split("/"); var path = parts.length == 1 || parts[parts.length-1].length? parts[parts.length-1] : parts[parts.length-2] ; if(location.hash.length || (path != '/apps' && path != '/apps/' && !path.match(/\.html$/))){ return location.hash.length ? location.hash.replace('#','') : path; } return window.appID; } function mobileStartscreen(){ var link = false; var androidLinks = {"geometry":"https://play.google.com/store/apps/details?id=org.geogebra.android.geometry", "graphing":"https://play.google.com/store/apps/details?id=org.geogebra.android", "3d":"https://play.google.com/store/apps/details?id=org.geogebra.android.g3d"}; var iosLinks = {"graphing":"https://itunes.apple.com/us/app/geogebra-graphing-calculator/id1146717204", "geometry":"https://itunes.apple.com/us/app/geogebra-geometry-calculator/id1232591335"}; if(/iPhone|iPad|iPod/i .test(window.navigator.userAgent)){ link = iosLinks[window.appID]; } else { link = androidLinks[window.appID]; } if(!link){ return false; } var nameText = c("appName").innerText; var appName = document.createElement("H1"); appName.innerText = nameText; appName.clasName = "appName"; c("appName").parentElement.className += " mobile"; c("GeoGebraFrame").remove(); c("mk-spinner-wrap").remove(); c("startscreen").style.textAlign="center"; c("logo").className += " mobile"; //c("GeoGebraHeader").style.display= "none"; var tryApp = document.createElement("a"); tryApp.innerText = translation.tryApp || "Try App"; var stay = document.createElement("a"); stay.innerText = translation.stay || "Continue"; c("startscreen").appendChild(appName); c("startscreen").appendChild(tryApp); c("startscreen").appendChild(stay); stay.addEventListener("click",function(){ stay.style.opacity = 0; tryApp.style.opacity = 0; insertScript(); }); tryApp.className = "tryApp"; tryApp.target = "_blank"; tryApp.rel = "noreferrer noopener"; tryApp.href = link; return true; } function checkLogin(){ installWorker(); var names = {'geometry':2, 'spreadsheet':3, 'cas':4, '3d':5, 'probability':6, 'graphing':1, 'whiteboard':7,'calculator':8}; var tubeid = getURLparam("id"); var checkId = location.pathname.match(/^\/(o|classic|graphing|geometry|3d|whiteboard|notes)\/([a-zA-Z0-9]+)/); if(checkId && !names[checkId[2]]){ tubeid = checkId[2]; if(checkId[1] == "o"){ appID = "auto"; } } var wait = false; var skipAppsPicker = getURLparam("command") || getURLparam("state") || getURLparam("filename"); if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i .test(window.navigator.userAgent) && c("appName") && !skipAppsPicker && !location.pathname.match(/lti/)){ wait = mobileStartscreen(); } function resizeStart(){ if(e("perspectivesBox")){ if(window.innerHeight < 650 || window.innerWidth < 650){ e("perspectivesBox").style.display = "none"; } else { e("perspectivesBox").style.top= (Math.max(0,Math.round(window.innerHeight/2 -250))-53)+"px"; } } } resizeStart(); window.addEventListener && window.addEventListener("resize", resizeStart); if(e("ggw")){ if(lookAndFeel){ e("ggw").setAttribute("data-param-laf",lookAndFeel); } if(location.host.indexOf("beta") == 0 || getURLparam("prerelease") || prerelease){ setPrerelease(prerelease || "true"); } if(getURLparam("debug") || debug || isLocalhost()){ setDebug(debug || true); } if(location.host.indexOf("alpha") == 0){ setPrerelease("canary"); e("ggw").setAttribute("data-param-materialsApi",location.protocol+"//"+location.host+"/api/json.php"); e("ggw").setAttribute("data-param-loginApi","https://"+location.host+"/api/login.php"); } if(isLocalhost()){ codebase = "./"; } } if(tubeid){ if(e("ggw")){ e("ggw").setAttribute("data-param-tubeid",tubeid); if(window.appID){ e("ggw").setAttribute("data-param-perspective",names[appID]); } var previewDiv = document.createElement("div"); previewDiv.id= "ggbsplash"; previewDiv.style.zIndex=1000; var preview = document.createElement("img"); preview.style.margin="auto"; preview.style.position="absolute"; var xhr = new XMLHttpRequest(); var materialHost = isLocalhost() ? "https://beta.geogebra.org":""; xhr.open("GET", materialHost + "/api/material_preview.php?u="+tubeid); xhr.onreadystatechange = function() { if (xhr.readyState == 4 && xhr.response) { preview.addEventListener && preview.addEventListener("load",function(){ preview.style.top=(window.innerHeight/2-preview.height/2)+"px"; preview.style.left=(window.innerWidth/2-preview.width/2)+"px"; c("logo") && c("logo").style.setProperty("display", "none"); }); preview.src = xhr.response.replace("http:","https:"); } }; xhr.send(); previewDiv.appendChild(preview); document.body.appendChild(previewDiv); perspective(false); insertScript(); return; } } else if(getPerspective()){ var pName = getPerspective(); if( pName.substring(0,6)=="search" || pName.substring(0,4) == "exam"){ if(e("perspectivesBox")){ e("perspectivesBox").style.display = "none"; } wait || perspective(pName); } else{ perspective(names[pName],pName); } document.body.className += " "+pName; document.body.className += " "+module; wait || insertScript(); showStartScreen(); return; } else if(skipAppsPicker ){ perspective(false); insertScript(); return; } showStartScreen(); wait || insertScript(); perspective(false, "picker"); //TODO } </script> <script type="text/javascript"> // test to see if the app is running as a chrome webapp document.isChromeWebapp = function isChromeWebapp() { if (typeof chrome === 'object' && typeof chrome.app === 'object' && typeof chrome.app.isInstalled === 'boolean' && chrome.app.isInstalled) { return true; } return false; }; </script> <!-- Google Analytics (Start) --> <script type="text/javascript"> window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date; if(window.installAnalytics){ window.installAnalytics('UA-1780044-1'); } else { ga('create','UA-1780044-1','auto'); } ga('send', 'pageview'); var gaPrefixes = {"graphing":"Graphing", "geometry":"Geometry"}; var gaLabel = gaPrefixes[window.appID] || "Classic"; gaLabel += appOnline ? " Web" : " Offline"; ga('send', 'event', 'Startup', analyticsVersion, gaLabel); </script> <script async src='https://www.google-analytics.com/analytics.js'></script> <!-- Google Analytics (End) --> <script> var GGW_appengine = GGW_appengine || {}; GGW_appengine.FILE_IDS = [""]; GGW_appengine.CLIENT_ID = ""; GGW_appengine.USER_EMAIL = ""; </script> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1" /> <style> body { touch-action: none; -ms-touch-action: none; /* Direct all pointer events to JavaScript code. */ -ms-user-select: none; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); /* avoid flash on Android http://stackoverflow.com/questions/5210481/*/ color: #666666; font-size: 14px; font-family: sans-serif; margin: 0px; padding: 0px; position: fixed; top:0; width:100%; height:100%; } .GeoGebraHeader{ display: flex; border-bottom: 1px solid #dcdcdc; background-color: rgb(255,255,255); padding: 4px; -ms-user-select: none; -moz-user-select: none; -webkit-use-select: none; user-select: none; height: 24px; } .GeoGebraHeader.beta { height: 64px; padding: 0px; border: 0px; } .GeoGebraHeader .signIn { color: rgb(0,0,0); opacity: 0.87; } .GeoGebraHeader .signIn:hover{ opacity: 1; background-color: #e5e5e5; } .GeoGebraHeader .appName.beta { font-size: 24px; font-weight: normal; margin: 20px 0px; position: absolute; top: 0px; left: 230px; width: 400px; height: 24px; line-height: 24px; font-family: sans-serif; } @media screen and (max-width: 660px) { .GeoGebraHeader .appName.beta { visibility: hidden; } } .GeoGebraFrame .buttons { position: absolute; top: 0px; right: 0px; display: flex; min-height: 48px; } .GeoGebraFrame .flatButtonHeader { padding: 6px; cursor: pointer; height: 36px; float: left; box-sizing: border-box; border-radius: 50%; } .GeoGebraFrame .flatButtonHeader img { opacity: 0.54; } .GeoGebraFrame .flatButtonHeader:hover, .GeoGebraFrame .flatButtonHeader.selected { background-color: #e5e5e5; } .GeoGebraFrame .flatButtonHeader img { width: 24px; height: 24px; } .GeoGebraFrame .menuBtn { margin: 14px 2px 14px 18px; } .GeoGebraFrame .shareBtn { margin: 14px 24px 14px 0; } .GeoGebraFrame .appsBtn { margin: 14px 0px 14px 0px; } .GeoGebraHeader .profilePanel, .GeoGebraHeader .signIn { text-transform: uppercase; margin: 16px 24px 16px 4px; padding: 4px 8px; line-height: 24px; border-radius: 2px; cursor: pointer; } .GeoGebraHeader .profilePanel { margin: 12px 24px 12px 12px; padding: 0px !important; } img.profileImage { border-radius: 50%; display: block; } .GeoGebraHeader .examPanel { position: absolute; top: 0px; right: 0px; display: flex; min-height: 48px; } .GeoGebraHeader .examInfoBtn { margin: 14px 18px; } .GeoGebraHeader .examTimer { font-size: 24px; font-weight: normal; margin: 20px 0px; line-height: 1; } .GeoGebraFrame .headerLogo { height: 48px; margin: 8px 0px; float: left; cursor: pointer; } .GeoGebraHeader .appName{ padding-left: 12px; font-size: 16px; margin: 3px 0; line-height: 17px; font-weight: normal; flex:1; } .GeoGebraHeader.mobile{ display:none; } .application .GeoGebraHeader.mobile{ display:flex; } .startscreen a, .startscreen a:visited{ margin: 10px; padding:8px; border-radius: 2px; box-shadow: 0 1px 4px rgba(0,0,0,0.2); font-size:16px; color: rgba(0,0,0,0.85); text-decoration:none; display:inline-block; width: 250px; transition: 0.2s; } .startscreen a.tryApp, .startscreen a.tryApp:visited{ background-color:#6557D2; color:rgba(255,255,255,0.85); } .startscreen .appName{ margin-top: 0; margin-bottom: 10px; } .GeoGebraHeader a{ color: #008475; text-decoration: none; padding: 0px 8px; margin-left: 5px; margin-right: 0px; } .GeoGebraHeader ul{ list-style-type:none; margin: 0; } .GeoGebraHeader li{ display: inline; } .GeoGebraHeader .links { padding: 3px 4px; font-size: 15px; margin: 0px; } .application .startscreen { display: none; } .startscreen{ position: absolute; top: 64px; width: 100%; height:calc(100% - 64px); } .startscreen.offline{ position: absolute; top: 0; width: 100%; height: 100%; } .startscreen .logo{ display:none; } .startscreen .logo.mobile{ display:block; width: 35%; margin: auto; } .startscreen .logo svg{ width: 100%; height: 100%; } /** app dropdown */ ul { padding-left: 0; list-style-type: none; } svg.icon.left { margin-right: 15px; } .beta ul a { transition: background-color .3s; font-size: 1rem; color: rgba(0,0,0,.87); display: block; padding: 0 15px; cursor: pointer; margin: 0; } nav.beta { box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12), 0 3px 1px -2px rgba(0,0,0,.2); z-index: 102; position: relative; width: 100%; } .popdown-button-container { position: absolute; top: 100%; right: 0; font-size: 16px; } .popdown-button-container svg { width: 24px; height: 24px; opacity: 1; min-width:24px; vertical-align: middle; } .GeoGebraHeader .matMenu.gwt-PopupPanel .gwt-MenuItem.listMenuItem { padding: 0; display: block; } .GeoGebraFrame .popupAnchor{ position: relative; height: 52px; } /** from Web styles */ .GeoGebraFrame .gwt-MenuItem { white-space: nowrap; } .GeoGebraFrame .matMenu.gwt-PopupPanel { background-color: #fff; padding: 8px 0px 8px 0px; border-radius: 2px; min-width: 192px; } .GeoGebraFrame .gwt-PopupPanel { border-radius: 10px; padding: 5px; background-color: rgba(255,255,255,0.9); box-shadow: 0 0 2px 1px rgba(102,102,102,0.3); z-index: 500; } .GeoGebraHeader.GeoGebraFrame .matMenu.gwt-PopupPanel .gwt-MenuItem { height: 32px; min-width: 192px; cursor: pointer; padding-top: 0px; padding-bottom: 0px; padding-right: 16px; } .GeoGebraFrame .matMenu.gwt-PopupPanel .gwt-MenuItem.listMenuItem { line-height: 24px; padding-top: 4px; } .GeoGebraFrame .matMenu.gwt-PopupPanel .gwt-MenuItem:hover { background-color: #eee; color: #000; }@-webkit-keyframes a{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.mk-spinner-ring{height:50px;margin-top:-25px;border-radius:50%;border:3px solid #00bcd4;border-left-color:transparent;background:transparent;-webkit-animation:a 1s infinite linear;animation:a 1s infinite linear}.mk-spinner-fan,.mk-spinner-ring{content:"";display:inline-block;position:absolute;width:50px;top:50%;left:50%;margin-left:-25px;z-index:1}.mk-spinner-fan{height:0;margin-top:0;border:3px solid #cebb17;border-radius:50%;-webkit-animation:a .8s infinite linear;animation:a .8s infinite linear}@-webkit-keyframes b{0%{-webkit-transform:scale(.9);transform:scale(.9)}to{-webkit-transform:scale(1);transform:scale(1)}}@keyframes b{0%{-webkit-transform:scale(.9);transform:scale(.9)}to{-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes c{0%{-webkit-transform:scale(.9);transform:scale(.9)}to{-webkit-transform:scale(4);transform:scale(4)}}@keyframes c{0%{-webkit-transform:scale(.9);transform:scale(.9)}to{-webkit-transform:scale(4);transform:scale(4)}}.mk-spinner-ripple:after,.mk-spinner-ripple:before{content:"";display:inline-block;position:absolute;width:20px;height:20px;top:50%;margin-top:-10px;left:50%;margin-left:-10px;z-index:1;border-radius:50%}.mk-spinner-ripple:before{background:#00796b;-webkit-animation:b 1s infinite .5s;animation:b 1s infinite .5s}.mk-spinner-ripple:after{background:#1de9b6;z-index:0;-webkit-transform:scale(3);transform:scale(3);-webkit-animation:c 1s infinite .5s;animation:c 1s infinite .5s}.mk-spinner-pie{content:"";display:inline-block;position:absolute;width:50px;height:50px;top:50%;margin-top:-25px;left:50%;margin-left:-25px;z-index:1;background:transparent;border-radius:50%;border:25px solid;border-color:#ffca28 #eeff41 #00bcd4 #1de9b6;-webkit-animation:a 1s infinite linear;animation:a 1s infinite linear}.mk-spinner-doublecircle{background:transparent;-webkit-animation:a 2s linear infinite;animation:a 2s linear infinite}.mk-spinner-doublecircle,.mk-spinner-doublecircle:after{border:3px solid;border-radius:50%;content:"";display:inline-block;position:absolute;width:50px;height:50px;top:50%;margin-top:-25px;left:50%;margin-left:-25px;z-index:1}.mk-spinner-doublecircle{border-color:#1de9b6 rgba(0,0,0,.07)}.mk-spinner-doublecircle:after{border-color:transparent #eeff41;-webkit-animation:a 5s linear infinite;animation:a 5s linear infinite}@keyframes a{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.mk-spinner-weight{-webkit-animation:a 1.5s infinite ease-in;animation:a 1.5s infinite ease-in;content:"";display:inline-block;position:absolute;width:50px;height:2px;top:50%;margin-top:-1px;left:50%;margin-left:-25px;z-index:1;background:#1de9b6}.mk-spinner-weight:after,.mk-spinner-weight:before{content:"";position:absolute;top:50%;border:2px solid #1de9b6;border-radius:50%}.mk-spinner-weight:before{width:12px;height:12px;margin-top:-6px;right:100%}.mk-spinner-weight:after{width:16px;height:16px;margin-top:-8px;left:100%}@-webkit-keyframes d{0%,to{-webkit-transform:scale(0);transform:scale(0)}50%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes d{0%,to{-webkit-transform:scale(0);transform:scale(0)}50%{-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes e{0%,to{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(0);transform:scale(0)}}@keyframes e{0%,to{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(0);transform:scale(0)}}.mk-spinner-bubbles,.mk-spinner-bubbles:after,.mk-spinner-bubbles:before{content:"";display:inline-block;position:absolute;width:20px;height:20px;top:50%;margin-top:-10px;left:50%;margin-left:-10px;z-index:1;border-radius:50%;background:inherit}.mk-spinner-bubbles:before{left:-100%;-webkit-animation:d 1.5s infinite;animation:d 1.5s infinite}.mk-spinner-bubbles{opacity:.7;background:#1de9b6}.mk-spinner-bubbles:after{opacity:.5;left:200%;-webkit-animation:e 1.5s infinite;animation:e 1.5s infinite}@-webkit-keyframes f{0%{-webkit-transform:translateY(0);transform:translateY(0)}25%{-webkit-transform:translateY(-4px);transform:translateY(-4px)}50%{-webkit-transform:translateY(0);transform:translateY(0)}75%{-webkit-transform:translateY(4px);transform:translateY(4px)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes f{0%{-webkit-transform:translateY(0);transform:translateY(0)}25%{-webkit-transform:translateY(-4px);transform:translateY(-4px)}50%{-webkit-transform:translateY(0);transform:translateY(0)}75%{-webkit-transform:translateY(4px);transform:translateY(4px)}to{-webkit-transform:translateY(0);transform:translateY(0)}}.mk-spinner-dots,.mk-spinner-dots:after,.mk-spinner-dots:before{content:"";display:inline-block;position:absolute;width:12px;height:12px;top:50%;margin-top:-6px;left:50%;margin-left:-6px;z-index:1;border-radius:50%;background:inherit;-webkit-transform-origin:center;transform-origin:center;-webkit-animation-name:f;animation-name:f;-webkit-animation-duration:2s;animation-duration:2s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-fill-mode:both;animation-fill-mode:both}.mk-spinner-dots:before{left:-100%;-webkit-animation-delay:.5s;animation-delay:.5s;background:#1de9b6}.mk-spinner-dots{background:rgba(29,233,182,.6)}.mk-spinner-dots:after{left:200%;-webkit-animation-delay:1s;animation-delay:1s;background:rgba(29,233,182,.3)}@-webkit-keyframes g{0%,50%,60%{-webkit-transform:translateX(0);transform:translateX(0)}90%,to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}@keyframes g{0%,50%,60%{-webkit-transform:translateX(0);transform:translateX(0)}90%,to{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}@-webkit-keyframes h{0%{-webkit-transform:translateX(0);transform:translateX(0)}50%,60%{-webkit-transform:translateX(-100%);transform:translateX(-100%)}90%,to{-webkit-transform:translateX(-200%);transform:translateX(-200%)}}@keyframes h{0%{-webkit-transform:translateX(0);transform:translateX(0)}50%,60%{-webkit-transform:translateX(-100%);transform:translateX(-100%)}90%,to{-webkit-transform:translateX(-200%);transform:translateX(-200%)}}.mk-spinner-boxes,.mk-spinner-boxes:after,.mk-spinner-boxes:before{content:"";display:inline-block;position:absolute;width:20px;height:20px;top:50%;margin-top:-10px;left:50%;margin-left:-10px;z-index:1}.mk-spinner-boxes{background:#1de9b6}.mk-spinner-boxes:after,.mk-spinner-boxes:before{margin-left:0;background:inherit}.mk-spinner-boxes:before{opacity:.5;left:100%;-webkit-animation:g 2s infinite 2s;animation:g 2s infinite 2s}.mk-spinner-boxes:after{opacity:.2;left:200%;-webkit-animation:h 2s infinite;animation:h 2s infinite}*,:after,:before{-webkit-box-sizing:border-box;box-sizing:border-box}.mk-spinner-wrap{min-height:100px;width:100%;position:relative}@-webkit-keyframes i{0%,5%{left:0;top:0}50%,55%{left:50%;top:50%}95%,to{left:0;top:0}}@keyframes i{0%,5%{left:0;top:0}50%,55%{left:50%;top:50%}95%,to{left:0;top:0}}@-webkit-keyframes j{0%,5%{right:0;bottom:0}50%,55%{right:50%;bottom:50%}95%,to{right:0;bottom:0}}@keyframes j{0%,5%{right:0;bottom:0}50%,55%{right:50%;bottom:50%}95%,to{right:0;bottom:0}}.mk-spinner-window{content:"";display:inline-block;position:absolute;width:36px;height:36px;top:50%;margin-top:-18px;left:50%;margin-left:-18px;z-index:1;background:#82b3ae}.mk-spinner-window:after,.mk-spinner-window:before{content:"";position:absolute;width:18px;height:18px;background:#6fa7a2}.mk-spinner-window:before{top:0;left:0;background:#6fa7a2;background:rgba(0,0,0,.1);-webkit-animation:i 3s infinite linear;animation:i 3s infinite linear}.mk-spinner-window:after{right:0;bottom:0;background:#62a099;background:rgba(0,0,0,.2);-webkit-animation:j 3s infinite linear;animation:j 3s infinite linear} .GeoGebraHeader , .GeoGebraFrame * { box-sizing:content-box; } .GeoGebraFrame, .GeoGebraFrame .GeoGebraPopup, .GeoGebraFrame .DialogBox, .GeoGebraFrame .gwt-PopupPanel, .GeoGebraFrame .gwt-SuggestBoxPopup, .GeoGebraFrame .ToolTip { font: 100%/120% geogebra-sans-serif,Frutiger,"Frutiger Linotype",Univers,Calibri,"Gill Sans","Gill Sans MT","Myriad Pro",Myriad,"DejaVu Sans Condensed","Liberation Sans","Nimbus Sans L",Tahoma,Geneva,"Helvetica Neue",Helvetica,Arial,sans-serif; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-weight: normal; font-stretch: normal; font-size: 100%; line-height: 120%; font-family: geogebra-sans-serif, Frutiger, "Frutiger Linotype", Univers, Calibri, "Gill Sans", "Gill Sans MT", "Myriad Pro", Myriad, "DejaVu Sans Condensed", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; } .GeoGebraFrame .ggbdockpanelhack>div { overflow: visible!important; } .GeoGebraFrame .TitleBarPanel { z-index: 11; left: auto!important; bottom: auto!important; max-width: 100%; } .GeoGebraFrame { background-color: #fff; color: #666; font-size: 16px; } .GeoGebraFrame .toolbar .header-open-landscape{ height: 56px; width: 100%; background-color: #6557D2; } .GeoGebraFrame .toolbar .header .center, .GeoGebraFrame .toolbar .header-open-portrait .center, .GeoGebraFrame .toolbar .header-open-landscape .center, .GeoGebraFrame .toolbar .header-close-portrait .center, .GeoGebraFrame .toolbar .header-close-landscape .center { position: absolute; display: inline-flex; left: calc(50% - 84px); } .GeoGebraFrame .flatButton { margin: 6px; padding: 6px; padding-top: 6px; padding-right: 6px; padding-bottom: 6px; padding-left: 6px; width: 24px; height: 24px; } .GeoGebraFrame .menu { position: absolute; top: 4px; left: 0px; z-index: 498; } .GeoGebraFrame .tabButton { position: relative; margin: 6px; padding: 6px; width: 24px; height: 24px; min-width: 24px; } .GeoGebraFrame .toolbar .main>* { position: absolute !important; display: inline-block; } .GeoGebraFrame .toolbar .header .rightSide, .GeoGebraFrame .toolbar .header-open-portrait .rightSide, .GeoGebraFrame .toolbar .header-open-landscape .rightSide, .GeoGebraFrame .toolbar .header-close-portrait .rightSide, .GeoGebraFrame .toolbar .header-close-landscape .rightSide { float: right; } .GeoGebraFrame .toolbar .header-open-landscape .close, .GeoGebraFrame .toolbar .header-close-portrait .close { float: left; margin-right: 6px; } .GeoGebraFrame .toolbar .main .tab-hidden { visibility: hidden; } .GeoGebraFrame .toolbar .tools { position: absolute; left: -100%; transition: left 200ms ease; } .GeoGebraFrame .hide-Dragger .gwt-SplitLayoutPanel-HDragger { border-left: 1px solid #ccc; z-index: 1; box-shadow: 2px 0px 6px rgba(0,0,0,0.4); width: 0px !important; } .GeoGebraFrame .undoRedoPanel { padding-top: 4px; padding-bottom: 4px; padding-left: 12px; position: absolute; z-index: 10; } .GeoGebraFrame .button.flatButton.graphicsContextMenuBtn.button-up, .GeoGebraFrame .button.flatButton.graphicsContextMenuBtn.button-up-hovering { margin-top: 10px; margin-right: 10px; position: absolute; right: 0px; } .GeoGebraFrame .button.flatButton.graphicsContextMenuBtn.button-up img, .GeoGebraFrame .button.flatButton.graphicsContextMenuBtn.button-up-hovering img { opacity: 0.54; } .GeoGebraFrame .matOpenKeyboardBtn { position: absolute; bottom: 8px; height: 22px; text-align: center; z-index: 99; } .GeoGebraFrame .matOpenKeyboardBtn img { width: 36px; opacity: 0.54; } .GeoGebraFrame .matAvDesign .NewRadioButtonTreeItemParent { border-top: #6557D2 solid 1px; border-bottom: #6557D2 solid 1px; } .GeoGebraFrame .matAvDesign .gwt-Tree .gwt-TreeItem .elem { min-height: 48px; position: relative; } .GeoGebraFrame .matAvDesign .marblePanel.error, .GeoGebraFrame .matAvDesign .marblePanel.help, .GeoGebraFrame .matAvDesign .marblePanel { position: absolute; height: 100%; padding-top: 0px; padding-bottom: 0px; padding-left: 18px; padding-right: 18px; } .GeoGebraFrame .matAvDesign .marblePanel.plus { padding-top: 0px; padding-left: 4px; padding-right: 4px; min-height: 47px; } .GeoGebraFrame .matAvDesign .marblePanel.plus img { opacity: 0.54; } .GeoGebraFrame .NewRadioButtonTreeItemParent { position: absolute; width: 100%; z-index: 4; } .GeoGebraFrame .algebraView .avInputItem { padding: 0!important; z-index: 1; margin-top: -2px; } .GeoGebraFrame .algebraHelpButton, .GeoGebraFrame .marblePanel { border-right: 1px solid #dcdcdc; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(220, 220, 220); } .GeoGebraFrame .matAvDesign .NewRadioButtonTreeItemParent { border-top: #6557D2 solid 1px; border-bottom: #6557D2 solid 1px; } .GeoGebraFrame .toolbar .toolsPanel { padding: 0px 16px 14px 16px; } .GeoGebraFrame .toolbar .toolsPanel .gwt-Label { cursor: default; height: 48px; line-height: 56px; font-size: 100%; } .GeoGebraFrame .toolbar .toolsPanel .button { position: relative; display: inline-block; border-radius: 5px; border: 1px solid #dcdcdc; background-color: #fff; padding: 3px; margin: 3px; width: 32px; height: 32px; } .GeoGebraFrame .checkBoxPanel>*, .GeoGebraFrame .panelRow>*, .GeoGebraFrame .listBoxPanel>*, .GeoGebraFrame .panelRowIndent>*, .GeoGebraFrame .propertiesTab .gwt-CheckBox>*, .GeoGebraFrame .panelRowCell>*, .GeoGebraFrame .panelRowCell>*, .GeoGebraFrame .optionsPanel>*, .GeoGebraFrame .optionsPanelIndent>*, .GeoGebraFrame .optionsPanelCell>*, .GeoGebraFrame .propertiesTab .sliderIntervalPanel>*, .GeoGebraFrame .propertiesTab .sliderWidthPanel>*, .GeoGebraFrame .textOptionsToolBar>*, .GeoGebraFrame .BackgroundColorPanel>*, .GeoGebraFrame .minMaxPanel>* { display: inline-block; vertical-align: middle; margin: 3px 10px 3px 0; } /*** MOW ***/ .GeoGebraFrame .mowToolbar { position: relative; height: 182px; overflow: hidden; background-color: #00a8d5; border-radius: 2px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; box-shadow: 0px -4px 6px 0px rgba(0,0,0,0.28); } .GeoGebraFrame .showMowSubmenu { bottom: 178px; transition: bottom 0.2s cubic-bezier(0.4, 0, 1, 1); } .GeoGebraFrame .BigScreen { width: 600px; } .GeoGebraFrame .mowToolbar img { width: 32px; opacity: 0.54; } .GeoGebraFrame .mowToolButton { position: relative; display: inline-block; border-radius: 5px; border: 1px solid #dcdcdc; background-color: #fff; padding: 3px; margin: 3px !important; width: 32px; height: 32px; } .GeoGebraFrame .mowSubmenuScrollPanel, .GeoGebraFrame .slideLeft, .GeoGebraFrame .slideCenter, .GeoGebraFrame .slideRight { background-color: #fff; position: relative; display: flex; top: 56px; width: 300%; height: 123px; } .GeoGebraFrame .mowSubMenuContent .panelRow { padding: 8px 16px 8px 16px; margin: 0px; } .GeoGebraFrame .penSubMenu .penPanel .panelRow { padding: 0px; } .GeoGebraFrame .penSubMenu .colorPanel .panelRow { padding: 0px; } .GeoGebraFrame .mowToolbar .middle { position: absolute; top: 0px; margin: 4px 0px 4px 0px; left: calc(50% - 108px); display: inline-flex; } .GeoGebraFrame .mowColorButton { width: 32px; height: 32px; border-radius: 2px; margin: 6px !important; } .GeoGebraFrame .penSubMenu .penPanel { width: 105px; margin: 0px; } .GeoGebraFrame .mowToolbar .middle img { opacity: 0.85; margin: 6px; padding: 6px; width: 24px; height: 24px; } .GeoGebraFrame .penSubMenu .colorPanel { position: absolute; left: 150px; margin: 0px; } .GeoGebraFrame .penSubMenu .penPanel .plusMarginLeft { margin-left: 16px !important; } .GeoGebraFrame .mowSubMenu { width: calc(100% /3); overflow: hidden; } .GeoGebraFrame .penSubMenu .sizePanel { position: absolute; left: 153px; top: 70px; } .GeoGebraFrame .mowSubMenu .mowSubMenuContent .mowOptionsSlider .ui-slider-horizontal { height: 5px; background-color: #989898; box-shadow: none; } .GeoGebraFrame .mowSubMenu .mowSubMenuContent .mowOptionsSlider .ui-slider-handle, .GeoGebraFrame .mowSubMenu .mowSubMenuContent .mowOptionsSlider .ui-slider-handle.ui-state-hover, .GeoGebraFrame .mowSubMenu .mowSubMenuContent .mowOptionsSlider .ui-slider-handle.ui-state-active, .GeoGebraFrame .mowSubMenu .mowSubMenuContent .mowOptionsSlider .ui-slider-handle.ui-state-focus { position: absolute; top: -5px !important; left: 0%; width: 15px !important; height: 15px !important; margin-left: -8px !important; border-radius: 50% !important; border: none !important; box-shadow: none !important; transition: all .2s ease; user-select: none; z-index: 2; } .GeoGebraFrame .penSubMenu .optionsSlider .ui-state-default, .GeoGebraFrame .penSubMenu .optionsSlider .ui-widget-content .ui-state-default, .GeoGebraFrame .penSubMenu .optionsSlider .ui-widget-header .ui-state-default, .GeoGebraFrame .avItemContent .optionsSlider .ui-state-default, .GeoGebraFrame .avItemContent .optionsSlider .ui-widget-content .ui-state-default, .GeoGebraFrame .avItemContent .optionsSlider .ui-widget-header .ui-state-default { background-color: #000; border: 3px solid rgba(0,0,0,0.4); top: -6px; -moz-background-clip: padding; -webkit-background-clip: padding; background-clip: padding-box; box-shadow: 0 0 1px 1px rgba(255,255,255,0.4); } .GeoGebraFrame .penSubMenu .optionsSlider .ui-slider .ui-slider-handle span, .GeoGebraFrame .avItemContent .optionsSlider .ui-slider .ui-slider-handle span { width: 10px; height: 10px; position: absolute; border-radius: 10px; border: 1px solid #000; } .GeoGebraFrame .mowSubMenu .mowSubMenuContent .mowOptionsSlider .gwt-Label { padding-left: 15px; display: none; } .GeoGebraFrame .mowColorPlusButton { width: 30px; height: 30px; border: 1px solid #dcdcdc !important; } .GeoGebraFrame .mowToolbar .right { position: absolute; top: 0px; right: 0px; margin: 4px 0px 4px 0px; } .GeoGebraFrame .mowToolbar .right img { opacity: 0.85; margin: 6px; padding: 6px; width: 24px; height: 24px; } .GeoGebraFrame .mowColorPlusButton img { padding: 3px; } .startscreen .mowSubMenuContent { overflow: hidden !important; } .GeoGebraFrame .mowToolbar .middle .indicator { width: 36px; height: 3px; background-color: white; vertical-align: bottom; position: relative; bottom: 10px; display: inline-table !important; top: 40px; transition: all 0.3s ease; left: 50%; opacity: 0.85; } .GeoGebraFrame .mowToolbar .middle.indicatorLeft .indicator { transform: translate(calc(50% - 66px), 0); } .toolPane{ right: 0px; bottom: 0px; position: absolute; left: 0px; top: 0px; overflow:hidden; width:380px; } .paneSplit { position: absolute; overflow-x: hidden; overflow-y: hidden !important; left: 380px; top: 0px; bottom: 0px; width: 8px; } .drawingPane { position: absolute; overflow: hidden; left: 388px; top: 0px; right: 0px; bottom: 0px; } .startscreen .undoRedoPanel{ left: 380px; } .visibleTools{ overflow: hidden; position: relative; zoom: 1; height: 100%; left: 0px; } .startscreen .GeoGebraFrame .toolbar .tools{ left: 0; } .GeoGebraFrame .TabbedKeyBoard.KeyBoard { padding-top: 0; background-color: #eee; } .GeoGebraFrame .KeyboardSwitcher { position: relative; background-color: #f8f8f8; border: #dcdcdc solid; border-width: 1px 0; width: 100%; height: 40px; margin-bottom: 5px; } .GeoGebraFrame .KeyBoard .KeyBoardButton { padding: 10px; height: 20px; text-align: center; line-height: inherit; margin: 2px; margin-top: 2px; margin-right: 2px; margin-bottom: 2px; margin-left: 2px; font-size: 120%; border-radius: 5px; white-space: nowrap; color: #000; } .GeoGebraFrame .KeyBoard.TabbedKeyBoard .KeyBoardButton { background-color: white; border-radius: 5px; border-bottom: 1px solid; border-bottom-color: #c7c7c7; padding: 9px 0; } .GeoGebraFrame .KeyPanel { margin: auto; margin-top: auto; margin-right: auto; margin-bottom: auto; margin-left: auto; } .GeoGebraFrame .TabbedKeyBoard.KeyBoard .KeyBoardButton { height: 40px; box-sizing: border-box; } .GeoGebraFrame .KeyBoard.TabbedKeyBoard .KeyBoardButton.colored { background-color: #dcdcdc; } .GeoGebraFrame .KeyBoard.TabbedKeyBoard .KeyBoardButton img { width: 24px; height: 24px; } .GeoGebraFrame td, .GeoGebraFrame th { color: #666; font-size: 16px; } .GeoGebraFrame .KeyBoard .KeyBoardButton div { text-align: center; } .startscreen .KeyBoard{ width: 100%; height: 228px; position: absolute; background-color: green; z-index: 100; bottom: 0; } @media (orientation: Portrait) { .toolPane { top: auto; height:300px; width:100%; } .paneSplit { position: absolute; overflow-x: hidden; overflow-y: hidden !important; left: 0; width: 100%; height: 8px; bottom: 300px; top: initial; } .startscreen .undoRedoPanel { left:0; } .drawingPane { left: 0; bottom: 300px; } .GeoGebraFrame .menu { bottom: 250px; top:initial; } .startscreen .GeoGebraFrame .hide-Dragger .gwt-SplitLayoutPanel-HDragger { height: 8px; top: 8px !important; top: initial; width: 100% !important; box-shadow: 0px -2px 2px rgba(0,0,0,0.4); } } .mk-spinner-wrap { position:absolute; top:50%; transform: translateY(-50%); z-index:1000; } .mk-spinner-ring { border-color: #6557D2; border-left-color: transparent; } body .startscreen .GeoGebraFrame img.gwt-Image,body .startscreen .GeoGebraFrame .button.flatButton img.gwt-Image { opacity: 0.4; } .startscreen .GeoGebraFrame .KeyBoard .gwt-Label { color: rgba(0,0,0,0.4); } </style> </head> <body dir="ltr" tabindex="-1" onload="checkLogin()"> <script>marginTop=appOnline ? 64 : 0;translation.tryApp="<!--TRY APP-->";translation.stay="<!--CONTINUE-->"; function toggleAppPicker(){ var style = document.getElementsByClassName("popdown-button-container")[0].style; var wasHidden = style.display == "none"; style.display = wasHidden ? "block" : "none"; selectAppPicker(wasHidden); } function selectAppPicker(selected){ var btn = document.getElementsByClassName("appsBtn")[0]; btn.className = selected ? btn.className + " selected" : btn.className.replace(/selected/,""); } function hideAppPicker(e){ var src = (e && e.srcElement) ? e.srcElement : e; while(src){ if(src.className && src.className.match(/appsBtn|popdown-button-container/)){ return; } src = src.parentElement; } document.getElementsByClassName("popdown-button-container")[0].style.display = "none"; selectAppPicker(false); } document.body.addEventListener("mousedown", hideAppPicker); window.addEventListener("load", function(){ if(!appOnline){ document.getElementById("headerID