change src on audio component to local storage var?

[TimGeiges]

How can I set the audio component "src" and/or "type" using local storage variables? I tried {mp3url} thought that would work but does not seem to. Also doesn't look like I can set an event to set the property of src in the events tab either.

[maxkatz]

The src and type attributes are not exposed (we'll add them). But here is how you can do it (on page load):

code
var player = Tiggr('player');
player&#46;append('<source
src="http:&#47;&#47;www&#46;html5rocks&#46;com&#47;en&#47;tutorials&#47;audio&#47;quick&#47;test&#46;mp3"
type="audio&#47;mpeg">');
/code

For 'src', load the value from local storage:

code
localStorage&#46;getItem('audio_url');
/code

[Don]

Hi Max,

Have the src and type attributes been exposed yet?

I have tried the following in JS in order to send the link to the player, but it did not work. The below URL to the audio fie is coming from an XML webservice:

Tiggzi('voicemail_9msg_link').src(value['TD'][8]); and

[Maryna Brodina]

Hello! This won't work Tiggzi('voicemail_9msg_link').src(value['TD'][8]);

Please try

var player = Tiggr('voicemail_9msg_link');
player.append('<source src="'+ value['TD'][8] + '">');

[Don]

Hi Marina,

Thanks for the quick response.

Although it worked...
Regrettably, this loaded the same audio file into each src of the grid

[Kateryna Grynko]

Hi Don,

If you use this function in response mapping you might need using context item selection and replace:codevar player = Tiggr('voicemail_9msg_link');/code
withcodevar player = $('[name="voicemail_9msg_link"]', element);/code

[Don]

Thanks Katya,

But when I do that, the app hangs.

precode
var cells = $('[data-role="tiggr_label"]', element);
var i, len;
for (i = 0, len = Math&#46;min(value['TD']&#46;length, cells&#46;size()); i < len; i++) {
if (i == 8) {
var player = $('[name="voicemail_msg8_link"]', element);
player&#46;append('<source src="'+ value['TD'] + '">');
}
else {
$(cells)&#46;html(value['TD']);
}
}
/code/pre

[Don]

A hidden cell (#7) had javascript... which oddly froze the app. I have remove the javascript and the app is no longer freezing.

However, even though the audio file link is correct the player icon does nothing.
there is also a strange box below the player icon.

I can send some screen shots if you like... it is very odd.

[Don]

Here is a screenshot of the player and the box appearing below the player icon.
I displayed the link in a label, so know for sure the link is correct and being written to the correct cell.

[Maryna Brodina]

Hello! You can do not use Audio component in each table cell. There are too many extra controls. Instead you can place buttons Play/Pause in each row and invisible Label (to store link to file), add one Audio component on screen and make it invisible. To play file use JS: for example on button click send link to Audio component and with JS handle audio playing.