canvas-editor-engine 1.0.16 → 1.0.17

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.
@@ -185,7 +185,7 @@ class ExcretionsComponent extends component_service_1.default {
185
185
  }
186
186
  ExcretionsComponent.template = ``;
187
187
  ExcretionsComponent.templateExcretion = `
188
- <button type="button" class="crop-button">
188
+ <button type="button" class="crop-button crop-button--view">
189
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
190
  </button>
191
191
  `;
@@ -205,18 +205,22 @@ ExcretionsComponent.css = `
205
205
  }
206
206
 
207
207
  .crop-button {
208
+ display: none;
209
+ justify-content: center;
210
+ align-items: center;
208
211
  position: absolute;
209
- padding: 3px;
212
+ padding: 5px;
210
213
  right: -35px;
211
214
  top: 0;
212
215
  background: #232222;
213
- border: none;
216
+ border: 1px solid #ffffff50;
214
217
  border-radius: 4px;
215
218
  width: 30px;
216
219
  height: 30px;
220
+ }
221
+
222
+ .crop-button--view {
217
223
  display: flex;
218
- justify-content: center;
219
- alight-items: center;
220
224
  }
221
225
 
222
226
  @keyframes border-dance {
@@ -1,4 +1,10 @@
1
1
  export default class CropService {
2
2
  static crop(): void;
3
- private static get options();
3
+ static viewCropButton(): void;
4
+ static get options(): {
5
+ x: number;
6
+ y: number;
7
+ width: number;
8
+ height: number;
9
+ };
4
10
  }
@@ -4,8 +4,15 @@ const excretions_component_1 = require("../components/excretions.component");
4
4
  class CropService {
5
5
  static crop() {
6
6
  excretions_component_1.default.additionStyle = 'crop';
7
+ CropService.viewCropButton();
7
8
  console.log(CropService.options);
8
9
  }
10
+ static viewCropButton() {
11
+ const cropButtons = excretions_component_1.default.excretionWrap.querySelectorAll('.crop-button');
12
+ const lastCropButtonIndex = cropButtons.length - 1;
13
+ const cropButton = cropButtons[lastCropButtonIndex];
14
+ cropButton.classList.add('crop-button--view');
15
+ }
9
16
  static get options() {
10
17
  const excretionLastIndex = excretions_component_1.default.excretionsCoords.length - 1;
11
18
  const coords = excretions_component_1.default.excretionsCoords[excretionLastIndex];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "canvas-editor-engine",
3
- "version": "1.0.16",
3
+ "version": "1.0.17",
4
4
  "description": "CanvasEditorEngine library, use: [typescript] [canvas]",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",