Jingga/oms-Draw
1
0
Fork 0
mirror of https://github.com/Karaka-Management/oms-Draw.git synced 2026-01-11 22:38:41 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Adjust paths and resize

Browse Source
This commit is contained in:
Dennis Eichhorn 2017-01-27 23:21:16 +01:00
parent e50800d08c
commit 86f5c45654
2 changed files with 13 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
Models/Editor.js
View File

@ -11,7 +11,7 @@
this.canvasContainer = this.canvas.parentElement;
this.ctx = this.canvas.getContext("2d");
const canvasStyle = window.getComputedStyle(this.canvas, null),
let canvasStyle = window.getComputedStyle(this.canvas, null),
canvasContainerStyle = window.getComputedStyle(this.canvasContainer, null);
this.resize({
@ -40,6 +40,16 @@
{
const self = this;
this.canvasContainer.addEventListener('DOMAttrModified', function(evt) {
self.canvasStyle = window.getComputedStyle(self.canvas, null);
self.canvasContainerStyle = window.getComputedStyle(self.canvasContainer, null);
this.resize({
width: parseFloat(self.canvasContainerStyle.width) - parseFloat(self.canvasContainerStyle.paddingLeft) - parseFloat(self.canvasContainerStyle.paddingRight) - parseFloat(self.canvasContainerStyle.borderLeftWidth) - parseFloat(self.canvasStyle.borderLeftWidth),
height: parseFloat(self.canvasContainerStyle.height) - parseFloat(self.canvasContainerStyle.paddingTop) - parseFloat(self.canvasContainerStyle.paddingBottom) - parseFloat(self.canvasContainerStyle.borderRightWidth) - parseFloat(self.canvasStyle.borderRightWidth)
});
});
// Handle draw and resize
this.canvas.addEventListener('mousemove', function (evt)
{
@ -47,26 +57,6 @@
self.oldPos = self.newPos;
self.newPos = self.mousePosition(evt);
if (self.newPos.x < self.canvas.width - 1 && self.newPos.x > self.canvas.width - 5 && self.newPos.y < self.canvas.height - 1 && self.newPos.y > self.canvas.height - 5) {
document.body.style.cursor = 'nwse-resize';
} else if (self.newPos.x > 1 && self.newPos.x < 5 && self.newPos.y > 1 && self.newPos.y < 5) {
document.body.style.cursor = 'nwse-resize';
} else if (self.newPos.x > 1 && self.newPos.x < 5 && self.newPos.y < self.canvas.height - 1 && self.newPos.y > self.canvas.height - 5) {
document.body.style.cursor = 'nesw-resize';
} else if (self.newPos.x < self.canvas.width - 1 && self.newPos.x > self.canvas.width - 5 && self.newPos.y > 1 && self.newPos.y < 5) {
document.body.style.cursor = 'nesw-resize';
} else if (self.newPos.x < self.canvas.width - 1 && self.newPos.x > self.canvas.width - 5 && self.newPos.y > 5 && self.newPos.y < self.canvas.height - 5) {
document.body.style.cursor = 'ew-resize';
} else if (self.newPos.x > 1 && self.newPos.x < 5 && self.newPos.y > 5 && self.newPos.y < self.canvas.height - 5) {
document.body.style.cursor = 'ew-resize';
} else if (self.newPos.x > 5 && self.newPos.x < self.canvas.width - 5 && self.newPos.y < self.canvas.height - 1 && self.newPos.y > self.canvas.height - 5) {
document.body.style.cursor = 'ns-resize';
} else if (self.newPos.x > 5 && self.newPos.x < self.canvas.width - 5 && self.newPos.y > 1 && self.newPos.y < 5) {
document.body.style.cursor = 'ns-resize';
} else {
document.body.style.cursor = 'default';
}
if (self.type === jsOMS.Modules.Draw.DrawTypeEnum.DRAW) {
self.draw(self.oldPos, self.newPos);
}

4
Theme/backend/draw-create.tpl.php
View File

@ -62,8 +62,8 @@ echo $this->getData('nav')->render(); ?>
<div class="m-draw">
<section class="box w-100" style="height: 30%;">
<div class="inner">
<canvas id="canvasImage" name="image" form="drawForm"></canvas>
<div class="inner resizable">
<canvas id="canvasImage resizable" name="image" form="drawForm"></canvas>
</div>
</section>
</div>