TablePress & DataTables - works on everything but iDevices

TablePress & DataTables - works on everything but iDevices

WordsmithWordsmith Posts: 22Questions: 0Answers: 0
edited May 2013 in DataTables 1.9
I'm using the plugin TablePress on my website. I have a table populated with music players and other info which can be seen here: http://thetracksmiths.com/beats/bap-adapt/. For whatever reasons, the music player does not work on iPhones or iPads. It IS working on android devices.

When I tell TablePress not to use DataTable's functionality (in my case, pagination, sorting, and search), the players work fine on the iDevices. What could possibly cause this? I appreciate any insight. Thanks.

Replies

  • allanallan Posts: 61,322Questions: 1Answers: 10,023 Site admin
    I'm afraid I don't know what would cause that. The only thing I can guess, is are you initialising the music player in fnInitComplete? (I don't know how TablePress works, it might/might not have that option?).

    I'm wondering if the music player is trying to initialise while the nodes are not on the page.

    Allan
  • WordsmithWordsmith Posts: 22Questions: 0Answers: 0
    I'll write to the author about the fnInitComplete (I'm not code-savy, so I have no idea what that is!). The player is generated by a WordPress shortcode, so I assume that the table loads first, then processes the shortcodes. I'm I far off in this thinking?
  • WordsmithWordsmith Posts: 22Questions: 0Answers: 0
    I heard back from the TablePress author, and he says that fnInitComplete is not being used in anything. Does that help any?
  • allanallan Posts: 61,322Questions: 1Answers: 10,023 Site admin
    Can you link to the audio plug-in you are using? What I'm thinking is that it isn't initialising one nodes which aren't in the DOM and you might have an async timing error.

    Also, when I try in Safari or Chrome (haven't trying any other browsers) the player doesn't appear to do anything?

    Allan
  • WordsmithWordsmith Posts: 22Questions: 0Answers: 0
    [quote]Also, when I try in Safari or Chrome (haven't trying any other browsers) the player doesn't appear to do anything?[/quote] Oh no! I've only been testing in Chrome. Ugg! More problems.

    The plugin isn't in the WordPress repository, it's a premium plug from CodeCanyon. I can link you to any of the files it contains on my server if that helps. Here's the link to the plugin on CodeCanyon: http://codecanyon.net/item/html5-music-player-with-3-css3-skins/1275465
  • WordsmithWordsmith Posts: 22Questions: 0Answers: 0
    Wow, I'm spaced out. I'm using Chrome, but I see you're not getting the player working in Chrome? Very odd. Works fine over here.
  • WordsmithWordsmith Posts: 22Questions: 0Answers: 0
    edited June 2013
    I think I fixed the problem in Chrome with the player. It was just a matter of the column not sizing properly. Should be fine now.
  • allanallan Posts: 61,322Questions: 1Answers: 10,023 Site admin
    Ah no - works just fine for me in Chrome and Safari now. No idea why it wasn't working before...

    I've just tried your site on an iPad and it mostly appears to work - the music player does everything but actually play music (scrolling, play / pause interaction).

    I don't understand what would cause that without some deep debugging I'm afraid. Have you asked the author of the player library if they've seen this kind of thing before?

    Allan
  • WordsmithWordsmith Posts: 22Questions: 0Answers: 0
    Yea, the author of the plugin is at a loss and referred me to your site actually ;) I'm not sure if this is your thing, but I'd be willing to talk about paying you to debug the issue and finding a solution. I'd give u access to whatever you need. This is just an enigma to me at this point!
  • WordsmithWordsmith Posts: 22Questions: 0Answers: 0
    Something interesting I found, I'm not the only one who seems to have this problem. There is a wordpress theme that is aimed at selling Hip-Hop beats online (what I'm trying to do with my site). I looked at the source code because I was curious and sure enough, they use DataTables. As with my site, the music does not play on iDevices. Here's the link: http://hiphopmakers.com/theme/musicmaker/beat-store-no-sidebar/

    Thought maybe this would offer up some insight. All I looked for in the source code was *.js and found datatables in there. I wouldn't know what else to look for for any other insight.
  • allanallan Posts: 61,322Questions: 1Answers: 10,023 Site admin
    Sorry I haven't had a chance to look at this today. Its been "one of them days...". I'll try to take a look tomorrow.
  • WordsmithWordsmith Posts: 22Questions: 0Answers: 0
    Not a problem.
  • WordsmithWordsmith Posts: 22Questions: 0Answers: 0
    Any new thoughts on this?
  • WordsmithWordsmith Posts: 22Questions: 0Answers: 0
    Beuler? Beuler?
  • WordsmithWordsmith Posts: 22Questions: 0Answers: 0
    Anybody out there willing to debug this issue? I need a solution.
  • allanallan Posts: 61,322Questions: 1Answers: 10,023 Site admin
    So I've just had a bit more of a look into this, and I can fairly easily replicate the issue without DataTables. All that needs to be done is to remove the element from the document and then add it back in again. The media player simply fails to play after that on iOS (and this removal and addition is fundamental to how DataTables works).

    For example, if you disable DataTables on your page and add this code:

    [code]
    jQuery(document).ready( function ($) {
    var a = $('#tablepress-2 tbody tr:eq(2)')[0];
    a.parentNode.removeChild( a );

    $('#tablepress-2 tbody').append( a );
    } );
    [/code]

    All of the players in the table will work, expect the very last row (the one that has been removed and re-added).

    So its not something that DataTables is doing wrong, but it is a problem in the media player that is triggered by the actions DataTables take. As I say, this is fundamental to DataTables and isn't likely to change, so we need to know either if the author of the media player library can fix it for when items are removed and then added back into the DOM. Or if there is some sort of re-initialisation that can be called when the element is added back into the DOM.

    Allan
  • WordsmithWordsmith Posts: 22Questions: 0Answers: 0
    I've tried multiple media players and the current one I'm using is the native audio player in WordPress 3.6. But this issue has affected them all. I'll try making some noise in the WP forum with what you've said here and see if there's any solution.
  • allanallan Posts: 61,322Questions: 1Answers: 10,023 Site admin
    It might very well be a bug in iOS itself. I'll try later on with a plain audio tag and moving that around the DOM.

    Allan
  • WordsmithWordsmith Posts: 22Questions: 0Answers: 0
    Have you tried this yet? I'm barking up every tree I can on this one.
  • allanallan Posts: 61,322Questions: 1Answers: 10,023 Site admin
    Not yet. You could try it yourself perhaps? :-) Just making a simple audio tag, remove it form the DOM and add it back in and then try to control it? That seems like the next step to me.

    Allan
  • WordsmithWordsmith Posts: 22Questions: 0Answers: 0
    I don't know how to do that :( I'm no coder. Is this something to do in HTML?
This discussion has been closed.