kopia lustrzana https://github.com/backface/turtlestitch
proof of concept works. performance is horrible....
Michael Aschauer
rodzic
32ddc734c0
commit
ee1f01d48d
|
|
@ -57,7 +57,6 @@
|
||||||
position:absolute;right:0;bottom:0;width:480px;height:360px;
|
position:absolute;right:0;bottom:0;width:480px;height:360px;
|
||||||
border:1px solid #c0c0c0"></canvas>
|
border:1px solid #c0c0c0"></canvas>
|
||||||
|
|
||||||
|
|
||||||
<div id="svg2" style="background:white;font-size:60%;position:absolute;
|
<div id="svg2" style="background:white;font-size:60%;position:absolute;
|
||||||
position:absolute;right:0;bottom:0;width:480px;height:360px;
|
position:absolute;right:0;bottom:0;width:480px;height:360px;
|
||||||
border:1px solid #c0c0c0" ></div>
|
border:1px solid #c0c0c0" ></div>
|
||||||
|
|
|
||||||
|
|
@ -68,6 +68,11 @@ IDE_Morph.prototype.buildPanes = function () {
|
||||||
this.createPaletteHandle();
|
this.createPaletteHandle();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
IDE_Morph.prototype.origSetStageExtent = IDE_Morph.prototype.setStageExtent;
|
||||||
|
IDE_Morph.prototype.setStageExtent = function (aPoint) {
|
||||||
|
this.origSetStageExtent(aPoint);
|
||||||
|
turtleShepherd.setStageDimensions(aPoint.x, aPoint.y);
|
||||||
|
};
|
||||||
|
|
||||||
// Create contol bar - (and add custom buttons)
|
// Create contol bar - (and add custom buttons)
|
||||||
IDE_Morph.prototype.createControlBar = function () {
|
IDE_Morph.prototype.createControlBar = function () {
|
||||||
|
|
@ -1310,9 +1315,9 @@ IDE_Morph.prototype.createCategories = function () {
|
||||||
buttonHeight = myself.categories.children[0].height(),
|
buttonHeight = myself.categories.children[0].height(),
|
||||||
border = 3,
|
border = 3,
|
||||||
rows = Math.ceil((myself.categories.children.length) / 2),
|
rows = Math.ceil((myself.categories.children.length) / 2),
|
||||||
xPadding = (myself.categories.width()
|
xPadding = (myself.categories.width() -
|
||||||
- border
|
border -
|
||||||
- buttonWidth * 2) / 3,
|
buttonWidth * 2) / 3,
|
||||||
yPadding = 2,
|
yPadding = 2,
|
||||||
l = myself.categories.left(),
|
l = myself.categories.left(),
|
||||||
t = myself.categories.top(),
|
t = myself.categories.top(),
|
||||||
|
|
@ -1423,12 +1428,12 @@ IDE_Morph.prototype.projectMenu = function () {
|
||||||
menu.addLine();
|
menu.addLine();
|
||||||
menu.addItem(
|
menu.addItem(
|
||||||
'Download as SVG',
|
'Download as SVG',
|
||||||
function() { myself.downloadSVG() },
|
function() { myself.downloadSVG(); },
|
||||||
'download current drawing as SVG file'
|
'download current drawing as SVG file'
|
||||||
);
|
);
|
||||||
menu.addItem(
|
menu.addItem(
|
||||||
'Download as EXP',
|
'Download as EXP',
|
||||||
function() { myself.downloadEXP() },
|
function() { myself.downloadEXP(); },
|
||||||
'download current drawing as EXP file'
|
'download current drawing as EXP file'
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|
@ -1483,27 +1488,6 @@ IDE_Morph.prototype.projectMenu = function () {
|
||||||
),
|
),
|
||||||
'Select categories of additional blocks to add to this project.'
|
'Select categories of additional blocks to add to this project.'
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|
||||||
graphicsName = 'Backgrounds';
|
|
||||||
menu.addItem(
|
|
||||||
'Backgrounds...',
|
|
||||||
createMediaMenu(
|
|
||||||
'Backgrounds',
|
|
||||||
function loadLib(file, name) {
|
|
||||||
var url = myself.resourceURL('Backgrounds', file);
|
|
||||||
img = new Image();
|
|
||||||
img.onload = function () {
|
|
||||||
var canvas = newCanvas(new Point(img.width, img.height));
|
|
||||||
canvas.getContext('2d').drawImage(img, 0, 0);
|
|
||||||
myself.droppedImageStage(canvas, name);
|
|
||||||
};
|
|
||||||
img.src = url;
|
|
||||||
}
|
|
||||||
),
|
|
||||||
'Select categories of additional blocks to add to this project.'
|
|
||||||
);
|
|
||||||
|
|
||||||
menu.popup(world, pos);
|
menu.popup(world, pos);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,13 @@
|
||||||
/* Sprite */
|
/* Sprite */
|
||||||
// modified SpriteMorph turtlestitch functions
|
// modified SpriteMorph turtlestitch functions
|
||||||
|
|
||||||
|
|
||||||
|
SpriteMorph.prototype.origInit = SpriteMorph.prototype.init;
|
||||||
|
SpriteMorph.prototype.init = function(globals) {
|
||||||
|
this.origInit(globals);
|
||||||
|
this.hide();
|
||||||
|
};
|
||||||
|
|
||||||
SpriteMorph.prototype.origForward = SpriteMorph.prototype.forward;
|
SpriteMorph.prototype.origForward = SpriteMorph.prototype.forward;
|
||||||
SpriteMorph.prototype.forward = function (steps) {
|
SpriteMorph.prototype.forward = function (steps) {
|
||||||
oldx = this.xPosition();
|
oldx = this.xPosition();
|
||||||
|
|
@ -16,10 +23,10 @@ SpriteMorph.prototype.origGotoXY = SpriteMorph.prototype.gotoXY;
|
||||||
SpriteMorph.prototype.gotoXY = function (x, y, justMe) {
|
SpriteMorph.prototype.gotoXY = function (x, y, justMe) {
|
||||||
oldx = this.xPosition();
|
oldx = this.xPosition();
|
||||||
oldy = this.yPosition();
|
oldy = this.yPosition();
|
||||||
console.log("jump in place - don't add.");
|
|
||||||
this.origGotoXY(x, y, justMe);
|
this.origGotoXY(x, y, justMe);
|
||||||
if ( Math.abs(this.xPosition()-oldx)<=1 && Math.abs(this.yPosition()-oldy)<=1 ) {
|
if ( Math.abs(this.xPosition()-oldx)<=1 && Math.abs(this.yPosition()-oldy)<=1 ) {
|
||||||
console.log("jump in place - don't add.");
|
// jump in place - don't add.
|
||||||
|
if (DEBUG) turtleShepherd.debug_msg("jump in place - don't add");
|
||||||
} else {
|
} else {
|
||||||
if (!turtleShepherd.hasSteps())
|
if (!turtleShepherd.hasSteps())
|
||||||
turtleShepherd.initPosition(oldx, oldy);
|
turtleShepherd.initPosition(oldx, oldy);
|
||||||
|
|
@ -32,14 +39,18 @@ SpriteMorph.prototype.origClear = SpriteMorph.prototype.clear;
|
||||||
SpriteMorph.prototype.clear = function () {
|
SpriteMorph.prototype.clear = function () {
|
||||||
this.origClear();
|
this.origClear();
|
||||||
turtleShepherd.clear();
|
turtleShepherd.clear();
|
||||||
|
//this.changed();
|
||||||
this.reRender();
|
this.reRender();
|
||||||
};
|
};
|
||||||
|
|
||||||
SpriteMorph.prototype.reRender = function () {
|
SpriteMorph.prototype.reRender = function () {
|
||||||
this.parent.clearPenTrails();
|
//this.changed();
|
||||||
turtleShepherd.reRender(this.parent.penTrails());
|
turtleShepherd.reRender(this.parent.penTrails());
|
||||||
|
this.hide();
|
||||||
|
this.changed();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
/* Stage */
|
/* Stage */
|
||||||
// modified StageMorph turtlestitch functions
|
// modified StageMorph turtlestitch functions
|
||||||
|
|
||||||
|
|
@ -51,6 +62,140 @@ StageMorph.prototype.mouseScroll = function (y, x) {
|
||||||
turtleShepherd.zoomIn();
|
turtleShepherd.zoomIn();
|
||||||
}
|
}
|
||||||
|
|
||||||
this.clearPenTrails();
|
this.reRender();
|
||||||
reDraw(this.penTrails());
|
this.changed();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
|
StageMorph.prototype.reRender = function () {
|
||||||
|
//this.changed();
|
||||||
|
turtleShepherd.reRender(this.penTrails());
|
||||||
|
//this.changed();
|
||||||
|
};
|
||||||
|
|
||||||
|
StageMorph.prototype.originalSetScale = StageMorph.prototype.setScale;
|
||||||
|
StageMorph.prototype.setScale = function (number) {
|
||||||
|
this.scaleChanged = true;
|
||||||
|
this.originalSetScale(number);
|
||||||
|
if (DEBUG) turtleShepherd.debug_msg("scale stage to "+ number );
|
||||||
|
if (DEBUG) turtleShepherd.debug_msg("stage dimensions " +
|
||||||
|
this.extent().x + " " +
|
||||||
|
this.extent().y);
|
||||||
|
if (DEBUG) turtleShepherd.debug_msg("stage position " +
|
||||||
|
this.position().x + " " +
|
||||||
|
this.position().y);
|
||||||
|
turtleShepherd.setStageDimensions(this.extent().x, this.extent().y);
|
||||||
|
turtleShepherd.setStagePosition(this.position().x, this.position().y);
|
||||||
|
//this.resizePenTrails();
|
||||||
|
this.changed();
|
||||||
|
this.reRender();
|
||||||
|
};
|
||||||
|
|
||||||
|
StageMorph.prototype.resizePenTrails = function () {
|
||||||
|
this.trailsCanvas = newCanvas(new Point(this.extent().x,this.extent().y));
|
||||||
|
this.changed();
|
||||||
|
};
|
||||||
|
|
||||||
|
StageMorph.prototype.originalDrawOn = StageMorph.prototype.drawOn;
|
||||||
|
|
||||||
|
/*
|
||||||
|
StageMorph.prototype.drawOn = function (aCanvas, aRect) {
|
||||||
|
if (DEBUG) turtleShepherd.debug_msg("draw on stage");
|
||||||
|
//turtleShepherd.reRender(this.penTrails());
|
||||||
|
|
||||||
|
c = this.penTrails().getContext('2d');
|
||||||
|
c.drawSvg(turtleShepherd.toSVG(), 0, 0, aCanvas.width, aCanvas.height);
|
||||||
|
return this.originalDrawOn(aCanvas, aRect);
|
||||||
|
};*
|
||||||
|
|
||||||
|
|
||||||
|
/* from beetleblocks */
|
||||||
|
/*
|
||||||
|
// StageMorph drawing
|
||||||
|
StageMorph.prototype.originalDrawOn = StageMorph.prototype.drawOn;
|
||||||
|
StageMorph.prototype.drawOn = function (aCanvas, aRect) {
|
||||||
|
// If the scale is lower than 1, we reuse the original method,
|
||||||
|
// otherwise we need to modify the renderer dimensions
|
||||||
|
// we do not need to render the original canvas anymore because
|
||||||
|
// we have removed sprites and backgrounds
|
||||||
|
|
||||||
|
var rectangle, area, delta, src, context, w, h, sl, st;
|
||||||
|
if (!this.isVisible) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
if (this.scale < 1) {
|
||||||
|
return this.originalDrawOn(aCanvas, aRect);
|
||||||
|
}
|
||||||
|
|
||||||
|
rectangle = aRect || this.bounds;
|
||||||
|
area = rectangle.intersect(this.bounds).round();
|
||||||
|
if (area.extent().gt(new Point(0, 0))) {
|
||||||
|
delta = this.position().neg();
|
||||||
|
src = area.copy().translateBy(delta).round();
|
||||||
|
context = aCanvas.getContext('2d');
|
||||||
|
context.globalAlpha = this.alpha;
|
||||||
|
|
||||||
|
sl = src.left();
|
||||||
|
st = src.top();
|
||||||
|
w = Math.min(src.width(), this.image.width - sl);
|
||||||
|
h = Math.min(src.height(), this.image.height - st);
|
||||||
|
|
||||||
|
if (w < 1 || h < 1) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
context.save();
|
||||||
|
if (this.scaleChanged) {
|
||||||
|
w = this.width();
|
||||||
|
h = this.height();
|
||||||
|
this.scaleChanged = false;
|
||||||
|
this.reRender();
|
||||||
|
}
|
||||||
|
|
||||||
|
context.drawImage(
|
||||||
|
this.penTrails(),
|
||||||
|
src.left() / this.scale,
|
||||||
|
src.top() / this.scale,
|
||||||
|
w,
|
||||||
|
h,
|
||||||
|
area.left() / this.scale,
|
||||||
|
area.top() / this.scale,
|
||||||
|
w,
|
||||||
|
h
|
||||||
|
);
|
||||||
|
context.restore();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
/*
|
||||||
|
|
||||||
|
StageMorph.prototype.originalSetScale = StageMorph.prototype.setScale;
|
||||||
|
StageMorph.prototype.setScale = function (number) {
|
||||||
|
this.scaleChanged = true;
|
||||||
|
this.originalSetScale(number);
|
||||||
|
};
|
||||||
|
|
||||||
|
// Contextual 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.hide();
|
||||||
|
return menu;
|
||||||
|
}
|
||||||
|
menu.addItem(
|
||||||
|
'pic...',
|
||||||
|
function () {
|
||||||
|
window.open(myself.fullImageClassic().toDataURL());
|
||||||
|
},
|
||||||
|
'open a new window\nwith a picture of the scene'
|
||||||
|
);
|
||||||
|
return menu;
|
||||||
|
};
|
||||||
|
|
||||||
|
*/
|
||||||
|
|
|
||||||
|
|
@ -1,402 +0,0 @@
|
||||||
// Stitchode's main changes and addtions to snap! go in here
|
|
||||||
// sorry it lacks proper documentation
|
|
||||||
|
|
||||||
|
|
||||||
var tStitch = {};
|
|
||||||
|
|
||||||
tStitch.debug = true;
|
|
||||||
tStitch.draw_jumps = true;
|
|
||||||
tStitch.draw_stitches = true;
|
|
||||||
tStitch.draw_stitch_len = 2;
|
|
||||||
|
|
||||||
tStitch.debug_msg = function (st,clear) {
|
|
||||||
o = new String();
|
|
||||||
if (!clear) {
|
|
||||||
o = document.getElementById("bug").innerHTML;
|
|
||||||
} else {
|
|
||||||
o = "";
|
|
||||||
}
|
|
||||||
o += st;
|
|
||||||
document.getElementById("bug").innerHTML = o;
|
|
||||||
}
|
|
||||||
|
|
||||||
tStitch.getBaseURL = function () {
|
|
||||||
var url = location.href; // entire url including querystring - also: window.location.href;
|
|
||||||
if (url.lastIndexOf('#') > 0) {
|
|
||||||
url = url.substring(0, url.lastIndexOf('#'));
|
|
||||||
}
|
|
||||||
url = url.substring(0, url.lastIndexOf('/'));
|
|
||||||
return url + "/";
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
tStitch.stitches = {};
|
|
||||||
tStitch.stitches.x = new Array();
|
|
||||||
tStitch.stitches.y = new Array();
|
|
||||||
tStitch.stitches.jump = new Array();
|
|
||||||
|
|
||||||
tStitch.isFirst = function() {
|
|
||||||
if (tStitch.stitches.x.length > 0)
|
|
||||||
return false;
|
|
||||||
else
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
|
|
||||||
tStitch.clearPoints = function() {
|
|
||||||
tStitch.stitches.x = new Array();
|
|
||||||
tStitch.stitches.y = new Array();
|
|
||||||
tStitch.stitches.jump = new Array();
|
|
||||||
}
|
|
||||||
tStitch.addPoint = function (x,y,jump) {
|
|
||||||
if (tStitch.debug) {
|
|
||||||
s = new String();
|
|
||||||
s = s + "adding Point (" + x + "," + y;
|
|
||||||
if (jump) s = s + ",jump";
|
|
||||||
s+= ")";
|
|
||||||
console.log(s);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (tStitch.stitches.x[tStitch.stitches.x.length-1] == x &&
|
|
||||||
tStitch.stitches.y[tStitch.stitches.y.length-1] == y
|
|
||||||
) {
|
|
||||||
//alert("pint exist");
|
|
||||||
} else {
|
|
||||||
tStitch.stitches.x.push(x);
|
|
||||||
tStitch.stitches.y.push(y);
|
|
||||||
tStitch.stitches.jump.push(jump);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
tStitch.toogleShowStitches = function() {
|
|
||||||
tStitch.draw_stitches = !tStitch.draw_stitches;
|
|
||||||
}
|
|
||||||
|
|
||||||
tStitch.getShowStitches = function() {
|
|
||||||
return tStitch.draw_stitches;
|
|
||||||
}
|
|
||||||
|
|
||||||
tStitch.toogleShowJumpStitches = function() {
|
|
||||||
tStitch.draw_jumps = !tStitch.draw_jumps;
|
|
||||||
}
|
|
||||||
|
|
||||||
tStitch.getShowJumpStitches = function() {
|
|
||||||
return tStitch.draw_jumps;
|
|
||||||
}
|
|
||||||
|
|
||||||
tStitch.signup = function() {
|
|
||||||
window.open('http://' + window.location.hostname + '/signup');
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
tStitch.upload = function(name) {
|
|
||||||
|
|
||||||
tStitch.debug_msg("uploading points... sending SAVE with num points= " + tStitch.stitches.x.length, true);
|
|
||||||
params = { "x[]": tStitch.stitches.x, "y[]":tStitch.stitches.y, "j[]":tStitch.stitches.jump, "name":name };
|
|
||||||
|
|
||||||
if (tStitch.stitches.x.length <= 1 || tStitch.stitches.y <= 1) {
|
|
||||||
new DialogBoxMorph().inform(
|
|
||||||
'Upload Error',
|
|
||||||
'No stitches to upload, please (re)generate a drawing first!',
|
|
||||||
world);
|
|
||||||
|
|
||||||
} else {
|
|
||||||
$.post(
|
|
||||||
"/upload",
|
|
||||||
data = params,
|
|
||||||
successCallback = function (data) {
|
|
||||||
if (data!="ERROR") {
|
|
||||||
/*new DialogBoxMorph().inform(
|
|
||||||
'Upload Success',
|
|
||||||
'Your embroidery file is ready and will be available at this url:\n' +
|
|
||||||
window.location.hostname + '/view/'+data,'\n',
|
|
||||||
world);*/
|
|
||||||
window.open('http://' + window.location.hostname + '/view/'+data, 'TurtleStitch file preview');
|
|
||||||
} else {
|
|
||||||
new DialogBoxMorph().inform(
|
|
||||||
'Upload Error',
|
|
||||||
'Sorry! Upload failed for an unknown reason',
|
|
||||||
world);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
|
||||||
$.fileDownload(tStitch.getBaseURL() +"stitchcode/backend/save.py", {
|
|
||||||
successCallback: function (html, url) {
|
|
||||||
alert("DSD");
|
|
||||||
},
|
|
||||||
failCallback: function (html, url) {
|
|
||||||
alert(
|
|
||||||
'Your file download just failed for this URL:' + url +
|
|
||||||
'\r\n' + 'Here was the resulting error HTML: \r\n'
|
|
||||||
+ html
|
|
||||||
);
|
|
||||||
},
|
|
||||||
|
|
||||||
httpMethod: "POST",
|
|
||||||
data: params
|
|
||||||
}); */
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* Sprite */
|
|
||||||
// modified SpriteMorph turtle functions
|
|
||||||
|
|
||||||
// SpriteMorph motion primitives
|
|
||||||
|
|
||||||
|
|
||||||
SpriteMorph.prototype.forward = function (steps) {
|
|
||||||
var dest,
|
|
||||||
dist = steps * this.parent.scale || 0;
|
|
||||||
|
|
||||||
oldpos = this.position();
|
|
||||||
|
|
||||||
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();
|
|
||||||
//this.drawLineX(dest);
|
|
||||||
|
|
||||||
tx = dest.x - this.parent.topLeft().x
|
|
||||||
ty = dest.y - this.parent.topLeft().y
|
|
||||||
tjump = !this.isDown;
|
|
||||||
|
|
||||||
if (tStitch.isFirst()) {
|
|
||||||
origx = oldpos.x - this.parent.topLeft().x;
|
|
||||||
origy = oldpos.y - this.parent.topLeft().y;
|
|
||||||
tStitch.addPoint(origx , origy ,true);
|
|
||||||
//alert("first");
|
|
||||||
//alert("orig: " + origx + "," + origy+ " tx/ty: " + tx + ", "+ ty + " - "+ this.position());
|
|
||||||
}
|
|
||||||
|
|
||||||
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;
|
|
||||||
|
|
||||||
oldX = this.position().x / stage.scale - stage.center().x + this.extent().x/2;
|
|
||||||
oldY = -(this.position().y / stage.scale - stage.center().y + this.extent().y/2);
|
|
||||||
|
|
||||||
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
|
|
||||||
tjump = !this.isDown;
|
|
||||||
|
|
||||||
if ( Math.abs(x-oldX)<=1.1 && Math.abs(y-oldY)<=1.1 ) {
|
|
||||||
if (tStitch.debug)
|
|
||||||
console.log("jump in place - don't add.");
|
|
||||||
} else {
|
|
||||||
if (tStitch.debug)
|
|
||||||
console.log("gotoXY "+ x + "," + y + " from: + " + oldX + "," + oldY);
|
|
||||||
tStitch.addPoint(tx,ty,tjump);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
// SpriteMorph drawing:
|
|
||||||
|
|
||||||
SpriteMorph.prototype.drawLine = function (start, dest) {
|
|
||||||
var stagePos = this.parent.bounds.origin,
|
|
||||||
stageScale = this.parent.scale,
|
|
||||||
context = this.parent.penTrails().getContext('2d'),
|
|
||||||
from = start.subtract(stagePos).divideBy(stageScale),
|
|
||||||
to = dest.subtract(stagePos).divideBy(stageScale),
|
|
||||||
damagedFrom = from.multiplyBy(stageScale).add(stagePos),
|
|
||||||
damagedTo = to.multiplyBy(stageScale).add(stagePos),
|
|
||||||
damaged = damagedFrom.rectangle(damagedTo).expandBy(
|
|
||||||
Math.max(this.size * stageScale / 2, 1)
|
|
||||||
).intersect(this.parent.visibleBounds()).spread();
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
if (this.isDown) {
|
|
||||||
context.lineWidth = this.size;
|
|
||||||
context.strokeStyle = this.color.toString();
|
|
||||||
if (this.useFlatLineEnds) {
|
|
||||||
context.lineCap = 'butt';
|
|
||||||
context.lineJoin = 'miter';
|
|
||||||
} else {
|
|
||||||
context.lineCap = 'round';
|
|
||||||
context.lineJoin = 'round';
|
|
||||||
}
|
|
||||||
context.beginPath();
|
|
||||||
context.moveTo(from.x, from.y);
|
|
||||||
context.lineTo(to.x, to.y);
|
|
||||||
context.stroke();
|
|
||||||
if (this.isWarped === false) {
|
|
||||||
this.world().broken.push(damaged);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
SpriteMorph.prototype.drawJumpLine = function (start, dest) {
|
|
||||||
var stagePos = this.parent.bounds.origin,
|
|
||||||
stageScale = this.parent.scale,
|
|
||||||
context = this.parent.penTrails().getContext('2d'),
|
|
||||||
from = start.subtract(stagePos).divideBy(stageScale),
|
|
||||||
to = dest.subtract(stagePos).divideBy(stageScale),
|
|
||||||
damagedFrom = from.multiplyBy(stageScale).add(stagePos),
|
|
||||||
damagedTo = to.multiplyBy(stageScale).add(stagePos),
|
|
||||||
damaged = damagedFrom.rectangle(damagedTo).expandBy(
|
|
||||||
Math.max(this.size * stageScale / 2, 1)
|
|
||||||
).intersect(this.parent.visibleBounds()).spread();
|
|
||||||
|
|
||||||
context.lineWidth = this.size;
|
|
||||||
context.strokeStyle = new Color(255, 0, 0).toString();
|
|
||||||
context.lineCap = 'round';
|
|
||||||
context.lineJoin = 'round';
|
|
||||||
context.beginPath();
|
|
||||||
context.moveTo(from.x, from.y);
|
|
||||||
context.lineTo(to.x, to.y);
|
|
||||||
context.stroke();
|
|
||||||
if (this.isWarped === false) {
|
|
||||||
this.world().broken.push(damaged);
|
|
||||||
}
|
|
||||||
|
|
||||||
};
|
|
||||||
|
|
||||||
SpriteMorph.prototype.drawStitch = function (dest) {
|
|
||||||
//dest = dest.subtract(this.topLeft());
|
|
||||||
var s = tStitch.draw_stitch_len;
|
|
||||||
var stagePos = this.parent.bounds.origin,
|
|
||||||
stageScale = this.parent.scale,
|
|
||||||
context = this.parent.penTrails().getContext('2d'),
|
|
||||||
to = dest.subtract(stagePos).divideBy(stageScale),
|
|
||||||
damagedFrom = new Point(to.x-s,to.y-s).multiplyBy(stageScale).add(stagePos),
|
|
||||||
damagedTo = new Point(to.x+s,to.y+s).multiplyBy(stageScale).add(stagePos),
|
|
||||||
damaged = damagedFrom.rectangle(damagedTo).expandBy(
|
|
||||||
Math.max(this.size * stageScale / 2, 1)
|
|
||||||
).intersect(this.parent.visibleBounds()).spread();
|
|
||||||
|
|
||||||
context.lineWidth = this.size;
|
|
||||||
context.strokeStyle = new Color(0, 0, 255).toString();
|
|
||||||
context.lineCap = 'round';
|
|
||||||
context.lineJoin = 'round';
|
|
||||||
|
|
||||||
context.beginPath();
|
|
||||||
context.moveTo(to.x - s, to.y - s );
|
|
||||||
context.lineTo(to.x + s, to.y + s);
|
|
||||||
context.stroke();
|
|
||||||
|
|
||||||
context.beginPath();
|
|
||||||
context.moveTo(to.x - s, to.y + s);
|
|
||||||
context.lineTo(to.x + s, to.y - s);
|
|
||||||
context.stroke();
|
|
||||||
if (this.isWarped === false) {
|
|
||||||
this.world().broken.push(damaged);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
SpriteMorph.prototype.clear = function () {
|
|
||||||
this.parent.clearPenTrails();
|
|
||||||
tStitch.clearPoints();
|
|
||||||
if (tStitch.debug) {
|
|
||||||
tStitch.debug_msg("",true);
|
|
||||||
}
|
|
||||||
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// SpriteMorph motion - adjustments due to nesting
|
|
||||||
|
|
||||||
SpriteMorph.prototype.moveBy = function (delta, justMe) {
|
|
||||||
// override the inherited default to make sure my parts follow
|
|
||||||
// unless it's justMe (a correction)
|
|
||||||
var start = this.isDown && !justMe && this.parent ?
|
|
||||||
this.rotationCenter() : null;
|
|
||||||
|
|
||||||
// add stitch controls
|
|
||||||
if (this.parent) {
|
|
||||||
if (this.parent.penTrails()) {
|
|
||||||
origin = this.rotationCenter();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
SpriteMorph.uber.moveBy.call(this, delta);
|
|
||||||
|
|
||||||
// add stitch controls
|
|
||||||
if (this.parent) {
|
|
||||||
if (this.parent.penTrails() && origin.x > 100) {
|
|
||||||
//alert(origin.x);
|
|
||||||
if (tStitch.draw_stitches) {
|
|
||||||
this.drawStitch(this.rotationCenter());
|
|
||||||
}
|
|
||||||
if (tStitch.draw_jumps && !this.isDown) {
|
|
||||||
this.drawJumpLine(origin,this.rotationCenter());
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
if (start) {
|
|
||||||
this.drawLine(start, this.rotationCenter());
|
|
||||||
}
|
|
||||||
if (!justMe) {
|
|
||||||
this.parts.forEach(function (part) {
|
|
||||||
part.moveBy(delta);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
/*
|
|
||||||
// Definition of new block categories
|
|
||||||
SpriteMorph.prototype.categories =
|
|
||||||
[
|
|
||||||
'motion',
|
|
||||||
'control',
|
|
||||||
'shapes',
|
|
||||||
'colors',
|
|
||||||
'sensing',
|
|
||||||
'operators',
|
|
||||||
'variables',
|
|
||||||
'lists',
|
|
||||||
'my blocks'
|
|
||||||
];
|
|
||||||
|
|
||||||
SpriteMorph.prototype.blockColor = {
|
|
||||||
motion : new Color(74, 108, 212),
|
|
||||||
shapes : new Color(143, 86, 227),
|
|
||||||
colors : new Color(207, 74, 217),
|
|
||||||
sound : new Color(207, 74, 217), // we need to keep this color for the zoom blocks dialog
|
|
||||||
control : new Color(230, 168, 34),
|
|
||||||
sensing : new Color(4, 148, 220),
|
|
||||||
operators : new Color(98, 194, 19),
|
|
||||||
variables : new Color(243, 118, 29),
|
|
||||||
lists : new Color(217, 77, 17),
|
|
||||||
other : new Color(150, 150, 150),
|
|
||||||
'my blocks': new Color(150, 150, 60),
|
|
||||||
};
|
|
||||||
|
|
||||||
// now move also "make a block to 'my blocks'
|
|
||||||
|
|
||||||
*/
|
|
||||||
|
|
||||||
|
|
||||||
Plik diff jest za duży
Load Diff
|
|
@ -1,146 +0,0 @@
|
||||||
// Stitchode's main changes and addtions to snap! go in here
|
|
||||||
// sorry it lacks proper documentation
|
|
||||||
|
|
||||||
|
|
||||||
var tStitch = {};
|
|
||||||
|
|
||||||
tStitch.debug = true;
|
|
||||||
tStitch.draw_jumps = true;
|
|
||||||
tStitch.draw_stitches = true;
|
|
||||||
tStitch.draw_stitch_len = 2;
|
|
||||||
|
|
||||||
tStitch.debug_msg = function (st,clear) {
|
|
||||||
o = new String();
|
|
||||||
if (!clear) {
|
|
||||||
o = document.getElementById("bug").innerHTML;
|
|
||||||
} else {
|
|
||||||
o = "";
|
|
||||||
}
|
|
||||||
o += st;
|
|
||||||
document.getElementById("bug").innerHTML = o;
|
|
||||||
};
|
|
||||||
|
|
||||||
tStitch.getBaseURL = function () {
|
|
||||||
var url = location.href; // entire url including querystring - also: window.location.href;
|
|
||||||
if (url.lastIndexOf('#') > 0) {
|
|
||||||
url = url.substring(0, url.lastIndexOf('#'));
|
|
||||||
}
|
|
||||||
url = url.substring(0, url.lastIndexOf('/'));
|
|
||||||
return url + "/";
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
tStitch.stitches = {};
|
|
||||||
tStitch.stitches.x = [];
|
|
||||||
tStitch.stitches.y = [];
|
|
||||||
tStitch.stitches.jump = [];
|
|
||||||
|
|
||||||
tStitch.isFirst = function() {
|
|
||||||
if (tStitch.stitches.x.length > 0)
|
|
||||||
return false;
|
|
||||||
else
|
|
||||||
return true;
|
|
||||||
};
|
|
||||||
|
|
||||||
tStitch.clearPoints = function() {
|
|
||||||
tStitch.stitches.x = [];
|
|
||||||
tStitch.stitches.y = [];
|
|
||||||
tStitch.stitches.jump = [];
|
|
||||||
};
|
|
||||||
|
|
||||||
tStitch.addPoint = function (x,y,jump) {
|
|
||||||
if (tStitch.debug) {
|
|
||||||
s = new String();
|
|
||||||
s = s + "adding Point (" + x + "," + y;
|
|
||||||
if (jump) s = s + ",jump";
|
|
||||||
s+= ")";
|
|
||||||
console.log(s);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (tStitch.stitches.x[tStitch.stitches.x.length-1] == x &&
|
|
||||||
tStitch.stitches.y[tStitch.stitches.y.length-1] == y
|
|
||||||
) {
|
|
||||||
//alert("pint exist");
|
|
||||||
} else {
|
|
||||||
tStitch.stitches.x.push(x);
|
|
||||||
tStitch.stitches.y.push(y);
|
|
||||||
tStitch.stitches.jump.push(jump);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
tStitch.toogleShowStitches = function() {
|
|
||||||
tStitch.draw_stitches = !tStitch.draw_stitches;
|
|
||||||
};
|
|
||||||
|
|
||||||
tStitch.getShowStitches = function() {
|
|
||||||
return tStitch.draw_stitches;
|
|
||||||
};
|
|
||||||
|
|
||||||
tStitch.toogleShowJumpStitches = function() {
|
|
||||||
tStitch.draw_jumps = !tStitch.draw_jumps;
|
|
||||||
};
|
|
||||||
|
|
||||||
tStitch.getShowJumpStitches = function() {
|
|
||||||
return tStitch.draw_jumps;
|
|
||||||
};
|
|
||||||
|
|
||||||
tStitch.signup = function() {
|
|
||||||
window.open('http://' + window.location.hostname + '/signup');
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
tStitch.upload = function(name) {
|
|
||||||
|
|
||||||
tStitch.debug_msg("uploading points... sending SAVE with num points= " + tStitch.stitches.x.length, true);
|
|
||||||
params = { "x[]": tStitch.stitches.x, "y[]":tStitch.stitches.y, "j[]":tStitch.stitches.jump, "name":name };
|
|
||||||
|
|
||||||
if (tStitch.stitches.x.length <= 1 || tStitch.stitches.y <= 1) {
|
|
||||||
new DialogBoxMorph().inform(
|
|
||||||
'Upload Error',
|
|
||||||
'No stitches to upload, please (re)generate a drawing first!',
|
|
||||||
world);
|
|
||||||
|
|
||||||
} else {
|
|
||||||
$.post(
|
|
||||||
"/upload",
|
|
||||||
data = params,
|
|
||||||
successCallback = function (data) {
|
|
||||||
if (data!="ERROR") {
|
|
||||||
/*new DialogBoxMorph().inform(
|
|
||||||
'Upload Success',
|
|
||||||
'Your embroidery file is ready and will be available at this url:\n' +
|
|
||||||
window.location.hostname + '/view/'+data,'\n',
|
|
||||||
world);*/
|
|
||||||
window.open('http://' + window.location.hostname + '/view/'+data, 'TurtleStitch file preview');
|
|
||||||
} else {
|
|
||||||
new DialogBoxMorph().inform(
|
|
||||||
'Upload Error',
|
|
||||||
'Sorry! Upload failed for an unknown reason',
|
|
||||||
world);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
|
||||||
$.fileDownload(tStitch.getBaseURL() +"stitchcode/backend/save.py", {
|
|
||||||
successCallback: function (html, url) {
|
|
||||||
alert("DSD");
|
|
||||||
},
|
|
||||||
failCallback: function (html, url) {
|
|
||||||
alert(
|
|
||||||
'Your file download just failed for this URL:' + url +
|
|
||||||
'\r\n' + 'Here was the resulting error HTML: \r\n'
|
|
||||||
+ html
|
|
||||||
);
|
|
||||||
},
|
|
||||||
|
|
||||||
httpMethod: "POST",
|
|
||||||
data: params
|
|
||||||
}); */
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
IDE_Morph.prototype.uploadStitches = function () {
|
|
||||||
tStitch.upload();
|
|
||||||
};
|
|
||||||
|
|
@ -1,21 +0,0 @@
|
||||||
var tstools = {};
|
|
||||||
|
|
||||||
tstools.getBaseURL = function () {
|
|
||||||
var url = location.href; // entire url including querystring - also: window.location.href;
|
|
||||||
if (url.lastIndexOf('#') > 0) {
|
|
||||||
url = url.substring(0, url.lastIndexOf('#'));
|
|
||||||
}
|
|
||||||
url = url.substring(0, url.lastIndexOf('/'));
|
|
||||||
return url + "/";
|
|
||||||
};
|
|
||||||
|
|
||||||
tstools.debug_msg = function (st, clear=false) {
|
|
||||||
o = new String();
|
|
||||||
if (!clear) {
|
|
||||||
o = document.getElementById("debug").innerHTML;
|
|
||||||
} else {
|
|
||||||
o = "";
|
|
||||||
}
|
|
||||||
o = st + "<br />" + o;
|
|
||||||
document.getElementById("debug").innerHTML = o;
|
|
||||||
};
|
|
||||||
|
|
@ -6,7 +6,10 @@
|
||||||
*/
|
*/
|
||||||
|
|
||||||
function TurtleShepherd() {
|
function TurtleShepherd() {
|
||||||
|
this.w = 480;
|
||||||
|
this.h = 360;
|
||||||
this.clear();
|
this.clear();
|
||||||
|
this.gridSize = 50;
|
||||||
}
|
}
|
||||||
|
|
||||||
TurtleShepherd.prototype.clear = function() {
|
TurtleShepherd.prototype.clear = function() {
|
||||||
|
|
@ -18,8 +21,6 @@ TurtleShepherd.prototype.clear = function() {
|
||||||
this.steps = 0;
|
this.steps = 0;
|
||||||
this.initX = 0;
|
this.initX = 0;
|
||||||
this.initY = 0;
|
this.initY = 0;
|
||||||
this.w = 480;
|
|
||||||
this.h = 360;
|
|
||||||
this.scale = 1;
|
this.scale = 1;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -85,16 +86,30 @@ TurtleShepherd.prototype.zoomOut = function() {
|
||||||
if (DEBUG) this.debug_msg("zoom to scale "+ this.scale );
|
if (DEBUG) this.debug_msg("zoom to scale "+ this.scale );
|
||||||
};
|
};
|
||||||
|
|
||||||
TurtleShepherd.prototype.setDimensions = function(x,y) {
|
TurtleShepherd.prototype.setStageDimensions = function(w,h) {
|
||||||
this.w = x;
|
this.w = w;
|
||||||
this.h = y;
|
this.h = h;
|
||||||
|
/*
|
||||||
|
document.getElementById("svg2").style.left = x + "px";
|
||||||
|
document.getElementById("svg2").style.top = y+ "px";
|
||||||
|
*/
|
||||||
|
document.getElementById("svg2").style.width = w + "px";
|
||||||
|
document.getElementById("svg2").style.height = h + "px";
|
||||||
|
document.getElementById("svg2").style.right = "0";
|
||||||
|
document.getElementById("svg2").style.bottom = "0";
|
||||||
|
};
|
||||||
|
|
||||||
|
TurtleShepherd.prototype.setStagePosition = function(x,y) {
|
||||||
|
//document.getElementById("svg2").style.top = y + "px";
|
||||||
|
//document.getElementById("svg2").style.left = x + "px";
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
TurtleShepherd.prototype.renderGrid = function(size=50) {
|
TurtleShepherd.prototype.renderGrid = function(size) {
|
||||||
return '<defs>\n' +
|
size = this.gridSize;
|
||||||
'<pattern id="grid" width="'+size+'" height="'+size+'" patternUnits="userSpaceOnUse">\n' +
|
return '<defs>' +
|
||||||
'<path d="M '+size+' 0 L 0 0 0 '+size+'" fill="none" stroke="gray" stroke-width="0.5"/>\n' +
|
'<pattern id="grid" width="'+size+'" height="'+size+'" patternUnits="userSpaceOnUse">' +
|
||||||
|
'<path d="M '+size+' 0 L 0 0 0 '+size+'" fill="none" stroke="gray" stroke-width="0.5"/>' +
|
||||||
'</pattern>' +
|
'</pattern>' +
|
||||||
'</defs>\n';
|
'</defs>\n';
|
||||||
};
|
};
|
||||||
|
|
@ -103,7 +118,7 @@ TurtleShepherd.prototype.toSVG = function() {
|
||||||
|
|
||||||
//var svgStr = "<?xml version=\"1.0\" standalone=\"no\"?>\n";
|
//var svgStr = "<?xml version=\"1.0\" standalone=\"no\"?>\n";
|
||||||
//svgStr += "<!DOCTYPE svg PUBLIC \"-//W3C//DTD SVG 1.1//EN\" \n\"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd\">\n";
|
//svgStr += "<!DOCTYPE svg PUBLIC \"-//W3C//DTD SVG 1.1//EN\" \n\"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd\">\n";
|
||||||
svgStr = '<svg width="' + this.w +'" height="' +this.h + '"' +
|
svgStr = '<svg width="' +this.w + '" height="' +this.h + '"' +
|
||||||
' viewBox="' + (-1 * this.w / 2 * this.scale) + ' ' +
|
' viewBox="' + (-1 * this.w / 2 * this.scale) + ' ' +
|
||||||
(-1 * this.h / 2 * this.scale) + ' ' +
|
(-1 * this.h / 2 * this.scale) + ' ' +
|
||||||
(this.w* this.scale) + ' ' +
|
(this.w* this.scale) + ' ' +
|
||||||
|
|
@ -182,18 +197,20 @@ TurtleShepherd.prototype.toSVG = function() {
|
||||||
|
|
||||||
TurtleShepherd.prototype.reRender = function(cnv) {
|
TurtleShepherd.prototype.reRender = function(cnv) {
|
||||||
//load a svg snippet in the canvas with id = 'svg'
|
//load a svg snippet in the canvas with id = 'svg'
|
||||||
canvas = document.getElementById('svg');
|
//canvas = document.getElementById('svg');
|
||||||
document.getElementById("code").innerHTML = turtleShepherd.toSVG();
|
document.getElementById("code").innerHTML = turtleShepherd.toSVG();
|
||||||
document.getElementById("svg2").innerHTML = turtleShepherd.toSVG();
|
document.getElementById("svg2").innerHTML = turtleShepherd.toSVG();
|
||||||
//canvg(document.getElementById('svg'), cmdCache.toSVG());
|
//canvg(document.getElementById('svg'), turtleShepherd.toSVG());
|
||||||
|
|
||||||
//canvg(cnv, cmdCache.toSVG());
|
canvg(cnv, turtleShepherd.toSVG());
|
||||||
|
|
||||||
//var cnv = caller.parent.penTrails();
|
//var cnv = caller.parent.penTrails();
|
||||||
//var ctx = cnv.getContext('2d');
|
//alert(cnv);
|
||||||
//ctx.drawSvg(cmdCache.toSVG(), 0, 0, cnv.width, cnv.height);
|
//if (cnv) {
|
||||||
|
// var ctx = cnv.getContext('2d');
|
||||||
}
|
// ctx.drawSvg(turtleShepherd.toSVG(), 0, 0, cnv.width, cnv.height);
|
||||||
|
//}
|
||||||
|
};
|
||||||
|
|
||||||
TurtleShepherd.prototype.debug_msg = function (st, clear) {
|
TurtleShepherd.prototype.debug_msg = function (st, clear) {
|
||||||
o = "";
|
o = "";
|
||||||
|
|
|
||||||
|
|
@ -4,9 +4,9 @@ DEBUG = true;
|
||||||
|
|
||||||
function reDraw(cnv) {
|
function reDraw(cnv) {
|
||||||
//load a svg snippet in the canvas with id = 'svg'
|
//load a svg snippet in the canvas with id = 'svg'
|
||||||
canvas = document.getElementById('svg');
|
//canvas = document.getElementById('svg');
|
||||||
//document.getElementById("code").innerHTML = cmdCache.toSVG();
|
//document.getElementById("code").innerHTML = cmdCache.toSVG();
|
||||||
document.getElementById("svg2").innerHTML = turtleShepherd.toSVG();
|
// document.getElementById("svg2").innerHTML = turtleShepherd.toSVG();
|
||||||
//canvg(document.getElementById('svg'), cmdCache.toSVG());
|
//canvg(document.getElementById('svg'), cmdCache.toSVG());
|
||||||
|
|
||||||
//canvg(cnv, cmdCache.toSVG());
|
//canvg(cnv, cmdCache.toSVG());
|
||||||
|
|
|
||||||
Ładowanie…
Reference in New Issue