diff --git a/demo/simple.css b/demo/simple.css index ac23eeed..16820530 100644 --- a/demo/simple.css +++ b/demo/simple.css @@ -1,5 +1,5 @@ body { - background-color: #eae6d1; + background-color: #333; font-family: sans-serif; } canvas { @@ -16,25 +16,6 @@ canvas.pixelated { image-rendering: pixelated; -ms-interpolation-mode: nearest-neighbor; } -label { - padding-right: 3em; -} -div#sqHeader { - position: fixed; - top: 0; - left: 0; - right: 0; - padding: 10px; - border-bottom: 6px double gray; -} -div#sqFooter { - position: fixed; - left: 0; - right: 0; - bottom: 0; - padding: 10px; - border-top: 6px double gray; -} div#sqSpinner { position: fixed; margin: auto; top: 0; left: 0; bottom: 0; right: 0; diff --git a/demo/simple.html b/demo/simple.html index 56b8f76c..e4b23066 100644 --- a/demo/simple.html +++ b/demo/simple.html @@ -30,7 +30,6 @@ - @@ -41,25 +40,6 @@ -
-

SqueakJS

- - -
- -
-
-
-

SqueakJS is a Virtual Machine - for the Squeak dialect of Smalltalk, written in pure JavaScript by Vanessa Freudenberg. - Above is a stripped-down version of Squeak 2.2, which was released in 1998. - Modern Squeak versions are much more advanced, but more demanding, too. You can try - them on the SqueakJS launcher page. - Also, you may want to try the Lively SqueakJS Debugger. -

-
diff --git a/demo/simple.js b/demo/simple.js index 12f0354a..d5247cf4 100644 --- a/demo/simple.js +++ b/demo/simple.js @@ -21,25 +21,14 @@ */ -var fullscreen = navigator.standalone || - window.matchMedia('(max-device-width: 800px) and (max-device-height: 800px)').matches; - window.onload = function() { SqueakJS.runSqueak('squeakjs.image', sqCanvas, { appName: "SqueakJS", files: ['squeakjs.image', 'squeakjs.changes'], - fullscreen: fullscreen, - swapButtons: true, - header: sqHeader, - footer: sqFooter, spinner: sqSpinner, - swapCheckbox: sqSwapButtons, - fullscreenCheckbox: sqFullscreen, }); }; -if (addToHomescreen.isStandalone) - fullscreen = true; -else addToHomescreen({ +if (!addToHomescreen.isStandalone) addToHomescreen({ appID: 'squeakjs.demo.add2home', }); diff --git a/etoys/etoys.css b/etoys/etoys.css index 0699b940..16820530 100644 --- a/etoys/etoys.css +++ b/etoys/etoys.css @@ -1,5 +1,5 @@ body { - background-color: #eae6d1; + background-color: #333; font-family: sans-serif; } canvas { @@ -16,22 +16,6 @@ canvas.pixelated { image-rendering: pixelated; -ms-interpolation-mode: nearest-neighbor; } -div#sqHeader { - position: fixed; - top: 0; - left: 0; - right: 0; - padding: 10px; - border-bottom: 6px double gray; -} -div#sqFooter { - position: fixed; - left: 0; - right: 0; - bottom: 0; - padding: 10px; - border-top: 6px double gray; -} div#sqSpinner { position: fixed; margin: auto; top: 0; left: 0; bottom: 0; right: 0; diff --git a/etoys/etoys.js b/etoys/etoys.js index e741b277..139bf938 100644 --- a/etoys/etoys.js +++ b/etoys/etoys.js @@ -20,8 +20,6 @@ * THE SOFTWARE. */ -var fullscreen = navigator.standalone || - window.matchMedia('(max-device-width: 800px) and (max-device-height: 800px)').matches; window.onload = function() { var url = "https://freudenbergs.de/vanessa/squeakjs/etoys.image"; @@ -29,18 +27,17 @@ window.onload = function() { appName: "Etoys", fixedWidth: 1200, fixedHeight: 900, - fullscreen: fullscreen, - header: sqHeader, - footer: sqFooter, spinner: sqSpinner, files: ["Etoys/EtoysV5.stc"], root: "/Etoys", templates: { "/Etoys": "Etoys" }, + onStart: function(vm, display, options) { + // debugger + // vm.breakOn("Latin1Environment class>>systemConverterClass"); + }, }); }; -if (addToHomescreen.isStandalone) - fullscreen = true; -else addToHomescreen({ +if (!addToHomescreen.isStandalone) addToHomescreen({ appID: 'squeakjs.etoys.add2home', }); diff --git a/etoys/index.html b/etoys/index.html index 88bd3bb3..bbea06ff 100644 --- a/etoys/index.html +++ b/etoys/index.html @@ -40,21 +40,6 @@ -
-

SqueakJS/Etoys

-
- -
-
-
-

This is SqueakJS - running Etoys without the usual browser plugin. - You can also run it in the Lively SqueakJS debugger. - Feedback and contributions welcome! — Vanessa Freudenberg -

-
diff --git a/run/index.html b/run/index.html index a8f7ba31..a9b1a312 100644 --- a/run/index.html +++ b/run/index.html @@ -12,7 +12,6 @@ sqText.style.display = "none"; sqCanvas.style.display = "block"; SqueakJS.runSqueak(imageName, sqCanvas,{ - fullscreen: true, spinner: sqSpinner, appName: imageName && imageName.replace(/.*\//, "").replace(/\.image$/, ""), onStart: function(vm, display, options) { @@ -242,8 +241,8 @@

Run SqueakJS apps

The apps are configured to use template files (e.g. example projects and artwork) that are loaded from a server on demand. diff --git a/scratch/index.html b/scratch/index.html index fb77c1df..b17ddc46 100644 --- a/scratch/index.html +++ b/scratch/index.html @@ -30,7 +30,6 @@ - @@ -40,19 +39,6 @@ -
-

Scratch on SqueakJS

- -
- -
-
-
-

This is SqueakJS running a Scratch image. - Feedback and contributions welcome! — Vanessa Freudenberg

-
diff --git a/scratch/scratch.css b/scratch/scratch.css index 0699b940..16820530 100644 --- a/scratch/scratch.css +++ b/scratch/scratch.css @@ -1,5 +1,5 @@ body { - background-color: #eae6d1; + background-color: #333; font-family: sans-serif; } canvas { @@ -16,22 +16,6 @@ canvas.pixelated { image-rendering: pixelated; -ms-interpolation-mode: nearest-neighbor; } -div#sqHeader { - position: fixed; - top: 0; - left: 0; - right: 0; - padding: 10px; - border-bottom: 6px double gray; -} -div#sqFooter { - position: fixed; - left: 0; - right: 0; - bottom: 0; - padding: 10px; - border-top: 6px double gray; -} div#sqSpinner { position: fixed; margin: auto; top: 0; left: 0; bottom: 0; right: 0; diff --git a/scratch/scratch.js b/scratch/scratch.js index f5cd60f4..92502d71 100644 --- a/scratch/scratch.js +++ b/scratch/scratch.js @@ -27,18 +27,12 @@ window.onload = function() { var url = "https://freudenbergs.de/vanessa/squeakjs/scratch/Scratch.image"; SqueakJS.runSqueak(url, sqCanvas, { appName: "Scratch", - fullscreen: fullscreen, - header: sqHeader, - footer: sqFooter, spinner: sqSpinner, - fullscreenCheckbox: sqFullscreen, root: "/Scratch", templates: ["Projects", "Media", "Help", "locale"], }); }; -if (addToHomescreen.isStandalone) - fullscreen = true; -else addToHomescreen({ +if (addToHomescreen.isStandalone) addToHomescreen({ appID: 'squeakjs.scratch.add2home', }); diff --git a/squeak.js b/squeak.js index 6caadb23..9c07edfa 100644 --- a/squeak.js +++ b/squeak.js @@ -127,9 +127,6 @@ function setupFullscreen(display, canvas, options) { display.fullscreen = fullscreen; var fullwindow = fullscreen || options.fullscreen; box.style.background = fullwindow ? 'black' : ''; - if (options.header) options.header.style.display = fullwindow ? 'none' : ''; - if (options.footer) options.footer.style.display = fullwindow ? 'none' : ''; - if (options.fullscreenCheckbox) options.fullscreenCheckbox.checked = fullscreen; setTimeout(onresize, 0); } @@ -146,35 +143,16 @@ function setupFullscreen(display, canvas, options) { } else { var isFullscreen = false; checkFullscreen = function() { - if ((options.header || options.footer) && isFullscreen != display.fullscreen) { + if (isFullscreen != display.fullscreen) { isFullscreen = display.fullscreen; fullscreenChange(isFullscreen); } }; } - if (options.fullscreenCheckbox) options.fullscreenCheckbox.onclick = function() { - display.fullscreen = options.fullscreenCheckbox.checked; - checkFullscreen(); - }; - return checkFullscreen; } -function setupSwapButtons(options) { - if (options.swapCheckbox) { - var imageName = Squeak.Settings["squeakImageName"] || "default", - settings = JSON.parse(Squeak.Settings["squeakSettings:" + imageName] || "{}"); - if ("swapButtons" in settings) options.swapButtons = settings.swapButtons; - options.swapCheckbox.checked = options.swapButtons; - options.swapCheckbox.onclick = function() { - options.swapButtons = options.swapCheckbox.checked; - settings["swapButtons"] = options.swapButtons; - Squeak.Settings["squeakSettings:" + imageName] = JSON.stringify(settings); - }; - } -} - function recordModifiers(evt, display) { var shiftPressed = evt.shiftKey, ctrlPressed = evt.ctrlKey && !evt.altKey, @@ -358,8 +336,6 @@ function createSqueakDisplay(canvas, options) { document.body.style.margin = 0; document.body.style.backgroundColor = 'black'; document.ontouchmove = function(evt) { evt.preventDefault(); }; - if (options.header) options.header.style.display = 'none'; - if (options.footer) options.footer.style.display = 'none'; } var display = { context: canvas.getContext("2d"), @@ -383,7 +359,6 @@ function createSqueakDisplay(canvas, options) { changedCallback: null, // invoked when display size/scale changes // additional functions added below }; - setupSwapButtons(options); if (options.pixelated) { canvas.classList.add("pixelated"); display.cursorCanvas && display.cursorCanvas.classList.add("pixelated"); @@ -964,18 +939,11 @@ function createSqueakDisplay(canvas, options) { else onresize(); }, 300); - // if no fancy layout, don't bother - if ((!options.header || !options.footer) && !options.fullscreen) { - display.width = canvas.width; - display.height = canvas.height; - return; - } // CSS won't let us do what we want so we will layout the canvas ourselves. - var fullscreen = options.fullscreen || display.fullscreen, - x = 0, - y = fullscreen ? 0 : options.header.offsetTop + options.header.offsetHeight, + var x = 0, + y = 0, w = window.innerWidth, - h = fullscreen ? window.innerHeight : Math.max(100, options.footer.offsetTop - y), + h = window.innerHeight, paddingX = 0, // padding outside canvas paddingY = 0; // above are the default values for laying out the canvas @@ -1077,7 +1045,6 @@ SqueakJS.runImage = function(buffer, name, display, options) { var vm = new Squeak.Interpreter(image, display, options); SqueakJS.vm = vm; Squeak.Settings["squeakImageName"] = name; - setupSwapButtons(options); display.clear(); display.showBanner("Starting " + SqueakJS.appName); var spinner = setupSpinner(vm, options); diff --git a/standalone/nw.html b/standalone/nw.html index 620af35f..ccce5459 100644 --- a/standalone/nw.html +++ b/standalone/nw.html @@ -17,12 +17,11 @@ oldRunImg(buffer, name, display, options); }.bind(SqueakJS); SqueakJS.runSqueak(imageName, sqCanvas, { - fullscreen: true, spinner: sqSpinner, appName: imageName && imageName.replace(/\.image$/, ""), }); } - + window.onload = function() { var p = require("path"); var imageArg = nw.App.argv.find((a) => { return a.endsWith(".image") });