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

Auto adjust image/canvas size to image

Browse Source
This commit is contained in:
Dennis Eichhorn 2017-02-08 18:14:53 +01:00
parent 8bb52a3c40
commit 265f38f5c2
2 changed files with 13 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
Models/Editor.js
View File

@ -104,10 +104,19 @@
jsOMS.Modules.Draw.Editor.prototype.initCanvas = function() jsOMS.Modules.Draw.Editor.prototype.initCanvas = function()
{ {
const img = this.editor.getElementsByTagName('img'); const img = this.canvas.getAttribute('data-src'),
self = this;
if(img.length > 0) { if(typeof img !== 'undefined' && img.length > 0) {
this.canvas.getContext("2d").drawImage(img[0], 0, 0); let imgObj = new Image();
imgObj.addEventListener('load', function() {
self.canvas.width = imgObj.width;
self.canvas.height = imgObj.height;
self.canvas.getContext("2d").drawImage(imgObj, 0, 0);
});
imgObj.src = img;
} }
}; };

3
Theme/Backend/draw-single.tpl.php
View File

@ -75,8 +75,7 @@ echo $this->getData('nav')->render(); ?>
<div class="m-draw"> <div class="m-draw">
<section class="box wf-100" style="height: 30%;"> <section class="box wf-100" style="height: 30%;">
<div class="inner resizable"> <div class="inner resizable">
<img class="hidden" src="<?= $this->request->getUri()->getBase() . $image->getMedia()->getPath(); ?>"> <canvas data-src="<?= $this->request->getUri()->getBase() . $image->getMedia()->getPath(); ?>" id="canvasImage resizable" name="image" form="drawForm"></canvas>
<canvas id="canvasImage resizable" name="image" form="drawForm"></canvas>
</div> </div>
</section> </section>
</div> </div>