kopia lustrzana https://github.com/backface/turtlestitch
initial hacking sessions: hide some panes, locating and display of pen points
Michael Aschauer
rodzic
5f3279990b
commit
8ed287bbe7
|
|
@ -0,0 +1,41 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<title>turtleStitch (based on Snap!) - Devlopment</title>
|
||||
<script type="text/javascript" src="morphic.js"></script>
|
||||
<script type="text/javascript" src="widgets.js"></script>
|
||||
<script type="text/javascript" src="blocks.js"></script>
|
||||
<script type="text/javascript" src="threads.js"></script>
|
||||
<script type="text/javascript" src="objects.js"></script>
|
||||
<script type="text/javascript" src="gui.js"></script>
|
||||
<script type="text/javascript" src="paint.js"></script>
|
||||
<script type="text/javascript" src="lists.js"></script>
|
||||
<script type="text/javascript" src="byob.js"></script>
|
||||
<script type="text/javascript" src="xml.js"></script>
|
||||
<script type="text/javascript" src="store.js"></script>
|
||||
<script type="text/javascript" src="locale.js"></script>
|
||||
<script type="text/javascript" src="cloud.js"></script>
|
||||
<script type="text/javascript" src="sha512.js"></script>
|
||||
|
||||
<script type="text/javascript" src="stitchcode/stitchcodeChangeSetDel.js"></script>
|
||||
<script type="text/javascript" src="stitchcode/stitchcodeChangeSet.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
var world;
|
||||
window.onload = function () {
|
||||
world = new WorldMorph(document.getElementById('world'));
|
||||
world.worldCanvas.focus();
|
||||
new IDE_Morph().openIn(world);
|
||||
setInterval(loop, 1);
|
||||
};
|
||||
function loop() {
|
||||
world.doOneCycle();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body style="margin: 0;">
|
||||
<div name="bug" id="bug" style="font-size:80%;position: absolute;width:100%;height:5%;top:95%">points: </div>
|
||||
<canvas id="world" tabindex="1" style="position: absolute;width:100%;height:95%"></canvas>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,67 @@
|
|||
|
||||
var tStitch = {};
|
||||
tStitch.debug = true;
|
||||
tStitch.stitches = {};
|
||||
tStitch.stitches.x = new Array();
|
||||
tStitch.stitches.y = new Array();
|
||||
tStitch.stitches.jump = new Array();
|
||||
tStitch.addPoint = function (x,y,jump) {
|
||||
if (tStitch.debug) {
|
||||
o = new String();
|
||||
o = document.getElementById("bug").innerHTML;
|
||||
o = o + "[" + x + "x" + y;
|
||||
if (jump) o = o + " (isJump = " + jump +")";
|
||||
o+= "], ";
|
||||
document.getElementById("bug").innerHTML = o ;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// SpriteMorph turtle functions
|
||||
|
||||
SpriteMorph.prototype.forward = function (steps) {
|
||||
var dest,
|
||||
dist = steps * this.parent.scale || 0;
|
||||
|
||||
if (dist >= 0) {
|
||||
dest = this.position().distanceAngle(dist, this.heading);
|
||||
} else {
|
||||
dest = this.position().distanceAngle(
|
||||
Math.abs(dist),
|
||||
(this.heading - 180)
|
||||
);
|
||||
}
|
||||
|
||||
this.setPosition(dest);
|
||||
this.positionTalkBubble();
|
||||
|
||||
tx = dest.x - this.parent.topLeft().x
|
||||
ty = dest.y - this.parent.topLeft().y
|
||||
tjump = !this.isDown;
|
||||
tStitch.addPoint(tx,ty,tjump);
|
||||
//alert("move to: " + tx + "x" + ty + " - isJump = " + tjump);
|
||||
|
||||
};
|
||||
|
||||
SpriteMorph.prototype.gotoXY = function (x, y, justMe) {
|
||||
var stage = this.parentThatIsA(StageMorph),
|
||||
newX,
|
||||
newY,
|
||||
dest;
|
||||
|
||||
newX = stage.center().x + (+x || 0) * stage.scale;
|
||||
newY = stage.center().y - (+y || 0) * stage.scale;
|
||||
if (this.costume) {
|
||||
dest = new Point(newX, newY).subtract(this.rotationOffset);
|
||||
} else {
|
||||
dest = new Point(newX, newY).subtract(this.extent().divideBy(2));
|
||||
}
|
||||
|
||||
this.setPosition(dest, justMe);
|
||||
this.positionTalkBubble();
|
||||
|
||||
tx = dest.x - this.parent.topLeft().x
|
||||
ty = dest.y - this.parent.topLeft().y
|
||||
//alert("jump to: " + tx + "x" + ty);
|
||||
tStitch.addPoint(tx,ty,tjump);
|
||||
};
|
||||
|
|
@ -0,0 +1,592 @@
|
|||
|
||||
|
||||
// this file includes changes just to deactivate/hide some
|
||||
// stuff and functions we don't need.
|
||||
|
||||
|
||||
IDE_Morph.prototype.buildPanes = function () {
|
||||
this.createLogo();
|
||||
this.createControlBar();
|
||||
this.createCategories();
|
||||
this.createPalette();
|
||||
this.createStage();
|
||||
this.createSpriteBar();
|
||||
this.createSpriteEditor();
|
||||
this.createCorralBar();
|
||||
this.createCorral();
|
||||
this.corral.isVisible = false;
|
||||
this.corralBar.isVisible= false;
|
||||
this.spriteBar.isVisible= false;
|
||||
};
|
||||
|
||||
IDE_Morph.prototype.createLogo = function () {
|
||||
var myself = this;
|
||||
|
||||
if (this.logo) {
|
||||
this.logo.destroy();
|
||||
}
|
||||
|
||||
this.logo = new Morph();
|
||||
//this.logo.texture = 'snap_logo_sm.png';
|
||||
this.logo.texture = 'stitchcode/stitchcode_logo_small.png';
|
||||
this.logo.drawNew = function () {
|
||||
this.image = newCanvas(this.extent());
|
||||
var context = this.image.getContext('2d'),
|
||||
gradient = context.createLinearGradient(
|
||||
0,
|
||||
0,
|
||||
this.width(),
|
||||
0
|
||||
);
|
||||
gradient.addColorStop(0, 'black');
|
||||
gradient.addColorStop(0.5, myself.frameColor.toString());
|
||||
context.fillStyle = MorphicPreferences.isFlat ?
|
||||
myself.frameColor.toString() : gradient;
|
||||
context.fillRect(0, 0, this.width(), this.height());
|
||||
if (this.texture) {
|
||||
this.drawTexture(this.texture);
|
||||
}
|
||||
};
|
||||
|
||||
this.logo.drawCachedTexture = function () {
|
||||
var context = this.image.getContext('2d');
|
||||
context.drawImage(
|
||||
this.cachedTexture,
|
||||
5,
|
||||
Math.round((this.height() - this.cachedTexture.height) / 2)
|
||||
);
|
||||
this.changed();
|
||||
};
|
||||
|
||||
this.logo.mouseClickLeft = function () {
|
||||
myself.snapMenu();
|
||||
};
|
||||
|
||||
this.logo.color = new Color();
|
||||
this.logo.setExtent(new Point(200, 28)); // dimensions are fixed
|
||||
this.add(this.logo);
|
||||
};
|
||||
|
||||
|
||||
|
||||
// IDE_Morph layout
|
||||
|
||||
IDE_Morph.prototype.fixLayout = function (situation) {
|
||||
// situation is a string, i.e.
|
||||
// 'selectSprite' or 'refreshPalette' or 'tabEditor'
|
||||
var padding = this.padding;
|
||||
|
||||
Morph.prototype.trackChanges = false;
|
||||
|
||||
if (situation !== 'refreshPalette') {
|
||||
// controlBar
|
||||
this.controlBar.setPosition(this.logo.topRight());
|
||||
this.controlBar.setWidth(this.right() - this.controlBar.left());
|
||||
this.controlBar.fixLayout();
|
||||
|
||||
// categories
|
||||
this.categories.setLeft(this.logo.left());
|
||||
this.categories.setTop(this.logo.bottom());
|
||||
}
|
||||
|
||||
// palette
|
||||
this.palette.setLeft(this.logo.left());
|
||||
this.palette.setTop(this.categories.bottom());
|
||||
this.palette.setHeight(this.bottom() - this.palette.top());
|
||||
|
||||
if (situation !== 'refreshPalette') {
|
||||
// stage
|
||||
if (this.isAppMode) {
|
||||
this.stage.setScale(Math.floor(Math.min(
|
||||
(this.width() - padding * 2) / this.stage.dimensions.x,
|
||||
(this.height() - this.controlBar.height() * 2 - padding * 2)
|
||||
/ this.stage.dimensions.y
|
||||
) * 10) / 10);
|
||||
this.stage.setCenter(this.center());
|
||||
} else {
|
||||
// this.stage.setScale(this.isSmallStage ? 0.5 : 1);
|
||||
this.stage.setScale(this.isSmallStage ? this.stageRatio : 1);
|
||||
this.stage.setTop(this.logo.bottom() + padding);
|
||||
this.stage.setRight(this.right());
|
||||
}
|
||||
/*
|
||||
// spriteBar
|
||||
this.spriteBar.setPosition(this.logo.bottomRight().add(padding));
|
||||
this.spriteBar.setExtent(new Point(
|
||||
Math.max(0, this.stage.left() - padding - this.spriteBar.left()),
|
||||
this.categories.bottom() - this.spriteBar.top() - padding
|
||||
));
|
||||
this.spriteBar.fixLayout();
|
||||
*/
|
||||
// spriteEditor
|
||||
if (this.spriteEditor.isVisible) {
|
||||
//this.spriteEditor.setPosition(this.spriteBar.bottomLeft());
|
||||
this.spriteEditor.setPosition(this.logo.bottomRight().add(padding));
|
||||
this.spriteEditor.setExtent(new Point(
|
||||
//this.spriteBar.width(),
|
||||
Math.max(0, this.stage.left() - padding - this.spriteEditor.left()),
|
||||
this.bottom() - this.spriteEditor.top()
|
||||
));
|
||||
}
|
||||
|
||||
|
||||
// corralBar
|
||||
this.corralBar.setLeft(this.stage.left());
|
||||
this.corralBar.setTop(this.stage.bottom() + padding);
|
||||
this.corralBar.setWidth(this.stage.width());
|
||||
|
||||
// corral
|
||||
if (!contains(['selectSprite', 'tabEditor'], situation)) {
|
||||
this.corral.setPosition(this.corralBar.bottomLeft());
|
||||
this.corral.setWidth(this.stage.width());
|
||||
this.corral.setHeight(this.bottom() - this.corral.top());
|
||||
this.corral.fixLayout();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
Morph.prototype.trackChanges = true;
|
||||
this.changed();
|
||||
};
|
||||
|
||||
IDE_Morph.prototype.setProjectName = function (string) {
|
||||
this.projectName = string.replace(/['"]/g, ''); // filter quotation marks
|
||||
this.hasChangedMedia = true;
|
||||
this.controlBar.updateLabel();
|
||||
};
|
||||
|
||||
IDE_Morph.prototype.createSpriteBar = function () {
|
||||
// assumes that the categories pane has already been created
|
||||
var rotationStyleButtons = [],
|
||||
thumbSize = new Point(45, 45),
|
||||
nameField,
|
||||
padlock,
|
||||
thumbnail,
|
||||
tabCorner = 15,
|
||||
tabColors = this.tabColors,
|
||||
tabBar = new AlignmentMorph('row', -tabCorner * 2),
|
||||
tab,
|
||||
symbols = ['\u2192', '\u21BB', '\u2194'],
|
||||
labels = ['don\'t rotate', 'can rotate', 'only face left/right'],
|
||||
myself = this;
|
||||
|
||||
if (this.spriteBar) {
|
||||
this.spriteBar.destroy();
|
||||
}
|
||||
|
||||
this.spriteBar = new Morph();
|
||||
this.spriteBar.color = this.frameColor;
|
||||
//this.add(this.spriteBar);
|
||||
|
||||
function addRotationStyleButton(rotationStyle) {
|
||||
var colors = myself.rotationStyleColors,
|
||||
button;
|
||||
|
||||
button = new ToggleButtonMorph(
|
||||
colors,
|
||||
myself, // the IDE is the target
|
||||
function () {
|
||||
if (myself.currentSprite instanceof SpriteMorph) {
|
||||
myself.currentSprite.rotationStyle = rotationStyle;
|
||||
myself.currentSprite.changed();
|
||||
myself.currentSprite.drawNew();
|
||||
myself.currentSprite.changed();
|
||||
}
|
||||
rotationStyleButtons.forEach(function (each) {
|
||||
each.refresh();
|
||||
});
|
||||
},
|
||||
symbols[rotationStyle], // label
|
||||
function () { // query
|
||||
return myself.currentSprite instanceof SpriteMorph
|
||||
&& myself.currentSprite.rotationStyle === rotationStyle;
|
||||
},
|
||||
null, // environment
|
||||
localize(labels[rotationStyle])
|
||||
);
|
||||
|
||||
button.corner = 8;
|
||||
button.labelMinExtent = new Point(11, 11);
|
||||
button.padding = 0;
|
||||
button.labelShadowOffset = new Point(-1, -1);
|
||||
button.labelShadowColor = colors[1];
|
||||
button.labelColor = myself.buttonLabelColor;
|
||||
button.fixLayout();
|
||||
button.refresh();
|
||||
rotationStyleButtons.push(button);
|
||||
button.setPosition(myself.spriteBar.position().add(2));
|
||||
button.setTop(button.top()
|
||||
+ ((rotationStyleButtons.length - 1) * (button.height() + 2))
|
||||
);
|
||||
myself.spriteBar.add(button);
|
||||
if (myself.currentSprite instanceof StageMorph) {
|
||||
button.hide();
|
||||
}
|
||||
return button;
|
||||
}
|
||||
|
||||
addRotationStyleButton(1);
|
||||
addRotationStyleButton(2);
|
||||
addRotationStyleButton(0);
|
||||
this.rotationStyleButtons = rotationStyleButtons;
|
||||
|
||||
thumbnail = new Morph();
|
||||
thumbnail.setExtent(thumbSize);
|
||||
thumbnail.image = this.currentSprite.thumbnail(thumbSize);
|
||||
thumbnail.setPosition(
|
||||
rotationStyleButtons[0].topRight().add(new Point(5, 3))
|
||||
);
|
||||
this.spriteBar.add(thumbnail);
|
||||
|
||||
thumbnail.fps = 3;
|
||||
|
||||
thumbnail.step = function () {
|
||||
if (thumbnail.version !== myself.currentSprite.version) {
|
||||
thumbnail.image = myself.currentSprite.thumbnail(thumbSize);
|
||||
thumbnail.changed();
|
||||
thumbnail.version = myself.currentSprite.version;
|
||||
}
|
||||
};
|
||||
|
||||
nameField = new InputFieldMorph(this.currentSprite.name);
|
||||
nameField.setWidth(100); // fixed dimensions
|
||||
nameField.contrast = 90;
|
||||
nameField.setPosition(thumbnail.topRight().add(new Point(10, 3)));
|
||||
this.spriteBar.add(nameField);
|
||||
nameField.drawNew();
|
||||
nameField.accept = function () {
|
||||
var newName = nameField.getValue();
|
||||
myself.currentSprite.setName(
|
||||
myself.newSpriteName(newName, myself.currentSprite)
|
||||
);
|
||||
nameField.setContents(myself.currentSprite.name);
|
||||
};
|
||||
this.spriteBar.reactToEdit = nameField.accept;
|
||||
|
||||
// padlock
|
||||
padlock = new ToggleMorph(
|
||||
'checkbox',
|
||||
null,
|
||||
function () {
|
||||
myself.currentSprite.isDraggable =
|
||||
!myself.currentSprite.isDraggable;
|
||||
},
|
||||
localize('draggable'),
|
||||
function () {
|
||||
return myself.currentSprite.isDraggable;
|
||||
}
|
||||
);
|
||||
padlock.label.isBold = false;
|
||||
padlock.label.setColor(this.buttonLabelColor);
|
||||
padlock.color = tabColors[2];
|
||||
padlock.highlightColor = tabColors[0];
|
||||
padlock.pressColor = tabColors[1];
|
||||
|
||||
padlock.tick.shadowOffset = MorphicPreferences.isFlat ?
|
||||
new Point() : new Point(-1, -1);
|
||||
padlock.tick.shadowColor = new Color(); // black
|
||||
padlock.tick.color = this.buttonLabelColor;
|
||||
padlock.tick.isBold = false;
|
||||
padlock.tick.drawNew();
|
||||
|
||||
padlock.setPosition(nameField.bottomLeft().add(2));
|
||||
padlock.drawNew();
|
||||
this.spriteBar.add(padlock);
|
||||
if (this.currentSprite instanceof StageMorph) {
|
||||
padlock.hide();
|
||||
}
|
||||
|
||||
// tab bar
|
||||
tabBar.tabTo = function (tabString) {
|
||||
var active;
|
||||
myself.currentTab = tabString;
|
||||
this.children.forEach(function (each) {
|
||||
each.refresh();
|
||||
if (each.state) {active = each; }
|
||||
});
|
||||
active.refresh(); // needed when programmatically tabbing
|
||||
myself.createSpriteEditor();
|
||||
myself.fixLayout('tabEditor');
|
||||
};
|
||||
|
||||
tab = new TabMorph(
|
||||
tabColors,
|
||||
null, // target
|
||||
function () {tabBar.tabTo('scripts'); },
|
||||
localize('Scripts'), // label
|
||||
function () { // query
|
||||
return myself.currentTab === 'scripts';
|
||||
}
|
||||
);
|
||||
tab.padding = 3;
|
||||
tab.corner = tabCorner;
|
||||
tab.edge = 1;
|
||||
tab.labelShadowOffset = new Point(-1, -1);
|
||||
tab.labelShadowColor = tabColors[1];
|
||||
tab.labelColor = this.buttonLabelColor;
|
||||
tab.drawNew();
|
||||
tab.fixLayout();
|
||||
tabBar.add(tab);
|
||||
|
||||
tab = new TabMorph(
|
||||
tabColors,
|
||||
null, // target
|
||||
function () {tabBar.tabTo('costumes'); },
|
||||
localize('Costumes'), // label
|
||||
function () { // query
|
||||
return myself.currentTab === 'costumes';
|
||||
}
|
||||
);
|
||||
tab.padding = 3;
|
||||
tab.corner = tabCorner;
|
||||
tab.edge = 1;
|
||||
tab.labelShadowOffset = new Point(-1, -1);
|
||||
tab.labelShadowColor = tabColors[1];
|
||||
tab.labelColor = this.buttonLabelColor;
|
||||
tab.drawNew();
|
||||
tab.fixLayout();
|
||||
tabBar.add(tab);
|
||||
|
||||
tab = new TabMorph(
|
||||
tabColors,
|
||||
null, // target
|
||||
function () {tabBar.tabTo('sounds'); },
|
||||
localize('Sounds'), // label
|
||||
function () { // query
|
||||
return myself.currentTab === 'sounds';
|
||||
}
|
||||
);
|
||||
tab.padding = 3;
|
||||
tab.corner = tabCorner;
|
||||
tab.edge = 1;
|
||||
tab.labelShadowOffset = new Point(-1, -1);
|
||||
tab.labelShadowColor = tabColors[1];
|
||||
tab.labelColor = this.buttonLabelColor;
|
||||
tab.drawNew();
|
||||
tab.fixLayout();
|
||||
tabBar.add(tab);
|
||||
|
||||
tabBar.fixLayout();
|
||||
tabBar.children.forEach(function (each) {
|
||||
each.refresh();
|
||||
});
|
||||
this.spriteBar.tabBar = tabBar;
|
||||
this.spriteBar.add(this.spriteBar.tabBar);
|
||||
|
||||
this.spriteBar.fixLayout = function () {
|
||||
this.tabBar.setLeft(this.left());
|
||||
this.tabBar.setBottom(this.bottom());
|
||||
};
|
||||
};
|
||||
|
||||
IDE_Morph.prototype.createCorralBar = function () {
|
||||
// assumes the stage has already been created
|
||||
var padding = 5,
|
||||
newbutton,
|
||||
paintbutton,
|
||||
colors = [
|
||||
this.groupColor,
|
||||
this.frameColor.darker(50),
|
||||
this.frameColor.darker(50)
|
||||
];
|
||||
|
||||
if (this.corralBar) {
|
||||
this.corralBar.destroy();
|
||||
}
|
||||
|
||||
this.corralBar = new Morph();
|
||||
this.corralBar.color = this.frameColor;
|
||||
this.corralBar.setHeight(this.logo.height()); // height is fixed
|
||||
//this.add(this.corralBar);
|
||||
|
||||
// new sprite button
|
||||
newbutton = new PushButtonMorph(
|
||||
this,
|
||||
"addNewSprite",
|
||||
new SymbolMorph("turtle", 14)
|
||||
);
|
||||
newbutton.corner = 12;
|
||||
newbutton.color = colors[0];
|
||||
newbutton.highlightColor = colors[1];
|
||||
newbutton.pressColor = colors[2];
|
||||
newbutton.labelMinExtent = new Point(36, 18);
|
||||
newbutton.padding = 0;
|
||||
newbutton.labelShadowOffset = new Point(-1, -1);
|
||||
newbutton.labelShadowColor = colors[1];
|
||||
newbutton.labelColor = this.buttonLabelColor;
|
||||
newbutton.contrast = this.buttonContrast;
|
||||
newbutton.drawNew();
|
||||
newbutton.hint = "add a new Turtle sprite";
|
||||
newbutton.fixLayout();
|
||||
newbutton.setCenter(this.corralBar.center());
|
||||
newbutton.setLeft(this.corralBar.left() + padding);
|
||||
this.corralBar.add(newbutton);
|
||||
|
||||
paintbutton = new PushButtonMorph(
|
||||
this,
|
||||
"paintNewSprite",
|
||||
new SymbolMorph("brush", 15)
|
||||
);
|
||||
paintbutton.corner = 12;
|
||||
paintbutton.color = colors[0];
|
||||
paintbutton.highlightColor = colors[1];
|
||||
paintbutton.pressColor = colors[2];
|
||||
paintbutton.labelMinExtent = new Point(36, 18);
|
||||
paintbutton.padding = 0;
|
||||
paintbutton.labelShadowOffset = new Point(-1, -1);
|
||||
paintbutton.labelShadowColor = colors[1];
|
||||
paintbutton.labelColor = this.buttonLabelColor;
|
||||
paintbutton.contrast = this.buttonContrast;
|
||||
paintbutton.drawNew();
|
||||
paintbutton.hint = "paint a new sprite";
|
||||
paintbutton.fixLayout();
|
||||
paintbutton.setCenter(this.corralBar.center());
|
||||
paintbutton.setLeft(
|
||||
this.corralBar.left() + padding + newbutton.width() + padding
|
||||
);
|
||||
this.corralBar.add(paintbutton);
|
||||
};
|
||||
|
||||
IDE_Morph.prototype.createCorral = function () {
|
||||
// assumes the corral bar has already been created
|
||||
var frame, template, padding = 5, myself = this;
|
||||
|
||||
if (this.corral) {
|
||||
this.corral.destroy();
|
||||
}
|
||||
|
||||
this.corral = new Morph();
|
||||
this.corral.color = this.groupColor;
|
||||
//this.add(this.corral);
|
||||
|
||||
this.corral.stageIcon = new SpriteIconMorph(this.stage);
|
||||
this.corral.stageIcon.isDraggable = false;
|
||||
this.corral.add(this.corral.stageIcon);
|
||||
|
||||
frame = new ScrollFrameMorph(null, null, this.sliderColor);
|
||||
frame.acceptsDrops = false;
|
||||
frame.contents.acceptsDrops = false;
|
||||
|
||||
frame.contents.wantsDropOf = function (morph) {
|
||||
return morph instanceof SpriteIconMorph;
|
||||
};
|
||||
|
||||
frame.contents.reactToDropOf = function (spriteIcon) {
|
||||
myself.corral.reactToDropOf(spriteIcon);
|
||||
};
|
||||
|
||||
frame.alpha = 0;
|
||||
|
||||
this.sprites.asArray().forEach(function (morph) {
|
||||
template = new SpriteIconMorph(morph, template);
|
||||
frame.contents.add(template);
|
||||
});
|
||||
|
||||
this.corral.frame = frame;
|
||||
this.corral.add(frame);
|
||||
|
||||
this.corral.fixLayout = function () {
|
||||
this.stageIcon.setCenter(this.center());
|
||||
this.stageIcon.setLeft(this.left() + padding);
|
||||
this.frame.setLeft(this.stageIcon.right() + padding);
|
||||
this.frame.setExtent(new Point(
|
||||
this.right() - this.frame.left(),
|
||||
this.height()
|
||||
));
|
||||
this.arrangeIcons();
|
||||
this.refresh();
|
||||
};
|
||||
|
||||
this.corral.arrangeIcons = function () {
|
||||
var x = this.frame.left(),
|
||||
y = this.frame.top(),
|
||||
max = this.frame.right(),
|
||||
start = this.frame.left();
|
||||
|
||||
this.frame.contents.children.forEach(function (icon) {
|
||||
var w = icon.width();
|
||||
|
||||
if (x + w > max) {
|
||||
x = start;
|
||||
y += icon.height(); // they're all the same
|
||||
}
|
||||
icon.setPosition(new Point(x, y));
|
||||
x += w;
|
||||
});
|
||||
this.frame.contents.adjustBounds();
|
||||
};
|
||||
|
||||
this.corral.addSprite = function (sprite) {
|
||||
this.frame.contents.add(new SpriteIconMorph(sprite));
|
||||
this.fixLayout();
|
||||
};
|
||||
|
||||
this.corral.refresh = function () {
|
||||
this.stageIcon.refresh();
|
||||
this.frame.contents.children.forEach(function (icon) {
|
||||
icon.refresh();
|
||||
});
|
||||
};
|
||||
|
||||
this.corral.wantsDropOf = function (morph) {
|
||||
return morph instanceof SpriteIconMorph;
|
||||
};
|
||||
|
||||
this.corral.reactToDropOf = function (spriteIcon) {
|
||||
var idx = 1,
|
||||
pos = spriteIcon.position();
|
||||
spriteIcon.destroy();
|
||||
this.frame.contents.children.forEach(function (icon) {
|
||||
if (pos.gt(icon.position()) || pos.y > icon.bottom()) {
|
||||
idx += 1;
|
||||
}
|
||||
});
|
||||
myself.sprites.add(spriteIcon.object, idx);
|
||||
myself.createCorral();
|
||||
myself.fixLayout();
|
||||
};
|
||||
|
||||
};
|
||||
|
||||
// StageMorph user menu
|
||||
|
||||
StageMorph.prototype.userMenu = function () {
|
||||
var ide = this.parentThatIsA(IDE_Morph),
|
||||
menu = new MenuMorph(this),
|
||||
shiftClicked = this.world().currentKey === 16,
|
||||
myself = this;
|
||||
|
||||
if (ide && ide.isAppMode) {
|
||||
// menu.addItem('help', 'nop');
|
||||
return menu;
|
||||
}
|
||||
//menu.addItem("edit", 'edit');
|
||||
menu.addItem("show all", 'showAll');
|
||||
menu.addItem(
|
||||
"pic...",
|
||||
function () {
|
||||
window.open(myself.fullImageClassic().toDataURL());
|
||||
},
|
||||
'open a new window\nwith a picture of the stage'
|
||||
);
|
||||
if (shiftClicked) {
|
||||
menu.addLine();
|
||||
menu.addItem(
|
||||
"turn pen trails into new costume...",
|
||||
function () {
|
||||
var costume = new Costume(
|
||||
myself.trailsCanvas,
|
||||
Date.now().toString()
|
||||
).copy();
|
||||
ide.currentSprite.addCostume(costume);
|
||||
ide.currentSprite.wearCostume(costume);
|
||||
ide.hasChangedMedia = true;
|
||||
},
|
||||
'turn all pen trails and stamps\n' +
|
||||
'into a new costume for the\ncurrently selected sprite',
|
||||
new Color(100, 0, 0)
|
||||
);
|
||||
}
|
||||
return menu;
|
||||
};
|
||||
Plik binarny nie jest wyświetlany.
|
Po Szerokość: | Wysokość: | Rozmiar: 2.3 KiB |
Ładowanie…
Reference in New Issue