[Koha-patches] [PATCH] [Draft! Dont Commit] gracefull fallback of sound from audio tag to object tag

[Michael Hafen]

This is mostly for IE.  Add javascript that checks for html5 audio tag support
and falls back to object tag if there is no support.

This is the first attempt

This requires ogg codec installed.

I can't get this to work, anyone have an idea what I'm doing wrong?

---
 .../prog/en/modules/circ/circulation.tmpl          |   31 ++++++++++
 .../prog/en/modules/circ/returns.tmpl              |   60 ++++++++++++++++++++
 2 files changed, 91 insertions(+), 0 deletions(-)

diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/circ/circulation.tmpl b/koha-tmpl/intranet-tmpl/prog/en/modules/circ/circulation.tmpl
index d7a70fe..593db50 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/circ/circulation.tmpl
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/circ/circulation.tmpl
@@ -283,7 +283,23 @@ function refocus(calendar) {
         <!-- TMPL_IF NAME="IMPOSSIBLE" -->
 
 <!-- TMPL_IF NAME="soundon" -->
+<span id="soundon_critical">
 <audio src="/intranet-tmpl/prog/sound/critical.ogg" autoplay="autoplay" autobuffer="autobuffer"></audio>
+</span>
+<script type="text/javascript">
+// inspired by modernizr 1.1 (MIT License)
+var soundon_el = document.createElement('audio');
+if ( ! soundon_el['canPlayType'] ) {
+  soundon_el = document.getElementById( 'soundon_critical' );
+  soundon_el.innerHTML = '
+<object data="/intranet-tmpl/prog/sound/critical.ogg" width="1" height="1" autoplay="true" type="application/ogg">
+  <param name="src" value="/intranet-tmpl/prog/sound/critical.ogg" />
+  <param name="controller" value="false" />
+  <param name="autostart" value="1" />
+</object>
+';
+}
+</script>
 <!-- /TMPL_IF -->        
 
 <div class="yui-g">
@@ -346,7 +362,22 @@ function refocus(calendar) {
 </div></div>
 <!-- TMPL_ELSE -->
 <!-- TMPL_IF NAME="soundon" -->
+<span id="soundon_beep">
 <audio src="/intranet-tmpl/prog/sound/beep.ogg" autoplay="autoplay" autobuffer="autobuffer"></audio>
+</span>
+<script type="text/javascript">
+var soundon_el = document.createElement('audio');
+if ( ! soundon_el['canPlayType'] ) {
+  soundon_el = document.getElementById( 'soundon_beep' );
+  soundon_el.innerHTML = '
+<object data="/intranet-tmpl/prog/sound/beep.ogg" width="1" height="1" autoplay="true" type="application/ogg">
+  <param name="src" value="/intranet-tmpl/prog/sound/beep.ogg" />
+  <param name="controller" value="false" />
+  <param name="autostart" value="1" />
+</object>
+';
+}
+</script>
 <!-- /TMPL_IF -->
     <!--/TMPL_IF --> <!-- /impossible -->
 
diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/circ/returns.tmpl b/koha-tmpl/intranet-tmpl/prog/en/modules/circ/returns.tmpl
index fef7c57..abd3078 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/circ/returns.tmpl
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/circ/returns.tmpl
@@ -91,7 +91,22 @@ function Dopop(link) {
 	<!-- waiting -->
 
 <!-- TMPL_IF NAME="soundon" -->
+<span id="soundon_ending">
 <audio src="/intranet-tmpl/prog/sound/ending.ogg" autoplay="autoplay" autobuffer="autobuffer"></audio>
+</span>
+<script type="text/javascript">
+var soundon_el = document.createElement('audio');
+if ( ! soundon_el['canPlayType'] ) {
+  soundon_el = document.getElementById( 'soundon_ending' );
+  soundon_el.innerHTML = '
+<object data="/intranet-tmpl/prog/sound/ending.ogg" width="1" height="1" autoplay="true" type="application/ogg">
+  <param name="src" value="/intranet-tmpl/prog/sound/ending.ogg" />
+  <param name="controller" value="false" />
+  <param name="autostart" value="1" />
+</object>
+';
+}
+</script>
 <!-- /TMPL_IF -->	
 	
 <div class="dialog message">
@@ -221,7 +236,22 @@ function Dopop(link) {
 	<!--  reserved  -->
 	
 <!-- TMPL_IF NAME="soundon" -->
+<span id="soundon_opening">
 <audio src="/intranet-tmpl/prog/sound/opening.ogg" autoplay="autoplay" autobuffer="autobuffer"></audio>
+</span>
+<script type="text/javascript">
+var soundon_el = document.createElement('audio');
+if ( ! soundon_el['canPlayType'] ) {
+  soundon_el = document.getElementById( 'soundon_opening' );
+  soundon_el.innerHTML = '
+<object data="/intranet-tmpl/prog/sound/opening.ogg" width="1" height="1" autoplay="true" type="application/ogg">
+  <param name="src" value="/intranet-tmpl/prog/sound/opening.ogg" />
+  <param name="controller" value="false" />
+  <param name="autostart" value="1" />
+</object>
+';
+}
+</script>
 <!-- /TMPL_IF -->
 	
 	<div class="dialog message">
@@ -289,11 +319,41 @@ function Dopop(link) {
                     <!-- /TMPL_IF -->
             <!-- /TMPL_LOOP -->
 <!-- TMPL_IF NAME="soundon" -->
+<span id="soundon_critical">
 <audio src="/intranet-tmpl/prog/sound/critical.ogg" autoplay="autoplay" autobuffer="autobuffer"></audio>
+</span>
+<script type="text/javascript">
+var soundon_el = document.createElement('audio');
+if ( ! soundon_el['canPlayType'] ) {
+  soundon_el = document.getElementById( 'soundon_critical' );
+  soundon_el.innerHTML = '
+<object data="/intranet-tmpl/prog/sound/critical.ogg" width="1" height="1" autoplay="true" type="application/ogg">
+  <param name="src" value="/intranet-tmpl/prog/sound/critical.ogg" />
+  <param name="controller" value="false" />
+  <param name="autostart" value="1" />
+</object>
+';
+}
+</script>
 <!-- /TMPL_IF -->
         <!-- TMPL_ELSE -->
 <!-- TMPL_IF NAME="soundon" -->
+<span id="soundon_beep">
 <audio src="/intranet-tmpl/prog/sound/beep.ogg" autoplay="autoplay" autobuffer="autobuffer"></audio>
+</span>
+<script type="text/javascript">
+var soundon_el = document.createElement('audio');
+if ( ! soundon_el['canPlayType'] ) {
+  soundon_el = document.getElementById( 'soundon_beep' );
+  soundon_el.innerHTML = '
+<object data="/intranet-tmpl/prog/sound/beep.ogg" width="1" height="1" autoplay="true" type="application/ogg">
+  <param name="src" value="/intranet-tmpl/prog/sound/beep.ogg" />
+  <param name="controller" value="false" />
+  <param name="autostart" value="1" />
+</object>
+';
+}
+</script>
 <!-- /TMPL_IF -->
         <!-- /TMPL_IF -->
     </div>
-- 
1.6.3.3