impress / impress.js

It's a presentation framework based on the power of CSS3 transforms and transitions in modern browsers and inspired by the idea behind prezi.com.
http://impress.js.org
MIT License
37.62k stars 6.67k forks source link

Allow multiple data-substep-order with the same value #825

Closed fnogatz closed 1 year ago

fnogatz commented 1 year ago

In #779, the ability to add the order of substeps using the data-substep-order has been added. The current implementation relies on the assumption that all the given numbers are unique: a sequence 1, 2, 10, 100 is correctly handled, but another 1, 1, 2, 2 is not. I find the latter very useful to show multiple elements of different DOM nodes in a single substep.

Take for instance a slightly modified version of @codesections' original example from https://github.com/impress/impress.js/pull/779#issuecomment-774574325.

 <ul>
     <li class="substep"  data-substep-order="0">
         TypeScript <span class="substep" data-substep-order="3">(Microsoft)</span>
     </li>
     <li class="substep"  data-substep-order="1">
         Golang <span class="substep" data-substep-order="3">(Google)</span>
     </li>
     <li class="substep data-substep-order="2">
         Rust<span class="substep" data-substep-order="3">(Mozilla et al.)</span>
     </li>
 </ul>

In contrast to the original example, the examples are shown in a single, last substep.

This PR adds the correct handling of multiple data-substep-order with the same value. I don't think it needs to be explicitly stated in the plugin's README – as I originally thought it would already be supported :)

A real-world example that uses the proposed change can be found at multiple occasions in the slides of my PhD defense (source code).