Krpano Store

HTML5-VR Audio

Spectrum template for krpano

HTML5-VR Audio Plugin repository folder, DEMOfor HTML5 and WebVR! (Oculus Rift, Google Cardboard, GearVR, ...)

by Spacery Wirtualne - biuro@spacerywirtualne.pl

Description

Most of the functions of this plugin is similar to the;
Sound Interface Plugin krpano.
We worked hard to get the functions that will be similar to Sound Interface Plugin krpano methods.
The Sound Interface plugin extends krpano with actions for playing and controlling sounds directly from xml.

Note

Works fine with Panotour Pro
Plugin allows you to easily add sound objects
Works only in HTML5 and krpano version min. 1.19 pr4
Plugin supports mp3 and ogg files. Both files must have the same name and be in the same location
It works best in browsers that support the Web Audio API

VRmode compatible

Plugin works great in VR mode hardsets.

Buy this Plugin

Updates for this plugin are free!

HTML5-VR Audio Plugin

45 €

HTML5-VR Audio Example

Screenshots & Examples

In this plug-in version (with GUI) knowledge of the coding is not required.

Version 2.0 with GUI Editor!

Documentation

HTML5 Sound Interface Plugin will be developed dynamically, so the latest documentation is available online on the krpano forum.

The current documentation

Plugin Actions

The HTML5 Sound Interface plugin add its actions directly to the krpano root. That means the actions can be called like normal krpano actions.
  • playHtml5sound(name, audiofile, loop*, volume*, oncomplete*)
    • preloads a sound file
    • name = identification name for the sound
    • audiofile = the path and filename of a sound file without extension
    • loop = true/false (default=false)(*optional)
    • volume = sound volume (0.0 - 1.0, default=1.0)(*optional)  (Web Audio Api only)
    • oncomplete = actions that will be called on complete (*optional)
  • playHtml5sound2D(keep, name, audiofile, rate*, volume*,loops*, onload*, onplay*,onpause*,onstop*,onmute*, oncomplete*)
    • preloads a sound file
    • keep = if true - remains on the next panorama (true/false, default=false)
    • name = identification name for the sound
    • audiofile = the path and filename of a sound file without extension
    • rate = playback speed (0.5 - 4.0, default =1.0) (*optional)  (Web Audio Api only)
    • volume = sound volume (0.0 - 1.0, default=1.0)(*optional)  (Web Audio Api only)
    • loops = true/false (default=false)(*optional)
    • onload = actions that will be called on sound loaded (*optional)
    • onplay = actions that will be called if the sound start to play (*optional)
    • onpause = actions that will be called if the sound is paused (*optional)
    • onstop = actions that will be called if the sound is stopped(*optional)
    • onmute = actions that will be called if the sound is muted/unmuted (*optional)
    • oncomplete = actions that will be called on complete (*optional)
  • playHtml5sound3D(keep, name, audiofile, ath, atv, range, rate*, volume*, loops*, onload*, onplay*, onpause*, onstop*, onmute*, oncomplete*)  (Web Audio Api only)
    • plays a sound file with adjustable volume and panning
    • keep = if true - remains on the next panorama (true/false, default=false)
    • name = identification name for the sound
    • audiofile = the path and filename of a sound file without extension
    • ath = horizontal sound source position (-180 .. 180)
    • atv = vertical sound source position (-90 .. 90)
    • range = range of the sound (in degrees, 10-360)
    • rate = playback speed (0.5 - 4.0, default =1.0) (*optional)
    • volume = sound volume (0.0 - 1.0, default=1.0)(*optional)
    • loops = true/false (default=false)(*optional)
    • onload = actions that will be called on sound loaded (*optional)
    • onplay = actions that will be called if the sound start to play (*optional)
    • onpause = actions that will be called if the sound is paused (*optional)
    • onstop = actions that will be called if the sound is stopped(*optional)
    • onmute = actions that will be called if the sound is muted/unmuted (*optional)
    • oncomplete = actions that will be called on complete (*optional)
  • playHtml5sound3DHS(keep, name, audiofile, hotspotname, range, rate*, volume*, loops*, onload*, onplay*, onpause*, onstop*, onmute*, oncomplete*)  (Web Audio Api only)
    • plays a directional 3D sound at a hotspot position - when the hotspot moves the sound will follow it
    • keep = if true - remains on the next panorama (true/false, default=false)
    • name = identification name for the sound
    • audiofile = the path and filename of a sound file without extension
    • hotspotname = name of the parent hotspot
    • range = range of the sound (in degrees, 10-360)
    • rate = playback speed (0.5 - 4.0, default =1.0) (*optional)
    • volume = sound volume (0.0 - 1.0, default=1.0)(*optional)
    • loops = true/false (default=false)(*optional)
    • onload = actions that will be called on sound loaded (*optional)
    • onplay = actions that will be called if the sound start to play (*optional)
    • onpause = actions that will be called if the sound is paused (*optional)
    • onstop = actions that will be called if the sound is stopped(*optional)
    • onmute = actions that will be called if the sound is muted/unmuted (*optional)
    • oncomplete = actions that will be called on complete (*optional)
  • Html5Soundvolume(name, value)  (Web Audio Api only)
    • volume settings
    • name = identification name of the sound
    • value = value (0.0-1.0)
  • Html5Soundplay(name)
    • resumes a paused sound
    • name = identification name of the sound
  • Html5Soundpause(name)
    • pauses a sound
    • name = identification name of the sound
  • Html5Soundstop(name)
    • stops playing a sound
    • name = identification name of the sound
  • Html5Soundmute(name)
    • stops playing a sound
    • name = identification name of the sound
  • Html5Soundrate(name, value)  (Web Audio Api only)
    • playback speed settings
    • name = identification name of the sound
    • value = 0.5-4.0
  • Html5SoundSetSeek(name, value)  (Web Audio Api only)
    • Set the seek of the sound
    • name = identification name of the sound
    • value = in second
  • Html5SoundGetSeek(name, dstvar)  (Web Audio Api only)
    • Get the seek value of the sound
    • name = identification name of the sound
    • dstvar = The destination variable name where the seek will be stored

Installation

Easy to install

  1. Copy the folder 'html5sound' to your project root
  2. In the header index.html file add the following lines of code:
    <html>
<head>
	[...]
	<script src="/html5sound/js/howler.core.min.js"></script>
	<script src="/html5sound/js/howler.effects.min.js"></script>
	[...]
	</head>
		<body>
		[...]
		</body>
	</html>
  3. Put in your main xml file this line of code:
    <include url="%FIRSTXML%/html5sound/xmls/init.xml"/>
<include url="%FIRSTXML%/html5sound/gui/xmls/init.xml" />
  4. In Panotour Pro put in your main xml file this line of code:
    <!-- ptp_datafolder_name = name of the folder repository, generated by Panotour Pro --/>

<krpano ptp_datafolder_name="tourdata" generated_by_panotour="true"/>
<include url="%FIRSTXML%/html5sound/xmls/init.xml"/>
<include url="%FIRSTXML%/html5sound/gui/xmls/init.xml" />
  5. Done