canvas-editor-engine 1.0.14 → 1.0.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -2,6 +2,7 @@ import ComponentService from "../services/component.service";
|
|
|
2
2
|
import type { IExcretionsCoords, TExcretionStyle, TExcretionToolState } from "../types/excretion";
|
|
3
3
|
export default class ExcretionsComponent extends ComponentService {
|
|
4
4
|
private static template;
|
|
5
|
+
private static templateExcretion;
|
|
5
6
|
private static css;
|
|
6
7
|
static excretionWrap: HTMLElement;
|
|
7
8
|
private static _excretions;
|
|
@@ -109,7 +109,7 @@ class ExcretionsComponent extends component_service_1.default {
|
|
|
109
109
|
const wrapOptions = {
|
|
110
110
|
className: 'excretion',
|
|
111
111
|
};
|
|
112
|
-
const excretionTemplate = ExcretionsComponent.getTemplate(
|
|
112
|
+
const excretionTemplate = ExcretionsComponent.getTemplate(ExcretionsComponent.templateExcretion, wrapOptions);
|
|
113
113
|
ExcretionsComponent.clearExcretionsCoords();
|
|
114
114
|
const tempStart = {
|
|
115
115
|
start: cursorPosition,
|
|
@@ -184,6 +184,11 @@ class ExcretionsComponent extends component_service_1.default {
|
|
|
184
184
|
}
|
|
185
185
|
}
|
|
186
186
|
ExcretionsComponent.template = ``;
|
|
187
|
+
ExcretionsComponent.templateExcretion = `
|
|
188
|
+
<button type="button" class="crop-button">
|
|
189
|
+
<svg fill="#ffffff" viewBox="0 0 1920 1920" xmlns="http://www.w3.org/2000/svg" stroke="#ffffff"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <path fill-rule="evenodd" clip-rule="evenodd" d="M426.667 0h106.666v1386.67H1920v106.66H426.667V0zM320 426.667H0v106.666h320V426.667zm320 0v106.666h746.67V1280h106.66V426.667H640zM1493.33 1600h-106.66v320h106.66v-320z"></path> </g></svg>
|
|
190
|
+
</button>
|
|
191
|
+
`;
|
|
187
192
|
ExcretionsComponent.css = `
|
|
188
193
|
.excretion {
|
|
189
194
|
display: flex;
|
|
@@ -199,6 +204,21 @@ ExcretionsComponent.css = `
|
|
|
199
204
|
box-shadow: 0px 0px 0px calc(100vw + 100vh) #50505070;
|
|
200
205
|
}
|
|
201
206
|
|
|
207
|
+
.crop-button {
|
|
208
|
+
position: absolute;
|
|
209
|
+
padding: 3px;
|
|
210
|
+
right: -35px;
|
|
211
|
+
top: 0;
|
|
212
|
+
background: #232222;
|
|
213
|
+
border: none;
|
|
214
|
+
border-radius: 4px;
|
|
215
|
+
width: 30px;
|
|
216
|
+
height: 30px;
|
|
217
|
+
display: flex;
|
|
218
|
+
justify-content: center;
|
|
219
|
+
alight-items: center;
|
|
220
|
+
}
|
|
221
|
+
|
|
202
222
|
@keyframes border-dance {
|
|
203
223
|
0% {
|
|
204
224
|
background-position: left top, right bottom, left bottom, right top;
|