From 117ae2ad0dc783f0488a34095b9d7e138e3a6999 Mon Sep 17 00:00:00 2001 From: peterpeterparker Date: Thu, 19 Aug 2021 17:35:28 +0200 Subject: [PATCH] fix: delete slide and DOM JSX update --- CHANGELOG.md | 2 +- studio/package-lock.json | 6 +++--- studio/package.json | 2 +- .../editor/events/deck/deck-events.handler.ts | 7 ------- .../src/app/pages/editor/app-editor/app-editor.tsx | 12 ++++++++++++ webcomponents/core/CHANGELOG.md | 6 ++++++ webcomponents/core/package-lock.json | 2 +- webcomponents/core/package.json | 2 +- webcomponents/core/src/components.d.ts | 2 +- .../deck/deckdeckgo-deck/deckdeckgo-deck.tsx | 11 ++++------- 10 files changed, 30 insertions(+), 22 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 0504b1b6f..a6bd8c11e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -8,7 +8,7 @@ ### Web Components -- core: v8.3.0 ([CHANGELOG](https://github.com/deckgo/deckdeckgo/blob/master/webcomponents/core/CHANGELOG.md)) +- core: v8.4.0 ([CHANGELOG](https://github.com/deckgo/deckdeckgo/blob/master/webcomponents/core/CHANGELOG.md)) - highlight-code: v3.3.1 ([CHANGELOG](https://github.com/deckgo/deckdeckgo/blob/master/webcomponents/highlight-code/CHANGELOG.md)) ### Others diff --git a/studio/package-lock.json b/studio/package-lock.json index 0f8a8b2e2..eb50d5cb2 100644 --- a/studio/package-lock.json +++ b/studio/package-lock.json @@ -1149,9 +1149,9 @@ } }, "@deckdeckgo/core": { - "version": "8.3.0", - "resolved": "https://registry.npmjs.org/@deckdeckgo/core/-/core-8.3.0.tgz", - "integrity": "sha512-UFfIl3t1l1x059wv1RMfRpy/x1uIRPnfMm4UxdLzsFwE1AkLNi04x8aLpcUkAISS67c3q4UVEIfNqs3wKNXl7A==", + "version": "8.4.0", + "resolved": "https://registry.npmjs.org/@deckdeckgo/core/-/core-8.4.0.tgz", + "integrity": "sha512-0lvMbnzbQ3DsHfNcDcfgMelVXSEIRRQ6aGhMbVf6xKsDkR3jdLsfUnYXpjmtlr1oPvS6AOklxdebdSlSQpephw==", "requires": { "@deckdeckgo/deck-utils": "^4.0.2", "@deckdeckgo/utils": "^2.0.1" diff --git a/studio/package.json b/studio/package.json index e51fa5aa3..8b0912546 100644 --- a/studio/package.json +++ b/studio/package.json @@ -22,7 +22,7 @@ "dependencies": { "@deckdeckgo/charts": "^2.1.0", "@deckdeckgo/color": "^4.1.0", - "@deckdeckgo/core": "^8.3.0", + "@deckdeckgo/core": "^8.4.0", "@deckdeckgo/deck-utils": "^4.1.0", "@deckdeckgo/demo": "^2.1.0", "@deckdeckgo/drag-resize-rotate": "^2.2.0", diff --git a/studio/src/app/handlers/editor/events/deck/deck-events.handler.ts b/studio/src/app/handlers/editor/events/deck/deck-events.handler.ts index c4d0ebd10..72f8785c6 100644 --- a/studio/src/app/handlers/editor/events/deck/deck-events.handler.ts +++ b/studio/src/app/handlers/editor/events/deck/deck-events.handler.ts @@ -544,8 +544,6 @@ export class DeckEventsHandler { } } - await this.deleteSlideElement(); - busyStore.state.deckBusy = false; resolve(); @@ -557,11 +555,6 @@ export class DeckEventsHandler { }); } - private async deleteSlideElement() { - const deck: HTMLDeckgoDeckElement = this.mainRef.querySelector('deckgo-deck'); - await deck?.deleteActiveSlide(); - } - private async getSlideAttributes(slide: HTMLElement, cleanFields: boolean): Promise { if (SlideUtils.slideScope(slide) !== SlideScope.DEFAULT) { return this.getSlideUserAttributes(slide); diff --git a/studio/src/app/pages/editor/app-editor/app-editor.tsx b/studio/src/app/pages/editor/app-editor/app-editor.tsx index 3e6e0ae06..b053e593d 100644 --- a/studio/src/app/pages/editor/app-editor/app-editor.tsx +++ b/studio/src/app/pages/editor/app-editor/app-editor.tsx @@ -30,7 +30,9 @@ import {ChartEventsHandler} from '../../../handlers/core/events/chart/chart-even import {SlideHelper} from '../../../helpers/editor/slide.helper'; import {SlotType} from '../../../types/editor/slot-type'; + import {signIn as navigateSignIn} from '../../../utils/core/signin.utils'; +import {SlideUtils} from '../../../utils/editor/slide.utils'; import {AuthService} from '../../../services/auth/auth.service'; import {AnonymousService} from '../../../services/editor/anonymous/anonymous.service'; @@ -380,6 +382,16 @@ export class AppEditor { await this.replaceSlide($event.detail); } + @Listen('slideDelete', {target: 'document'}) + async deleteSlide({detail: deletedSlide}: CustomEvent) { + const slideIndex: number = SlideUtils.slideIndex(deletedSlide); + + this.slides = [...this.slides.filter((_slide: JSX.IntrinsicElements, index: number) => slideIndex !== index)]; + + // Update deck length and slide to an active slide + await this.deckRef.deleteActiveSlide(false); + } + @Listen('addSlide', {target: 'document'}) async addSlide($event: CustomEvent) { if (!$event) { diff --git a/webcomponents/core/CHANGELOG.md b/webcomponents/core/CHANGELOG.md index c7781ea59..194bcd4d2 100644 --- a/webcomponents/core/CHANGELOG.md +++ b/webcomponents/core/CHANGELOG.md @@ -1,3 +1,9 @@ +# 8.4.0 (2021-08-19) + +### Features + +- `deleteActiveSlide` make removal of DOM child optional + # 8.3.0 (2021-08-19) ### Features diff --git a/webcomponents/core/package-lock.json b/webcomponents/core/package-lock.json index 8bd907fa9..0ac957a0b 100644 --- a/webcomponents/core/package-lock.json +++ b/webcomponents/core/package-lock.json @@ -1,6 +1,6 @@ { "name": "@deckdeckgo/core", - "version": "8.3.0", + "version": "8.4.0", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/webcomponents/core/package.json b/webcomponents/core/package.json index e85223b87..a41f1e3a7 100644 --- a/webcomponents/core/package.json +++ b/webcomponents/core/package.json @@ -1,6 +1,6 @@ { "name": "@deckdeckgo/core", - "version": "8.3.0", + "version": "8.4.0", "description": "Add a presentation to your web application using HTML and Web Components", "main": "dist/index.cjs.js", "module": "dist/index.js", diff --git a/webcomponents/core/src/components.d.ts b/webcomponents/core/src/components.d.ts index d5430cdbe..a435ad9f8 100644 --- a/webcomponents/core/src/components.d.ts +++ b/webcomponents/core/src/components.d.ts @@ -13,7 +13,7 @@ export namespace Components { "autoSlideInterval": number; "blockSlide": (block: boolean) => Promise; "cloneBackground": boolean; - "deleteActiveSlide": () => Promise; + "deleteActiveSlide": (removeChild?: boolean) => Promise; "direction": 'horizontal' | 'vertical' | 'papyrus'; "directionMobile": 'horizontal' | 'vertical' | 'papyrus'; "doPrint": () => Promise; diff --git a/webcomponents/core/src/components/deck/deckdeckgo-deck/deckdeckgo-deck.tsx b/webcomponents/core/src/components/deck/deckdeckgo-deck/deckdeckgo-deck.tsx index ec3603d3c..8b9047100 100644 --- a/webcomponents/core/src/components/deck/deckdeckgo-deck/deckdeckgo-deck.tsx +++ b/webcomponents/core/src/components/deck/deckdeckgo-deck/deckdeckgo-deck.tsx @@ -957,19 +957,16 @@ export class DeckdeckgoDeck { } @Method() - async deleteActiveSlide() { + async deleteActiveSlide(removeChild: boolean = true) { if (this.activeIndex > this.length || this.activeIndex < 0) { return; } - const slide: HTMLElement = this.el.querySelector('.deckgo-slide-container:nth-child(' + (this.activeIndex + 1) + ')'); - - if (!slide) { - return; + if (removeChild) { + const slide: HTMLElement | null = this.el.querySelector('.deckgo-slide-container:nth-child(' + (this.activeIndex + 1) + ')'); + slide?.parentElement.removeChild(slide); } - slide.parentElement.removeChild(slide); - this.activeIndex = this.activeIndex > 0 ? this.activeIndex - 1 : 0; this.length = this.length > 0 ? this.length - 1 : 0;