Dynamic fonts (#3698)

* Piping themes into the renderer and ensuring fields update their size information when constants change.
This commit is contained in:
Sam El-Husseini
2020-02-20 17:16:01 -08:00
committed by GitHub
parent 8524da903b
commit eb40ca44ba
21 changed files with 495 additions and 224 deletions

View File

@@ -347,6 +347,18 @@ function changeTheme() {
}
}
function changeRenderingConstant(value) {
var type = document.getElementById('rendering-constant-selector').value;
if (type == 'fontSize') {
var fontStyle = {
'size': value
};
workspace.getTheme().setFontStyle(fontStyle);
}
// Refresh theme.
workspace.setTheme(workspace.getTheme());
}
function setBackgroundColour() {
// Set background colour to differentiate server vs local copy.
if (location.protocol == 'file:') {
@@ -563,6 +575,10 @@ var spaghettiXml = [
.blockRenderDebug {
display: none;
}
.zelos-renderer .blocklyFlyoutButton .blocklyText {
font-size: 1.5rem;
}
</style>
</head>
<body onload="start()">
@@ -631,6 +647,15 @@ var spaghettiXml = [
<input type="button" value="Airstrike!" onclick="airstrike(100)">
<input type="button" value="Spaghetti!" onclick="spaghetti(8)">
</p>
<p>
Rendering: &nbsp;
<select id="rendering-constant-selector">
<option value="fontSize">Font Size</option>
</select>
<input type="range" min="3" max="50" value="4"
oninput="changeRenderingConstant(this.value)"
onchange="changeRenderingConstant(this.value)" />
</p>
<ul class="playgroundToggleOptions">
<li>
<label for="logCheck">Log events:</label>