Confirmed users
1,340
edits
No edit summary |
No edit summary |
||
(19 intermediate revisions by one other user not shown) | |||
Line 1: | Line 1: | ||
= Overview = | = Overview = | ||
On the surface, MMS messages are very similar to multipart HTML emails. One part is responsible for the layout of the message, though MMS uses SMIL rather than HTML. The other parts are attachments, such as text, picture, video, and sound files. Much like in multipart | On the surface, MMS messages are very similar to multipart HTML emails. One part is responsible for the layout of the message, though MMS uses SMIL rather than HTML. The other parts are attachments, such as text, picture, video, and sound files. Much like in multipart emails, the attachments have "file names" and are referred to by those from the presentation part. | ||
The API proposal below tries to reuse as many existing Web technologies as applicable. The SMIL document is exposed as a [https://developer.mozilla.org/en/DOM:document DOM document] and the attachments as [https://developer.mozilla.org/en/DOM/Blob Blob] objects. On a User Agent capable of rendering SMIL, the web application may simply render the DOM right away. On other User Agents, it may use XSLT or some other method to convert SMIL to HTML. | |||
To read the attachments, the web application may use the [https://developer.mozilla.org/en/DOM/FileReader FileReader] API. However, it's not that useful or efficient to have image/audio/video data in memory (e.g. as a typed array). For display purposes the web application just needs a URI that resolves to the data, so that it can point to it in a <video>, <audio>, <img> element. This is possible with the [https://developer.mozilla.org/en/DOM/window.URL.createObjectURL window.URL] API. | |||
= API = | = API = | ||
== MmsManager == | |||
/** | /** | ||
Line 36: | Line 42: | ||
DOMRequest cancelMessage(MmsMessage message); | DOMRequest cancelMessage(MmsMessage message); | ||
} | } | ||
== MmsMessage == | |||
/** | |||
* MmsMessage constructor. | |||
*/ | |||
MmsMessage MmsMessage( | |||
DOMString receiver, | |||
Document document | |||
); | |||
[Constructor] | [Constructor] | ||
Line 75: | Line 91: | ||
readonly attribute MmsAttachmentStorage attachments; | readonly attribute MmsAttachmentStorage attachments; | ||
} | } | ||
== MmsAttachmentStorage == | |||
/** | /** | ||
* This object implements a mapping to look up attachments by their name. | * This object implements a mapping to look up attachments (blobs) by their name. | ||
* | * | ||
* var text = message.attachments["text.txt"]; | * var text = message.attachments["text.txt"]; | ||
* message.attachments["movie.mov"] = new | * message.attachments["movie.mov"] = new Blob([data], {type: "application/video"}); | ||
* delete message.attachments["picture.png"]; | * delete message.attachments["picture.png"]; | ||
*/ | */ | ||
interface MmsAttachmentStorage | interface MmsAttachmentStorage | ||
{ | { | ||
getter | getter Blob getAttachment(DOMString name); | ||
setter creator void setAttachment(DOMString name, | setter creator void setAttachment(DOMString name, Blob attachment); | ||
deleter void deleteAttachment(DOMString name); | deleter void deleteAttachment(DOMString name); | ||
} | } | ||
= | = Examples = | ||
== Receiving an MMS == | == Receiving an MMS == | ||
// Listen for incoming MMS. If the message contents hasn't been fetched yet, do so. | |||
navigator.mms.onreceived = function (event) { | navigator.mms.onreceived = function (event) { | ||
var message = event.message; | var message = event.message; | ||
Line 138: | Line 124: | ||
} | } | ||
// Deconstruct and display an MMS. For simplicity's sake, this only supports one | |||
// slide and one multimedia element per slide. | |||
function handleNewMessage(message) { | function handleNewMessage(message) { | ||
var | var firstPar = message.contentDocument.querySelectorAll("par")[0]; | ||
var mediaEl = firstPar.querySelectorAll("img|audio|video")[0]; | |||
var importedEl = document.importNode(mediaEl); | |||
var mediaUrl = window.URL.createObjectURL(message.attachments[importedEl.src]); | |||
importedEl.src = mediaUrl; | |||
messageDisplayContainer.appendChild(importedEl); | |||
window.URL.revokeObjectURL(mediaUrl); | |||
} | } | ||
== Sending an MMS == | == Sending an MMS == | ||
var smil = "<smil><body><par><video src="lolcat.mov"/></par></body></smil>"; | <html> | ||
<body> | |||
<input type="file" id="picture" accept="image/*"> | |||
<div> | |||
<input type="text" id="number"> | |||
<button onclick="sendMMS();">Send</button> | |||
</div> | |||
<script> | |||
function sendMMS() { | |||
var smil = "<smil><body><par><video src="lolcat.mov"/></par></body></smil>"; | |||
var doc = (new DOMParser()).parseFromString(smil, "application/smil"); | |||
var number = document.getElementById("number").value; | |||
var message = new MmsMessage(number, doc); | |||
var pictureEl = document.getElementById("picture"); | |||
var pictureBlob = pictureEl.files[0]; | |||
message.attachments["picture.jpg"] = pictureBlob; | |||
navigator.mms.send(message); | |||
} | |||
</script> | |||
</body> | |||
</html> | |||
[[Category:Web APIs]] |