ingrammicro / puzzle-publisher

A Sketch plugin that exports Sketch artboards into clickable HTML file and publishes it on an external site.
GNU General Public License v3.0
174 stars 19 forks source link

Hotspots with Previous Artboard target only works once #75

Closed habovh closed 2 years ago

habovh commented 2 years ago

I have a project where the user can go deep in the screens (artboard) hierarchy, and each screen in the hierarchy has a "back" button that allows the user to get back to the starting or "root" artboard.

It works fine when running prototype within Sketch, but when exported using Puzzle Publisher, it seems the back button only brings back to the previously displayed artboard. Instead of going back up the hierarchy much like history.back(), clicking the back button works once, but clicking again brings back the artboard we just left.

Consider the following artboards A, B, C and D. Root is A. Goal is to get from A down to D through B and C, then go back up. The arrow "→" means a "push" to the next artboard. The return arrow "↩" means pressing the back button.

Expected behaviour A → B → C → D ↩ C ↩ B ↩ A

Actual behaviour A → B → C → D ↩ C ↩ D ↩ C ↩ D ↩ C

As you can see, pressing back multiple times only swaps between the last two screens whereas it is expected to navigate back in the history.

From what I understand reading how the goBack function works:

https://github.com/ingrammicro/puzzle-publisher/blob/59f4db287f4ef3abb0390ec5de957df2358007cf/PuzzlePublisher.sketchplugin/Contents/Sketch/viewer/viewer.js#L633-L642

It seems that Puzzle Publisher is either:

FYI, I'm using the "Animate artboard from right" setting on when pushing a screen and "No artboard animation" when going back.

MaxBazarov commented 2 years ago

@habovh Thanks for the report. Investigating...

habovh commented 2 years ago

Thought I'd share a template file, could become handy when debugging.

Can confirm the issue is visible using this Sketch file.

Stack navigation push-pop example.zip Exported HTML.zip

Edit: screen recording showing the unexpected behaviour:

https://user-images.githubusercontent.com/4186230/160853209-e252060e-138d-4778-b7d9-ccdd5b2863ed.mov

MaxBazarov commented 2 years ago

Fixed in 17.2.3 Please test it.

habovh commented 2 years ago

@MaxBazarov wow that was fast! It seems that the back button behaviour is working as expected now, thank you!

Out of curiosity, how do modal works in the context of this plugin? Is there a special way to push artboards that marks them as modals?

MaxBazarov commented 2 years ago

Out of curiosity, how do modal works in the context of this plugin? Is there a special way to push artboards that marks them as modals?

You can set Modal type in Configure artboard. Partially it mean that that artboad will displayed on a center over previous page with full-page shadow.

Screenshot 2022-03-31 at 20 58 00 Screenshot 2022-03-31 at 20 58 12

See example here - https://github.com/ingrammicro/puzzle-publisher/tree/master/examples/Link-ModalArtboard

habovh commented 2 years ago

Thanks for the info, I wasn't aware of this! Will definitely come in handy down the line.

MaxBazarov commented 2 years ago

Also any artboard can be an overlay. https://github.com/ingrammicro/puzzle-publisher/tree/master/examples/Overlays

On 31 Mar 2022, at 22:19, Jordan Becker @.***> wrote:

Thanks for the info, I wasn't aware of this! Will definitely come in handy down the line.

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you were mentioned.