Skip to content

Commit c7154a5

Browse files
codefraucodefrau
committed
Remove header/footer layouts
1 parent 698cf3f commit c7154a5

12 files changed

+17
-172
lines changed

‎demo/simple.css

+1-20
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
body {
2-
background-color: #eae6d1;
2+
background-color: #333;
33
font-family: sans-serif;
44
}
55
canvas {
@@ -16,25 +16,6 @@ canvas.pixelated {
1616
image-rendering: pixelated;
1717
-ms-interpolation-mode: nearest-neighbor;
1818
}
19-
label {
20-
padding-right: 3em;
21-
}
22-
div#sqHeader {
23-
position: fixed;
24-
top: 0;
25-
left: 0;
26-
right: 0;
27-
padding: 10px;
28-
border-bottom: 6px double gray;
29-
}
30-
div#sqFooter {
31-
position: fixed;
32-
left: 0;
33-
right: 0;
34-
bottom: 0;
35-
padding: 10px;
36-
border-top: 6px double gray;
37-
}
3819
div#sqSpinner {
3920
position: fixed;
4021
margin: auto; top: 0; left: 0; bottom: 0; right: 0;

‎demo/simple.html

-20
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,6 @@
3030
<meta name="apple-mobile-web-app-capable" content="yes">
3131
<meta name="msapplication-TileImage" content="icon.png">
3232

33-
<link rel="stylesheet" href="../lib/gh-fork-ribbon.css">
3433
<link rel="stylesheet" href="../lib/addtohomescreen.css">
3534
<script src="../lib/addtohomescreen.js"></script>
3635

@@ -41,25 +40,6 @@
4140

4241
</head>
4342
<body>
44-
<div id="sqHeader">
45-
<h1>SqueakJS</h1>
46-
<label title="Swap middle and right mouse buttons"><input id="sqSwapButtons" type="checkbox">swap buttons</label>
47-
<label title="Make Squeak as large as possible"><input id="sqFullscreen" type="checkbox">full screen</label>
48-
<div class="github-fork-ribbon-wrapper right">
49-
<div class="github-fork-ribbon">
50-
<a href="https://github.com/codefrau/SqueakJS" target="_blank">Fork me on GitHub</a>
51-
</div>
52-
</div>
53-
</div>
54-
<div id="sqFooter">
55-
<p><a href="../" target="_blank">SqueakJS</a> is a Virtual Machine
56-
for the Squeak dialect of Smalltalk, written in pure JavaScript by Vanessa Freudenberg.
57-
Above is a stripped-down version of Squeak 2.2, which was released in 1998.
58-
Modern Squeak versions are much more advanced, but more demanding, too. You can try
59-
them on the SqueakJS <a href="../run">launcher page</a>.
60-
Also, you may want to try the <a href= "https://smalltalkzoo.thechm.org/HOPL-Squeak.html?mini">Lively SqueakJS Debugger</a>.
61-
</p>
62-
</div>
6343
<canvas id="sqCanvas"></canvas>
6444
<div id="sqSpinner"><div></div></div>
6545
</body>

‎demo/simple.js

+1-12
Original file line numberDiff line numberDiff line change
@@ -21,25 +21,14 @@
2121
*/
2222

2323

24-
var fullscreen = navigator.standalone ||
25-
window.matchMedia('(max-device-width: 800px) and (max-device-height: 800px)').matches;
26-
2724
window.onload = function() {
2825
SqueakJS.runSqueak('squeakjs.image', sqCanvas, {
2926
appName: "SqueakJS",
3027
files: ['squeakjs.image', 'squeakjs.changes'],
31-
fullscreen: fullscreen,
32-
swapButtons: true,
33-
header: sqHeader,
34-
footer: sqFooter,
3528
spinner: sqSpinner,
36-
swapCheckbox: sqSwapButtons,
37-
fullscreenCheckbox: sqFullscreen,
3829
});
3930
};
4031

41-
if (addToHomescreen.isStandalone)
42-
fullscreen = true;
43-
else addToHomescreen({
32+
if (!addToHomescreen.isStandalone) addToHomescreen({
4433
appID: 'squeakjs.demo.add2home',
4534
});

‎etoys/etoys.css

+1-17
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
body {
2-
background-color: #eae6d1;
2+
background-color: #333;
33
font-family: sans-serif;
44
}
55
canvas {
@@ -16,22 +16,6 @@ canvas.pixelated {
1616
image-rendering: pixelated;
1717
-ms-interpolation-mode: nearest-neighbor;
1818
}
19-
div#sqHeader {
20-
position: fixed;
21-
top: 0;
22-
left: 0;
23-
right: 0;
24-
padding: 10px;
25-
border-bottom: 6px double gray;
26-
}
27-
div#sqFooter {
28-
position: fixed;
29-
left: 0;
30-
right: 0;
31-
bottom: 0;
32-
padding: 10px;
33-
border-top: 6px double gray;
34-
}
3519
div#sqSpinner {
3620
position: fixed;
3721
margin: auto; top: 0; left: 0; bottom: 0; right: 0;

‎etoys/etoys.js

+5-8
Original file line numberDiff line numberDiff line change
@@ -20,27 +20,24 @@
2020
* THE SOFTWARE.
2121
*/
2222

23-
var fullscreen = navigator.standalone ||
24-
window.matchMedia('(max-device-width: 800px) and (max-device-height: 800px)').matches;
2523

2624
window.onload = function() {
2725
var url = "https://freudenbergs.de/vanessa/squeakjs/etoys.image";
2826
SqueakJS.runSqueak(url, sqCanvas, {
2927
appName: "Etoys",
3028
fixedWidth: 1200,
3129
fixedHeight: 900,
32-
fullscreen: fullscreen,
33-
header: sqHeader,
34-
footer: sqFooter,
3530
spinner: sqSpinner,
3631
files: ["Etoys/EtoysV5.stc"],
3732
root: "/Etoys",
3833
templates: { "/Etoys": "Etoys" },
34+
onStart: function(vm, display, options) {
35+
// debugger
36+
// vm.breakOn("Latin1Environment class>>systemConverterClass");
37+
},
3938
});
4039
};
4140

42-
if (addToHomescreen.isStandalone)
43-
fullscreen = true;
44-
else addToHomescreen({
41+
if (!addToHomescreen.isStandalone) addToHomescreen({
4542
appID: 'squeakjs.etoys.add2home',
4643
});

‎etoys/index.html

-15
Original file line numberDiff line numberDiff line change
@@ -40,21 +40,6 @@
4040

4141
</head>
4242
<body>
43-
<div id="sqHeader">
44-
<h1>SqueakJS/Etoys</h1>
45-
<div class="github-fork-ribbon-wrapper right">
46-
<div class="github-fork-ribbon">
47-
<a href="https://github.com/codefrau/SqueakJS" target="_blank">Fork me on GitHub</a>
48-
</div>
49-
</div>
50-
</div>
51-
<div id="sqFooter">
52-
<p>This is <a href="../" target="_blank">SqueakJS</a>
53-
running <a href="http://squeakland.org/" target="_blank">Etoys</a> without the usual browser plugin.
54-
You can also run it in the <a href= "https://smalltalkzoo.thechm.org/HOPL-Squeak.html?etoys">Lively SqueakJS</a> debugger.
55-
Feedback and contributions welcome! — Vanessa Freudenberg
56-
</p>
57-
</div>
5843
<canvas id="sqCanvas" width="1200" height="900"></canvas>
5944
<div id="sqSpinner"><div></div></div>
6045
</body>

‎run/index.html

+2-3
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,6 @@
1212
sqText.style.display = "none";
1313
sqCanvas.style.display = "block";
1414
SqueakJS.runSqueak(imageName, sqCanvas,{
15-
fullscreen: true,
1615
spinner: sqSpinner,
1716
appName: imageName && imageName.replace(/.*\//, "").replace(/\.image$/, ""),
1817
onStart: function(vm, display, options) {
@@ -242,8 +241,8 @@ <h2>Run SqueakJS apps</h2>
242241
The apps are configured to use template files (e.g. example projects and artwork)
243242
that are loaded from a server on demand.
244243
<ul>
245-
<li><a href="../etoys/#fullscreen=true" target="_blank">Etoys</a></li>
246-
<li><a href="../scratch/#fullscreen=true" target="_blank">Scratch</a></li>
244+
<li><a href="../etoys/" target="_blank">Etoys</a></li>
245+
<li><a href="../scratch/" target="_blank">Scratch</a></li>
247246
<li>demo of the <a href="../demo/simple.html#document=JSBridge.st" target="_blank">JavaScript bridge</a> (not really an app)</li>
248247
<li><a href="https://codefrau.github.io/jasmine/" target="_blank">Croquet Jasmine</a> (2004)</li>
249248
</ul>

‎scratch/index.html

-14
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,6 @@
3030
<meta name="apple-mobile-web-app-capable" content="yes">
3131
<meta name="msapplication-TileImage" content="scratch.png">
3232

33-
<link rel="stylesheet" href="../lib/gh-fork-ribbon.css">
3433
<link rel="stylesheet" href="../lib/addtohomescreen.css">
3534
<script src="../lib/addtohomescreen.js"></script>
3635

@@ -40,19 +39,6 @@
4039

4140
</head>
4241
<body>
43-
<div id="sqHeader">
44-
<h1>Scratch on SqueakJS</h1>
45-
<label title="Make Scratch as large as possible"><input id="sqFullscreen" type="checkbox">full screen</label>
46-
<div class="github-fork-ribbon-wrapper right">
47-
<div class="github-fork-ribbon">
48-
<a href="https://github.com/codefrau/SqueakJS" target="_blank">Fork me on GitHub</a>
49-
</div>
50-
</div>
51-
</div>
52-
<div id="sqFooter">
53-
<p>This is <a href="../" target="_blank">SqueakJS</a> running a Scratch image.
54-
Feedback and contributions welcome! — Vanessa Freudenberg</p>
55-
</div>
5642
<canvas id="sqCanvas"></canvas>
5743
<div id="sqSpinner"><div></div></div>
5844
</body>

‎scratch/scratch.css

+1-17
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
body {
2-
background-color: #eae6d1;
2+
background-color: #333;
33
font-family: sans-serif;
44
}
55
canvas {
@@ -16,22 +16,6 @@ canvas.pixelated {
1616
image-rendering: pixelated;
1717
-ms-interpolation-mode: nearest-neighbor;
1818
}
19-
div#sqHeader {
20-
position: fixed;
21-
top: 0;
22-
left: 0;
23-
right: 0;
24-
padding: 10px;
25-
border-bottom: 6px double gray;
26-
}
27-
div#sqFooter {
28-
position: fixed;
29-
left: 0;
30-
right: 0;
31-
bottom: 0;
32-
padding: 10px;
33-
border-top: 6px double gray;
34-
}
3519
div#sqSpinner {
3620
position: fixed;
3721
margin: auto; top: 0; left: 0; bottom: 0; right: 0;

‎scratch/scratch.js

+1-7
Original file line numberDiff line numberDiff line change
@@ -27,18 +27,12 @@ window.onload = function() {
2727
var url = "https://freudenbergs.de/vanessa/squeakjs/scratch/Scratch.image";
2828
SqueakJS.runSqueak(url, sqCanvas, {
2929
appName: "Scratch",
30-
fullscreen: fullscreen,
31-
header: sqHeader,
32-
footer: sqFooter,
3330
spinner: sqSpinner,
34-
fullscreenCheckbox: sqFullscreen,
3531
root: "/Scratch",
3632
templates: ["Projects", "Media", "Help", "locale"],
3733
});
3834
};
3935

40-
if (addToHomescreen.isStandalone)
41-
fullscreen = true;
42-
else addToHomescreen({
36+
if (addToHomescreen.isStandalone) addToHomescreen({
4337
appID: 'squeakjs.scratch.add2home',
4438
});

‎squeak.js

+4-37
Original file line numberDiff line numberDiff line change
@@ -127,9 +127,6 @@ function setupFullscreen(display, canvas, options) {
127127
display.fullscreen = fullscreen;
128128
var fullwindow = fullscreen || options.fullscreen;
129129
box.style.background = fullwindow ? 'black' : '';
130-
if (options.header) options.header.style.display = fullwindow ? 'none' : '';
131-
if (options.footer) options.footer.style.display = fullwindow ? 'none' : '';
132-
if (options.fullscreenCheckbox) options.fullscreenCheckbox.checked = fullscreen;
133130
setTimeout(onresize, 0);
134131
}
135132

@@ -146,35 +143,16 @@ function setupFullscreen(display, canvas, options) {
146143
} else {
147144
var isFullscreen = false;
148145
checkFullscreen = function() {
149-
if ((options.header || options.footer) && isFullscreen != display.fullscreen) {
146+
if (isFullscreen != display.fullscreen) {
150147
isFullscreen = display.fullscreen;
151148
fullscreenChange(isFullscreen);
152149
}
153150
};
154151
}
155152

156-
if (options.fullscreenCheckbox) options.fullscreenCheckbox.onclick = function() {
157-
display.fullscreen = options.fullscreenCheckbox.checked;
158-
checkFullscreen();
159-
};
160-
161153
return checkFullscreen;
162154
}
163155

164-
function setupSwapButtons(options) {
165-
if (options.swapCheckbox) {
166-
var imageName = Squeak.Settings["squeakImageName"] || "default",
167-
settings = JSON.parse(Squeak.Settings["squeakSettings:" + imageName] || "{}");
168-
if ("swapButtons" in settings) options.swapButtons = settings.swapButtons;
169-
options.swapCheckbox.checked = options.swapButtons;
170-
options.swapCheckbox.onclick = function() {
171-
options.swapButtons = options.swapCheckbox.checked;
172-
settings["swapButtons"] = options.swapButtons;
173-
Squeak.Settings["squeakSettings:" + imageName] = JSON.stringify(settings);
174-
};
175-
}
176-
}
177-
178156
function recordModifiers(evt, display) {
179157
var shiftPressed = evt.shiftKey,
180158
ctrlPressed = evt.ctrlKey && !evt.altKey,
@@ -358,8 +336,6 @@ function createSqueakDisplay(canvas, options) {
358336
document.body.style.margin = 0;
359337
document.body.style.backgroundColor = 'black';
360338
document.ontouchmove = function(evt) { evt.preventDefault(); };
361-
if (options.header) options.header.style.display = 'none';
362-
if (options.footer) options.footer.style.display = 'none';
363339
}
364340
var display = {
365341
context: canvas.getContext("2d"),
@@ -383,7 +359,6 @@ function createSqueakDisplay(canvas, options) {
383359
changedCallback: null, // invoked when display size/scale changes
384360
// additional functions added below
385361
};
386-
setupSwapButtons(options);
387362
if (options.pixelated) {
388363
canvas.classList.add("pixelated");
389364
display.cursorCanvas && display.cursorCanvas.classList.add("pixelated");
@@ -964,18 +939,11 @@ function createSqueakDisplay(canvas, options) {
964939
else
965940
onresize();
966941
}, 300);
967-
// if no fancy layout, don't bother
968-
if ((!options.header || !options.footer) && !options.fullscreen) {
969-
display.width = canvas.width;
970-
display.height = canvas.height;
971-
return;
972-
}
973942
// CSS won't let us do what we want so we will layout the canvas ourselves.
974-
var fullscreen = options.fullscreen || display.fullscreen,
975-
x = 0,
976-
y = fullscreen ? 0 : options.header.offsetTop + options.header.offsetHeight,
943+
var x = 0,
944+
y = 0,
977945
w = window.innerWidth,
978-
h = fullscreen ? window.innerHeight : Math.max(100, options.footer.offsetTop - y),
946+
h = window.innerHeight,
979947
paddingX = 0, // padding outside canvas
980948
paddingY = 0;
981949
// above are the default values for laying out the canvas
@@ -1077,7 +1045,6 @@ SqueakJS.runImage = function(buffer, name, display, options) {
10771045
var vm = new Squeak.Interpreter(image, display, options);
10781046
SqueakJS.vm = vm;
10791047
Squeak.Settings["squeakImageName"] = name;
1080-
setupSwapButtons(options);
10811048
display.clear();
10821049
display.showBanner("Starting " + SqueakJS.appName);
10831050
var spinner = setupSpinner(vm, options);

‎standalone/nw.html

+1-2
Original file line numberDiff line numberDiff line change
@@ -17,12 +17,11 @@
1717
oldRunImg(buffer, name, display, options);
1818
}.bind(SqueakJS);
1919
SqueakJS.runSqueak(imageName, sqCanvas, {
20-
fullscreen: true,
2120
spinner: sqSpinner,
2221
appName: imageName && imageName.replace(/\.image$/, ""),
2322
});
2423
}
25-
24+
2625
window.onload = function() {
2726
var p = require("path");
2827
var imageArg = nw.App.argv.find((a) => { return a.endsWith(".image") });

0 commit comments

Comments
 (0)