Permalink
Browse files

Initial working versions for hosted and packaged

  • Loading branch information...
mahemoff committed Jan 24, 2011
0 parents commit c94806fab924ed41f3cdbede2d7d2bf129c540dc
21 README
@@ -0,0 +1,21 @@
+DESCRIPTION
+This is a simple countdown tool to demonstrate installable web app functionality
+in Google Chrome, both a packaged and a hosted edition.
+
+The tutorial was originally presented when Chrome apps were in development,
+and it was possible for an app to also include a browser/page action. Thus,
+the packaged app demo is slightly out of date. Caveat emptor!
+
+AUTHOR
+Michael Mahemoff
+
+LICENSE
+MIT License
+
+CREDITS
+Image reproduced under a Creative Commons license from:
+http://www.iconfinder.com/icondetails/34292/128/timer_icon
+
+date.js used under MIT license - see top of date.js file.
+(Note date.js is not used here and only included for pedagogical purposes,
+so that developers can extend the app as provided here.)
@@ -0,0 +1,20 @@
+This is the Background page
+<script>
+var timer;
+function startCountdown(durationSecs) {
+ var opener = window.opener;
+ clearTimeout(timer);
+ var endDate = +new Date + 1000*durationSecs;
+ (function() {
+ var remainingMillis = endDate-new Date;
+ if (opener && opener.updateTime)
+ opener.updateTime(Math.round(remainingMillis/1000));
+ if (remainingMillis > 0) {
+ timer = setTimeout(arguments.callee, 1000);
+ } else {
+ window.webkitNotifications.createNotification
+ ("countdown128.png","Countdown App", "Countdown has completed").show();
+ }
+ })();
+}
+</script>
Binary file not shown.
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,40 @@
+<html>
+ <head>
+ <style>
+ body { margin: 0; padding: 0; }
+ #durationEntry { background: #fef; margin: 20px; padding: 10px 20px; }
+ #durationEntry, #durationEntry input { text-align: right; }
+ #secsRemaining { text-align: center; font-size: 200pt; margin: 0; }
+ #unitsMessage { margin: 10pt; text-align: center; display: none; }
+ </style>
+ </head>
+ <body>
+
+ <section id="durationEntry">
+ Countdown Duration (secs): <input id="durationSecs" size="5" value="60" />
+ <button id="schedule">start</button>
+ </section>
+
+ <div id="secsRemaining"></div>
+
+ </body>
+ <script>
+ var win = window.open("background.html", "background", "background");
+
+ window.onload = function() {
+ document.getElementById("schedule").onclick = function() {
+ var durationSecs = parseInt(document.getElementById("durationSecs").value);
+ if (durationSecs && durationSecs>0)
+ win.startCountdown(durationSecs);
+ console.log("w", win);
+ };
+ };
+
+ function updateTime(secsRemaining) {
+ document.getElementById("secsRemaining").innerHTML = secsRemaining;
+ if (secsRemaining<=0)
+ document.getElementById("secsRemaining").innerHTML = "Done";
+ }
+
+ </script>
+</html>
@@ -0,0 +1,16 @@
+{
+ "name": "Countdown",
+ "version": "1.0",
+ "description": "A countdown app",
+ "icons": {
+ "24": "countdown24.png",
+ "128": "countdown128.png"
+ },
+ "permissions": ["notifications", "background"],
+ "background_page": "background.html",
+ "app": {
+ "launch": {
+ "web_url": "http://play.dev/countdown/hosted/launchLocalPath.html"
+ }
+ }
+}
Oops, something went wrong.

0 comments on commit c94806f

Please sign in to comment.