mirror of
https://github.com/overte-org/overte.git
synced 2025-08-16 09:31:57 +02:00
Add new dynamic and colored brushes.
- Add dynamic hue brush; - Add dynamic (animated) rotation and translation brush; - Add colored brushes that already have the colors set (user can't change it);
This commit is contained in:
Artur Gomes
parent
b6ccce3904
commit
c8d475dff1
15 changed files with 460 additions and 135 deletions
Binary file not shown.
|
Before Width: | Height: | Size: 24 KiB |
BIN
scripts/system/fingerPaint/content/brushes/colored/breakfast.png
Normal file
BIN
scripts/system/fingerPaint/content/brushes/colored/breakfast.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 934 B |
BIN
scripts/system/fingerPaint/content/brushes/colored/chique.png
Normal file
BIN
scripts/system/fingerPaint/content/brushes/colored/chique.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 919 B |
BIN
scripts/system/fingerPaint/content/brushes/colored/hawaii.png
Normal file
BIN
scripts/system/fingerPaint/content/brushes/colored/hawaii.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 944 B |
BIN
scripts/system/fingerPaint/content/brushes/colored/newton.png
Normal file
BIN
scripts/system/fingerPaint/content/brushes/colored/newton.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 628 B |
BIN
scripts/system/fingerPaint/content/brushes/colored/pastels.png
Normal file
BIN
scripts/system/fingerPaint/content/brushes/colored/pastels.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 934 B |
BIN
scripts/system/fingerPaint/content/brushes/colored/softy.png
Normal file
BIN
scripts/system/fingerPaint/content/brushes/colored/softy.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 928 B |
|
|
@ -0,0 +1,36 @@
|
|||
//This file is just used for the superclass
|
||||
function DynamicBrushClass() {}
|
||||
|
||||
/**
|
||||
* Called on every frame draw after the user stops painting
|
||||
*
|
||||
* @abstract
|
||||
* @param deltaSeconds, the number of seconds past since the last frame was rendered
|
||||
* @param entityID: the id of the polyline being drawn
|
||||
* @param fingerOverlayID: the id of the overlay that shows over the finger when using fingerpaint
|
||||
*/
|
||||
DynamicBrushClass.prototype.onUpdate = function(deltaSeconds, entityIDs) {
|
||||
//To be implemented on the child
|
||||
throw "Abstract method onUpdate not implemented";
|
||||
}
|
||||
|
||||
/**
|
||||
* This function updates the user data so in the next frame the animation gets the previous values.
|
||||
*
|
||||
* @param entityID: the id of the polyline being animated
|
||||
* @param dynamicBrushObject: the animation object (should be a subclass of dynamicBrush)
|
||||
*/
|
||||
DynamicBrushClass.prototype.updateUserData = function(entityID, dynamicBrushObject) {
|
||||
//print("Saving class " + dynamicBrushObject.NAME);
|
||||
var prevUserData = Entities.getEntityProperties(entityID).userData;
|
||||
if (prevUserData) {
|
||||
prevUserData = prevUserData == "" ? new Object() : JSON.parse(prevUserData); //preserve other possible user data
|
||||
if (prevUserData.animations != null && prevUserData.animations[dynamicBrushObject.NAME] != null) {
|
||||
delete prevUserData.animations[dynamicBrushObject.NAME];
|
||||
prevUserData.animations[dynamicBrushObject.NAME] = dynamicBrushObject;
|
||||
}
|
||||
Entities.editEntity(entityID, {userData: JSON.stringify(prevUserData)});
|
||||
}
|
||||
}
|
||||
|
||||
DynamicBrush = DynamicBrushClass;
|
||||
|
|
@ -0,0 +1,64 @@
|
|||
(function() {
|
||||
Script.include("dynamicBrushesList.js");
|
||||
var UPDATE_TIME = 33; //run at aproximatelly 30fps
|
||||
var self = this;
|
||||
this.preload = function(entityID) {
|
||||
print("After adding script 2 : " + JSON.stringify(Entities.getEntityProperties(entityID)));
|
||||
self.intervalID = Script.setInterval(function() {
|
||||
if (Vec3.withinEpsilon(MyAvatar.position, Entities.getEntityProperties(entityID).position, 3)) {
|
||||
var userData = Entities.getEntityProperties(entityID).userData;
|
||||
//print("UserData: " + userData);
|
||||
|
||||
if (userData) {
|
||||
var userDataObject = JSON.parse(userData);
|
||||
var animationObject = userDataObject.animations;
|
||||
//print("Playing animation " + JSON.stringify(animationObject));
|
||||
var newAnimationObject = null;
|
||||
Object.keys(animationObject).forEach(function(animationName) {
|
||||
newAnimationObject = animationObject[animationName];
|
||||
//print("Proto 0001: " + JSON.stringify(newAnimationObject));
|
||||
newAnimationObject.__proto__ = DynamicBrushesInfo[animationName].proto;
|
||||
newAnimationObject.onUpdate(UPDATE_TIME, entityID);
|
||||
});
|
||||
}
|
||||
}
|
||||
}, UPDATE_TIME);
|
||||
};
|
||||
this.unload = function() {
|
||||
Script.clearInterval(self.intervalID);
|
||||
}
|
||||
});
|
||||
/*
|
||||
(function() {
|
||||
Script.include("dynamicBrushesList.js");
|
||||
var UPDATE_TIME = 10;
|
||||
var self = this;
|
||||
this.preload = function(entityID) {
|
||||
Script.setTimeout(playAnimations, UPDATE_TIME);
|
||||
function playAnimations() {
|
||||
var userData = Entities.getEntityProperties(entityID).userData;
|
||||
//print("UserData: " + userData);
|
||||
|
||||
if (userData) {
|
||||
var userDataObject = JSON.parse(userData);
|
||||
var animationObject = userDataObject.animations;
|
||||
//print("Playing animation " + JSON.stringify(animationObject));
|
||||
var newAnimationObject = null;
|
||||
Object.keys(animationObject).forEach(function(animationName) {
|
||||
newAnimationObject = animationObject[animationName];
|
||||
//print("Proto 0001: " + JSON.stringify(newAnimationObject));
|
||||
newAnimationObject.__proto__ = DynamicBrushesInfo[animationName].proto;
|
||||
if (userDataObject.isDrawing) {
|
||||
newAnimationObject.onDraw(UPDATE_TIME, entityID, null);
|
||||
} else {
|
||||
newAnimationObject.onUpdate(UPDATE_TIME, entityID, null);
|
||||
}
|
||||
});
|
||||
}
|
||||
Script.setTimeout(playAnimations, UPDATE_TIME);
|
||||
}
|
||||
};
|
||||
});*/
|
||||
|
||||
|
||||
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
Script.include("dynamicHueBrush.js");
|
||||
Script.include("dynamicRotationBrush.js");
|
||||
Script.include("dynamicTranslationBrush.js");
|
||||
|
||||
DynamicBrushesInfo = {
|
||||
DynamicHueBrush: {
|
||||
isEnabled: false,
|
||||
proto: DynamicHueBrush.prototype,
|
||||
settings: null,
|
||||
},
|
||||
|
||||
DynamicRotationBrush: {
|
||||
isEnabled: false,
|
||||
proto: DynamicRotationBrush.prototype,
|
||||
settings: null,
|
||||
},
|
||||
|
||||
DynamicTranslationBrush: {
|
||||
isEnabled: false,
|
||||
proto: DynamicTranslationBrush.prototype,
|
||||
settings: null,
|
||||
},
|
||||
}
|
||||
|
||||
dynamicBrushFactory = function(dynamicBrushName, settings) {
|
||||
switch (dynamicBrushName) {
|
||||
case "DynamicHueBrush":
|
||||
return new DynamicHueBrush(settings);
|
||||
case "DynamicRotationBrush":
|
||||
return new DynamicRotationBrush(settings);
|
||||
case "DynamicTranslationBrush":
|
||||
return new DynamicTranslationBrush(settings);
|
||||
default:
|
||||
throw new Error("Could not instantiate " + dynamicBrushName);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,63 @@
|
|||
//Superclass
|
||||
Script.include("dynamicBrush.js");
|
||||
|
||||
function DynamicHueBrushClass(settings) {
|
||||
//dynamic brush vars
|
||||
DynamicBrush.call(this);
|
||||
print("Starting dynamic hue brush");
|
||||
this.hsvColor = {hue: 0, saturation: 1.0, value: 1.0};
|
||||
this.dynamicColor = {red: 0, green: 0, blue: 0};
|
||||
}
|
||||
|
||||
DynamicHueBrushClass.prototype.DYNAMIC_BRUSH_TIME = 10; //inteval in milliseconds to update the brush width;
|
||||
DynamicHueBrushClass.prototype.DYNAMIC_BRUSH_INCREMENT = 0.5; //linear increment of brush size;
|
||||
DynamicHueBrushClass.prototype.NAME = "DynamicHueBrush"; //linear increment of brush size;
|
||||
|
||||
DynamicHueBrushClass.prototype.onUpdate = function(deltaSeconds, entityID) {
|
||||
print("Dynamic Hue Brush");
|
||||
this.hsvColor.hue = this.hsvColor.hue + ((deltaSeconds * this.DYNAMIC_BRUSH_INCREMENT)/this.DYNAMIC_BRUSH_TIME);
|
||||
this.hsvColor.hue = this.hsvColor.hue >= 360 ? 0 : this.hsvColor.hue; //restart hue cycle
|
||||
this.dynamicColor = this.convertHsvToRgb(this.hsvColor);
|
||||
Entities.editEntity(entityID, { color : this.dynamicColor});
|
||||
this.parent.updateUserData(entityID, this);
|
||||
}
|
||||
|
||||
|
||||
DynamicHueBrushClass.prototype.convertHsvToRgb = function(hsvColor) {
|
||||
var c = hsvColor.value * hsvColor.saturation;
|
||||
var x = c * (1 - Math.abs((hsvColor.hue/60) % 2 - 1));
|
||||
var m = hsvColor.value - c;
|
||||
var rgbColor = new Object();
|
||||
if (hsvColor.hue >= 0 && hsvColor.hue < 60) {
|
||||
rgbColor.red = (c + m) * 255;
|
||||
rgbColor.green = (x + m) * 255;
|
||||
rgbColor.blue = (0 + m) * 255;
|
||||
} else if (hsvColor.hue >= 60 && hsvColor.hue < 120) {
|
||||
rgbColor.red = (x + m) * 255;
|
||||
rgbColor.green = (c + m) * 255;
|
||||
rgbColor.blue = (0 + m) * 255;
|
||||
} else if (hsvColor.hue >= 120 && hsvColor.hue < 180) {
|
||||
rgbColor.red = (0 + m) * 255;
|
||||
rgbColor.green = (c + m) * 255;
|
||||
rgbColor.blue = (x + m) * 255;
|
||||
} else if (hsvColor.hue >= 180 && hsvColor.hue < 240) {
|
||||
rgbColor.red = (0 + m) * 255;
|
||||
rgbColor.green = (x + m) * 255;
|
||||
rgbColor.blue = (c + m) * 255;
|
||||
} else if (hsvColor.hue >= 240 && hsvColor.hue < 300) {
|
||||
rgbColor.red = (x + m) * 255;
|
||||
rgbColor.green = (0 + m) * 255;
|
||||
rgbColor.blue = (c + m) * 255;
|
||||
} else if (hsvColor.hue >= 300 && hsvColor.hue < 360) {
|
||||
rgbColor.red = (c + m) * 255;
|
||||
rgbColor.green = (0 + m) * 255;
|
||||
rgbColor.blue = (x + m) * 255;
|
||||
}
|
||||
return rgbColor;
|
||||
}
|
||||
|
||||
//DynamicHueBrushClass.prototype = Object.create(DynamicBrush.prototype);
|
||||
DynamicHueBrushClass.prototype.constructor = DynamicHueBrushClass;
|
||||
DynamicHueBrushClass.prototype.parent = DynamicBrush.prototype;
|
||||
|
||||
DynamicHueBrush = DynamicHueBrushClass;
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
//Superclass
|
||||
Script.include("dynamicBrush.js");
|
||||
|
||||
function DynamicRotationBrushClass(settings) {
|
||||
//dynamic brush vars
|
||||
DynamicBrush.call(this);
|
||||
print("Starting dynamic rotation brush");
|
||||
this.angle = 0;
|
||||
this.identityAxis = {x: settings.axis == "pitch" ? 1 : 0, y: settings.axis == "yaw" ? 1 : 0, z: settings.axis == "roll" ? 1 : 0};
|
||||
}
|
||||
|
||||
DynamicRotationBrushClass.prototype.constructor = DynamicRotationBrushClass;
|
||||
DynamicRotationBrushClass.prototype.parent = DynamicBrush.prototype;
|
||||
|
||||
DynamicRotationBrushClass.prototype.DYNAMIC_BRUSH_TIME = 100; //inteval in milliseconds to update the entity rotation;
|
||||
DynamicRotationBrushClass.prototype.DYNAMIC_BRUSH_INCREMENT = 5; //linear increment of brush size;
|
||||
DynamicRotationBrushClass.prototype.NAME = "DynamicRotationBrush"; //linear increment of brush size;
|
||||
|
||||
DynamicRotationBrushClass.prototype.onUpdate = function(deltaSeconds, entityID) {
|
||||
this.angle = this.angle + ((deltaSeconds * this.DYNAMIC_BRUSH_INCREMENT)/this.DYNAMIC_BRUSH_TIME);
|
||||
this.angle = this.angle >= 360 ? 0 : this.angle; //restart hue cycle
|
||||
var rotation = Vec3.multiply(this.angle, this.identityAxis);
|
||||
//print("rotation " + JSON.stringify(rotation));
|
||||
Entities.editEntity(entityID, {rotation : Quat.fromPitchYawRollDegrees(rotation.x, rotation.y, rotation.z)});
|
||||
this.parent.updateUserData(entityID, this);
|
||||
}
|
||||
|
||||
DynamicRotationBrush = DynamicRotationBrushClass;
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
//Superclass
|
||||
Script.include("dynamicBrush.js");
|
||||
|
||||
function DynamicTranslationBrushClass(settings) {
|
||||
//dynamic brush vars
|
||||
DynamicBrush.call(this);
|
||||
print("Starting dynamic Translation brush");
|
||||
this.startingPosition = null;
|
||||
this.translation = 0;
|
||||
this.translationAxis = settings.axis;
|
||||
}
|
||||
|
||||
DynamicTranslationBrushClass.prototype.constructor = DynamicTranslationBrushClass;
|
||||
DynamicTranslationBrushClass.prototype.parent = DynamicBrush.prototype;
|
||||
|
||||
DynamicTranslationBrushClass.prototype.DYNAMIC_BRUSH_TIME = 10; //inteval in milliseconds to update the brush width;
|
||||
DynamicTranslationBrushClass.prototype.DYNAMIC_BRUSH_INCREMENT = 0.005; //linear increment of brush size;
|
||||
DynamicTranslationBrushClass.prototype.MAX_TRANSLATION = 2;
|
||||
DynamicTranslationBrushClass.prototype.NAME = "DynamicTranslationBrush"; //linear increment of brush size;
|
||||
|
||||
DynamicTranslationBrushClass.prototype.onUpdate = function(deltaSeconds, entityID) {
|
||||
var currentPosition = Entities.getEntityProperties(entityID).position;
|
||||
//print("currentPosition " + JSON.stringify(currentPosition));
|
||||
if (this.startingPosition == null) {
|
||||
//print("setting starting position ");
|
||||
this.startingPosition = currentPosition;
|
||||
}
|
||||
this.translation = this.translation + ((deltaSeconds * this.DYNAMIC_BRUSH_INCREMENT)/this.DYNAMIC_BRUSH_TIME);
|
||||
this.translation = Math.abs(this.startingPosition[this.translationAxis]) + this.translation >=
|
||||
Math.abs(this.startingPosition[this.translationAxis]) + this.MAX_TRANSLATION ? 0 : this.translation;
|
||||
//print(Math.abs(this.startingPosition.z) + this.translation + " >= " + Math.abs(this.startingPosition.z) + this.MAX_TRANSLATION);
|
||||
var nextPosition = {x: this.startingPosition.x, y: this.startingPosition.y, z: this.startingPosition.z};
|
||||
nextPosition[this.translationAxis] = this.translation + nextPosition[this.translationAxis];
|
||||
Entities.editEntity(entityID, {position : nextPosition});
|
||||
this.parent.updateUserData(entityID, this);
|
||||
}
|
||||
|
||||
DynamicTranslationBrush = DynamicTranslationBrushClass;
|
||||
|
|
@ -7,7 +7,6 @@
|
|||
// Distributed under the Apache License, Version 2.0.
|
||||
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
|
||||
//
|
||||
|
||||
(function () {
|
||||
var tablet,
|
||||
button,
|
||||
|
|
@ -18,20 +17,15 @@
|
|||
isFingerPainting = false,
|
||||
isTabletFocused = false, //starts with true cause you need to be hovering the tablet in order to open the app
|
||||
tabletDebugFocusLine = null,
|
||||
//dynamic brush vars
|
||||
/*9isDynamicBrushEnabled = false,
|
||||
isDynamicBrushRunning = false,
|
||||
DYNAMIC_BRUSH_UPDATE_TIME = 100,
|
||||
//animated brush vars
|
||||
lastFrameTime = Date.now(),
|
||||
frameDeltaSeconds = null, //time that passed between frames in milliseconds
|
||||
stopDynamicBrush = false,
|
||||
prevBrushWidth = 0,
|
||||
DYNAMIC_BRUSH_TIME = 50, //inteval in milliseconds to update the brush width
|
||||
DYNAMIC_BRUSH_INCREMENT = 0.01, //linear increment of brush size */
|
||||
frameDeltaSeconds = null, //time that passed between frames in ms;
|
||||
//end of dynamic brush vars
|
||||
leftHand = null,
|
||||
rightHand = null,
|
||||
leftBrush = null,
|
||||
rightBrush = null,
|
||||
isBrushColored = false,
|
||||
isLeftHandDominant = false,
|
||||
CONTROLLER_MAPPING_NAME = "com.highfidelity.fingerPaint",
|
||||
isTabletDisplayed = false,
|
||||
|
|
@ -40,13 +34,15 @@
|
|||
HIFI_POINTER_DISABLE_MESSAGE_CHANNEL = "Hifi-Pointer-Disable",
|
||||
SCRIPT_PATH = Script.resolvePath('')
|
||||
CONTENT_PATH = SCRIPT_PATH.substr(0, SCRIPT_PATH.lastIndexOf('/')),
|
||||
ANIMATION_SCRIPT_PATH = Script.resolvePath("content/brushes/dynamicBrushes/dynamicBrushScript.js"),
|
||||
APP_URL = CONTENT_PATH + "/html/main.html";
|
||||
|
||||
// Set up the qml ui
|
||||
var qml = Script.resolvePath('PaintWindow.qml');
|
||||
//var qml = Script.resolvePath('PaintWindow.qml');
|
||||
Script.include("../libraries/controllers.js");
|
||||
var window = null;
|
||||
|
||||
Script.include("content/brushes/dynamicBrushes/dynamicBrushesList.js");
|
||||
//var window = null;
|
||||
|
||||
//var inkSource = null;
|
||||
var inkSourceOverlay = null;
|
||||
// Set path for finger paint hand animations
|
||||
|
|
@ -54,7 +50,7 @@
|
|||
var LEFT_ANIM_URL = Script.resourcesPath() + 'avatar/animations/touch_point_closed_left.fbx';
|
||||
var RIGHT_ANIM_URL_OPEN = Script.resourcesPath() + 'avatar/animations/touch_point_open_right.fbx';
|
||||
var LEFT_ANIM_URL_OPEN = Script.resourcesPath() + 'avatar/animations/touch_point_open_left.fbx';
|
||||
|
||||
|
||||
function paintBrush(name) {
|
||||
// Paints in 3D.
|
||||
var brushName = name,
|
||||
|
|
@ -105,6 +101,10 @@
|
|||
function getStrokeWidth() {
|
||||
return strokeWidthMultiplier;
|
||||
}
|
||||
|
||||
function getEntityID() {
|
||||
return entityID;
|
||||
}
|
||||
|
||||
function changeTexture(textureURL) {
|
||||
texture = textureURL;
|
||||
|
|
@ -119,12 +119,6 @@
|
|||
|
||||
function startLine(position, width) {
|
||||
// Start drawing a polyline.
|
||||
/*if (isDynamicBrushEnabled) {
|
||||
print("start running the dynamic brush");
|
||||
prevBrushWidth = getStrokeWidth();
|
||||
changeStrokeWidthMultiplier(0.1);
|
||||
isDynamicBrushRunning = true;
|
||||
}*/
|
||||
if (isTabletFocused)
|
||||
return;
|
||||
|
||||
|
|
@ -152,14 +146,15 @@
|
|||
strokeWidths: strokeWidths,
|
||||
textures: texture, // Daantje
|
||||
isUVModeStretch: IS_UV_MODE_STRETCH,
|
||||
dimensions: STROKE_DIMENSIONS
|
||||
dimensions: STROKE_DIMENSIONS,
|
||||
shapeType: "box",
|
||||
collisionless: true,
|
||||
});
|
||||
|
||||
isDrawingLine = true;
|
||||
addAnimationToBrush(entityID);
|
||||
}
|
||||
|
||||
function drawLine(position, width) {
|
||||
print("current brush width" + getStrokeWidth());
|
||||
// Add a stroke to the polyline if stroke is a sufficient length.
|
||||
var localPosition,
|
||||
distanceToPrevious,
|
||||
|
|
@ -184,11 +179,13 @@
|
|||
&& (Date.now() - timeOfLastPoint) >= MIN_STROKE_INTERVAL
|
||||
&& strokePoints.length < MAX_POINTS_PER_LINE) {
|
||||
strokePoints.push(localPosition);
|
||||
|
||||
strokeNormals.push(strokeNormal());
|
||||
strokeWidths.push(width);
|
||||
timeOfLastPoint = Date.now();
|
||||
|
||||
Entities.editEntity(entityID, {
|
||||
color: STROKE_COLOR,
|
||||
linePoints: strokePoints,
|
||||
normals: strokeNormals,
|
||||
strokeWidths: strokeWidths
|
||||
|
|
@ -199,6 +196,15 @@
|
|||
function finishLine(position, width) {
|
||||
// Finish drawing polyline; delete if it has only 1 point.
|
||||
//stopDynamicBrush = true;
|
||||
print("Before adding script: " + JSON.stringify(Entities.getEntityProperties(entityID)));
|
||||
var userData = Entities.getEntityProperties(entityID).userData;
|
||||
if (userData && JSON.parse(userData).animations) {
|
||||
Entities.editEntity(entityID, {
|
||||
script: ANIMATION_SCRIPT_PATH,
|
||||
});
|
||||
}
|
||||
print("After adding script: " + JSON.stringify(Entities.getEntityProperties(entityID)));
|
||||
//setIsDrawingFingerPaint(entityID, false);
|
||||
print("already stopped drawing");
|
||||
width = width * strokeWidthMultiplier;
|
||||
|
||||
|
|
@ -213,6 +219,7 @@
|
|||
}
|
||||
|
||||
isDrawingLine = false;
|
||||
print("After adding script 3: " + JSON.stringify(Entities.getEntityProperties(entityID)));
|
||||
}
|
||||
|
||||
function cancelLine() {
|
||||
|
|
@ -259,6 +266,11 @@
|
|||
if (found) {
|
||||
addElementToUndoStack(Entities.getEntityProperties(foundID));
|
||||
Entities.deleteEntity(foundID);
|
||||
/*Entities.editEntity(entityID, {
|
||||
color: «,
|
||||
normals: strokeNormals,
|
||||
strokeWidths: strokeWidths
|
||||
});*/
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -280,6 +292,7 @@
|
|||
undoErasing: undoErasing,
|
||||
getStrokeColor: getStrokeColor,
|
||||
getStrokeWidth: getStrokeWidth,
|
||||
getEntityID: getEntityID,
|
||||
changeUVMode: changeUVMode
|
||||
};
|
||||
}
|
||||
|
|
@ -465,29 +478,6 @@
|
|||
};
|
||||
}
|
||||
|
||||
/*function runDynamicBrush() {
|
||||
if (isDynamicBrushRunning) {
|
||||
var currentBrush = isLeftHandDominant ? leftBrush : rightBrush;
|
||||
|
||||
if (currentBrush.getStrokeWidth() < 2.1 && !stopDynamicBrush) {
|
||||
currentBrush.changeStrokeWidthMultiplier(currentBrush.getStrokeWidth() + ((frameDeltaSeconds * DYNAMIC_BRUSH_INCREMENT)/DYNAMIC_BRUSH_TIME));
|
||||
print("going up: " + currentBrush.getStrokeWidth());
|
||||
}
|
||||
if (stopDynamicBrush) {
|
||||
currentBrush.changeStrokeWidthMultiplier(currentBrush.getStrokeWidth() - ((frameDeltaSeconds * DYNAMIC_BRUSH_INCREMENT)/DYNAMIC_BRUSH_TIME));
|
||||
print("going down: " + currentBrush.getStrokeWidth());
|
||||
}
|
||||
if (currentBrush.getStrokeWidth() <= 0) {
|
||||
print("stopped: " + currentBrush.getStrokeWidth());
|
||||
stopDynamicBrush = false;
|
||||
isDynamicBrushRunning = false;
|
||||
print("putting back the brush width: " + prevBrushWidth);
|
||||
currentBrush.changeStrokeWidthMultiplier(prevBrushWidth);
|
||||
currentBrush.finishLine();
|
||||
}
|
||||
}
|
||||
}*/
|
||||
|
||||
function onUpdate() {
|
||||
|
||||
//update ink Source
|
||||
|
|
@ -519,9 +509,20 @@
|
|||
// }
|
||||
// inkSource = Entities.addEntity(inkSourceProps);
|
||||
// }
|
||||
|
||||
/*frameDeltaSeconds = Date.now() - lastFrameTime;
|
||||
lastFrameTime = Date.now();
|
||||
runDynamicBrush(); */
|
||||
var nearbyEntities = Entities.findEntities(MyAvatar.position, 5.0);
|
||||
for (var i = 0; i < nearbyEntities.length; i++) {
|
||||
//Entities.editEntity(nearbyEntities[i], {userData: ""}); //clear user data (good to use in case we need to clear it)
|
||||
|
||||
var userData = Entities.getEntityProperties(nearbyEntities[i]).userData;
|
||||
if (userData != "") {
|
||||
playAnimations(nearbyEntities[i], JSON.parse(userData).animations);
|
||||
}
|
||||
}*/
|
||||
/*if (Entities.getEntityProperties(nearbyEntities[i]).name == "fingerPainting")
|
||||
Entities.deleteEntity(nearbyEntities[i]);*/
|
||||
if ((leftBrush == null || rightBrush == null) || (!leftBrush.isDrawing() && !rightBrush.isDrawing())) {
|
||||
checkTabletHasFocus();
|
||||
}
|
||||
|
|
@ -875,12 +876,15 @@
|
|||
}
|
||||
switch (event.type) {
|
||||
case "changeColor":
|
||||
print("changing color...");
|
||||
leftBrush.changeStrokeColor(event.red, event.green, event.blue);
|
||||
rightBrush.changeStrokeColor(event.red, event.green, event.blue);
|
||||
Overlays.editOverlay(inkSourceOverlay, {
|
||||
color: {red: event.red, green: event.green, blue: event.blue}
|
||||
});
|
||||
if (!isBrushColored) {
|
||||
print("changing color...");
|
||||
leftBrush.changeStrokeColor(event.red, event.green, event.blue);
|
||||
rightBrush.changeStrokeColor(event.red, event.green, event.blue);
|
||||
Overlays.editOverlay(inkSourceOverlay, {
|
||||
color: {red: event.red, green: event.green, blue: event.blue}
|
||||
});
|
||||
|
||||
}
|
||||
break;
|
||||
|
||||
case "changeBrush":
|
||||
|
|
@ -894,6 +898,14 @@
|
|||
leftBrush.changeUVMode(true);
|
||||
rightBrush.changeUVMode(true);
|
||||
}
|
||||
isBrushColored = event.isColored;
|
||||
if (event.isColored) {
|
||||
leftBrush.changeStrokeColor(255, 255, 255);
|
||||
rightBrush.changeStrokeColor(255, 255, 255);
|
||||
Overlays.editOverlay(inkSourceOverlay, {
|
||||
color: {red: 255, green: 255, blue: 255}
|
||||
});
|
||||
}
|
||||
/*leftBrush.changeUVMode(false);
|
||||
rightBrush.changeUVMode(false);
|
||||
if (event.brushName.indexOf("256x256") != -1) {
|
||||
|
|
@ -932,15 +944,34 @@
|
|||
updateHandAnimations();
|
||||
break;
|
||||
|
||||
/*case "switchDynamicBrush":
|
||||
isDynamicBrushEnabled = event.isDynamicBrushEnabled;
|
||||
break;*/
|
||||
case "switchDynamicBrush":
|
||||
DynamicBrushesInfo[event.dynamicBrushName].isEnabled = event.enabled;
|
||||
DynamicBrushesInfo[event.dynamicBrushName].settings = event.settings;
|
||||
break;
|
||||
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
function addAnimationToBrush(entityID) {
|
||||
print("Brushes INfo 0" + JSON.stringify(DynamicBrushesInfo));
|
||||
Object.keys(DynamicBrushesInfo).forEach(function(animationName) {
|
||||
print(animationName + "Brushes INfo 0" + JSON.stringify(DynamicBrushesInfo));
|
||||
if (DynamicBrushesInfo[animationName].isEnabled) {
|
||||
var prevUserData = Entities.getEntityProperties(entityID).userData;
|
||||
prevUserData = prevUserData == "" ? new Object() : JSON.parse(prevUserData); //preserve other possible user data
|
||||
if (prevUserData.animations == null) {
|
||||
prevUserData.animations = {};
|
||||
}
|
||||
prevUserData.animations[animationName] = dynamicBrushFactory(animationName, DynamicBrushesInfo[animationName].settings);
|
||||
Entities.editEntity(entityID, {userData: JSON.stringify(prevUserData)});
|
||||
//Entities.editEntity(entityID, {script: Script.resolvePath("content/brushes/dynamicBrushes/dynamicBrushScript.js")});
|
||||
}
|
||||
});
|
||||
print("Brushes INfo 1" + JSON.stringify(DynamicBrushesInfo));
|
||||
}
|
||||
|
||||
function addElementToUndoStack(item)
|
||||
{
|
||||
if (undoStack.length + 1 > UNDO_STACK_SIZE) {
|
||||
|
|
@ -986,10 +1017,5 @@
|
|||
}
|
||||
|
||||
setUp();
|
||||
Script.scriptEnding.connect(tearDown);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
Script.scriptEnding.connect(tearDown);
|
||||
}());
|
||||
|
|
@ -6,7 +6,7 @@
|
|||
background-color: #666666
|
||||
}
|
||||
.BrushIcon {
|
||||
padding: 10px,
|
||||
<div class="brushLabel"></div> padding: 10px,
|
||||
width: 130px,
|
||||
}
|
||||
#dynamicBrush {
|
||||
|
|
@ -15,73 +15,104 @@
|
|||
.selectedBrush {
|
||||
background-color: #f4e842
|
||||
}
|
||||
#brushesCointainer {
|
||||
margin-bottom: 200px;
|
||||
}
|
||||
.brushLabel {
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
color: white;
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
<!--<input onchange="setDynamicBrush(this)" type="checkbox" id="dynamicBrush"> Use Dynamic brush </input>-->
|
||||
<div id="brushesCointainer">
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256/basic.png" onclick="changePaintBrush(0)"><img width="130px" src="../content/brushes/256x256/basic.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256/basic.png" onclick="changePaintBrush(1)"><img width="130px" src="../content/brushes/256x256/basic.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256/bristle.png" onclick="changePaintBrush(2)"><img width="130px" src="../content/brushes/256x256/bristle.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256/bristle.png" onclick="changePaintBrush(3)"><img width="130px" src="../content/brushes/256x256/bristle.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256/dupuiz.png" onclick="changePaintBrush(4)"><img width="130px" src="../content/brushes/256x256/dupuiz.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256/dupuiz.png" onclick="changePaintBrush(5)"><img width="130px" src="../content/brushes/256x256/dupuiz.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256/gouache.png" onclick="changePaintBrush(6)"><img width="130px" src="../content/brushes/256x256/gouache.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256/gouache.png" onclick="changePaintBrush(7)"><img width="130px" src="../content/brushes/256x256/gouache.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256/graphite.png" onclick="changePaintBrush(8)"><img width="130px" src="../content/brushes/256x256/graphite.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256/graphite.png" onclick="changePaintBrush(9)"><img width="130px" src="../content/brushes/256x256/graphite.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256/hair.png" onclick="changePaintBrush(10)"><img width="130px" src="../content/brushes/256x256/hair.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256/hair.png" onclick="changePaintBrush(11)"><img width="130px" src="../content/brushes/256x256/hair.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256/spat-fine.png" onclick="changePaintBrush(12)"><img width="130px" src="../content/brushes/256x256/spat-fine.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256/spat-fine.png" onclick="changePaintBrush(13)"><img width="130px" src="../content/brushes/256x256/spat-fine.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256/spat-medium.png" onclick="changePaintBrush(14)"><img width="130px" src="../content/brushes/256x256/spat-medium.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256/spat-medium.png" onclick="changePaintBrush(15)"><img width="130px" src="../content/brushes/256x256/spat-medium.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256/sponge.png" onclick="changePaintBrush(16)"><img width="130px" src="../content/brushes/256x256/sponge.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256/sponge.png" onclick="changePaintBrush(17)"><img width="130px" src="../content/brushes/256x256/sponge.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256stretched/basic.png" onclick="changePaintBrush(18)"><img width="130px" src="../content/brushes/256x256stretched/basic.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256stretched/basic.png" onclick="changePaintBrush(19)"><img width="130px" src="../content/brushes/256x256stretched/basic.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256stretched/bristle.png" onclick="changePaintBrush(20)"><img width="130px" src="../content/brushes/256x256stretched/bristle.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256stretched/bristle.png" onclick="changePaintBrush(21)"><img width="130px" src="../content/brushes/256x256stretched/bristle.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256stretched/gouache.png" onclick="changePaintBrush(22)"><img width="130px" src="../content/brushes/256x256stretched/gouache.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256stretched/gouache.png" onclick="changePaintBrush(23)"><img width="130px" src="../content/brushes/256x256stretched/gouache.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256stretched/sponge.png" onclick="changePaintBrush(24)"><img width="130px" src="../content/brushes/256x256stretched/sponge.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256stretched/sponge.png" onclick="changePaintBrush(25)"><img width="130px" src="../content/brushes/256x256stretched/sponge.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/basic.png" onclick="changePaintBrush(26)"><img width="130px" src="../content/brushes/basic.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/basic.png" onclick="changePaintBrush(27)"><img width="130px" src="../content/brushes/basic.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/bristle.png" onclick="changePaintBrush(28)"><img width="130px" src="../content/brushes/bristle.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/bristle.png" onclick="changePaintBrush(29)"><img width="130px" src="../content/brushes/bristle.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/gouache.png" onclick="changePaintBrush(30)"><img width="130px" src="../content/brushes/gouache.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/gouache.png" onclick="changePaintBrush(31)"><img width="130px" src="../content/brushes/gouache.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/gradient.png" onclick="changePaintBrush(32)"><img width="130px" src="../content/brushes/gradient.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/gradient.png" onclick="changePaintBrush(33)"><img width="130px" src="../content/brushes/gradient.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/gradient2.png" onclick="changePaintBrush(34)"><img width="130px" src="../content/brushes/gradient2.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/gradient2.png" onclick="changePaintBrush(35)"><img width="130px" src="../content/brushes/gradient2.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/gradient3.png" onclick="changePaintBrush(36)"><img width="130px" src="../content/brushes/gradient3.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/gradient3.png" onclick="changePaintBrush(37)"><img width="130px" src="../content/brushes/gradient3.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/koons.png" onclick="changePaintBrush(38)"><img width="130px" src="../content/brushes/koons.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/koons.png" onclick="changePaintBrush(39)"><img width="130px" src="../content/brushes/koons.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/oil.png" onclick="changePaintBrush(40)"><img width="130px" src="../content/brushes/oil.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/oil.png" onclick="changePaintBrush(41)"><img width="130px" src="../content/brushes/oil.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/paintbrush1.png" onclick="changePaintBrush(42)"><img width="130px" src="../content/brushes/paintbrush1.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/paintbrush1.png" onclick="changePaintBrush(43)"><img width="130px" src="../content/brushes/paintbrush1.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/paintbrush2.png" onclick="changePaintBrush(44)"><img width="130px" src="../content/brushes/paintbrush2.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/paintbrush2.png" onclick="changePaintBrush(45)"><img width="130px" src="../content/brushes/paintbrush2.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/paintbrush3.png" onclick="changePaintBrush(46)"><img width="130px" src="../content/brushes/paintbrush3.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/paintbrush3.png" onclick="changePaintBrush(47)"><img width="130px" src="../content/brushes/paintbrush3.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/paintbrush4.png" onclick="changePaintBrush(48)"><img width="130px" src="../content/brushes/paintbrush4.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/paintbrush4.png" onclick="changePaintBrush(49)"><img width="130px" src="../content/brushes/paintbrush4.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/paintbrush5.png" onclick="changePaintBrush(50)"><img width="130px" src="../content/brushes/paintbrush5.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/paintbrush5.png" onclick="changePaintBrush(51)"><img width="130px" src="../content/brushes/paintbrush5.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/paintbrush6.png" onclick="changePaintBrush(52)"><img width="130px" src="../content/brushes/paintbrush6.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/paintbrush6.png" onclick="changePaintBrush(53)"><img width="130px" src="../content/brushes/paintbrush6.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/pastel.png" onclick="changePaintBrush(54)"><img width="130px" src="../content/brushes/pastel.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/pastel.png" onclick="changePaintBrush(55)"><img width="130px" src="../content/brushes/pastel.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/soft.png" onclick="changePaintBrush(56)"><img width="130px" src="../content/brushes/soft.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/soft.png" onclick="changePaintBrush(57)"><img width="130px" src="../content/brushes/soft.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/sponge.png" onclick="changePaintBrush(58)"><img width="130px" src="../content/brushes/sponge.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/sponge.png" onclick="changePaintBrush(59)"><img width="130px" src="../content/brushes/sponge.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/square.png" onclick="changePaintBrush(60)"><img width="130px" src="../content/brushes/square.png" class="BrushIcon" ></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/square.png" onclick="changePaintBrush(61)"><img width="130px" src="../content/brushes/square.png" class="BrushIcon" ></button>
|
||||
<div><input onchange="setDynamicBrush(this)" animationType="DynamicHueBrush" type="checkbox" id="dynamicBrush"> Use Dynamic Hue </input></div>
|
||||
<div>
|
||||
<div style="float: left; margin-right: 20px">
|
||||
<div><input onchange="setDynamicBrush(this)" settings='{"axis": "yaw"}' animationType="DynamicRotationBrush" type="checkbox" id="dynamicBrush"> Use Yaw Rotation </input></div>
|
||||
<div><input onchange="setDynamicBrush(this)" settings='{"axis": "pitch"}' animationType="DynamicRotationBrush" type="checkbox" id="dynamicBrush"> Use Pitch Rotation </input></div>
|
||||
<div><input onchange="setDynamicBrush(this)" settings='{"axis": "roll"}' animationType="DynamicRotationBrush" type="checkbox" id="dynamicBrush"> Use Roll Rotation </input></div>
|
||||
</div>
|
||||
<div >
|
||||
<div><input onchange="setDynamicBrush(this)" settings='{"axis": "x"}' animationType="DynamicTranslationBrush" type="checkbox" id="dynamicBrush"> Use Translation x</input></div>
|
||||
<div><input onchange="setDynamicBrush(this)" settings='{"axis": "y"}' animationType="DynamicTranslationBrush" type="checkbox" id="dynamicBrush"> Use Translation y</input></div>
|
||||
<div><input onchange="setDynamicBrush(this)" settings='{"axis": "z"}' animationType="DynamicTranslationBrush" type="checkbox" id="dynamicBrush"> Use Translation z</input></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="brushesCointainer">
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256/basic.png" onclick="changePaintBrush(0)"><img width="130px" src="../content/brushes/256x256/basic.png" class="BrushIcon" ><div class="brushLabel">basic A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256/basic.png" onclick="changePaintBrush(1)"><img width="130px" src="../content/brushes/256x256/basic.png" class="BrushIcon" ><div class="brushLabel">basic B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256/bristle.png" onclick="changePaintBrush(2)"><img width="130px" src="../content/brushes/256x256/bristle.png" class="BrushIcon" ><div class="brushLabel">bristle A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256/bristle.png" onclick="changePaintBrush(3)"><img width="130px" src="../content/brushes/256x256/bristle.png" class="BrushIcon" ><div class="brushLabel">bristle B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256/dupuiz.png" onclick="changePaintBrush(4)"><img width="130px" src="../content/brushes/256x256/dupuiz.png" class="BrushIcon" ><div class="brushLabel">dupuiz A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256/dupuiz.png" onclick="changePaintBrush(5)"><img width="130px" src="../content/brushes/256x256/dupuiz.png" class="BrushIcon" ><div class="brushLabel">dupuiz B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256/gouache.png" onclick="changePaintBrush(6)"><img width="130px" src="../content/brushes/256x256/gouache.png" class="BrushIcon" ><div class="brushLabel">gouache A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256/gouache.png" onclick="changePaintBrush(7)"><img width="130px" src="../content/brushes/256x256/gouache.png" class="BrushIcon" ><div class="brushLabel">gouache B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256/graphite.png" onclick="changePaintBrush(8)"><img width="130px" src="../content/brushes/256x256/graphite.png" class="BrushIcon" ><div class="brushLabel">graphite A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256/graphite.png" onclick="changePaintBrush(9)"><img width="130px" src="../content/brushes/256x256/graphite.png" class="BrushIcon" ><div class="brushLabel">graphite B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256/spat-fine.png" onclick="changePaintBrush(10)"><img width="130px" src="../content/brushes/256x256/spat-fine.png" class="BrushIcon" ><div class="brushLabel">spat-fine A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256/spat-fine.png" onclick="changePaintBrush(11)"><img width="130px" src="../content/brushes/256x256/spat-fine.png" class="BrushIcon" ><div class="brushLabel">spat-fine B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256/spat-medium.png" onclick="changePaintBrush(12)"><img width="130px" src="../content/brushes/256x256/spat-medium.png" class="BrushIcon" ><div class="brushLabel">spat-medium A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256/spat-medium.png" onclick="changePaintBrush(13)"><img width="130px" src="../content/brushes/256x256/spat-medium.png" class="BrushIcon" ><div class="brushLabel">spat-medium B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256/sponge.png" onclick="changePaintBrush(14)"><img width="130px" src="../content/brushes/256x256/sponge.png" class="BrushIcon" ><div class="brushLabel">sponge A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256/sponge.png" onclick="changePaintBrush(15)"><img width="130px" src="../content/brushes/256x256/sponge.png" class="BrushIcon" ><div class="brushLabel">sponge B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256stretched/basic.png" onclick="changePaintBrush(16)"><img width="130px" src="../content/brushes/256x256stretched/basic.png" class="BrushIcon" ><div class="brushLabel">basic A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256stretched/basic.png" onclick="changePaintBrush(17)"><img width="130px" src="../content/brushes/256x256stretched/basic.png" class="BrushIcon" ><div class="brushLabel">basic B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256stretched/bristle.png" onclick="changePaintBrush(18)"><img width="130px" src="../content/brushes/256x256stretched/bristle.png" class="BrushIcon" ><div class="brushLabel">bristle A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256stretched/bristle.png" onclick="changePaintBrush(19)"><img width="130px" src="../content/brushes/256x256stretched/bristle.png" class="BrushIcon" ><div class="brushLabel">bristle B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256stretched/gouache.png" onclick="changePaintBrush(20)"><img width="130px" src="../content/brushes/256x256stretched/gouache.png" class="BrushIcon" ><div class="brushLabel">gouache A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256stretched/gouache.png" onclick="changePaintBrush(21)"><img width="130px" src="../content/brushes/256x256stretched/gouache.png" class="BrushIcon" ><div class="brushLabel">gouache B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/256x256stretched/sponge.png" onclick="changePaintBrush(22)"><img width="130px" src="../content/brushes/256x256stretched/sponge.png" class="BrushIcon" ><div class="brushLabel">sponge A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/256x256stretched/sponge.png" onclick="changePaintBrush(23)"><img width="130px" src="../content/brushes/256x256stretched/sponge.png" class="BrushIcon" ><div class="brushLabel">sponge B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/basic.png" onclick="changePaintBrush(24)"><img width="130px" src="../content/brushes/basic.png" class="BrushIcon" ><div class="brushLabel">basic A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/basic.png" onclick="changePaintBrush(25)"><img width="130px" src="../content/brushes/basic.png" class="BrushIcon" ><div class="brushLabel">basic B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/bristle.png" onclick="changePaintBrush(26)"><img width="130px" src="../content/brushes/bristle.png" class="BrushIcon" ><div class="brushLabel">bristle A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/bristle.png" onclick="changePaintBrush(27)"><img width="130px" src="../content/brushes/bristle.png" class="BrushIcon" ><div class="brushLabel">bristle B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/gouache.png" onclick="changePaintBrush(28)"><img width="130px" src="../content/brushes/gouache.png" class="BrushIcon" ><div class="brushLabel">gouache A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/gouache.png" onclick="changePaintBrush(29)"><img width="130px" src="../content/brushes/gouache.png" class="BrushIcon" ><div class="brushLabel">gouache B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/gradient.png" onclick="changePaintBrush(30)"><img width="130px" src="../content/brushes/gradient.png" class="BrushIcon" ><div class="brushLabel">gradient A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/gradient.png" onclick="changePaintBrush(31)"><img width="130px" src="../content/brushes/gradient.png" class="BrushIcon" ><div class="brushLabel">gradient B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/gradient2.png" onclick="changePaintBrush(32)"><img width="130px" src="../content/brushes/gradient2.png" class="BrushIcon" ><div class="brushLabel">gradient2 A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/gradient2.png" onclick="changePaintBrush(33)"><img width="130px" src="../content/brushes/gradient2.png" class="BrushIcon" ><div class="brushLabel">gradient2 B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/gradient3.png" onclick="changePaintBrush(34)"><img width="130px" src="../content/brushes/gradient3.png" class="BrushIcon" ><div class="brushLabel">gradient3 A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/gradient3.png" onclick="changePaintBrush(35)"><img width="130px" src="../content/brushes/gradient3.png" class="BrushIcon" ><div class="brushLabel">gradient3 B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/koons.png" onclick="changePaintBrush(36)"><img width="130px" src="../content/brushes/koons.png" class="BrushIcon" ><div class="brushLabel">koons A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/koons.png" onclick="changePaintBrush(37)"><img width="130px" src="../content/brushes/koons.png" class="BrushIcon" ><div class="brushLabel">koons B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/oil.png" onclick="changePaintBrush(38)"><img width="130px" src="../content/brushes/oil.png" class="BrushIcon" ><div class="brushLabel">oil A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/oil.png" onclick="changePaintBrush(39)"><img width="130px" src="../content/brushes/oil.png" class="BrushIcon" ><div class="brushLabel">oil B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/paintbrush1.png" onclick="changePaintBrush(40)"><img width="130px" src="../content/brushes/paintbrush1.png" class="BrushIcon" ><div class="brushLabel">paintbrush1 A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/paintbrush1.png" onclick="changePaintBrush(41)"><img width="130px" src="../content/brushes/paintbrush1.png" class="BrushIcon" ><div class="brushLabel">paintbrush1 B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/paintbrush2.png" onclick="changePaintBrush(42)"><img width="130px" src="../content/brushes/paintbrush2.png" class="BrushIcon" ><div class="brushLabel">paintbrush2 A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/paintbrush2.png" onclick="changePaintBrush(43)"><img width="130px" src="../content/brushes/paintbrush2.png" class="BrushIcon" ><div class="brushLabel">paintbrush2 B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/paintbrush3.png" onclick="changePaintBrush(44)"><img width="130px" src="../content/brushes/paintbrush3.png" class="BrushIcon" ><div class="brushLabel">paintbrush3 A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/paintbrush3.png" onclick="changePaintBrush(45)"><img width="130px" src="../content/brushes/paintbrush3.png" class="BrushIcon" ><div class="brushLabel">paintbrush3 B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/paintbrush4.png" onclick="changePaintBrush(46)"><img width="130px" src="../content/brushes/paintbrush4.png" class="BrushIcon" ><div class="brushLabel">paintbrush4 A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/paintbrush4.png" onclick="changePaintBrush(47)"><img width="130px" src="../content/brushes/paintbrush4.png" class="BrushIcon" ><div class="brushLabel">paintbrush4 B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/paintbrush5.png" onclick="changePaintBrush(48)"><img width="130px" src="../content/brushes/paintbrush5.png" class="BrushIcon" ><div class="brushLabel">paintbrush5 A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/paintbrush5.png" onclick="changePaintBrush(49)"><img width="130px" src="../content/brushes/paintbrush5.png" class="BrushIcon" ><div class="brushLabel">paintbrush5 B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/paintbrush6.png" onclick="changePaintBrush(50)"><img width="130px" src="../content/brushes/paintbrush6.png" class="BrushIcon" ><div class="brushLabel">paintbrush6 A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/paintbrush6.png" onclick="changePaintBrush(51)"><img width="130px" src="../content/brushes/paintbrush6.png" class="BrushIcon" ><div class="brushLabel">paintbrush6 B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/pastel.png" onclick="changePaintBrush(52)"><img width="130px" src="../content/brushes/pastel.png" class="BrushIcon" ><div class="brushLabel">pastel A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/pastel.png" onclick="changePaintBrush(53)"><img width="130px" src="../content/brushes/pastel.png" class="BrushIcon" ><div class="brushLabel">pastel B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/soft.png" onclick="changePaintBrush(54)"><img width="130px" src="../content/brushes/soft.png" class="BrushIcon" ><div class="brushLabel">soft A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/soft.png" onclick="changePaintBrush(55)"><img width="130px" src="../content/brushes/soft.png" class="BrushIcon" ><div class="brushLabel">soft B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/sponge.png" onclick="changePaintBrush(56)"><img width="130px" src="../content/brushes/sponge.png" class="BrushIcon" ><div class="brushLabel">sponge A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/sponge.png" onclick="changePaintBrush(57)"><img width="130px" src="../content/brushes/sponge.png" class="BrushIcon" ><div class="brushLabel">sponge B</div></button></button>
|
||||
<button class="brushButton" brushType="stretch" id="content/brushes/square.png" onclick="changePaintBrush(58)"><img width="130px" src="../content/brushes/square.png" class="BrushIcon" ><div class="brushLabel">square A</div></button></button>
|
||||
<button class="brushButton" brushType="repeat" id="content/brushes/square.png" onclick="changePaintBrush(59)"><img width="130px" src="../content/brushes/square.png" class="BrushIcon" ><div class="brushLabel">square B</div></button></button>
|
||||
<button class="brushButton" colored="true" brushType="stretch" id="content/brushes/colored/breakfast.png" onclick="changePaintBrush(60)"><img width="130px" src="../content/brushes/colored/breakfast.png" class="BrushIcon" ><div class="brushLabel">breakfast A</div></button></button>
|
||||
<button class="brushButton" colored="true" brushType="repeat" id="content/brushes/colored/breakfast.png" onclick="changePaintBrush(61)"><img width="130px" src="../content/brushes/colored/breakfast.png" class="BrushIcon" ><div class="brushLabel">breakfast B</div></button></button>
|
||||
<button class="brushButton" colored="true" brushType="stretch" id="content/brushes/colored/chique.png" onclick="changePaintBrush(62)"><img width="130px" src="../content/brushes/colored/chique.png" class="BrushIcon" ><div class="brushLabel">chique A</div></button></button>
|
||||
<button class="brushButton" colored="true" brushType="repeat" id="content/brushes/colored/chique.png" onclick="changePaintBrush(63)"><img width="130px" src="../content/brushes/colored/chique.png" class="BrushIcon" ><div class="brushLabel">chique B</div></button></button>
|
||||
<button class="brushButton" colored="true" brushType="stretch" id="content/brushes/colored/hawaii.png" onclick="changePaintBrush(64)"><img width="130px" src="../content/brushes/colored/hawaii.png" class="BrushIcon" ><div class="brushLabel">hawaii A</div></button></button>
|
||||
<button class="brushButton" colored="true" brushType="repeat" id="content/brushes/colored/hawaii.png" onclick="changePaintBrush(65)"><img width="130px" src="../content/brushes/colored/hawaii.png" class="BrushIcon" ><div class="brushLabel">hawaii B</div></button></button>
|
||||
<button class="brushButton" colored="true" brushType="stretch" id="content/brushes/colored/newton.png" onclick="changePaintBrush(66)"><img width="130px" src="../content/brushes/colored/newton.png" class="BrushIcon" ><div class="brushLabel">newton A</div></button></button>
|
||||
<button class="brushButton" colored="true" brushType="repeat" id="content/brushes/colored/newton.png" onclick="changePaintBrush(67)"><img width="130px" src="../content/brushes/colored/newton.png" class="BrushIcon" ><div class="brushLabel">newton B</div></button></button>
|
||||
<button class="brushButton" colored="true" brushType="stretch" id="content/brushes/colored/pastels.png" onclick="changePaintBrush(68)"><img width="130px" src="../content/brushes/colored/pastels.png" class="BrushIcon" ><div class="brushLabel">pastels A</div></button></button>
|
||||
<button class="brushButton" colored="true" brushType="repeat" id="content/brushes/colored/pastels.png" onclick="changePaintBrush(69)"><img width="130px" src="../content/brushes/colored/pastels.png" class="BrushIcon" ><div class="brushLabel">pastels B</div></button></button>
|
||||
<button class="brushButton" colored="true" brushType="stretch" id="content/brushes/colored/softy.png" onclick="changePaintBrush(70)"><img width="130px" src="../content/brushes/colored/softy.png" class="BrushIcon" ><div class="brushLabel">softy A</div></button></button>
|
||||
<button class="brushButton" colored="true" brushType="repeat" id="content/brushes/colored/softy.png" onclick="changePaintBrush(71)"><img width="130px" src="../content/brushes/colored/softy.png" class="BrushIcon" ><div class="brushLabel">softy B</div></button></button>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
|
@ -94,20 +125,23 @@
|
|||
bruhes[currentBrush].classList.remove("selectedBrush");
|
||||
currentBrush = brushIndex;
|
||||
bruhes[currentBrush].classList.add("selectedBrush");
|
||||
debugger;
|
||||
console.log(bruhes[currentBrush].getAttribute("colored"));
|
||||
var changedBrushEvent = {
|
||||
"type" : "changeBrush",
|
||||
"brushName": bruhes[currentBrush].id,
|
||||
"brushType": bruhes[currentBrush].getAttribute("brushType")
|
||||
"brushType": bruhes[currentBrush].getAttribute("brushType"),
|
||||
"isColored": bruhes[currentBrush].getAttribute("colored"),
|
||||
};
|
||||
parent.postMessage(JSON.stringify(changedBrushEvent), "*");
|
||||
}
|
||||
|
||||
/*function setDynamicBrush(checkbox) {
|
||||
var switchBrushEvent = {
|
||||
"type" : "switchDynamicBrush",
|
||||
"isDynamicBrushEnabled": checkbox.checked
|
||||
function setDynamicBrush(checkbox) {
|
||||
var switchDynamicBrushEvent = {
|
||||
"type" : "switchDynamicBrush",
|
||||
"dynamicBrushName": checkbox.getAttribute("animationType"),
|
||||
"enabled" : checkbox.checked,
|
||||
"settings" : JSON.parse(checkbox.getAttribute("settings")),
|
||||
};
|
||||
parent.postMessage(JSON.stringify(switchBrushEvent), "*");
|
||||
}*/
|
||||
parent.postMessage(JSON.stringify(switchDynamicBrushEvent), "*");
|
||||
}
|
||||
</script>
|
||||
Loading…
Reference in a new issue