Namespaces

Variants
Actions

Please note that as of October 24, 2014, the Nokia Developer Wiki will no longer be accepting user contributions, including new entries, edits and comments, as we begin transitioning to our new home, in the Windows Phone Development Wiki. We plan to move over the majority of the existing entries over the next few weeks. Thanks for all your past and future contributions.

Embedding local or remote MP3 audio in Symbian Web Runtime

From Wiki
Jump to: navigation, search
Article Metadata
Article
Created: Maveric (28 Oct 2010)
Last edited: hamishwillee (23 Jul 2012)

Under construction.

Contents

Introduction

The purpose of this Wiki article is to demonstrate how you can play sounds in a Symbian WRT widget using embedded Flash object.


Prerequisites

  • any code editor of your choice.
  • a supported device for testing, N8 used in this example.

Example code

This example code shows how to embed a MP3 file, locally or remotely from a server to be played within your S60 WRT widget. We will create a method that can be called when the MP3 file needs to be embedded. Therefore an additional JavaScript file will be created.

basic.js - code for WRT default JavaScript file

audioplay.js - serves as home for the Mp3 embed method.

var songname = "";
var songURL = "";
 
function embedMP3(songname, songURL) {
var objectType = "application/x-mplayer2";
document.writeln("<div>");
document.writeln("<strong style='font-size:18px; position:relative; top:-28px'>" + songname + "&nbsp;</strong>");
document.writeln("<object width='200' height='80'>");
document.writeln("<param name='type' value='" + objectType + "'>");
document.writeln("<param name='src' value='" + songURL + "'>");
document.writeln("<param name='autostart' value='0'>");
document.writeln("<param name='showcontrols' value='1'>");
document.writeln("<param name='showstatusbar' value='1'>");
document.writeln("<embed src ='" + songURL + "' type='" + objectType + "' autoplay='false' autostart='0' width='280' height='69' controller='1' showstatusbar='1' bgcolor='#ffffff'></embed>");
document.writeln("</object>");
document.writeln("</div>");
document.close();
}

index.html - code for WRT default HTML-file

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Mp3 audio play test</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script language="javascript" type="text/javascript" src="basic.js"></script>
<script src="audioplay.js" type="text/javascript"></script>
<link rel="stylesheet" href="basic.css" type="text/css" />
<meta name="Generator" content="Nokia WDE 3.0.0" />
</head>
<body onload="init();">
</body>
</html>

basic.css

In the CSS file basic.js will be simply defined a background-color and text alignment to the middle of the widget.

body {
background-color: #6C5635;
text-align: center;
}

Media file and link for testing

test.mp3

Media:test.mp3

This page was last modified on 23 July 2012, at 06:34.
70 page views in the last 30 days.

Was this page helpful?

Your feedback about this content is important. Let us know what you think.

 

Thank you!

We appreciate your feedback.

×