Joomla Free extensions

Thank you, Bach Pham. Please let me know when there is a new version to test.

Rich

Hello Richard Howell
Yes, We will notify for you after we updated and fixed the problem successfully
Best regards
Bach Pham

Hi Bach Pham,

The following two changes correct the specific problems using Firefox. I wish they also corrected the jumping/wrong-helper-positioning using iOS-Safari and Chrome when the page is scrolled, but they do not. So it could be that these changes should not be implemented. But in iOS-Safari and Chrome there is not (and was not) an oops-behavior issue, only a visual issue when the page is scrolled.

There is a long-standing discussion of the jumping/wrong-helper-positioning issue at this link...
stackoverflow.com/questions/5791886/jque...-after-page-scrolled

There is also an old closed bug report at this link...
bugs.jqueryui.com/ticket/3740

It seems that some updates to the jquery-ui interface have solved the visual issue, while later updates have created it again.

The two changes which correct the problem in Firefox are in the file...
\modules\mod_jo_audio_player\assets\js\jquery.html5audio.min.js

(1) Remove oops behavior by invoking the clone option by finding the text...
cursor:"move",
and inserting immediately after the comma...
helper:"clone",

Without this change the helper has the default value of "original" which causes the oops behavior.

(2) Remove issues with jumping/wrong-helper-position in Firefox when the page is scrolled by deleting the following text...
u.bind("sortstart", function(a,b){b.helper.css("margin-top",Md.scrollTop())}),u.bind("sortbeforestop",function(a,b){b.helper.css("margin-top","1px")}),

Perhaps a new thread should be started on the jumping/wrong-helper-position issue in iOS-Safari and Chrome. I do not know if it exists in other browsers too. Or perhaps this thread should be kept open until that issue is also solved - in case the solution to that issue leads to change (2) above being wrong. To me it seems unlikely that change (1) would be affected; but that's just my guess.

Rich

Hi Richard Howell
Thank for your information! It very importand for me
Have a nice day
Best regards
Bach Pham

Hi Bach Pham,

You might find this interesting. Although it concerns Google Chrome it does have a connection with the original issue here as it has evolved, I think.

Using the Developer Tools in Chrome it is possible to see that the Audio Player module loads differently depending on the module parameter "playlist_height". When the height is more than adequate to contain the playlist elements - or set to "auto" - there is no need for a scrollbar; and the divs which load, starting with playlistHolder, are...
div.playlistHolder
div.componentPlaylist
div.playlist_inner
ul#playlistXXX

When the height is less than adequate (scrollbar called for) the divs which load are...
div.playlistHolder
div.componentPlaylist.jspScrollable
div.jspContainer
div.jspPane (with sibling div.jspVerticalBar)
div.playlist_inner
ul#playlistXXX

I think it might help if the two additional divs could be loaded regardless. That would be a more uniform situation to work with, in terms of constraints on the helper when being dragged - and inconsistent behavior.

Using Chrome Developer Tools to watch the styling of the element div.componentPlaylist when playlist_height is either more than adequate or set to auto, it is possible to see how that changes after re-ordering the playlist once, twice, three times, and so forth. Particularly the "overflow" property of that div.

Scrolling the page a bit highlights inconsistent behavior when re-ordering the elements by dragging under these conditions, too.

I have been working with a very basic version of my audio-test page using the Protostar template. I have not added that page to the testing subdomain site, but I can do so if you would like me to.

Rich

Hi Bach Pham,

I have just sent you an email via your ContactUs page to let you know what changes I have made to the JO Audio Player module to solve these issues. (Tested in IE, Firefox, Chrome, and iOS/Safari.

Best regards,

Richard