Delete option and better display layout

This commit is contained in:
Justin Hawkins 2021-12-16 22:58:46 +10:30
parent a099d738fc
commit f64240e135

View File

@ -1,11 +1,21 @@
{{ define "content" }}
<main role="main" class="" style="height:100%;" x-data="editor()" x-init="setup_canvas();">
<main role="main" class="" stylse="height:100%;" x-data="editor()" x-init="setup_canvas();">
<div class="row">
<div class="col">
<canvas id="c" x-bind:style="canvas_style">
</canvas>
<img :src="img_data">
</div>
<div class="col">
<div id="tools-top" x-show="!toolbar">
<button type="button" @click="add_some_text()" class="btn btn-primary">Add text</button>
<button type="button" @click="crop()" class="btn btn-primary">Crop</button>
<button type="button" @click="crop()" class="btn btn-primary">Apply</button>
</div>
<div id="tools-delete" x-show="toolbar == 'text'">
<button type="button" @click="delete_selected();" class="btn btn-primary" style="">delete</button>
</div>
<div id="tools-colour" x-show="toolbar == 'text'">
<table>
<tr>
@ -46,8 +56,9 @@
</table>
</div>
<canvas id="c" width="600" height="600" x-bind:style="canvas_style"></canvas>
<img :src="img_data">
</div>
</div>
</main>
{{ end }}
@ -100,6 +111,13 @@ function editor() {
self.toolbar = 'text';
});
},
delete_selected() {
selected = canvas.getActiveObjects();
selected.forEach(el => {
canvas.discardActiveObject(el);
canvas.remove(el);
});
},
set_colour(colour, type) {
selected = canvas.getActiveObjects();
console.log();