// Copyright (c) 2014-16 Walter Bender
//
// This program is free software; you can redistribute it and/or
// modify it under the terms of the The GNU Affero General Public
// License as published by the Free Software Foundation; either
// version 3 of the License, or (at your option) any later version.
//
// You should have received a copy of the GNU Affero General Public
// License along with this library; if not, write to the Free Software
// Foundation, 51 Franklin Street, Suite 500 Boston, MA 02110-1335 USA
//
// Defined below are the inline SVGs used for turtles and blocks. SVGs
// are modified by fill_color, stroke_color, block_label, et al. using
// .replace, e.g.,
// BASICBLOCK.replace(/fill_color/g,
// PALETTEFILLCOLORS['turtle']).replace(/stroke_color/g,
// PALETTESTROKECOLORS['turtle']).replace('block_label', 'clear'));
// Chrome can load the image type "data:image/svg+xml;utf8," inline,
// but Firefox cannot, so we set it in the async methods instead.
// The relative position of the button added to collapsible blocks,
// e.g., start and action. (TODO: Calculate these values.)
const COLLAPSEBUTTONXOFF = -48;
const COLLAPSEBUTTONYOFF = 9;
// With default scaling, blocks are multiples of a standard height.
const STANDARDBLOCKHEIGHT = 42;
const DEFAULTBLOCKSCALE = 1.5; // scale used in block factory
// The default turtles are generated from the TURTLESVG template.
const FILLCOLORS = ['#ed001d', '#a34600', '#fb5f00', '#6cc600', '#00843c', '#008283', '#007ac9', '#005dff', '#b500e3', '#ec008a'];
const STROKECOLORS = ['#ffada6', '#ffa300', '#ffc000', '#037700', '#00fa8c', '#00f3db', '#00e3ff', '#8dceff', '#f3aeff', '#ff97d5'];
// (fill_color, stroke_color)
const TURTLESVG = '';
// Offsets for placing text ontop of value blocks.
const TEXTX = 26;
const TEXTY = 26;
const VALUETEXTX = 70;
// Collapse text label positions
const COLLAPSETEXTX = 10;
const COLLAPSETEXTY = 40;
// Artwork position in Media Block
const MEDIASAFEAREA = [40, 4, 108, 80];
// Palette-related artwork
const HIGHLIGHTCOLOR = '#FFFFFF';
const ACTIVECOLOR = '#212121';
function showMaterialHighlight(x, y, r, event, scale, stage) {
var circles = {
highlight: new createjs.Shape(),
active: new createjs.Shape()
};
circles.highlight.graphics.f(HIGHLIGHTCOLOR).drawCircle(0, 0, r);
circles.highlight.alpha = 0.3;
circles.highlight.x = x;
circles.highlight.y = y;
circles.active.graphics.f(ACTIVECOLOR).drawCircle(0, 0, r);
circles.active.alpha = 0;
stage.addChild(circles.highlight, circles.active);
createjs.Tween.get(circles.active).to({scaleX: 0.3, scaleY: 0.3, x: event.rawX / scale, y: event.rawY / scale}).to({scaleX: 1, scaleY: 1, x: x, y: y}, 650, createjs.Ease.circInOut);
createjs.Tween.get(circles.active).to({alpha: 0.05}).to({alpha: 0.3}, 400);
return circles;
}
function hideButtonHighlight(circles, stage) {
// Un-real circles!
if (circles.active === undefined) {
return;
}
createjs.Tween.get(circles.active).to({alpha: 0}, 400);
createjs.Tween.get(circles.highlight).to({alpha: 0}, 400);
setTimeout(function() {
stage.removeChild(circles.active, circles.highlight);
}, 650);
}
function hideButtonHighlight(circles, stage) {
// Un-real circles!
if (circles.active === undefined) {
return;
}
createjs.Tween.get(circles.active).to({alpha: 0}, 400);
createjs.Tween.get(circles.highlight).to({alpha: 0}, 400);
setTimeout(function() {
stage.removeChild(circles.active, circles.highlight);
}, 650);
}
function hidePaletteNameDisplay(palette_text, stage){
setTimeout(function(){
stage.removeChild(palette_text);
}, 150);
}
const MENUWIDTH = 200;
const PALETTEFILLER = '';
const PALETTEHEADER = '';
const PALETTEBUTTON = '';
// samples-viewer related artwork
const BACKGROUND = '';
const NEXTBUTTON = '';
const PREVBUTTON = '';
// for print and error messages
const MSGBLOCK = '';
// boundary for screen
const BOUNDARY = '';
// border for trashcan
const BORDER = '';
// palette artwork
// Palettes have different colored blocks
// hue, value, chroma
const PALETTECOLORS = {
'turtle': [37.5, 70, 50],
'pen': [57.5, 50, 28],
'boxes': [12.5, 60, 80],
'action': [22.5, 80, 57],
'media': [57.5, 70, 28],
'number': [0, 70, 42],
'boolean': [30, 80, 57],
'flow': [15, 60, 50],
'sensors': [7.5, 60, 80],
'extras': [7.5, 50, 50],
'myblocks': [57.5, 70, 14],
'heap': [17.5, 60, 70],
};
// These colors are calculated at load time from the colors defined above.
var PALETTEFILLCOLORS = {
};
var PALETTESTROKECOLORS = {
};
var PALETTEHIGHLIGHTCOLORS = {
};
var HIGHLIGHTSTROKECOLORS = {
};
const DISABLEDFILLCOLOR = '#AEAEAE';
const DISABLEDSTROKECOLOR = '#7A7A7A';
const UPICON = '';
const DOWNICON = '';
const FADEDUPICON = '';
const FADEDDOWNICON = '';
const CLOSEICON = '';
const TURTLEPALETTEICON = '';
const PENPALETTEICON = '';
const NUMBERPALETTEICON = '';
const BOOLEANPALETTEICON = '';
const FLOWPALETTEICON = '';
const BLOCKSPALETTEICON = '';
const ACTIONPALETTEICON = '';
const MEDIAPALETTEICON = ' ';
const SENSORSPALETTEICON = ' ';
const EXTRASPALETTEICON = ' ';
const MYBLOCKSPALETTEICON = '';
const HEAPPALETTEICON = '';
const PALETTEICONS = {
'turtle': TURTLEPALETTEICON,
'pen': PENPALETTEICON,
'number': NUMBERPALETTEICON,
'boolean': BOOLEANPALETTEICON,
'flow': FLOWPALETTEICON,
'boxes': BLOCKSPALETTEICON,
'action': ACTIONPALETTEICON,
'media': MEDIAPALETTEICON,
'sensors': SENSORSPALETTEICON,
'extras': EXTRASPALETTEICON,
'myblocks': MYBLOCKSPALETTEICON,
'heap': HEAPPALETTEICON
};