Claude
084922afaa
Bring the full EditmaskwithAI application into the repo under paintplus/ (429 files) so the service is self-contained — the installer copies the vendored source to ~/docker/paintplus/src instead of cloning at runtime. Rename to PaintPlus (service + branding; app logic untouched): - services/editmaskwithai.sh -> services/paintplus.sh (register_service paintplus, install_paintplus, ~/docker/paintplus, Caddy paintplus:8000, Authelia option preserved) - container names -> paintplus across docker-compose*.yml; dev network -> paintplus-network - browser <title> -> "PaintPlus - AI Image Editor"; README heading -> PaintPlus with upstream provenance note - README utilities table: editmaskwithai -> paintplus Backend/frontend code (help strings referencing the old container name, the ai_photo_edit.db filename) is intentionally left as-is to avoid touching application logic. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Nb2vJ8W7bHKx1JXVvpCraH
76 lines
1.9 KiB
HTML
76 lines
1.9 KiB
HTML
<html>
|
|
<body style="margin:0;">
|
|
|
|
<iframe id="myFrame" style="width:100%;height:100vh;border:0;" src="../" allow="camera"></iframe>
|
|
|
|
<script>
|
|
window.addEventListener('load', function (e) {
|
|
draw_various();
|
|
}, false);
|
|
|
|
async function draw_various() {
|
|
var Layers = document.getElementById('myFrame').contentWindow.Layers;
|
|
|
|
//add layer
|
|
var canvas = document.createElement('canvas');
|
|
canvas.width = 50;
|
|
canvas.height = 50;
|
|
var ctx = canvas.getContext("2d");
|
|
cross_X(ctx, 25, 25);
|
|
var params = {
|
|
type: 'image',
|
|
data: canvas.toDataURL("image/png"),
|
|
x: 50,
|
|
y: 50,
|
|
width: canvas.width,
|
|
height: canvas.height,
|
|
};
|
|
await Layers.insert(params);
|
|
|
|
//add new layer
|
|
var canvas = document.createElement('canvas');
|
|
canvas.width = 400;
|
|
canvas.height = 400;
|
|
var ctx = canvas.getContext("2d");
|
|
cross_X(ctx, 200, 200, null, '#00cc00');
|
|
var params = {
|
|
type: 'image',
|
|
data: canvas.toDataURL("image/png"),
|
|
width: canvas.width,
|
|
height: canvas.height,
|
|
};
|
|
await Layers.insert(params);
|
|
|
|
//update last layer
|
|
var canvas = Layers.convert_layer_to_canvas(null, true); //no trim
|
|
var ctx = canvas.getContext("2d");
|
|
cross_X(ctx, 300, 300, null, '#00cc00');
|
|
Layers.update_layer_image(canvas);
|
|
//also update layer
|
|
var link = Layers.get_layer();
|
|
link.x = parseInt(canvas.dataset.x);
|
|
link.y = parseInt(canvas.dataset.y);
|
|
link.width = canvas.width;
|
|
link.height = canvas.height;
|
|
}
|
|
|
|
function cross_X(ctx, x, y, size = 20, col = '#ff0000') {
|
|
if(size == null)
|
|
size = 20;
|
|
x = parseFloat(x);
|
|
y = parseFloat(y);
|
|
size = parseInt(size);
|
|
var lw = parseInt(5);
|
|
ctx.beginPath();
|
|
ctx.moveTo(x - size, y - size);
|
|
ctx.lineTo(x + size, y + size);
|
|
ctx.lineWidth = lw;
|
|
ctx.strokeStyle = col;
|
|
ctx.stroke();
|
|
ctx.moveTo(x + size, y - size);
|
|
ctx.lineTo(x - size, y + size);
|
|
ctx.lineWidth = lw;
|
|
ctx.strokeStyle = col;
|
|
ctx.stroke();
|
|
}
|
|
</script> |