How to graph sensor data with rrdtool and the Bridge

Hardware Arduino Yún
10

Last part of Temp.php:

        $.fn.UseTooltip = function () {
            $(this).bind("plothover", function (event, pos, item) {
                if (item) {
                    if ((previousLabel != item.series.label) || (previousPoint != item.dataIndex)) {
                        previousPoint = item.dataIndex;
                        previousLabel = item.series.label;
                        $("#tooltip").remove();
 
                        var x = item.datapoint[0];
                        var y = item.datapoint[1];
                        
                        var datepoint = new Date(x + 28800000);  // get rid of -8 hour offset
                        if (datepoint.getMinutes() < 10)
                        {
                           var timeString = datepoint.getHours() + ":" + "0" + datepoint.getMinutes();
                        } 
                        else 
                        {
                           var timeString = datepoint.getHours() + ":" + datepoint.getMinutes();
                        }
 
                        var color = item.series.color;
                        var month = new Date(x).getMonth();
 
                        //console.log(item);
 
                        if (item.seriesIndex == 0) {
                            showTooltip(item.pageX,
                            item.pageY,
                            color,
                            "<strong>" + item.series.label + "</strong>
" + timeString + " : <strong>" + y + "</strong>(F)");
                        } else {
                            showTooltip(item.pageX,
                            item.pageY,
                            color,
                            "<strong>" + item.series.label + "</strong>
" + timeString + " : <strong>" + y + "</strong>(F)");
                        }
                    }
                } else {
                    $("#tooltip").remove();
                    previousPoint = null;
                }
            });
        };
 
        function showTooltip(x, y, color, contents) {
            $('<div id="tooltip">' + contents + '</div>').css({
                position: 'absolute',
                display: 'none',
                top: y - 40,
                left: x - 40,
                border: '2px solid ' + color,
                padding: '3px',
                'font-size': '9px',
                'border-radius': '5px',
                'background-color': '#fff',
                'font-family': 'Verdana, Arial, Helvetica, Tahoma, sans-serif',
                opacity: 0.9
            }).appendTo("body").fadeIn(200);
        }
    </script>
</head>
<body>
    <div style="width:100%;height:540px;text-align:center;margin:10px">       
        <div id="flot-placeholder1" style="width:98%;height:100%;"></div>       
    </div>
</body>
</html>
EOD;

$button1 = "Previus Day";
$value1 =  sizeof($files) - $fileindex;
$button2 = "Next Day";
$value2 =  sizeof($files) - $fileindex - 2;
if($value2 < 0) $value2 = 0;

$html = $html . <<<EOD
   

   <form name="input" action="Temp.php" method="get"
           style="position:absolute; top:5.8in; left:0.5in">
   <input type="hidden" name="day" value=$value1>
   <button type="submit" style="width:1.3in; height:0.5in; font-size:12pt">$button1</button>
   </form>

   <form name="input" action="Temp.php" method="get"
           style="position:absolute; top:5.8in; left:2.0in">
   <input type="hidden" name="day" value=$value2>
   <button type="submit" style="width:1.3in; height:0.5in; font-size:12pt">$button2</button>
   </form>
   
  <p style="position:absolute; top:5.65in; left:3.6in; font-size:12pt"><b>Inside Temp:</b></p>
  <p style="position:absolute; top:5.65in; left:4.7in; font-size:12pt"><b>Now:</b> $insideTemp <b>Min:</b> $indoorMin <b>Max:</b> $indoorMax</p>

  <p style="position:absolute; top:5.95in; left:3.6in; font-size:12pt"><b>Outside Temp:</b></p>
  <p style="position:absolute; top:5.95in; left:4.7in; font-size:12pt"><b>Now:</b> $outsideTemp <b>Min:</b> $outdoorMin <b>Max:</b> $outdoorMax</p>

  <p style="position:absolute; top:5.65in; left:7.4in; font-size:12pt"><b>Last Sample Time:</b> $dataTime</p>

  <p style="position:absolute; top:5.95in; left:7.4in; font-size:12pt"><b>Board Temp:</b> $boardTemp</p>

  <p style="position:absolute; top:5.95in; left:8.9in; font-size:12pt"><b>Voltage:</b> $voltage V</p>

EOD;

echo $html;

?>