Created
June 29, 2015 00:46
-
-
Save Gr8Gatsby/9ec6e3b4aa73c5849ba9 to your computer and use it in GitHub Desktop.
This Gist shows how to create a simple toast message on Windows using JavaScript.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function createToast(message, imgUrl, imgAlt) { | |
// Namespace: Windows.UI.Notifications | |
if (typeof Windows.UI.Notifications === 'undefined') { | |
return; | |
} | |
// Setup variables for shorthand | |
var notifications = Windows.UI.Notifications, | |
templateType = notifications.ToastTemplateType.toastImageAndText01, | |
templateContent = notifications.ToastNotificationManager.getTemplateContent(templateType), | |
toastMessage = templateContent.getElementsByTagName('text'), | |
toastImage = templateContent.getElementsByTagName('image'), | |
toastElement = templateContent.selectSingleNode('/toast'); | |
// Set message & image in toast template | |
toastMessage[0].appendChild(templateContent.createTextNode(message || 'Demo message')); | |
toastImage[0].setAttribute('src', imgUrl || 'https://unsplash.it/150/?random'); | |
toastImage[0].setAttribute('alt', imgAlt || 'Random sample image'); | |
toastElement.setAttribute('duration', 'long'); | |
toastElement.setAttribute('launch', '{"type":"toast","code":"info"}'); // Optional Launch Parameter | |
// Show the toast | |
var toast = new notifications.ToastNotification(templateContent); | |
var toastNotifier = new notifications.ToastNotificationManager.createToastNotifier(); | |
toastNotifier.show(toast); | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset="utf-8"> | |
<title>http://jsbin.com/lidovo/29/edit?html,js,output</title> | |
</head> | |
<body> | |
<button id="toast">Toast</button> | |
<a href="http://jsbin.com/lidovo/29/edit?html,js,output">View on JSBin</a> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment