' +
'
";
neo.innerHTML = html.replace(/\[(.*?)\]/g, function (match, str) {
return Neo.translate(str);
});
var parent = applet.parentNode;
parent.appendChild(neo);
parent.insertBefore(neo, applet);
// applet.style.display = "none";
// NEOを組み込んだURLをアプリ版で開くとDOMツリーが2重にできて格好悪いので消しておく
setTimeout(function () {
var tmp = document.getElementsByClassName("NEO");
if (tmp.length > 1) {
for (var i = 1; i < tmp.length; i++) {
tmp[i].style.display = "none";
}
}
}, 0);
};
Neo.initViewer = function (pch) {
var pageview = document.getElementById("pageView");
var pageWidth = Neo.config.applet_width;
var pageHeight = Neo.config.applet_height;
pageview.style.width = pageWidth + "px";
pageview.style.height = pageHeight + "px";
Neo.canvas = document.getElementById("canvas");
Neo.container = document.getElementById("container");
Neo.container.style.backgroundColor = Neo.config.color_back;
Neo.container.style.border = "0";
var dx = (pageWidth - Neo.config.width) / 2;
var dy = (pageHeight - Neo.config.height - 26) / 2;
var painter = document.getElementById("painter");
painter.style.marginTop = "0";
painter.style.position = "absolute";
painter.style.padding = "0";
painter.style.bottom = dy + 26 + "px";
painter.style.left = dx + "px";
var viewerButtonsWrapper = document.getElementById("viewerButtonsWrapper");
viewerButtonsWrapper.style.width = pageWidth - 2 + "px";
var viewerBar = document.getElementById("viewerBar");
viewerBar.style.position = "absolute";
viewerBar.style.right = "2px";
viewerBar.style.top = "1px";
viewerBar.style.width = pageWidth - 24 * 6 - 2 + "px";
Neo.canvas.style.width = Neo.config.width + "px";
Neo.canvas.style.height = Neo.config.height + "px";
Neo.painter = new Neo.Painter();
Neo.painter.build(Neo.canvas, Neo.config.width, Neo.config.height);
Neo.container.oncontextmenu = function () {
return false;
};
painter.addEventListener(
"mousedown",
function () {
Neo.painter._actionMgr.isMouseDown = true;
},
false
);
document.addEventListener(
"mousemove",
function (e) {
if (Neo.painter._actionMgr.isMouseDown) {
var zoom = Neo.painter.zoom;
var x = Neo.painter.zoomX - e.movementX / zoom;
var y = Neo.painter.zoomY - e.movementY / zoom;
Neo.painter.setZoomPosition(x, y);
}
},
false
);
document.addEventListener(
"mouseup",
function () {
Neo.painter._actionMgr.isMouseDown = false;
Neo.viewerBar.isMouseDown = false;
},
false
);
if (pch) {
//Neo.config.pch_file) {
Neo.painter._actionMgr._items = pch.data;
Neo.painter.play();
}
};
Neo.startViewer = function () {
if (Neo.applet) {
var name = Neo.applet.attributes.name.value || "pch";
if (!document[name]) document[name] = Neo;
if (Neo.applet.parentNode) {
Neo.applet.parentNode.removeChild(Neo.applet);
}
}
Neo.styleSheet = Neo.getStyleSheet();
var lightBack = Neo.multColor(Neo.config.color_back, 1.3);
var darkBack = Neo.multColor(Neo.config.color_back, 0.7);
Neo.addRule(".NEO #viewerButtons", "color", Neo.config.color_text);
Neo.addRule(".NEO #viewerButtons", "background-color", Neo.config.color_back);
Neo.addRule(
".NEO #viewerButtonsWrapper",
"border",
"1px solid " + Neo.config.color_frame + " !important"
);
Neo.addRule(
".NEO #viewerButtons",
"border",
"1px solid " + Neo.config.color_back + " !important"
);
Neo.addRule(
".NEO #viewerButtons",
"border-left",
"1px solid " + lightBack + " !important"
);
Neo.addRule(
".NEO #viewerButtons",
"border-top",
"1px solid " + lightBack + " !important"
);
Neo.addRule(
".NEO #viewerButtons >div.buttonOff",
"background-color",
Neo.config.color_icon + " !important"
);
Neo.addRule(
".NEO #viewerButtons >div.buttonOff:active",
"background-color",
darkBack + " !important"
);
Neo.addRule(
".NEO #viewerButtons >div.buttonOn",
"background-color",
darkBack + " !important"
);
Neo.addRule(
".NEO #viewerButtons >div",
"border",
"1px solid " + Neo.config.color_frame + " !important"
);
Neo.addRule(
".NEO #viewerButtons >div.buttonOff:hover",
"border",
"1px solid" + Neo.config.color_bar_select + " !important"
);
Neo.addRule(
".NEO #viewerButtons >div.buttonOff:active",
"border",
"1px solid" + Neo.config.color_bar_select + " !important"
);
Neo.addRule(
".NEO #viewerButtons >div.buttonOn",
"border",
"1px solid" + Neo.config.color_bar_select + " !important"
);
Neo.addRule(".NEO #viewerBar >div", "background-color", Neo.config.color_bar);
// Neo.addRule(".NEO #viewerBar:active", "background-color", darkBack);
Neo.addRule(
".NEO #viewerBarMark",
"background-color",
Neo.config.color_text + " !important"
);
setTimeout(function () {
Neo.viewerPlay = new Neo.ViewerButton().init("viewerPlay");
Neo.viewerPlay.setSelected(true);
Neo.viewerPlay.onmouseup = function () {
Neo.painter.onplay();
};
Neo.viewerStop = new Neo.ViewerButton().init("viewerStop");
Neo.viewerStop.onmouseup = function () {
Neo.painter.onstop();
};
Neo.viewerSpeed = new Neo.ViewerButton().init("viewerSpeed");
Neo.viewerSpeed.onmouseup = function () {
Neo.painter.onspeed();
this.update();
};
new Neo.ViewerButton().init("viewerRewind").onmouseup = function () {
Neo.painter.onrewind();
};
new Neo.ViewerButton().init("viewerPlus").onmouseup = function () {
new Neo.ZoomPlusCommand(Neo.painter).execute();
};
new Neo.ViewerButton().init("viewerMinus").onmouseup = function () {
new Neo.ZoomMinusCommand(Neo.painter).execute();
};
var length = Neo.painter._actionMgr._items.length;
Neo.viewerBar = new Neo.ViewerBar().init("viewerBar", { length: length });
}, 0);
};
Neo.getFilename = function () {
return Neo.config.pch_file || Neo.config.image_canvas;
};
Neo.getPCH = function (filename, callback) {
if (!filename || filename.slice(-4).toLowerCase() != ".pch") return null;
var request = new XMLHttpRequest();
request.open("GET", filename, true);
request.responseType = "arraybuffer";
request.onload = function () {
var pch = Neo.decodePCH(request.response);
if (pch) {
if (callback) callback(pch);
} else {
console.log("not a NEO animation");
}
};
request.send();
};
Neo.decodePCH = function (rawdata) {
var byteArray = new Uint8Array(rawdata);
var data = LZString.decompressFromUint8Array(byteArray.subarray(12));
var header = byteArray.subarray(0, 12);
if (
header[0] == "N".charCodeAt(0) &&
header[1] == "E".charCodeAt(0) &&
header[2] == "O".charCodeAt(0)
) {
var width = header[4] + header[5] * 0x100;
var height = header[6] + header[7] * 0x100;
var items = Neo.fixPCH(JSON.parse(data));
return {
width: width,
height: height,
data: items,
};
} else {
return null;
}
};
Neo.fixPCH = function (items) {
for (var i = 0; i < items.length; i++) {
var item = items[i];
var index = item.indexOf("eraseAll");
if (index > 0) {
var tmp = item.slice(index);
var tmp2 = item.slice(0, index);
console.log("fix eraseAll", tmp2, tmp);
items[i] = tmp2;
items.splice(i, 0, tmp);
}
}
return items;
};
/*
-----------------------------------------------------------------------
LiveConnect
-----------------------------------------------------------------------
*/
Neo.playPCH = function () {
Neo.painter.onplay();
};
Neo.suspendDraw = function () {
Neo.painter.onstop();
};
Neo.setSpeed = function (value) {
Neo.speed = value;
};
Neo.setVisit = function (layer, value) {
Neo.painter.visible[layer] = (value == 0) ? false : true;
Neo.painter.updateDestCanvas(
0,
0,
Neo.painter.canvasWidth,
Neo.painter.canvasHeight);
};
Neo.setMark = function (value) {
Neo.painter._actionMgr._mark = value;
Neo.painter.onmark();
};
Neo.getSeek = function () {
return Neo.painter._actionMgr._head;
};
Neo.getLineCount = function () {
return Neo.painter._actionMgr._items.length;
};
"use strict";
Neo.getModifier = function (e) {
if (e.shiftKey) {
return "shift";
} else if (
e.button == 2 ||
e.ctrlKey ||
e.altKey ||
Neo.painter.virtualRight
) {
return "right";
}
return null;
};
/*
-------------------------------------------------------------------------
Button
-------------------------------------------------------------------------
*/
Neo.Button = function () {};
Neo.Button.prototype.init = function (name, params) {
this.element = document.getElementById(name);
this.params = params || {};
this.name = name;
this.selected = false;
this.isMouseDown = false;
var ref = this;
this.element.onmousedown = function (e) {
ref._mouseDownHandler(e);
};
this.element.onmouseup = function (e) {
ref._mouseUpHandler(e);
};
this.element.onmouseover = function (e) {
ref._mouseOverHandler(e);
};
this.element.onmouseout = function (e) {
ref._mouseOutHandler(e);
};
this.element.addEventListener(
"touchstart",
function (e) {
ref._mouseDownHandler(e);
e.preventDefault();
},
true
);
this.element.addEventListener(
"touchend",
function (e) {
ref._mouseUpHandler(e);
},
true
);
this.element.className = !this.params.type == "fill" ? "button" : "buttonOff";
this.disable = function(wait) {
this.element.style.pointerEvents = "none";
this.element.style.opacity = "0.5";
if (wait) {
setTimeout(function () {
ref.enable();
}, wait);
}
}
this.enable = function() {
this.element.style.pointerEvents = "inherit";
this.element.style.opacity = "1.0";
}
return this;
};
Neo.Button.prototype._mouseDownHandler = function (e) {
if (Neo.painter.isUIPaused()) return;
this.isMouseDown = true;
if (this.params.type == "fill" && this.selected == false) {
for (var i = 0; i < Neo.toolButtons.length; i++) {
var toolTip = Neo.toolButtons[i];
toolTip.setSelected(this.selected ? false : true);
}
Neo.painter.setToolByType(Neo.Painter.TOOLTYPE_FILL);
}
if (this.onmousedown) this.onmousedown(this);
};
Neo.Button.prototype._mouseUpHandler = function (e) {
if (this.isMouseDown) {
this.isMouseDown = false;
if (this.onmouseup) this.onmouseup(this);
}
};
Neo.Button.prototype._mouseOutHandler = function (e) {
if (this.isMouseDown) {
this.isMouseDown = false;
if (this.onmouseout) this.onmouseout(this);
}
};
Neo.Button.prototype._mouseOverHandler = function (e) {
if (this.onmouseover) this.onmouseover(this);
};
Neo.Button.prototype.setSelected = function (selected) {
if (selected) {
this.element.className = "buttonOn";
} else {
this.element.className = "buttonOff";
}
this.selected = selected;
};
Neo.Button.prototype.update = function () {};
/*
-------------------------------------------------------------------------
Right Button
-------------------------------------------------------------------------
*/
Neo.RightButton;
Neo.RightButton = function () {};
Neo.RightButton.prototype = new Neo.Button();
Neo.RightButton.prototype.init = function (name, params) {
Neo.Button.prototype.init.call(this, name, params);
this.params.type = "right";
return this;
};
Neo.RightButton.prototype._mouseDownHandler = function (e) {};
Neo.RightButton.prototype._mouseUpHandler = function (e) {
this.setSelected(!this.selected);
};
Neo.RightButton.prototype._mouseOutHandler = function (e) {};
Neo.RightButton.prototype.setSelected = function (selected) {
if (selected) {
this.element.className = "buttonOn";
Neo.painter.virtualRight = true;
} else {
this.element.className = "buttonOff";
Neo.painter.virtualRight = false;
}
this.selected = selected;
};
Neo.RightButton.clear = function () {
var right = Neo.rightButton;
right.setSelected(false);
};
/*
-------------------------------------------------------------------------
Fill Button
-------------------------------------------------------------------------
*/
Neo.FillButton;
Neo.FillButton = function () {};
Neo.FillButton.prototype = new Neo.Button();
Neo.FillButton.prototype.init = function (name, params) {
Neo.Button.prototype.init.call(this, name, params);
this.params.type = "fill";
return this;
};
/*
-------------------------------------------------------------------------
ColorTip
-------------------------------------------------------------------------
*/
Neo.colorTips = [];
Neo.ColorTip = function () {};
Neo.ColorTip.prototype.init = function (name, params) {
this.element = document.getElementById(name);
this.params = params || {};
this.name = name;
this.selected = this.name == "color1" ? true : false;
this.isMouseDown = false;
var ref = this;
this.element.onmousedown = function (e) {
ref._mouseDownHandler(e);
};
this.element.onmouseup = function (e) {
ref._mouseUpHandler(e);
};
this.element.onmouseover = function (e) {
ref._mouseOverHandler(e);
};
this.element.onmouseout = function (e) {
ref._mouseOutHandler(e);
};
this.element.addEventListener(
"touchstart",
function (e) {
ref._mouseDownHandler(e);
e.preventDefault();
},
true
);
this.element.addEventListener(
"touchend",
function (e) {
ref._mouseUpHandler(e);
},
true
);
this.element.className = "colorTipOff";
var index = parseInt(this.name.slice(5)) - 1;
this.element.style.left = index % 2 ? "0px" : "26px";
this.element.style.top = Math.floor(index / 2) * 21 + "px";
// base64 ColorTip.png
this.element.innerHTML =
"' +
'
" +
'' +
"
" +
"' +
'
" +
"' +
'' +
'' +
'' +
'' +
'' +
'' +
'
" +
"' +
"
" +
"
";
this.setColor(Neo.config.colors[params.index - 1]);
this.setSelected(this.selected);
Neo.colorTips.push(this);
};
Neo.ColorTip.prototype._mouseDownHandler = function (e) {
if (Neo.painter.isUIPaused()) return;
this.isMouseDown = true;
for (var i = 0; i < Neo.colorTips.length; i++) {
var colorTip = Neo.colorTips[i];
if (this == colorTip) {
switch (Neo.getModifier(e)) {
case "shift":
this.setColor(Neo.config.colors[this.params.index - 1]);
break;
case "right":
this.setColor(Neo.painter.foregroundColor);
break;
}
// if (e.shiftKey) {
// this.setColor(Neo.config.colors[this.params.index - 1]);
// } else if (e.button == 2 || e.ctrlKey || e.altKey ||
// Neo.painter.virtualRight) {
// this.setColor(Neo.painter.foregroundColor);
// }
}
colorTip.setSelected(this == colorTip) ? true : false;
}
Neo.painter.setColor(this.color);
Neo.updateUIColor(true, false);
if (this.onmousedown) this.onmousedown(this);
};
Neo.ColorTip.prototype._mouseUpHandler = function (e) {
if (this.isMouseDown) {
this.isMouseDown = false;
if (this.onmouseup) this.onmouseup(this);
}
};
Neo.ColorTip.prototype._mouseOutHandler = function (e) {
if (this.isMouseDown) {
this.isMouseDown = false;
if (this.onmouseout) this.onmouseout(this);
}
};
Neo.ColorTip.prototype._mouseOverHandler = function (e) {
if (this.onmouseover) this.onmouseover(this);
};
Neo.ColorTip.prototype.setSelected = function (selected) {
if (selected) {
this.element.className = "colorTipOn";
} else {
this.element.className = "colorTipOff";
}
this.selected = selected;
};
Neo.ColorTip.prototype.setColor = function (color) {
this.color = color;
this.element.style.backgroundColor = color;
};
Neo.ColorTip.getCurrent = function () {
for (var i = 0; i < Neo.colorTips.length; i++) {
var colorTip = Neo.colorTips[i];
if (colorTip.selected) return colorTip;
}
return null;
};
/*
-------------------------------------------------------------------------
ToolTip
-------------------------------------------------------------------------
*/
Neo.toolTips = [];
Neo.toolButtons = [];
Neo.ToolTip = function () {};
Neo.ToolTip.prototype.prevMode = -1;
Neo.ToolTip.prototype.init = function (name, params) {
this.element = document.getElementById(name);
this.params = params || {};
this.params.type = this.element.id;
this.name = name;
this.mode = 0;
this.isMouseDown = false;
var ref = this;
this.element.onmousedown = function (e) {
ref._mouseDownHandler(e);
};
this.element.onmouseup = function (e) {
ref._mouseUpHandler(e);
};
this.element.onmouseover = function (e) {
ref._mouseOverHandler(e);
};
this.element.onmouseout = function (e) {
ref._mouseOutHandler(e);
};
this.element.addEventListener(
"touchstart",
function (e) {
ref._mouseDownHandler(e);
e.preventDefault();
},
true
);
this.element.addEventListener(
"touchend",
function (e) {
ref._mouseUpHandler(e);
},
true
);
this.selected = this.params.type == "pen" ? true : false;
this.setSelected(this.selected);
this.element.innerHTML =
"";
this.canvas = this.element.getElementsByTagName("canvas")[0];
this.label = this.element.getElementsByTagName("div")[0];
this.update();
return this;
};
Neo.ToolTip.prototype._mouseDownHandler = function (e) {
this.isMouseDown = true;
if (this.isTool) {
if (this.selected == false) {
for (var i = 0; i < Neo.toolButtons.length; i++) {
var toolTip = Neo.toolButtons[i];
toolTip.setSelected(this == toolTip ? true : false);
}
} else {
var length = this.toolStrings.length;
if (Neo.getModifier(e) == "right") {
this.mode--;
if (this.mode < 0) this.mode = length - 1;
} else {
this.mode++;
if (this.mode >= length) this.mode = 0;
}
}
Neo.painter.setToolByType(this.tools[this.mode]);
this.update();
}
if (this.onmousedown) this.onmousedown(this);
};
Neo.ToolTip.prototype._mouseUpHandler = function (e) {
if (this.isMouseDown) {
this.isMouseDown = false;
if (this.onmouseup) this.onmouseup(this);
}
};
Neo.ToolTip.prototype._mouseOutHandler = function (e) {
if (this.isMouseDown) {
this.isMouseDown = false;
if (this.onmouseout) this.onmouseout(this);
}
};
Neo.ToolTip.prototype._mouseOverHandler = function (e) {
if (this.onmouseover) this.onmouseover(this);
};
Neo.ToolTip.prototype.setSelected = function (selected) {
if (this.fixed) {
this.element.className = "toolTipFixed";
} else {
if (selected) {
this.element.className = "toolTipOn";
} else {
this.element.className = "toolTipOff";
}
}
this.selected = selected;
};
Neo.ToolTip.prototype.update = function () {};
Neo.ToolTip.prototype.draw = function (c) {
if (this.hasTintImage) {
if (typeof c != "string") c = Neo.painter.getColorString(c);
var ctx = this.canvas.getContext("2d");
if (this.prevMode != this.mode) {
this.prevMode = this.mode;
var img = new Image();
img.src = this.toolIcons[this.mode];
img.onload = function () {
var ref = this;
ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
this.drawTintImage(ctx, img, c, 0, 0);
}.bind(this);
} else {
Neo.tintImage(ctx, c);
}
}
};
Neo.ToolTip.prototype.drawTintImage = function (ctx, img, c, x, y) {
ctx.drawImage(img, x, y);
Neo.tintImage(ctx, c);
};
Neo.ToolTip.bezier =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAATCAYAAADWOo4fAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAAT0lEQVRIx+3SQQoAIAhE0en+h7ZVEEKBZrX5b5sjKknAkRYpNslaMLPq44ZI9wwHs0vMQ/v87u0Kk8xfsaI242jbMdjPi5Y0r/zTAAAAD3UOjRf9jcO4sgAAAABJRU5ErkJggg==";
Neo.ToolTip.blur =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAATCAYAAADWOo4fAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAASUlEQVRIx+3VMQ4AIAgEQeD/f8bWWBnJYUh2SgtgK82G8/MhzVKwxOtTLgIUx6tDout4laiPIICA0Qj4bXxAy0+8LZP9yACAJwsqkggS55eiZgAAAABJRU5ErkJggg==";
Neo.ToolTip.blurrect =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAATCAYAAADWOo4fAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAAX0lEQVRIx+2XQQ4AEAwEt+I7/v+8Org6lJKt6NzLjjYE8DAKtLpYoDeCCCC7tYUd3ru2qQOzDTyndhJzB6KSAmxSgM0fAlGuzBnmlziqxB8jFJkUYJMCbAQYPxt2kF06fvYKgjPBO/IAAAAASUVORK5CYII=";
Neo.ToolTip.brush =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAATCAYAAADWOo4fAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAAQUlEQVRIx2NgGOKAEcb4z8CweRA4xpdUPSxofJ8BdP8WcjQxDaCDqQLQY4CsUBgFo2AUjIJRMApGwSgYBaNgZAIA0CoDwDbZu8oAAAAASUVORK5CYII=";
Neo.ToolTip.burn =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAATCAYAAADWOo4fAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAAPklEQVRIx+3PMRIAMAQAQbzM0/0sKZPeiDG57TQ4keH0Htx9VR+MCM1vOezl8xUsv4IAAkYjoBsB3QgAgL9tYXgF19rh9yoAAAAASUVORK5CYII=";
Neo.ToolTip.copy =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAATCAYAAADWOo4fAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAAW0lEQVRIx+2XMQoAIAwDU/E7/v95Orh2KMUSC7m5Qs6AUqAxG1gzOLirwxhgmXOjOlg1oQY8sjf2mvYNSICNBNhIgE3oH/jlzfdo34AE2EiATXsBA+5mww6S5QASDwSGMt8ouwAAAABJRU5ErkJggg==";
Neo.ToolTip.copy2 =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAATCAYAAADWOo4fAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAAN0lEQVRIx+3PwQkAIBADwdPKt3MtQVCOPNz5B7JV0pNxOwRW9zng+G92n+hmQJoBaQakGSBJf9tyBgQUV/fKCAAAAABJRU5ErkJggg==";
Neo.ToolTip.ellipse =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAATCAYAAADWOo4fAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAATklEQVRIx+2VMQ4AIAgD6/8fjbOJi1LFmt4OPQ0KIE7LNgggCBLbHkuFM9lM+Om+QwDjpksyb4tT86vlvzgEbYxefQPyv5D8HjDGGGOk6b3jJ+lYubd8AAAAAElFTkSuQmCC";
Neo.ToolTip.ellipsefill =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAATCAYAAADWOo4fAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAAVUlEQVRIx+2VURIAEAgFc/9D5waSHpV5+43ZHRMizRnRA1REARLHHq6NCFl01Nail+LeEDMgU34nYhlQQd6K+PsGKkSEZyArBPoK3Y6K/AOEEEJIayZHbhIKjkZrFwAAAABJRU5ErkJggg==";
Neo.ToolTip.eraser =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAATCAYAAADWOo4fAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAABQElEQVRIx+1WQY7CMAwcI37Cad+yXOgH4Gu8gAt9CtrDirfMHjZJbbcktVSpQnROSeMkY3vsFHhzSG3xfLpz/JVmG0mIqDkIMcc6+7Kejx6fdb0dq7w09rVFkrjejrMOunQ9vg7f/5QEIAd6E1Eo38WF8fF7n8sdALCrLerIzoFI4sI0Vtv1SYZ8CVbeF7tzF7JugIkVkxOauc6CIe8842S+XmMfsq7TN9LRTngZmTmVD4SrnzYaGYhFoxCWgajXuMjYGTuJ3dlwIBIN3U0cUVqLXCs5E7YeVsvAYJul5HWeLUhL3EpstQwooqoOTEHDOebpMn7ngkUsg3RotU8X1MkuVDrYohkIupC0YArX6T+PfX3kcbQLNV/iCKi6EB3xqXdAZ0JKthZ8B0QEl673NIEX/0I/z36Rf6ENGzZ8EP4A8Lp+9e9VWC4AAAAASUVORK5CYII=";
Neo.ToolTip.flip =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAATCAYAAADWOo4fAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAAZklEQVRIx+2XQQoAIAgE1+g7/f95degWHSyTTXDOhTsSiUBgOtCq8mD3DiOA3NxTCVgKaLA0qHiFOsHSnC8ELKQAmxRgE15APQfWv9pzLjwX+CXsjvBPKAXYpACb8AICzM2GHeSWAfVOCIiJuQ9tAAAAAElFTkSuQmCC";
Neo.ToolTip.freehand =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAATCAYAAADWOo4fAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAAdUlEQVRIx+2WUQrAMAhD3dj9r+y+VoSyLhYDynzQv1qiJlCR4hzeAhVRsiC3Jkj0c5hN7Lx7IQ9SphLE1ICdwko420purEWQuywN3pqxgcw2+WwAtU1GzoqiLZNwZBvMAIcO8y3YKUO8mkbmjPzjK9E0TUPjBoeyLAS0usjLAAAAAElFTkSuQmCC";
Neo.ToolTip.line =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAATCAYAAADWOo4fAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAAU0lEQVRIx+2UQQ4AIAjD8P+PxivRGDQC47C+oN1hIgTLQAt4qIga2c23XYAVPkm3CVhlb4ShAa/rQgMi1i0NyFg3LaBq3bAA1LpfAd7/EkIIIR2YXFYSCpWS8w8AAAAASUVORK5CYII=";
Neo.ToolTip.merge =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAATCAYAAADWOo4fAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAAW0lEQVRIx+2XQQrAQAgDx9Lv9JF9+e6h54IINlgyZ4UMOYgwmAXXmRxc3WECorJ3dAfrJtXAC7c6PPygAQuosYAaC6hJ3YHqlfyC8Q1YQI0F1IwXCHg+G3WQKhvwgwUFmFyYbwAAAABJRU5ErkJggg==";
Neo.ToolTip.pen =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAATCAYAAADWOo4fAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAAK0lEQVRIx+3OsQkAMAwDQXn/oe3WfSAEctd9I5TA32pHJ/3AoTpfAQCAGwaa5AICJLKWSQAAAABJRU5ErkJggg==";
Neo.ToolTip.rect =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAATCAYAAADWOo4fAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAAQElEQVRIx+3TMQ4AIAhD0WK8/5VxdcIYY8rw3wok7YAEr6iGKaU74BY0ro+6FKhyDHe4VxRwm6eFLn8AAADwwQIwTQgGo9ZMywAAAABJRU5ErkJggg==";
Neo.ToolTip.rectfill =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAATCAYAAADWOo4fAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAANElEQVRIx+3PIQ4AIBADwcL//3xYBMEgLiQztmab0GvcxkqqO3ALPbbO7rBXDnRzAADgYwvqDwIMJlGb5QAAAABJRU5ErkJggg==";
Neo.ToolTip.text =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAATCAYAAADWOo4fAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAAcUlEQVRIx+2VwQ7AIAhDy7L//2V2WmIYg+ky2KEv8aCCqYQqQMgrJNpUQMXEKKDmAPHyspgSrBBvLZu3cQqZEdwhfusq0KdkVR5HlFfBvpI0mtIzeusFot7vFPqYuzZYMXUFlzc+qrIn7tf/ACGEkIwDlEQ94YZjzcgAAAAASUVORK5CYII=";
Neo.ToolTip.tone =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAATCAYAAADWOo4fAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAAO0lEQVRIx+3PIQ4AMAgEwaP//zNVVZUELiQ7CgWstFy8IaVsPhT1Lb/T+fQEAtwIcCPAjQC39QEAgJIL6DQCFhAqsRkAAAAASUVORK5CYII=";
/*
-------------------------------------------------------------------------
PenTip
-------------------------------------------------------------------------
*/
Neo.penTip;
Neo.PenTip = function () {};
Neo.PenTip.prototype = new Neo.ToolTip();
Neo.PenTip.prototype.tools = [
Neo.Painter.TOOLTYPE_PEN,
Neo.Painter.TOOLTYPE_BRUSH,
Neo.Painter.TOOLTYPE_TEXT,
];
Neo.PenTip.prototype.hasTintImage = true;
Neo.PenTip.prototype.toolIcons = [
Neo.ToolTip.pen,
Neo.ToolTip.brush,
Neo.ToolTip.text,
];
Neo.PenTip.prototype.init = function (name, params) {
this.toolStrings = [
Neo.translate("鉛筆"),
Neo.translate("水彩"),
Neo.translate("ﾃｷｽﾄ"),
];
this.isTool = true;
Neo.ToolTip.prototype.init.call(this, name, params);
return this;
};
Neo.PenTip.prototype.update = function () {
for (var i = 0; i < this.tools.length; i++) {
if (Neo.painter.tool.type == this.tools[i]) this.mode = i;
}
this.draw(Neo.painter.foregroundColor);
if (this.label) {
this.label.innerHTML = this.toolStrings[this.mode];
}
};
/*
-------------------------------------------------------------------------
Pen2Tip
-------------------------------------------------------------------------
*/
Neo.pen2Tip;
Neo.Pen2Tip = function () {};
Neo.Pen2Tip.prototype = new Neo.ToolTip();
Neo.Pen2Tip.prototype.tools = [
Neo.Painter.TOOLTYPE_TONE,
Neo.Painter.TOOLTYPE_BLUR,
Neo.Painter.TOOLTYPE_DODGE,
Neo.Painter.TOOLTYPE_BURN,
];
Neo.Pen2Tip.prototype.hasTintImage = true;
Neo.Pen2Tip.prototype.toolIcons = [
Neo.ToolTip.tone,
Neo.ToolTip.blur,
Neo.ToolTip.burn,
Neo.ToolTip.burn,
];
Neo.Pen2Tip.prototype.init = function (name, params) {
this.toolStrings = [
Neo.translate("トーン"),
Neo.translate("ぼかし"),
Neo.translate("覆い焼き"),
Neo.translate("焼き込み"),
];
this.isTool = true;
Neo.ToolTip.prototype.init.call(this, name, params);
return this;
};
Neo.Pen2Tip.prototype.update = function () {
for (var i = 0; i < this.tools.length; i++) {
if (Neo.painter.tool.type == this.tools[i]) this.mode = i;
}
switch (this.tools[this.mode]) {
case Neo.Painter.TOOLTYPE_TONE:
this.drawTone(Neo.painter.foregroundColor);
break;
case Neo.Painter.TOOLTYPE_DODGE:
this.draw(0xffc0c0c0);
break;
case Neo.Painter.TOOLTYPE_BURN:
this.draw(0xff404040);
break;
default:
this.draw(Neo.painter.foregroundColor);
break;
}
this.label.innerHTML = this.toolStrings[this.mode];
};
Neo.Pen2Tip.prototype.drawTone = function () {
var ctx = this.canvas.getContext("2d");
var imageData = ctx.getImageData(0, 0, 46, 18);
var buf32 = new Uint32Array(imageData.data.buffer);
var buf8 = new Uint8ClampedArray(imageData.data.buffer);
var c = Neo.painter.getColor() | 0xff000000;
var a = Math.floor(Neo.painter.alpha * 255);
var toneData = Neo.painter.getToneData(a);
for (var j = 0; j < 18; j++) {
for (var i = 0; i < 46; i++) {
if (
j >= 1 &&
j < 12 &&
i >= 2 &&
i < 26 &&
toneData[(i % 4) + (j % 4) * 4]
) {
buf32[j * 46 + i] = c;
} else {
buf32[j * 46 + i] = 0;
}
}
}
imageData.data.set(buf8);
ctx.putImageData(imageData, 0, 0);
this.prevMode = this.mode;
};
/*
-------------------------------------------------------------------------
EraserTip
-------------------------------------------------------------------------
*/
Neo.eraserTip;
Neo.EraserTip = function () {};
Neo.EraserTip.prototype = new Neo.ToolTip();
Neo.EraserTip.prototype.tools = [
Neo.Painter.TOOLTYPE_ERASER,
Neo.Painter.TOOLTYPE_ERASERECT,
Neo.Painter.TOOLTYPE_ERASEALL,
];
Neo.EraserTip.prototype.init = function (name, params) {
this.toolStrings = [
Neo.translate("消しペン"),
Neo.translate("消し四角"),
Neo.translate("全消し"),
];
this.drawOnce = false;
this.isTool = true;
Neo.ToolTip.prototype.init.call(this, name, params);
return this;
};
Neo.EraserTip.prototype.update = function () {
for (var i = 0; i < this.tools.length; i++) {
if (Neo.painter.tool.type == this.tools[i]) this.mode = i;
}
if (this.drawOnce == false) {
this.draw();
this.drawOnce = true;
}
this.label.innerHTML = this.toolStrings[this.mode];
};
Neo.EraserTip.prototype.draw = function () {
var ctx = this.canvas.getContext("2d");
ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
var img = new Image();
img.src = Neo.ToolTip.eraser;
img.onload = function () {
ctx.drawImage(img, 0, 0);
};
};
/*
-------------------------------------------------------------------------
EffectTip
-------------------------------------------------------------------------
*/
Neo.effectTip;
Neo.EffectTip = function () {};
Neo.EffectTip.prototype = new Neo.ToolTip();
Neo.EffectTip.prototype.tools = [
Neo.Painter.TOOLTYPE_RECTFILL,
Neo.Painter.TOOLTYPE_RECT,
Neo.Painter.TOOLTYPE_ELLIPSEFILL,
Neo.Painter.TOOLTYPE_ELLIPSE,
];
Neo.EffectTip.prototype.hasTintImage = true;
Neo.EffectTip.prototype.toolIcons = [
Neo.ToolTip.rectfill,
Neo.ToolTip.rect,
Neo.ToolTip.ellipsefill,
Neo.ToolTip.ellipse,
];
Neo.EffectTip.prototype.init = function (name, params) {
this.toolStrings = [
Neo.translate("四角"),
Neo.translate("線四角"),
Neo.translate("楕円"),
Neo.translate("線楕円"),
];
this.isTool = true;
Neo.ToolTip.prototype.init.call(this, name, params);
return this;
};
Neo.EffectTip.prototype.update = function () {
for (var i = 0; i < this.tools.length; i++) {
if (Neo.painter.tool.type == this.tools[i]) this.mode = i;
}
this.draw(Neo.painter.foregroundColor);
this.label.innerHTML = this.toolStrings[this.mode];
};
/*
-------------------------------------------------------------------------
Effect2Tip
-------------------------------------------------------------------------
*/
Neo.effect2Tip;
Neo.Effect2Tip = function () {};
Neo.Effect2Tip.prototype = new Neo.ToolTip();
Neo.Effect2Tip.prototype.tools = [
Neo.Painter.TOOLTYPE_COPY,
Neo.Painter.TOOLTYPE_MERGE,
Neo.Painter.TOOLTYPE_BLURRECT,
Neo.Painter.TOOLTYPE_FLIP_H,
Neo.Painter.TOOLTYPE_FLIP_V,
Neo.Painter.TOOLTYPE_TURN,
];
Neo.Effect2Tip.prototype.hasTintImage = true;
Neo.Effect2Tip.prototype.toolIcons = [
Neo.ToolTip.copy,
Neo.ToolTip.merge,
Neo.ToolTip.blurrect,
Neo.ToolTip.flip,
Neo.ToolTip.flip,
Neo.ToolTip.flip,
];
Neo.Effect2Tip.prototype.init = function (name, params) {
this.toolStrings = [
Neo.translate("コピー"),
Neo.translate("ﾚｲﾔ結合"),
Neo.translate("角取り"),
Neo.translate("左右反転"),
Neo.translate("上下反転"),
Neo.translate("傾け"),
];
this.isTool = true;
Neo.ToolTip.prototype.init.call(this, name, params);
this.img = document.createElement("img");
this.img.src = Neo.ToolTip.copy2;
this.element.appendChild(this.img);
return this;
};
Neo.Effect2Tip.prototype.update = function () {
for (var i = 0; i < this.tools.length; i++) {
if (Neo.painter.tool.type == this.tools[i]) this.mode = i;
}
this.draw(Neo.painter.foregroundColor);
this.label.innerHTML = this.toolStrings[this.mode];
};
/*
-------------------------------------------------------------------------
MaskTip
-------------------------------------------------------------------------
*/
Neo.maskTip;
Neo.MaskTip = function () {};
Neo.MaskTip.prototype = new Neo.ToolTip();
Neo.MaskTip.prototype.init = function (name, params) {
this.toolStrings = [
Neo.translate("通常"),
Neo.translate("マスク"),
Neo.translate("逆ﾏｽｸ"),
Neo.translate("加算"),
Neo.translate("逆加算"),
];
this.fixed = true;
Neo.ToolTip.prototype.init.call(this, name, params);
return this;
};
Neo.MaskTip.prototype._mouseDownHandler = function (e) {
this.isMouseDown = true;
if (Neo.getModifier(e) == "right") {
Neo.painter.maskColor = Neo.painter.foregroundColor;
} else {
var length = this.toolStrings.length;
this.mode++;
if (this.mode >= length) this.mode = 0;
Neo.painter.maskType = this.mode;
}
this.update();
if (this.onmousedown) this.onmousedown(this);
};
Neo.MaskTip.prototype.update = function () {
this.draw(Neo.painter.maskColor);
this.label.innerHTML = this.toolStrings[this.mode];
};
Neo.MaskTip.prototype.draw = function (c) {
if (typeof c != "string") c = Neo.painter.getColorString(c);
var ctx = this.canvas.getContext("2d");
ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
ctx.fillStyle = c;
ctx.fillRect(1, 1, 43, 9);
};
/*
-------------------------------------------------------------------------
DrawTip
-------------------------------------------------------------------------
*/
Neo.drawTip;
Neo.DrawTip = function () {};
Neo.DrawTip.prototype = new Neo.ToolTip();
Neo.DrawTip.prototype.hasTintImage = true;
Neo.DrawTip.prototype.toolIcons = [
Neo.ToolTip.freehand,
Neo.ToolTip.line,
Neo.ToolTip.bezier,
];
Neo.DrawTip.prototype.init = function (name, params) {
this.toolStrings = [
Neo.translate("手書き"),
Neo.translate("直線"),
Neo.translate("BZ曲線"),
];
this.fixed = true;
Neo.ToolTip.prototype.init.call(this, name, params);
return this;
};
Neo.DrawTip.prototype._mouseDownHandler = function (e) {
this.isMouseDown = true;
var length = this.toolStrings.length;
if (Neo.getModifier(e) == "right") {
this.mode--;
if (this.mode < 0) this.mode = length - 1;
} else {
this.mode++;
if (this.mode >= length) this.mode = 0;
}
Neo.painter.drawType = this.mode;
this.update();
if (this.onmousedown) this.onmousedown(this);
};
Neo.DrawTip.prototype.update = function () {
this.mode = Neo.painter.drawType;
this.draw(Neo.painter.foregroundColor);
this.label.innerHTML = this.toolStrings[this.mode];
};
/*
-------------------------------------------------------------------------
ColorSlider
-------------------------------------------------------------------------
*/
Neo.sliders = [];
Neo.ColorSlider = function () {};
Neo.ColorSlider.prototype.init = function (name, params) {
this.element = document.getElementById(name);
this.params = params || {};
this.name = name;
this.isMouseDown = false;
this.value = 0;
this.type = this.params.type;
this.element.className = "colorSlider";
this.element.innerHTML =
"";
this.element.innerHTML += "";
this.slider = this.element.getElementsByClassName("slider")[0];
this.label = this.element.getElementsByClassName("label")[0];
this.hit = this.element.getElementsByClassName("hit")[0];
this.hit["data-slider"] = params.type;
switch (this.type) {
case Neo.SLIDERTYPE_RED:
this.prefix = "R";
this.slider.style.backgroundColor = "#fa9696";
break;
case Neo.SLIDERTYPE_GREEN:
this.prefix = "G";
this.slider.style.backgroundColor = "#82f238";
break;
case Neo.SLIDERTYPE_BLUE:
this.prefix = "B";
this.slider.style.backgroundColor = "#8080ff";
break;
case Neo.SLIDERTYPE_ALPHA:
this.prefix = "A";
this.slider.style.backgroundColor = "#aaaaaa";
this.value = 255;
break;
}
this.update();
return this;
};
Neo.ColorSlider.prototype.downHandler = function (x, y) {
if (Neo.painter.isShiftDown) {
this.shift(x, y);
} else {
this.slide(x, y);
}
};
Neo.ColorSlider.prototype.moveHandler = function (x, y) {
this.slide(x, y);
//event.preventDefault();
};
Neo.ColorSlider.prototype.upHandler = function (x, y) {};
Neo.ColorSlider.prototype.shift = function (x, y) {
var value;
if (x >= 0 && x < 60 && y >= 0 && y <= 15) {
var v = Math.floor((x - 5) * 5.0);
var min = this.type == Neo.SLIDERTYPE_ALPHA ? 1 : 0;
value = Math.max(Math.min(v, 255), min);
if (this.value > value || this.value == 255) {
this.value--;
} else {
this.value++;
}
this.value = Math.max(Math.min(this.value, 255), min);
this.value0 = this.value;
this.x0 = x;
}
if (this.type == Neo.SLIDERTYPE_ALPHA) {
Neo.painter.alpha = this.value / 255.0;
this.update();
Neo.updateUIColor(false, false);
} else {
var r = Neo.sliders[Neo.SLIDERTYPE_RED].value;
var g = Neo.sliders[Neo.SLIDERTYPE_GREEN].value;
var b = Neo.sliders[Neo.SLIDERTYPE_BLUE].value;
Neo.painter.setColor((r << 16) | (g << 8) | b);
Neo.updateUIColor(true, true);
}
};
Neo.ColorSlider.prototype.slide = function (x, y) {
var value;
if (x >= 0 && x < 60 && y >= 0 && y <= 15) {
var v = Math.floor((x - 5) * 5.0);
value = Math.round(v / 5) * 5;
this.value0 = value;
this.x0 = x;
} else {
var d = (x - this.x0) / 3.0;
value = this.value0 + d;
}
var min = this.type == Neo.SLIDERTYPE_ALPHA ? 1 : 0;
this.value = Math.max(Math.min(value, 255), min);
if (this.type == Neo.SLIDERTYPE_ALPHA) {
Neo.painter.alpha = this.value / 255.0;
this.update();
Neo.updateUIColor(false, false);
} else {
var r = Neo.sliders[Neo.SLIDERTYPE_RED].value;
var g = Neo.sliders[Neo.SLIDERTYPE_GREEN].value;
var b = Neo.sliders[Neo.SLIDERTYPE_BLUE].value;
var color = (r << 16) | (g << 8) | b;
var colorTip = Neo.ColorTip.getCurrent();
if (colorTip) {
colorTip.setColor(Neo.painter.getColorString(color));
}
Neo.painter.setColor(color);
// Neo.updateUIColor(true, true);
}
};
Neo.ColorSlider.prototype.update = function () {
var color = Neo.painter.getColor();
var alpha = Neo.painter.alpha * 255;
switch (this.type) {
case Neo.SLIDERTYPE_RED:
this.value = color & 0x0000ff;
break;
case Neo.SLIDERTYPE_GREEN:
this.value = (color & 0x00ff00) >> 8;
break;
case Neo.SLIDERTYPE_BLUE:
this.value = (color & 0xff0000) >> 16;
break;
case Neo.SLIDERTYPE_ALPHA:
this.value = alpha;
break;
}
var width = (this.value * 49.0) / 255.0;
width = Math.max(Math.min(48, width), 1);
this.slider.style.width = width.toFixed(2) + "px";
this.label.innerHTML = this.prefix + this.value.toFixed(0);
};
/*
-------------------------------------------------------------------------
SizeSlider
-------------------------------------------------------------------------
*/
Neo.SizeSlider = function () {};
Neo.SizeSlider.prototype.init = function (name, params) {
this.element = document.getElementById(name);
this.params = params || {};
this.name = name;
this.isMouseDown = false;
this.value = this.value0 = 1;
this.element.className = "sizeSlider";
this.element.innerHTML =
"";
this.element.innerHTML += "";
this.slider = this.element.getElementsByClassName("slider")[0];
this.label = this.element.getElementsByClassName("label")[0];
this.hit = this.element.getElementsByClassName("hit")[0];
this.hit["data-slider"] = params.type;
this.slider.style.backgroundColor = Neo.painter.foregroundColor;
this.update();
return this;
};
Neo.SizeSlider.prototype.downHandler = function (x, y) {
if (Neo.painter.isShiftDown) {
this.shift(x, y);
} else {
this.value0 = this.value;
this.y0 = y;
this.slide(x, y);
}
};
Neo.SizeSlider.prototype.moveHandler = function (x, y) {
this.slide(x, y);
//event.preventDefault();
};
Neo.SizeSlider.prototype.upHandler = function (x, y) {};
Neo.SizeSlider.prototype.shift = function (x, y) {
var value0 = Neo.painter.lineWidth;
var value;
if (!Neo.painter.tool.alt) {
var v = Math.floor(((y - 4) * 30.0) / 33.0);
value = Math.max(Math.min(v, 30), 1);
if (value0 > value || value0 == 30) {
value0--;
} else {
value0++;
}
this.setSize(value0);
}
};
Neo.SizeSlider.prototype.slide = function (x, y) {
var value;
if (!Neo.painter.tool.alt) {
if (x >= 0 && x < 48 && y >= 0 && y < 41) {
var v = Math.floor(((y - 4) * 30.0) / 33.0);
value = v;
this.value0 = value;
this.y0 = y;
} else {
var d = (y - this.y0) / 7.0;
value = this.value0 + d;
}
} else {
// Ctrl+Alt+ドラッグでサイズ変更するとき
var d = y - this.y0;
value = this.value0 + d;
}
value = Math.max(Math.min(value, 30), 1);
this.setSize(value);
};
Neo.SizeSlider.prototype.setSize = function (value) {
value = Math.round(value);
Neo.painter.lineWidth = Math.max(Math.min(30, value), 1);
var tool = Neo.painter.getCurrentTool();
if (tool) {
if (tool.type == Neo.Painter.TOOLTYPE_BRUSH) {
Neo.painter.alpha = tool.getAlpha();
Neo.sliders[Neo.SLIDERTYPE_ALPHA].update();
} else if (tool.type == Neo.Painter.TOOLTYPE_TEXT) {
Neo.painter.updateInputText();
}
}
this.update();
};
Neo.SizeSlider.prototype.update = function () {
this.value = Neo.painter.lineWidth;
var height = (this.value * 33.0) / 30.0;
height = Math.max(Math.min(34, height), 1);
this.slider.style.height = height.toFixed(2) + "px";
this.label.innerHTML = this.value + "px";
this.slider.style.backgroundColor = Neo.painter.foregroundColor;
};
/*
-------------------------------------------------------------------------
LayerControl
-------------------------------------------------------------------------
*/
Neo.LayerControl = function () {};
Neo.LayerControl.prototype.init = function (name, params) {
this.element = document.getElementById(name);
this.params = params || {};
this.name = name;
this.isMouseDown = false;
var ref = this;
this.element.onmousedown = function (e) {
ref._mouseDownHandler(e);
};
this.element.addEventListener(
"touchstart",
function (e) {
ref._mouseDownHandler(e);
e.preventDefault();
},
true
);
this.element.className = "layerControl";
var layerStrings = [Neo.translate("Layer0"), Neo.translate("Layer1")];
this.element.innerHTML =
"" +
layerStrings[0] +
"
" +
layerStrings[1] +
"
";
this.bg = this.element.getElementsByClassName("bg")[0];
this.label0 = this.element.getElementsByClassName("label0")[0];
this.label1 = this.element.getElementsByClassName("label1")[0];
this.line0 = this.element.getElementsByClassName("line0")[0];
this.line1 = this.element.getElementsByClassName("line1")[0];
this.line0.style.display = "none";
this.line1.style.display = "none";
this.label1.style.display = "none";
this.update();
return this;
};
Neo.LayerControl.prototype._mouseDownHandler = function (e) {
if (Neo.getModifier(e) == "right") {
var visible = Neo.painter.visible[Neo.painter.current];
Neo.painter.visible[Neo.painter.current] = visible ? false : true;
} else {
var current = Neo.painter.current;
Neo.painter.current = current ? 0 : 1;
}
Neo.painter.updateDestCanvas(
0,
0,
Neo.painter.canvasWidth,
Neo.painter.canvasHeight
);
if (Neo.painter.tool.type == Neo.Painter.TOOLTYPE_PASTE) {
Neo.painter.tool.drawCursor(Neo.painter);
}
this.update();
if (this.onmousedown) this.onmousedown(this);
};
Neo.LayerControl.prototype.update = function () {
this.label0.style.display = Neo.painter.current == 0 ? "block" : "none";
this.label1.style.display = Neo.painter.current == 1 ? "block" : "none";
this.line0.style.display = Neo.painter.visible[0] ? "none" : "block";
this.line1.style.display = Neo.painter.visible[1] ? "none" : "block";
};
/*
-------------------------------------------------------------------------
ReserveControl
-------------------------------------------------------------------------
*/
Neo.reserveControls = [];
Neo.ReserveControl = function () {};
Neo.ReserveControl.prototype.init = function (name, params) {
this.element = document.getElementById(name);
this.params = params || {};
this.name = name;
var ref = this;
this.element.onmousedown = function (e) {
ref._mouseDownHandler(e);
};
this.element.addEventListener(
"touchstart",
function (e) {
ref._mouseDownHandler(e);
e.preventDefault();
},
true
);
this.element.className = "reserve";
var index = parseInt(this.name.slice(7)) - 1;
this.element.style.top = "1px";
this.element.style.left = index * 15 + 2 + "px";
this.reserve = Neo.clone(Neo.config.reserves[index]);
this.update();
Neo.reserveControls.push(this);
return this;
};
Neo.ReserveControl.prototype._mouseDownHandler = function (e) {
if (Neo.getModifier(e) == "right") {
this.save();
} else {
this.load();
}
this.update();
};
Neo.ReserveControl.prototype.load = function () {
Neo.painter.setToolByType(this.reserve.tool);
Neo.painter.foregroundColor = this.reserve.color;
Neo.painter.lineWidth = this.reserve.size;
Neo.painter.alpha = this.reserve.alpha;
switch (this.reserve.tool) {
case Neo.Painter.TOOLTYPE_PEN:
case Neo.Painter.TOOLTYPE_BRUSH:
case Neo.Painter.TOOLTYPE_TONE:
Neo.painter.drawType = this.reserve.drawType;
}
Neo.updateUI();
};
Neo.ReserveControl.prototype.save = function () {
this.reserve.color = Neo.painter.foregroundColor;
this.reserve.size = Neo.painter.lineWidth;
this.reserve.drawType = Neo.painter.drawType;
this.reserve.alpha = Neo.painter.alpha;
this.reserve.tool = Neo.painter.tool.getType();
this.element.style.backgroundColor = this.reserve.color;
this.update();
Neo.updateUI();
};
Neo.ReserveControl.prototype.update = function () {
this.element.style.backgroundColor = this.reserve.color;
};
/*
-------------------------------------------------------------------------
ScrollBarButton
-------------------------------------------------------------------------
*/
Neo.scrollH;
Neo.scrollV;
Neo.ScrollBarButton = function () {};
Neo.ScrollBarButton.prototype.init = function (name, params) {
this.element = document.getElementById(name);
this.params = params || {};
this.name = name;
this.element.innerHTML = "";
this.barButton = this.element.getElementsByTagName("div")[0];
this.element["data-bar"] = true;
this.barButton["data-bar"] = true;
if (name == "scrollH") Neo.scrollH = this;
if (name == "scrollV") Neo.scrollV = this;
return this;
};
Neo.ScrollBarButton.prototype.update = function (oe) {
if (this.name == "scrollH") {
var a = oe.destCanvas.width / (oe.canvasWidth * oe.zoom);
var barWidth = Math.ceil(oe.destCanvas.width * a);
var barX = oe.scrollBarX * (oe.destCanvas.width - barWidth);
this.barButton.style.width = Math.ceil(barWidth) - 4 + "px";
this.barButton.style.left = Math.floor(barX) + "px";
} else {
var a = oe.destCanvas.height / (oe.canvasHeight * oe.zoom);
var barHeight = Math.ceil(oe.destCanvas.height * a);
var barY = oe.scrollBarY * (oe.destCanvas.height - barHeight);
this.barButton.style.height = Math.ceil(barHeight) - 4 + "px";
this.barButton.style.top = Math.floor(barY) + "px";
}
};
/*
-------------------------------------------------------------------------
ViewerButton
-------------------------------------------------------------------------
*/
Neo.ViewerButton = function () {};
Neo.ViewerButton.prototype = new Neo.Button();
Neo.ViewerButton.speedStrings = ["最", "早", "既", "鈍"];
Neo.ViewerButton.prototype.init = function (name, params) {
Neo.Button.prototype.init.call(this, name, params);
if (name != "viewerSpeed") {
this.element.innerHTML = "";
this.canvas = this.element.getElementsByTagName("canvas")[0];
var ctx = this.canvas.getContext("2d");
var img = new Image();
img.src = Neo.ViewerButton[name.toLowerCase().replace(/viewer/, "")];
img.onload = function () {
var ref = this;
ctx.clearRect(0, 0, 24, 24);
ctx.drawImage(img, 0, 0);
Neo.tintImage(ctx, Neo.config.color_text);
}.bind(this);
} else {
this.element.innerHTML = "";
this.update();
}
return this;
};
Neo.ViewerButton.prototype.update = function () {
if (this.name == "viewerSpeed") {
var mode = Neo.painter._actionMgr.speedMode();
var speedString = Neo.translate(Neo.ViewerButton.speedStrings[mode]);
this.element.children[0].innerHTML = "" + speedString + "
";
}
};
Neo.ViewerButton.minus =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEX/////HgA/G9hMAAAAAXRSTlMAQObYZgAAABFJREFUCNdjYMAG5H+AEDYAADOnAi81ABEKAAAAAElFTkSuQmCC";
Neo.ViewerButton.plus =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAgMAAABinRfyAAAACVBMVEX/////HgD/HgAvnCBAAAAAAnRSTlMAAHaTzTgAAAAfSURBVAjXY2BAA0wTMAimVasaIARj2FQHCIGkBAUAAGm3CXHeKF1tAAAAAElFTkSuQmCC";
Neo.ViewerButton.play =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAgMAAABinRfyAAAACVBMVEX/////HgD/HgAvnCBAAAAAAnRSTlMAAHaTzTgAAAAuSURBVAjXY2BAABUQoQkitBxAxAQQsQRErAQRq+CspSBiKogIAekIABKqDhAzAAuwB6SsnxQ6AAAAAElFTkSuQmCC";
Neo.ViewerButton.stop =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEX/////HgA/G9hMAAAAAXRSTlMAQObYZgAAABFJREFUCNdjYIAB+x8EEBgAACjyDV75Mi9xAAAAAElFTkSuQmCC";
Neo.ViewerButton.rewind =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEX/////HgA/G9hMAAAAAXRSTlMAQObYZgAAACxJREFUCNdjYAADJiYGNjYGPj4GOTkGOzuGujqGf/9AJJANFAGKA2WBahgYAIE2Bb0RIYJRAAAAAElFTkSuQmCC";
/*
-------------------------------------------------------------------------
ViewerBar
-------------------------------------------------------------------------
*/
// length/mark/count
// update
Neo.ViewerBar = function () {};
Neo.ViewerBar.prototype.init = function (name, params) {
this.element = document.getElementById(name);
this.params = params || {};
this.name = name;
this.isMouseDown = false;
this.element.style.display = "inline-block";
this.element.innerHTML =
"" +
"" +
"hoge
";
this.seekElement = this.element.children[0];
this.markElement = this.element.children[1];
this.textElement = this.element.children[2];
this.width = this.seekElement.offsetWidth;
this.length = this.params.length || 100;
this.mark = this.length;
this.seek = 0;
var ref = this;
this.element.onmousedown = function (e) {
ref.isMouseDown = true;
ref._touchHandler(e);
};
this.element.onmousemove = function (e) {
if (ref.isMouseDown) {
ref._touchHandler(e);
}
};
// this.element.onmouseup = function(e) { this.isMouseDown = false; }
// this.element.onmouseout = function(e) { this.isMouseDown = false; }
this.element.addEventListener(
"touchstart",
function (e) {
ref._touchHandler(e);
e.preventDefault();
},
true
);
this.update();
return this;
};
Neo.ViewerBar.prototype.update = function () {
this.mark = Neo.painter._actionMgr._mark;
this.seek = Neo.painter._actionMgr._head;
var markX = (this.mark / this.length) * this.width;
this.markElement.style.left = markX + "px";
var seekX = (this.seek / this.length) * this.width;
this.seekElement.style.width = seekX + "px";
this.textElement.innerHTML = this.seek + "/" + this.length;
};
Neo.ViewerBar.prototype._touchHandler = function (e) {
var x = e.offsetX / this.width;
x = Math.max(Math.min(x, 1), 0);
Neo.painter._actionMgr._mark = Math.round(x * this.length);
//this.update();
// console.log('mark=', this.mark, 'head=', Neo.painter._actionMgr._head);
Neo.painter.onmark();
};
// Copyright (c) 2013 Pieroxy