scratchfoundation/scratch-vm
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-vm.git synced 2025-08-28 22:30:40 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Merge remote-tracking branch 'refs/remotes/LLK/develop' into feature/fencing

Browse source
This commit is contained in:
griffpatch 2017-02-11 14:30:59 +00:00
commit 9aa81d6776
16 changed files with 370 additions and 57 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/blocks/scratch3_control.js
View file

@ -110,7 +110,7 @@ Scratch3ControlBlocks.prototype.stop = function (args, util) {
option === 'other scripts in stage') {
util.stopOtherTargetThreads();
} else if (option === 'this script') {
util.stopThread();
util.stopThisScript();
}
};

3
src/blocks/scratch3_pen.js
View file

@ -147,6 +147,7 @@ Scratch3PenBlocks.prototype._updatePenColor = function (penState) {
penState.penAttributes.color4f[0] = rgb.r / 255.0;
penState.penAttributes.color4f[1] = rgb.g / 255.0;
penState.penAttributes.color4f[2] = rgb.b / 255.0;
penState.penAttributes.color4f[3] = 1;
};
/**
@ -260,6 +261,8 @@ Scratch3PenBlocks.prototype.setPenColorToColor = function (args, util) {
penState.penAttributes.color4f[2] = rgb.b / 255.0;
if (rgb.hasOwnProperty('a')) { // Will there always be an 'a'?
penState.penAttributes.color4f[3] = rgb.a / 255.0;
} else {
penState.penAttributes.color4f[3] = 1;
}
};

3
src/blocks/scratch3_sound.js
View file

@ -135,8 +135,9 @@ Scratch3SoundBlocks.prototype.playNoteForBeats = function (args, util) {
var beats = Cast.toNumber(args.BEATS);
var soundState = this._getSoundState(util.target);
var inst = soundState.currentInstrument;
var vol = soundState.volume;
if (typeof this.runtime.audioEngine === 'undefined') return;
return this.runtime.audioEngine.playNoteForBeatsWithInst(note, beats, inst);
return this.runtime.audioEngine.playNoteForBeatsWithInstAndVol(note, beats, inst, vol);
};
Scratch3SoundBlocks.prototype.playDrumForBeats = function (args, util) {

4
src/engine/execute.js
View file

@ -183,8 +183,8 @@ var execute = function (sequencer, thread) {
stopOtherTargetThreads: function () {
runtime.stopForTarget(target, thread);
},
stopThread: function () {
sequencer.retireThread(thread);
stopThisScript: function () {
thread.stopThisScript();
},
startProcedure: function (procedureCode) {
sequencer.stepToProcedure(thread, procedureCode);

21
src/engine/thread.js
View file

@ -140,6 +140,27 @@ Thread.prototype.popStack = function () {
return this.stack.pop();
};
/**
* Pop back down the stack frame until we hit a procedure call or the stack frame is emptied
*/
Thread.prototype.stopThisScript = function () {
var blockID = this.peekStack();
while (blockID !== null) {
var block = this.target.blocks.getBlock(blockID);
if (typeof block !== 'undefined' && block.opcode === 'procedures_callnoreturn') {
break;
}
this.popStack();
blockID = this.peekStack();
}
if (this.stack.length === 0) {
// Clean up!
this.requestScriptGlowInFrame = false;
this.status = Thread.STATUS_DONE;
}
};
/**
* Get top stack item.
* @return {?string} Block ID on top of stack.

2
src/io/keyboard.js
View file

@ -56,7 +56,7 @@ Keyboard.prototype._keyCodeToScratchKey = function (keyCode) {
case 39: return 'right arrow';
case 40: return 'down arrow';
}
return null;
return '';
};
/**

88
src/playground/index.html Normal file
View file

@ -0,0 +1,88 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Scratch VM Playground</title>
<link rel="stylesheet" href="playground.css">
<link rel="stylesheet" href="zenburn.css">
</head>
<body>
<div id="vm-devtools">
<h2>Scratch VM Playground</h2>
<select id="selectedTarget" multiple></select>
<div id="projectButtons">
<button id="greenflag">Green flag</button>
<button id="stopall">Stop</button>
</div>
<div>
Turbo: <input id='turbomode' type='checkbox' />
</div>
<div>
Compatibility (30 TPS): <input id='compatmode' type='checkbox' />
</div>
<br />
<ul id="playgroundLinks">
<li><a id="renderexplorer-link" href="#">Renderer</a></li>
<li><a id="threadexplorer-link" href="#">Threads</a></li>
<li><a id="blockexplorer-link" href="#">Block Representation</a></li>
<li><a id="importexport-link" href="#">Import/Export</a></li>
</ul><br />
<div id="tab-renderexplorer">
Renderer<br />
<canvas id="scratch-stage" style="width: 480px; height: 360px;"></canvas><br />
x: <input id='sinfo-x' />
y: <input id='sinfo-y' /><br />
dir: <input id='sinfo-direction' />
rotation style: <input id='sinfo-rotationstyle' /><br />
visible: <input id='sinfo-visible' />
<button id='sinfo-post'>Post</button>
</div>
<div id="tab-threadexplorer">
Thread explorer
<pre id="threadexplorer"></pre>
</div>
<div id="tab-blockexplorer">
Block explorer
<pre id="blockexplorer"></pre>
</div>
<div id="tab-importexport">
Import/Export<br />
Project ID: <input id="projectId" value="119615668" />
<button id="projectLoadButton">Load</button>
<button id="createEmptyProject">New Project</button><br />
<p>
<input type="button" value="Export to XML" onclick="toXml()">
&nbsp;
<input type="button" value="Import from XML" onclick="fromXml()" id="import">
<br /><br />
<textarea id="importExport"></textarea>
</p>
</div>
</div>
<div id="blocks"></div>
<!-- FPS counter, Syntax highlighter, Blocks, Renderer -->
<script src="./vendor.js"></script>
<!-- VM Worker -->
<script src="./scratch-vm.js"></script>
<!-- Playground -->
<script src="./playground.js"></script>
<script>
function toXml() {
var output = document.getElementById('importExport');
var xml = Blockly.Xml.workspaceToDom(workspace);
output.value = Blockly.Xml.domToPrettyText(xml);
output.focus();
output.select();
}
function fromXml() {
var input = document.getElementById('importExport');
var xml = Blockly.Xml.textToDom(input.value);
Blockly.Xml.domToWorkspace(workspace, xml);
}
</script>
</body>
</html>

73
src/playground/playground.css Normal file
View file

@ -0,0 +1,73 @@
body {
background: rgb(36,36,36);
}
a {
color: rgb(217,217,217);
}
h2 {
font-size: 1em;
}
#blocks {
position: absolute;
left: 40%;
right: 0;
top: 0;
bottom: 0;
font-family: "Helvetica Neue", Helvetica, sans-serif;
}
#vm-devtools {
color: rgb(217,217,217);
position: absolute;
left: 1%;
right: 60%;
top: 1%;
bottom: 0;
width: 35%;
}
#blockexplorer, #threadexplorer, #importexport {
position: absolute;
height: 75%;
overflow: scroll;
border: 1px solid #fff;
background: rgb(36,36,36);
color: rgb(217,217,217);
font-family: monospace;
font-size: 10pt;
width: 480px;
height: 360px;
}
#tab-blockexplorer, #tab-threadexplorer, #tab-importexport {
display: none;
}
#importExport {
width: 480px;
height: 360px;
background: rgb(36,36,36);
color: rgb(217,217,217);
}
#projectId {
background: rgb(36,36,36);
color: rgb(217,217,217);
font-family: monospace;
font-size: 10pt;
}
ul#playgroundLinks {
display: block;
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
}
#playgroundLinks li {
float: left;
}
#playgroundLinks li a {
display: block;
color: white;
text-align: center;
padding: 5px 10px;
}
#playgroundLinks li a:hover {
background-color: #111;
}

303
src/playground/playground.js Normal file
View file

@ -0,0 +1,303 @@
var loadProject = function () {
var id = location.hash.substring(1);
if (id.length < 1 || !isFinite(id)) {
id = '119615668';
}
var url = 'https://projects.scratch.mit.edu/internalapi/project/' +
id + '/get/';
var r = new XMLHttpRequest();
r.onreadystatechange = function () {
if (this.readyState === 4) {
if (r.status === 200) {
window.vm.loadProject(this.responseText);
}
}
};
r.open('GET', url);
r.send();
};
window.onload = function () {
// Lots of global variables to make debugging easier
// Instantiate the VM.
var vm = new window.VirtualMachine();
window.vm = vm;
// Loading projects from the server.
document.getElementById('projectLoadButton').onclick = function () {
document.location = '#' + document.getElementById('projectId').value;
location.reload();
};
loadProject();
// Instantiate the renderer and connect it to the VM.
var canvas = document.getElementById('scratch-stage');
var renderer = new window.RenderWebGL(canvas);
window.renderer = renderer;
vm.attachRenderer(renderer);
var audioEngine = new window.AudioEngine();
vm.attachAudioEngine(audioEngine);
// Instantiate scratch-blocks and attach it to the DOM.
var workspace = window.Blockly.inject('blocks', {
media: './media/',
zoom: {
controls: true,
wheel: true,
startScale: 0.75
},
colours: {
workspace: '#334771',
flyout: '#283856',
scrollbar: '#24324D',
scrollbarHover: '#0C111A',
insertionMarker: '#FFFFFF',
insertionMarkerOpacity: 0.3,
fieldShadow: 'rgba(255, 255, 255, 0.3)',
dragShadowOpacity: 0.6
}
});
window.workspace = workspace;
// Attach scratch-blocks events to VM.
workspace.addChangeListener(vm.blockListener);
var flyoutWorkspace = workspace.getFlyout().getWorkspace();
flyoutWorkspace.addChangeListener(vm.flyoutBlockListener);
// Create FPS counter.
var stats = new window.Stats();
document.getElementById('tab-renderexplorer').appendChild(stats.dom);
stats.dom.style.position = 'relative';
stats.begin();
// Playground data tabs.
// Block representation tab.
var blockexplorer = document.getElementById('blockexplorer');
var updateBlockExplorer = function (blocks) {
blockexplorer.innerHTML = JSON.stringify(blocks, null, 2);
window.hljs.highlightBlock(blockexplorer);
};
// Thread representation tab.
var threadexplorer = document.getElementById('threadexplorer');
var cachedThreadJSON = '';
var updateThreadExplorer = function (newJSON) {
if (newJSON !== cachedThreadJSON) {
cachedThreadJSON = newJSON;
threadexplorer.innerHTML = cachedThreadJSON;
window.hljs.highlightBlock(threadexplorer);
}
};
// Only request data from the VM thread if the appropriate tab is open.
window.exploreTabOpen = false;
var getPlaygroundData = function () {
vm.getPlaygroundData();
if (window.exploreTabOpen) {
window.requestAnimationFrame(getPlaygroundData);
}
};
// VM handlers.
// Receipt of new playground data (thread, block representations).
vm.on('playgroundData', function (data) {
updateThreadExplorer(data.threads);
updateBlockExplorer(data.blocks);
});
// Receipt of new block XML for the selected target.
vm.on('workspaceUpdate', function (data) {
workspace.clear();
var dom = window.Blockly.Xml.textToDom(data.xml);
window.Blockly.Xml.domToWorkspace(dom, workspace);
});
// Receipt of new list of targets, selected target update.
var selectedTarget = document.getElementById('selectedTarget');
vm.on('targetsUpdate', function (data) {
// Clear select box.
while (selectedTarget.firstChild) {
selectedTarget.removeChild(selectedTarget.firstChild);
}
// Generate new select box.
for (var i = 0; i < data.targetList.length; i++) {
var targetOption = document.createElement('option');
targetOption.setAttribute('value', data.targetList[i].id);
// If target id matches editingTarget id, select it.
if (data.targetList[i].id === data.editingTarget) {
targetOption.setAttribute('selected', 'selected');
}
targetOption.appendChild(
document.createTextNode(data.targetList[i].name)
);
selectedTarget.appendChild(targetOption);
}
});
selectedTarget.onchange = function () {
vm.setEditingTarget(this.value);
};
// Feedback for stacks and blocks running.
vm.on('SCRIPT_GLOW_ON', function (data) {
workspace.glowStack(data.id, true);
});
vm.on('SCRIPT_GLOW_OFF', function (data) {
workspace.glowStack(data.id, false);
});
vm.on('BLOCK_GLOW_ON', function (data) {
workspace.glowBlock(data.id, true);
});
vm.on('BLOCK_GLOW_OFF', function (data) {
workspace.glowBlock(data.id, false);
});
vm.on('VISUAL_REPORT', function (data) {
workspace.reportValue(data.id, data.value);
});
vm.on('SPRITE_INFO_REPORT', function (data) {
if (data.id !== selectedTarget.value) return; // Not the editingTarget
document.getElementById('sinfo-x').value = data.x;
document.getElementById('sinfo-y').value = data.y;
document.getElementById('sinfo-direction').value = data.direction;
document.getElementById('sinfo-rotationstyle').value = data.rotationStyle;
document.getElementById('sinfo-visible').value = data.visible;
});
document.getElementById('sinfo-post').addEventListener('click', function () {
var data = {};
data.x = document.getElementById('sinfo-x').value;
data.y = document.getElementById('sinfo-y').value;
data.direction = document.getElementById('sinfo-direction').value;
data.rotationStyle = document.getElementById('sinfo-rotationstyle').value;
data.visible = document.getElementById('sinfo-visible').value === 'true';
vm.postSpriteInfo(data);
});
// Feed mouse events as VM I/O events.
document.addEventListener('mousemove', function (e) {
var rect = canvas.getBoundingClientRect();
var coordinates = {
x: e.clientX - rect.left,
y: e.clientY - rect.top,
canvasWidth: rect.width,
canvasHeight: rect.height
};
window.vm.postIOData('mouse', coordinates);
});
canvas.addEventListener('mousedown', function (e) {
var rect = canvas.getBoundingClientRect();
var data = {
isDown: true,
x: e.clientX - rect.left,
y: e.clientY - rect.top,
canvasWidth: rect.width,
canvasHeight: rect.height
};
window.vm.postIOData('mouse', data);
e.preventDefault();
});
canvas.addEventListener('mouseup', function (e) {
var rect = canvas.getBoundingClientRect();
var data = {
isDown: false,
x: e.clientX - rect.left,
y: e.clientY - rect.top,
canvasWidth: rect.width,
canvasHeight: rect.height
};
window.vm.postIOData('mouse', data);
e.preventDefault();
});
// Feed keyboard events as VM I/O events.
document.addEventListener('keydown', function (e) {
// Don't capture keys intended for Blockly inputs.
if (e.target !== document && e.target !== document.body) {
return;
}
window.vm.postIOData('keyboard', {
keyCode: e.keyCode,
isDown: true
});
e.preventDefault();
});
document.addEventListener('keyup', function (e) {
// Always capture up events,
// even those that have switched to other targets.
window.vm.postIOData('keyboard', {
keyCode: e.keyCode,
isDown: false
});
// E.g., prevent scroll.
if (e.target !== document && e.target !== document.body) {
e.preventDefault();
}
});
// Run threads
vm.start();
// Inform VM of animation frames.
var animate = function () {
stats.update();
requestAnimationFrame(animate);
};
requestAnimationFrame(animate);
// Handlers for green flag and stop all.
document.getElementById('greenflag').addEventListener('click', function () {
vm.greenFlag();
});
document.getElementById('stopall').addEventListener('click', function () {
vm.stopAll();
});
document.getElementById('turbomode').addEventListener('change', function () {
var turboOn = document.getElementById('turbomode').checked;
vm.setTurboMode(turboOn);
});
document.getElementById('compatmode').addEventListener('change',
function () {
var compatibilityMode = document.getElementById('compatmode').checked;
vm.setCompatibilityMode(compatibilityMode);
});
var tabBlockExplorer = document.getElementById('tab-blockexplorer');
var tabThreadExplorer = document.getElementById('tab-threadexplorer');
var tabRenderExplorer = document.getElementById('tab-renderexplorer');
var tabImportExport = document.getElementById('tab-importexport');
// Handlers to show different explorers.
document.getElementById('threadexplorer-link').addEventListener('click',
function () {
window.exploreTabOpen = true;
getPlaygroundData();
tabBlockExplorer.style.display = 'none';
tabRenderExplorer.style.display = 'none';
tabThreadExplorer.style.display = 'block';
tabImportExport.style.display = 'none';
});
document.getElementById('blockexplorer-link').addEventListener('click',
function () {
window.exploreTabOpen = true;
getPlaygroundData();
tabBlockExplorer.style.display = 'block';
tabRenderExplorer.style.display = 'none';
tabThreadExplorer.style.display = 'none';
tabImportExport.style.display = 'none';
});
document.getElementById('renderexplorer-link').addEventListener('click',
function () {
window.exploreTabOpen = false;
tabBlockExplorer.style.display = 'none';
tabRenderExplorer.style.display = 'block';
tabThreadExplorer.style.display = 'none';
tabImportExport.style.display = 'none';
});
document.getElementById('importexport-link').addEventListener('click',
function () {
window.exploreTabOpen = false;
tabBlockExplorer.style.display = 'none';
tabRenderExplorer.style.display = 'none';
tabThreadExplorer.style.display = 'none';
tabImportExport.style.display = 'block';
});
};

14
src/util/cast.js
View file

@ -90,6 +90,15 @@ Cast.toRgbColorObject = function (value) {
return color;
};
/**
* Determine if a Scratch argument is a white space string (or null / empty).
* @param {*} val value to check.
* @return {boolean} True if the argument is all white spaces or null / empty.
*/
Cast.isWhiteSpace = function (val) {
return val === null || typeof val === 'string' && val.trim().length === 0;
};
/**
* Compare two values, using Scratch cast, case-insensitive string compare, etc.
* In Scratch 2.0, this is captured by `interp.compare.`
@ -100,6 +109,11 @@ Cast.toRgbColorObject = function (value) {
Cast.compare = function (v1, v2) {
var n1 = Number(v1);
var n2 = Number(v2);
if (n1 === 0 && Cast.isWhiteSpace(v1)) {
n1 = NaN;
} else if (n2 === 0 && Cast.isWhiteSpace(v2)) {
n2 = NaN;
}
if (isNaN(n1) || isNaN(n2)) {
// At least one argument can't be converted to a number.
// Scratch compares strings as case insensitive.

44
src/util/timer.js
View file

@ -23,16 +23,35 @@ var Timer = function () {};
*/
Timer.prototype.startTime = 0;
/**
* Disable use of self.performance for now as it results in lower performance
* However, instancing it like below (caching the self.performance to a local variable) negates most of the issues.
* @type {boolean}
*/
var USE_PERFORMANCE = false;
/**
* Legacy object to allow for us to call now to get the old style date time (for backwards compatibility)
* @deprecated This is only called via the nowObj.now() if no other means is possible...
*/
var legacyDateCode = {
now: function () {
return new Date().getTime();
}
};
/**
* Use this object to route all time functions through single access points.
*/
var nowObj = (USE_PERFORMANCE && typeof self !== 'undefined' && self.performance && 'now' in self.performance) ?
self.performance : Date.now ? Date : legacyDateCode;
/**
* Return the currently known absolute time, in ms precision.
* @returns {number} ms elapsed since 1 January 1970 00:00:00 UTC.
*/
Timer.prototype.time = function () {
if (Date.now) {
return Date.now();
} else {
return new Date().getTime();
}
return nowObj.now();
};
/**
@ -43,12 +62,7 @@ Timer.prototype.time = function () {
* @returns {number} ms-scale accurate time relative to other relative times.
*/
Timer.prototype.relativeTime = function () {
if (typeof self !== 'undefined' &&
self.performance && 'now' in self.performance) {
return self.performance.now();
} else {
return this.time();
}
return nowObj.now();
};
/**
@ -56,15 +70,11 @@ Timer.prototype.relativeTime = function () {
* at the most accurate precision possible.
*/
Timer.prototype.start = function () {
this.startTime = this.relativeTime();
this.startTime = nowObj.now();
};
/**
* Check time elapsed since `timer.start` was called.
* @returns {number} Time elapsed, in ms (possibly sub-ms precision).
*/
Timer.prototype.timeElapsed = function () {
return this.relativeTime() - this.startTime;
return nowObj.now() - this.startTime;
};
module.exports = Timer;