diff --git a/hc/front/management/commands/pygmentize.py b/hc/front/management/commands/pygmentize.py index e94f4135..10f05cef 100644 --- a/hc/front/management/commands/pygmentize.py +++ b/hc/front/management/commands/pygmentize.py @@ -19,3 +19,5 @@ class Command(BaseCommand): _process("browser.txt", "browser.html", lexers.JavascriptLexer()) _process("crontab.txt", "crontab.html", lexers.BashLexer()) _process("python.txt", "python.html", lexers.PythonLexer()) + _process("php.txt", "php.html", lexers.PhpLexer()) + _process("node.txt", "node.html", lexers.JavascriptLexer()) diff --git a/static/css/style.css b/static/css/style.css index a450d6ad..022595ce 100644 --- a/static/css/style.css +++ b/static/css/style.css @@ -33,10 +33,15 @@ body { } .index-bleed { - background: #e5ece5; + background: #FFF; padding-bottom: 2em; } +.get-started-bleed { + background: #e5ece5; + padding-bottom: 3em; +} + #pitch { text-align: center; padding: 72px 0; @@ -65,18 +70,10 @@ body { border-color: #dddddd; } -#welcome-status, #get-started { +#get-started { margin-top: 4em; } -#welcome-status th { - border-top: 0; -} - -.welcome-browser-controls { - text-align: right; -} - .glyphicon.up, .glyphicon.new, .glyphicon.grace, .glyphicon.down { font-size: 22px; } @@ -107,6 +104,15 @@ body { margin: 0; } +.tour-title { + margin: 50px 0; +} + + +.tour-section { + margin-bottom: 50px; +} + /* Checks */ table.table tr > th.th-name { diff --git a/static/img/my_checks.png b/static/img/my_checks.png new file mode 100644 index 00000000..30ae8cb5 Binary files /dev/null and b/static/img/my_checks.png differ diff --git a/static/img/period_grace.png b/static/img/period_grace.png new file mode 100644 index 00000000..1b262d48 Binary files /dev/null and b/static/img/period_grace.png differ diff --git a/static/js/index.js b/static/js/index.js deleted file mode 100644 index 98ebf3f4..00000000 --- a/static/js/index.js +++ /dev/null @@ -1,49 +0,0 @@ -$(function () { - $('[data-toggle="tooltip"]').tooltip(); - - var code = $("#check-code").text(); - var url = $("#pitch-url").text(); - url = url.replace("http://", "//"); - - var lastPing = null; - var lastPingHuman = null; - - $("#run-it").click(function() { - $.get(url); - }); - - function checkLastPing() { - $.getJSON("/status/" + code + "/", function(data) { - if (data.last_ping != lastPing) { - lastPing = data.last_ping; - $("#timer").data("timer", data.secs_to_alert); - } - - var lph = data.last_ping_human; - if (lph && lph.indexOf("seconds ago") > 0) - data.last_ping_human = "seconds ago"; - - if (data.last_ping_human != lastPingHuman) { - lastPingHuman = data.last_ping_human; - $("#last-ping").text(lastPingHuman); - } - }); - } - - function updateTimer() { - var timer = parseInt($("#timer").data("timer")); - if (timer == 0) - return; - - var s = timer % 60; - var m = parseInt(timer / 60) % 60; - var h = parseInt(timer / 3600); - $("#timer").text(h + "h " + m + "m " + s + "s"); - - $("#timer").data("timer", timer - 1); - } - - setInterval(checkLastPing, 3000); - setInterval(updateTimer, 1000); - -}); \ No newline at end of file diff --git a/templates/base.html b/templates/base.html index 2dfb65a6..895c3985 100644 --- a/templates/base.html +++ b/templates/base.html @@ -4,7 +4,7 @@ {% block title %}healthchecks.io - Get Notified When Your Cron Jobs Fail{% endblock %} - + diff --git a/templates/front/about.html b/templates/front/about.html index f6322598..8a2b648e 100644 --- a/templates/front/about.html +++ b/templates/front/about.html @@ -33,12 +33,64 @@

Alternative Services

- + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ Cronitor.io + +

One monitor is free.

+

50 monitors is $24.95/mo.

+
+ Cronitor.io + +

One snitch is free.

+

3 snitches is $5/mo.

+

100 snitches is $19/mo.

+
+ Coal Mine + +

Open Source.

+

No hosted service. No web UI, just API.

+
+ PushMon + +

Free during public beta.

+
+ steward.io + +

15 jobs is free.

+

75 jobs is $7/mo.

+
+ CronAlarm + +

10 jobs is $5/mo.

+

100 jobs is $20/mo.

+
{% endblock %} \ No newline at end of file diff --git a/templates/front/my_checks.html b/templates/front/my_checks.html index 0f4bb8dd..d4f9ca2a 100644 --- a/templates/front/my_checks.html +++ b/templates/front/my_checks.html @@ -169,7 +169,7 @@ class="update-timeout-label" data-toggle="tooltip" title="When check is late, how much time to wait until alert is sent"> - Grace Period + Grace Time

- Grace Period + Grace Time When a check is late, how much time to wait until alert is sent.

diff --git a/templates/front/snippets/crontab.html b/templates/front/snippets/crontab.html index 760042a4..67581548 100644 --- a/templates/front/snippets/crontab.html +++ b/templates/front/snippets/crontab.html @@ -1,3 +1,3 @@ -
# m h  dom mon dow   command
+
# m h dom mon dow   command
   8 6 *   *   *     /home/user/tasks/backup_all.sh && curl {{ ping_url }}
 
diff --git a/templates/front/snippets/crontab.txt b/templates/front/snippets/crontab.txt index 1927991b..c7e8aad3 100644 --- a/templates/front/snippets/crontab.txt +++ b/templates/front/snippets/crontab.txt @@ -1,2 +1,2 @@ -# m h dom mon dow command +# m h dom mon dow command 8 6 * * * /home/user/tasks/backup_all.sh && curl PING_URL \ No newline at end of file diff --git a/templates/front/snippets/node.html b/templates/front/snippets/node.html new file mode 100644 index 00000000..f3b216a6 --- /dev/null +++ b/templates/front/snippets/node.html @@ -0,0 +1,3 @@ +
var http = require('http');
+http.get("{{ ping_url }}");
+
diff --git a/templates/front/snippets/node.txt b/templates/front/snippets/node.txt new file mode 100644 index 00000000..3df15df0 --- /dev/null +++ b/templates/front/snippets/node.txt @@ -0,0 +1,2 @@ +var http = require('http'); +http.get("PING_URL"); \ No newline at end of file diff --git a/templates/front/snippets/php.html b/templates/front/snippets/php.html new file mode 100644 index 00000000..e30dec60 --- /dev/null +++ b/templates/front/snippets/php.html @@ -0,0 +1,2 @@ +
file_get_contents('{{ ping_url }}');
+
diff --git a/templates/front/snippets/php.txt b/templates/front/snippets/php.txt new file mode 100644 index 00000000..78fbe619 --- /dev/null +++ b/templates/front/snippets/php.txt @@ -0,0 +1 @@ +file_get_contents('PING_URL'); \ No newline at end of file diff --git a/templates/front/welcome.html b/templates/front/welcome.html index b25a8666..560e8f04 100644 --- a/templates/front/welcome.html +++ b/templates/front/welcome.html @@ -50,11 +50,14 @@
{% include "front/snippets/python.html" %}
+
+ {% include "front/snippets/node.html" %} +
+
+ {% include "front/snippets/php.html" %} +
{% include "front/snippets/browser.html" %} -
- -
@@ -62,38 +65,10 @@ +
-
-

Status - {{ check.code }} -

- - - - - - - - - - - -
Last pingPeriodAlert in
- {% if check.last_ping %} - {{ check.last_ping|naturaltime }} - {% else %} - Never - {% endif %} - - 1 day - (log in to change) - - {{ timer_formatted }} -
-
- -
+

E-mail Address to Receive Alerts:

{% csrf_token %} @@ -121,12 +96,100 @@
+
+ +
+
+
+

A quick peek of what's inside:

+
+
+ +
+
+ My Checks page +
+
+

+ A list of your checks, one for each Cron job, daemon or + periodically running task you want to monitor. +

+

+ Give names to your checks to easily recognize them + later. Adjust Period and Grace time to match periodicity + and duration of your tasks. +

+
+
+ +
+
+ Period/Grace Time dialog +
+
+ Each check has configurable Period and Grace Time parameters. + Depending on these parameters and time since the last ping, the check is in one of the + following states: + + + + + + + + + + + + + + + + + + +
+ + + New. + A check that has been created, but has not received any pings yet. +
+ + + Up. + Time since last ping has not exceeded Period. +
+ + + Late. + Time since last ping has exceeded Period, + but has not yet exceeded Period + Grace. +
+ + + Down. + Time since last ping has exceeded Period + Grace. + When check goes from "Late" to "Down", HealthChecks + sends you an email alert. +
+ +
+
+ +
+ + + + {% endblock %} {% block scripts %} {% compress js %} - {% endcompress %} {% endblock %}