New Feature: Audio Component

[rbalderrama]

Hi,
Need help configuring the source to be a file on the local hardrive of the computer where the gateway resides. I have tried using “https://localhost/c:/Sound/Alarm10.wav” and doesn’t work.
I have tested with a URL from a website and works good.
Thanks.

[ayu]

Hi @rbalderrama,

Looks like the path provided is not where the audio file actually is. If you need to use local file paths I’d suggest trying file:///<image path> (you can open an audio file with a browser and inspect the URL for reference); otherwise, you can upload the file onto WebDev and reference it that way.

[jeffrey.boey]

Hi I am transforming my iFrames to this component because it looks more suited but I have the same problem with the source.

I used File:/// but it is not doing anything.

.
,
The exact link works when entered in a browser directly.

Am I missing something? Thanks

[ayu]

Hi @jeffrey.boey,

Do you see anything in the browser’s console. I haven’t had a chance to test this personally, but my hunch is this is probably some security measure to prevent users from arbitrarily loading files, or the file path isn’t resolving correctly. If possible, I recommend using the WebDev module to store your audio files. If for whatever reason, that is not possible, I can ask the team to see if there are other options. Thanks.

[pturmel]

If you store the audio as blob data in a database, my Blob Server module should be able to deliver it.

Automation Professionals' Blob Server Module

Automation Professionals is pleased to announce an alpha release of its new Blob Server Module. Available only for Ignition v8.1, here. The Blob Server Module provides a simple way to deliver images, PDF files, or other binary content from a database to your Perspective clients or other web applications. Without needing the WebDev module. All you need is a Named Query that has appropriate security settings and returns a single row with two columns: Content, and ContentType. Modest documentati…

[jeffrey.boey]

Hi Ayu, Thanks for the tip, I checked the console and you were right, the server is preventing me from loading a file from it’s directory directly, image below:

.
.
My company does not have the WebDev module, I’ll try to talk to them to and see if we can get it but it’ll take sometime for the gears to turn, in the meantime, are there other solutions? I am trying to avoid using iframe as java seems to lock down files after being played and I can’t delete them unless I restart the gateway…

I’ll look into storing audio as blob, but Ideally a file is still much more easier to manage, especially if it needs to be used by other applications. Thanks

[ayu]

Hi @jeffrey.boey,

I’m not aware of any other solutions other than the ones listed above. Let me get in touch with the team to see if there are other avenues available or if this is a feature we can potentially implement. Thanks!

[jeffrey.boey]

Hi folks, just to update, we tried the WebDev Module on trial mode and it’s a good workaround with the folder mount function, solved all our problem

It does however adds alot to the budget to get the WebDev licences, especially since we are only using it to access local gateway files (and we do have a lot of gateways), so I hope there is a way around the security issue.

I’ll also look into @pturmel 's solution in using Blob from the database

Thanks for the help

[nminchin]

@jeffrey.boey

It does however adds alot to the budget to get the WebDev licences

Can you try copying your files to:
C:\Program Files\Inductive Automation\Ignition\webserver\webapps\main\YourFolder

and using the url:
http://<Ignition IP or hostname>:8088/main/YourFolder/YourAudio.wav

This is how we store cached versions of map tiles locally without webdev, but i believe this might be wiped when upgrading? Not sure... However we recently did a patch update from 8.1.9? to 8.1.15 and these files weren't deleted.

@Paul.Scott had some words around this here:

Increase the tile cache size for map perspective component

I’m not super excited on the premise of storing things in the webserver\webapps\main\ directory, for two reasons. Our installers delete that directory on upgrade, so you’d need to be mindful about managing those tiles yourself on upgrade I’m not an expert on the matter, but my understanding of how files in that directory get served up is sort of a byproduct of some stuff Jetty does. Meaning, nothing we wrote in our code base is directly facilitating that behavior. The next time we upgrade Jet…

I agree though that the web dev module is expensive when you have a very basic use for it

[victordcq]

@jeffrey.boey

java seems to lock down files after being played

I have a solution for that, i made a seperate post so people will find it easier when having the same problem

Unblock and Delete files that have been locked by Java

There is an issue with java locking files that are in use. Mainly when using the webserver. Causing it to be impossible to delete them while the gateway is running. But here is a solution! (For windows atleast). Using handle you can find and unlock files. I made it a bit easier to use by writing a simple bat file. UnlockAndDelete.zip (891.3 KB) Unzip on the pc in the gateway (in for example C:\Folder) You can execute this through script or in the cmd line, requires admin rights! script: …

[woodsb02]

For some reason the "display" property does not show by default in the PROPS list - so I couldn't work out how to make the audio component visible for a while. It feels like a bug that this doesn't show in the PROPS list - I had to click add property, and then it was there as an option.

While I am here - why does this have a separate "display" property, rather than just using the "visible" META used by every other perspective component?

[zacht]

Difference Between CSS Display and Visibility.

TL;DR: An item with Visibility=false will still take up space on the page, the content just won't be shown. An item with Display=false won't take up space on the page. If you toggle the Display property between true and false for a component, other components are likely to jump around (depending on the layout of course). This doesn't happen when toggling the Visible property.

[brandon1]

@zacht

An item with Visibility=false will still take up space on the page, the content just won't be shown. An item with Display=false won't take up space on the page.

Does this mean when Display=false it will not be loaded on the screen at all?

[ayu]

Hi @brandon1,

I believe the mark up will still exist in the DOM with display=false (which is essentially display: 'none'). However, the item will be ignored and not be part of the layout process when rendering. Hopefully, that helps. Thanks.

[nader.chinichian]

Is it possible to somehow style the background of the audio component?

It always shows as a grey color and is not good for dark themes.
I can recreate the whole UI if we have a script function to change the playback position.