Double Click

[randallr]

In the live example, double clicking the button breaks the transitioning.

[tinchoz49]

Hi, @randallr thanks for report the issue. This was happening because the last element kept the events (clicks for example) in the transition until is removed. I had two possible solutions here: First solution: I clone ( true) the lastElem to remove all events from the node but clone an element is expensive and i prefer keep the perfomance in the library. Second solution: I disable the pointer events in the lastElem so now when the transition is started you can't produce an event when you click again in the button.

One thing more. Now, if you see the live example the double click is working but the animations created with velocity don't feel is right (the elements are overlaping). My point is: mithril-transition is only a helper to create your custom transitions and the double click is more like a problem that you have to deal how fix it in your app. Maybe you can use the debounce function that some libraries has (underscore and lodash).

Again, thanks for reporting the issue!

[randallr]

Thanks Martin. Another observation, how does useHistory work? I was expecting that on Page 3's "Go To PAGEONE", that transition would be sliding from left to right (i.e. opposite direction).

-Randall

On Thu, Oct 15, 2015 at 8:52 PM, Martín Acosta notifications@github.com wrote:

Hi, @randallr https://github.com/randallr thanks for report the issue. This was happening because the last element kept the events (clicks for example) in the transition until is removed. I had two possible solutions here: First solution: I clone ( true) the lastElem to remove all events from the node but clone an element is expensive and i prefer keep the perfomance in the library. Second solution: I disable the pointer events in the lastElem so now when the transition is started you can't produce an event when you click again in the button.

One thing more. Now, if you see the live example the double click is working but the animations created with velocity don't feel is right (the elements are overlaping). My point is: mithril-transition is only a helper to create your custom transitions and the double click is more like a problem that you have to deal how fix it in your app. Maybe you can use the debounce function that some libraries has (underscore and lodash).

Again, thanks for reporting the issue!

— Reply to this email directly or view it on GitHub https://github.com/geut/mithril-transition/issues/1#issuecomment-148563246 .

[tinchoz49]

As a big picture useHistory is used to track the back button. The idea of the useHistory is track the pages/components that you visited using an stack soo you if click in the back button or link to the last immediately page the direction it would be 'prev'. A use case in the live example it would be something like this:

history	stack	actions (url)
0	empty	start app, actual page: '/pageOne'
1	empty	go to ('/pageTwo')
2	['pageOne']	actual page: '/pageTwo'
3	['pageOne']	go to: '/pageThree'
4	['pageOne', 'pageTwo']	actual page: '/pageThree'
5	['pageOne', 'pageTwo']	go to: '/pageTwo'
5b	['pageOne', 'pageTwo']	mithril-transition found that new page is the last page of the history stack
6	['pageOne']	actual page: '/pageTwo'
7	['pageOne']	go to: '/pageThree'
8	['pageOne', 'pageTwo']	actual page: '/pageThree'
9	['pageOne', 'pageTwo']	go to: '/pageOne'
9b	['pageOne', 'pageTwo']	mithril-transition check if the new page is the last page of the history stack and it doesn't (pageOne !== pageTwo)
10	['pageOne', 'pageTwo', 'pageThree']	actual page: '/pageOne'

In your example: when you click pageOne (in your pageThree) your last page was pageTwo not pageOne soo the direction is 'next'

note: It works exactly as the windows.history but i prefer don't use that object, instead i save the history in the sessionStorage.

[randallr]

Hello Martin, got it, thanks for the explanation.

-Randall

On Fri, Oct 16, 2015 at 11:55 AM, Martín Acosta notifications@github.com wrote:

As a big picture useHistory is used to track the back button. The idea of the useHistory is track the pages/components that you visited using an stack soo you if click in the back button or link to the last immediately page the direction it would be 'prev'. A use case in the live example it would be something like this: history stack actions (url) 0 empty start app, actual page: '/pageOne' 1 empty go to ('/pageTwo') 2 ['pageOne'] actual page: '/pageTwo' 3 ['pageOne'] go to: '/pageThree' 4 ['pageOne', 'pageTwo'] actual page: '/pageThree' 5 ['pageOne', 'pageTwo'] go to: '/pageTwo' 5b ['pageOne', 'pageTwo'] mithril-transition found that new page is the last page of the history stack 6 ['pageOne'] actual page: '/pageTwo' 7 ['pageOne'] go to: '/pageThree' 8 ['pageOne', 'pageTwo'] actual page: '/pageThree' 9 ['pageOne', 'pageTwo'] go to: '/pageOne' 9b ['pageOne', 'pageTwo'] mithril-transition check if the new page is the last page of the history stack and it doesn't (pageOne !== pageTwo) 10 ['pageOne', 'pageTwo', 'pageThree'] actual page: '/pageOne'

In your example: when you click pageOne (in your pageThree) your last page was pageTwo not pageOne soo the direction is 'next'

— Reply to this email directly or view it on GitHub https://github.com/geut/mithril-transition/issues/1#issuecomment-148753607 .