add some Bootstrap goodness
authorDirk Koopman <djk@tobit.co.uk>
Sat, 24 Jan 2015 21:01:38 +0000 (21:01 +0000)
committerDirk Koopman <djk@tobit.co.uk>
Sat, 24 Jan 2015 21:01:38 +0000 (21:01 +0000)
loop.pl

diff --git a/loop.pl b/loop.pl
index 4046ca9b95b42dd95f00a8313a4fc588b433563b..bb9582e92da6a48d2a7a5882d851eebe8703e294 100755 (executable)
--- a/loop.pl
+++ b/loop.pl
@@ -681,9 +681,22 @@ __DATA__
 % my $url = url_for 'weather';
 <!DOCTYPE html>
 <html>
-  <head><title>DWeather</title></head>
+  <head>
+    <title>DWeather</title>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+
+    <!-- Latest compiled and minified CSS -->
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
+
+    <!-- Optional theme -->
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">
+
+  </head>
   <body>
-       <h1>DWeather</h1>
+    <center><h1>High View Weather</h1></center>
+
 
     <script>
        var ws;
@@ -707,7 +720,7 @@ __DATA__
 
 
     ws = new WebSocket('<%= $url->to_abs %>');
-    document.body.innerHTML += 'ws connecting to: <%= $url->to_abs %> type_of: ' + typeof(ws) + '<br>';
+    document.body.innerHTML += '<center>ws connecting to: <%= $url->to_abs %> type_of: ' + typeof(ws) + '</center><br>';
     if (typeof(ws) === 'object') {
                ws.onmessage = function (event) {
                        var js = JSON.parse(event.data);
@@ -724,8 +737,10 @@ __DATA__
  
     </script>
 
+<div id="container">
+<div id="start-template">
 <br><br>
-<table border=1 width=80%>
+<table border=1 width=80% align="center">
 <tr>
 <th>Time:<td><span id="tm"> </span>
 <th>Sunrise:<td><span id="Sunrise"> </span>
@@ -761,5 +776,11 @@ __DATA__
 <th>Month:<td> <span id="Rain_Month"> </span>
 <th>Year:<td> <span id="Rain_Year"> </span>
 </table>
+</div>
+</div>
+    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
+    <!-- Latest compiled and minified JavaScript -->
+    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
 </body>
 </html>