X-Git-Url: https://git.plutz.net/?p=confetti;a=blobdiff_plain;f=static%2Ftherapy_draw.js;fp=static%2Ftherapy_draw.js;h=0000000000000000000000000000000000000000;hp=8a8e936c6873b443a0d7ba0799b491e7f5d50f7e;hb=43e7c60df0632fd383306a2d3c6dc8c4213d4b9d;hpb=d40eb749c3b9766eb85d843e712f1b86543232d2 diff --git a/static/therapy_draw.js b/static/therapy_draw.js deleted file mode 100644 index 8a8e936..0000000 --- a/static/therapy_draw.js +++ /dev/null @@ -1,115 +0,0 @@ -// Copyright 2016 Paul Hänsch -// -// This file is part of Confetti. -// -// Confetti is free software: you can redistribute it and/or modify -// it under the terms of the GNU Affero General Public License as published by -// the Free Software Foundation, either version 3 of the License, or -// (at your option) any later version. -// -// Confetti is distributed in the hope that it will be useful, -// but WITHOUT ANY WARRANTY; without even the implied warranty of -// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the -// GNU Affero General Public License for more details. -// -// You should have received a copy of the GNU Affero General Public License -// along with Confetti. If not, see . - -body = document.body -dbg = document.getElementById("jsdebug") -canvas = document.getElementById("canvas") -data=document.getElementById("image_serialize") - -image = canvas.getContext("2d") -mouse = 0 -image_serialize="" - -// start and current coordinates of a draw -// serves for tracking, whether path ends close to its beginning -stx=0, sty=0 -cux=0, cuy=0 - -function setstroke(w) { - image.lineWidth = w - data.value += " stroke-width " + image.lineWidth -} -function setcol(c) { - this.c = c - image.strokeStyle = c - image.fillStyle = c - data.value += " stroke " + c + "F" -} - -function relX(x){ - if ( body.clientWidth >= 800 ){ - return Math.floor(cscaleW * (x - canvas.offsetLeft)) - } else { - return Math.floor(cscaleW * (x - canvas.offsetLeft + window.pageXOffset)) - } -} -function relY(y){ - if ( body.clientWidth >= 800 ){ - return Math.floor(cscaleH * (y - canvas.offsetTop)) - } else { - return Math.floor(cscaleH * (y - canvas.offsetTop + window.pageYOffset)) - } -} - -function draw(x, y) { - if ( mouse == 1){ - cux=relX(x), cuy=relY(y) - - image.lineTo( cux, cuy ) - image.stroke() - - image_serialize += " " + cux + "," + cuy - } -} - -function drawstart(x, y) { - mouse = 1 - - cscaleW = canvas.width / canvas.clientWidth - cscaleH = canvas.height / canvas.clientHeight - - stx=relX(x), sty=relY(y) - - setstroke(document.querySelector('input[name="penwidth"]:checked').value); - setcol(document.querySelector('input[name="color"]:checked').value); - - image.beginPath() - draw(x, y) // why must this not use relative Coords ??? - - image_serialize = " polyline" -} - -function drawstop() { - - // if path ends close to beginning ( < 50 px); then close path and fill - if ( false && mouse == 1 && Math.sqrt( Math.pow(stx - cux, 2) + Math.pow(sty - cuy, 2)) <= 50 && c !== "#FFF" ){ - image.lineTo( stx, sty ) - image.stroke() - - image.globalAlpha = .5 - image.fill() - image.globalAlpha = 1 - - image_serialize += " " + stx + "," + sty - data.value += " fill " + c + "8" + image_serialize - } else if (mouse == 1) { - data.value += " fill #0000 " + image_serialize - } - dbg.innerHTML = " stx: " + stx + " cux: " + cux + " sty: " + sty + " cuy: " + cuy - - image.closePath() - image_serialize = "" - mouse = 0 -} - -window.addEventListener( 'mouseup', function() { drawstop() } ) -canvas.addEventListener( 'mousedown', function(e) { drawstart(e.clientX, e.clientY) } ) -canvas.addEventListener( 'mousemove', function(e) { draw(e.clientX, e.clientY) } ) - -window.addEventListener( 'touchend', function() { drawstop() } ) -canvas.addEventListener( 'touchstart', function(e) { drawstart(e.touches[0].clientX, e.touches[0].clientY) } ) -canvas.addEventListener( 'touchmove', function(e) { e.preventDefault(); draw(e.touches[0].clientX, e.touches[0].clientY) } )