Skip to content
This repository has been archived by the owner on Feb 6, 2024. It is now read-only.

Commit

Permalink
feat: add an optional option to not performed the inner slide animati…
Browse files Browse the repository at this point in the history
…on on slideNext and slidePrev
  • Loading branch information
peterpeterparker committed Nov 28, 2018
1 parent 90df088 commit cd06c76
Show file tree
Hide file tree
Showing 3 changed files with 36 additions and 14 deletions.
24 changes: 20 additions & 4 deletions doc/features/navigation.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,9 @@ Furthermore than the default swiping, the [DeckDeckGo] deck expose the following

- [Navigation](#navigation)
- [Go to next slide](#go-to-next-slide)
- [Optional parameters](#pptional-parameters)
- [Go to previous slide](#go-to-previous-slide)
- [Optional parameters](#pptional-parameters)
- [Go to a specific slide](#go-to-a-specific-slide)
- [Is the deck at the begin](#is-the-deck-at-the-begin)
- [Is the deck at the end](#is-the-deck-at-the-end)
Expand All @@ -32,10 +34,17 @@ const deck = document.getElementsByTagName('deckgo-deck');
await deck.slideNext();
```

*Optional parameter:* Optionally your could provide a boolean parameter to this method in case you would not like the event `slideNextDidChange` and `slidePrevDidChange` to be fired.
For example:

#### Optional parameters

| Parameter | Type | Default | Description |
| -------------------------- |:-----------------:|:-----------------:|:-----------------:|
| slideAnimation | boolean | true | Set to `false` in case you would not like the inner animation of a slide, like the reveal or code animation for example, to be performed. |
| emitEvent | boolean | true | Set to `false` in case you would not like the events `slideNextDidChange` and `slidePrevDidChange` to be fired. Note that to use this parameter, the previous should be set too. |

```
await deck.slideNext(false);
await deck.slideNext(false, false);
```

### Go to previous slide
Expand All @@ -44,10 +53,17 @@ await deck.slideNext(false);
await deck.slidePrev();
```

*Optional parameter:* Optionally your could provide a boolean parameter to this method in case you would not like the event `slideNextDidChange` and `slidePrevDidChange` to be fired.
#### Optional parameters

| Parameter | Type | Default | Description |
| -------------------------- |:-----------------:|:-----------------:|:-----------------:|
| slideAnimation | boolean | true | Set to `false` in case you would not like the inner animation of a slide, like the reveal or code animation for example, to be performed. |
| emitEvent | boolean | true | Set to `false` in case you would not like the events `slideNextDidChange` and `slidePrevDidChange` to be fired. Note that to use this parameter, the previous should be set too. |

For example:

```
await deck.slidePrev(false);
await deck.slidePrev(false, false);
```

### Go to a specific slide
Expand Down
8 changes: 4 additions & 4 deletions src/components.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -21,16 +21,16 @@ export namespace Components {
'keyboard': boolean;
'pager': boolean;
'pagerPercentage': boolean;
'slideNext': (emitEvent?: boolean) => Promise<void>;
'slidePrev': (emitEvent?: boolean) => Promise<void>;
'slideNext': (slideAnimation?: boolean, emitEvent?: boolean) => Promise<void>;
'slidePrev': (slideAnimation?: boolean, emitEvent?: boolean) => Promise<void>;
'slideTo': (index: number, speed?: number) => Promise<void>;
'toggleFullScreen': () => Promise<void>;
}
interface DeckgoDeckAttributes extends StencilHTMLAttributes {
'keyboard'?: boolean;
'onSlideDrag'?: (event: CustomEvent<number>) => void;
'onSlideNextStart'?: (event: CustomEvent<number>) => void;
'onSlidePrevStart'?: (event: CustomEvent<number>) => void;
'onSlideNextDidChange'?: (event: CustomEvent<number>) => void;
'onSlidePrevDidChange'?: (event: CustomEvent<number>) => void;
'onSlideWillChange'?: (event: CustomEvent<number>) => void;
'pager'?: boolean;
'pagerPercentage'?: boolean;
Expand Down
18 changes: 12 additions & 6 deletions src/components/deck/deckdeckgo-deck/deckdeckgo-deck.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -281,23 +281,29 @@ export class DeckdeckgoDeck {
/* BEGIN: Manual sliding */

@Method()
async slideNext(emitEvent?: boolean) {
await this.slideNextPrev(true, emitEvent);
async slideNext(slideAnimation?: boolean, emitEvent?: boolean) {
await this.slideNextPrev(true, slideAnimation, emitEvent);
}

@Method()
async slidePrev(emitEvent?: boolean) {
await this.slideNextPrev(false, emitEvent);
async slidePrev(slideAnimation?: boolean, emitEvent?: boolean) {
await this.slideNextPrev(false, slideAnimation, emitEvent);
}

private async slideNextPrev(swipeLeft: boolean, emitEvent?: boolean) {
private async slideNextPrev(swipeLeft: boolean, slideAnimation: boolean = true, emitEvent?: boolean) {
const slider: HTMLElement = this.el.shadowRoot.querySelector('div.deckgo-deck');

if (!slider || !window) {
return;
}

const couldSwipe: boolean = await this.couldSwipe(swipeLeft);
let couldSwipe: boolean;

if (!slideAnimation) {
couldSwipe = true;
} else {
couldSwipe = await this.couldSwipe(swipeLeft);
}

// We might want first to show hide stuffs in the slide before swiping
if (couldSwipe) {
Expand Down

0 comments on commit cd06c76

Please sign in to comment.