Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP

Comparing changes

Choose two branches to see what’s changed or to start a new pull request. If you need to, you can also compare across forks.

Open a pull request

Create a new pull request by comparing changes across two branches. If you need to, you can also compare across forks.
base fork: hydna/notifications
base: 0fc8d5ec84
...
head fork: hydna/notifications
compare: 037ef65b11
  • 4 commits
  • 3 files changed
  • 0 commit comments
  • 2 contributors
Commits on Mar 13, 2012
@jfd jfd Adapted to new push-api f6ee4d9
Commits on Apr 10, 2012
Gustaf Sjöberg Updated copy. c8d7d84
Gustaf Sjöberg Reset panel on invalid data. 95ab2d7
Gustaf Sjöberg Another copy update. 037ef65
Showing with 51 additions and 52 deletions.
  1. +16 −15 css/style.css
  2. +25 −27 index.html
  3. +10 −10 js/app.js
View
31 css/style.css
@@ -73,17 +73,13 @@
body {
-
font-family: "Helvetica Neue", Arial, San-Serif;
-
background: #212121;
- color: white;
-
+ color: #FFF;
}
#container {
-
position:absolute;
width: 890px;
@@ -99,7 +95,6 @@ body {
.pane {
-
position: relative;
width: 280px;
@@ -128,18 +123,16 @@ body {
.pane .count {
-
position: absolute;
right: 10px;
top: 10px;
- font-size: 2.0em;
+ font-size: 20px;
font-weight: bold;
}
.pane .info {
-
position: absolute;
background: url(../images/info.png) no-repeat;
@@ -157,7 +150,6 @@ body {
-moz-transition: opacity ease-out 0.3s;
-ms-transition: opacity ease-out 0.3s;
-o-transition: opacity ease-out 0.3s;
-
}
@@ -172,8 +164,10 @@ body {
.pane.instructions code {
- font-size: 0.9em;
- padding-left: 20px;
+ font-size: 12px;
+ padding: 5px;
+ background: #333;
+ color: #FFF;
}
@@ -183,12 +177,14 @@ body {
display: none;
background: #444;
+ color: #CCC;
top: -30px;
right: -400px;
width: 350px;
- font-size: 0.7em;
+ font-size: 12px;
+ line-height: 150%;
padding: 20px;
@@ -203,6 +199,11 @@ body {
-o-transition: opacity ease-out 0.3s;
}
+.pane .instruction h2,
+.pane .instruction h3 {
+ color: #EEE;
+}
+
#phone.pane .instruction {
right: 290px;
}
@@ -284,7 +285,7 @@ body {
width: 600px;
- font-size: 2.0em;
+ font-size: 20px;
font-weight: bold;
text-align: center;
@@ -306,4 +307,4 @@ body {
bottom: -120px;
-}
+}
View
52 index.html
@@ -7,11 +7,9 @@
<script type="text/javascript" src="http://cdn.hydna.com/1/hydna.js"></script>
<script>
- //
- // Put in your Hydna-URL here to try on your own domain.
- //
- var HYDNA_URL = "test-1.hydna.net";
-
+ // You can insert your own domain here if you do not wish to play with
+ // others:
+ var HYDNA_URL = "public.hydna.net";
</script>
</head>
@@ -21,21 +19,21 @@
<span class="info"></span>
<span class="count"></span>
<div class="instruction">
- <h2>Instant Messaging Notfication</h2>
- <p>This is the Instant Messaging Notification icon. It keeps track of how many unread messages that is in queue.</p>
- <h3>To increase the indicator:<h3>
+ <h2>Message Notfication</h2>
+ <p>This is the Message Notification box; it keeps track of how many unread messages you have.</p>
+ <h3>To increase the counter:<h3>
<code>
$ curl --data "incr" <span class="url"></span>
</code>
- <h3>To decrease the indicator:<h3>
+ <h3>To decrease the counter:<h3>
<code>
$ curl --data "decr" <span class="url"></span>
</code>
- <h3>To reset the indicator:<h3>
+ <h3>To reset the counter:<h3>
<code>
$ curl --data "reset" <span class="url"></span>
</code>
- <h3>To set the indicator to a specific value:<h3>
+ <h3>To set the counter to a specific value:<h3>
<code>
$ curl --data "set 15" <span class="url"></span>
</code>
@@ -46,22 +44,22 @@
<span class="count"></span>
<div class="instruction">
<h2>Support Mail Notification</h2>
- <p>This is the Support Mail Notification icon. It indicates how many unanswered emails there is in the queue.</p>
- <h3>To increase the indicator:<h3>
+ <p>This is the Support Mail Notification box; it keeps track of the number of unanswered emails that have been queued up.</p>
+ <h3>To increase the counter:<h3>
<code>
- $ curl --data "incr" <span class="url"></span>
+ $ curl -d "incr" <span class="url"></span>
</code>
- <h3>To decrease the indicator:<h3>
+ <h3>To decrease the counter:<h3>
<code>
- $ curl --data "decr" <span class="url"></span>
+ $ curl -d "decr" <span class="url"></span>
</code>
- <h3>To reset the indicator:<h3>
+ <h3>To reset the counter:<h3>
<code>
- $ curl --data "reset" <span class="url"></span>
+ $ curl -d "reset" <span class="url"></span>
</code>
- <h3>To set the indicator to a specific value:<h3>
+ <h3>To set the counter to a specific value:<h3>
<code>
- $ curl --data "set 15" <span class="url"></span>
+ $ curl -d "set 15" <span class="url"></span>
</code>
</div>
</div>
@@ -70,31 +68,31 @@
<span class="count"></span>
<div class="instruction">
<h2>Phone Call Notification</h2>
- <p>This is the Phone Call Notification icon. It keeps track of how many phone calls that is currently waiting in line.</p>
+ <p>This is the Phone Call Notification box; it keeps track of the number of customers eagerly waiting for you to pick up.</p>
<h3>To increase the indicator:<h3>
<code>
- $ curl --data "incr" <span class="url"></span>
+ $ curl -d "incr" <span class="url"></span>
</code>
<h3>To decrease the indicator:<h3>
<code>
- $ curl --data "decr" <span class="url"></span>
+ $ curl -d "decr" <span class="url"></span>
</code>
<h3>To reset the indicator:<h3>
<code>
- $ curl --data "reset" <span class="url"></span>
+ $ curl -d "reset" <span class="url"></span>
</code>
<h3>To set the indicator to a specific value:<h3>
<code>
- $ curl --data "set 15" <span class="url"></span>
+ $ curl -d "set 15" <span class="url"></span>
</code>
</div>
</div>
</div>
<div id="startup-notification" class="initial">
<p class="text">
- Click on the icons to get instructions in how to communicate with them
+ Click on the icons above to see instructions on how to communicate with them
</p>
</div>
<script src="js/app.js"></script>
</body>
-</html>
+</html>
View
20 js/app.js
@@ -1,5 +1,3 @@
-
-
(function () {
var channelOffset = 600000;
var hydnaurl;
@@ -43,7 +41,7 @@
function incr (elem) {
var counter = getcounter(elem);
- var current = parseInt(counter.innerHTML);
+ var current = parseInt(counter.innerHTML, 10);
current = isNaN(current) ? 0 : current;
counter.innerHTML = ++current;
startshake(elem);
@@ -52,7 +50,7 @@
function decr (elem) {
var counter = getcounter(elem);
- var current = parseInt(counter.innerHTML);
+ var current = parseInt(counter.innerHTML, 10);
current = isNaN(current) ? 0 : current;
counter.innerHTML = --current;
if (counter.innerHTML == "0") {
@@ -64,8 +62,11 @@
function set (elem, value) {
var counter = getcounter(elem);
- var current = parseInt(counter.innerHTML);
- counter.innerHTML = parseInt(value);
+ if (isNaN(value)) {
+ counter.innerHTML = '';
+ } else {
+ counter.innerHTML = parseInt(value, 10);
+ }
startshake(elem);
}
@@ -143,13 +144,13 @@
function onpaneclick (event) {
+ hideinstructions();
if (/disabled/.test(this.className)) {
return;
}
if (/instructions/.test(this.className) == false) {
- hideinstructions();
this.className = "pane instructions";
event.preventDefault();
event.stopPropagation();
@@ -167,14 +168,13 @@
function setuppane (pane, id) {
var urls = pane.getElementsByClassName("url");
var realid = channelOffset + id;
- var pushurl = hydnaurl + "api/send/" + realid;
var chanurl = hydnaurl + realid;
var channel;
pane.addEventListener("click", onpaneclick, false);
for (var i = 0; i < urls.length; i++) {
- urls[i].innerHTML = pushurl;
+ urls[i].innerHTML = chanurl;
}
channel = new HydnaChannel(chanurl, "r");
@@ -191,4 +191,4 @@
window.addEventListener("click", hideinstructions, false);
-})();
+})();

No commit comments for this range

Something went wrong with that request. Please try again.