SlideBox - Add Slides / Stop Swipes

ionic-v1
1

I’ve been dabbling with the slide box. I’m trying to create an on-boarding process using the Slide Box. Unfortunately, there does not seem to be a way to add slides once configured. It would be nice to be able to inject slides in depending on what actions the user has taken.

Example : Have Slidebox with an intro page, user swipes to reach a registration page. Once they have properly filled out the form and submitted, another slide is added to show a waiting on email verification page. Then, once email is verified, another slide added.

Another thing that would be nice is to prevent sliding to the next &/or previous slides depending on current user actions.

I’ve poked around in slideBox.js and ionicSlidebox.js looking for ways to do this. I’m afraid the code is a bit over my head to implement this myself.

Any suggestions on how to implement this? I see that slideBox.js has appendSlide, prependSlide etc. However, I can’t figure out how to access those methods from within a view controller.

1 Like
2

I’ve submitted a pull request for a feature I’ve added to the SlideBox. I’ll put together some sample code and explanation of how it works shortly.

3

Here’s an explanation of the maxViewableSlide directive I’ve added and a demo :

http://calendee.com/ionic-slidebox-with-max-viewable-slide/

4

Ran into a similar use case for this and came across this post. definitely could use this pulled in.

5

@Calendee Is there any solution/update for this with the latest ionic version?

6

I don’t believe so. Mine didn’t get pulled in and I don’t think anything like it has ever been added.

7

Did you manage some how to make it work (also it some hacky way)?

8

It was quite a hack. You might be better off just injecting slides AFTER the user is allowed to move to the next one. Or using ng-if on the slides until the user is allowed to move to the next.

9

Initially I want to render all the slides and just disable the moving (more simple to manage the slides, don’t need to use $ionicSlideBoxDelegate.update() and I want to show the pager for the all wizard )

So it doesn’t come so well, And therefore I’m trying to inject (and managing the pager by myself).
I’m updating the slides array and call $ionicSlideBoxDelegate.update() and then call $ionicSlideBoxDelegate.next() but it doesn’t slides to the next.
I add $timeout before I call to next and then it slides but the render doesn’t finish yet and it finished after the slide ends

Any propose how to make it smooth?

10

Just add 50 milliseconds to the $timeout and it smooth

tnx:)

11

Any luck on a prepend slide? Also, I would love to be able to remove slide from the beginning or end of the box.

1 Like