Its Sunday morning, I’m on a train from Beer Sheva to Tel Aviv, so it must be time for Elm Package of the week!

Say that you want to have a list in your ui that you want to move forward and back through. A music play list, a survey, a photo viewing application, etc. These things are everywhere on the web.

So if you need to implement one you could write your own thing but please don’t, as there is a great library called elm-pivot that will do it for you and save you a lot of work.

To work with this package you take a list and convert it to a pivot list with the Pivot.fromList function which has a signature of fromList : List a -> Maybe (Pivot a) Note a pivot by definition has as current position and thus can not be empty. You can also use the function fromCons: a -> List a -> Pivot a or pure: a -> pivot a .

Once you have a Pivot you can get parts of the list, move forward and back.

Lets build a small example around a pivot so you can see in action. This example will let us go forward and back threw a list of sales that an e - commerce store may have on their web page.

(Code under BSD license, and is meant to be learned from, feel free to use it for something interesting, if you do please let me know!)

If you would like to see it in action, her it is showing a very fake sale on t-shirts

If you like this sign up for my mailing list to get more, or subscribe to the RSS Feed.