Welcome to the Cumulus Support forum.

Latest Cumulus MX V3 release 3.28.6 (build 3283) - 21 March 2024

Cumulus MX V4 beta test release 4.0.0 (build 4019) - 03 April 2024

Legacy Cumulus 1 release 1.9.4 (build 1099) - 28 November 2014
(a patch is available for 1.9.4 build 1099 that extends the date range of drop-down menus to 2030)

Download the Software (Cumulus MX / Cumulus 1 and other related items) from the Wiki

Kindle.htmT

From build 3044 the development baton passed to Mark Crossley. Mark has been responsible for all the Builds since. He has made the code available on GitHub. It is Mark's hope that others will join in this development, but at the very least he welcomes your ideas for future developments (see Cumulus MX Development suggestions).

Moderator: mcrossley

Post Reply
Phil23
Posts: 884
Joined: Sat 16 Jul 2016 11:59 pm
Weather Station: Davis VP2+ & GW1000 (Standalone)
Operating System: Win10 Pro / rPi Buster
Location: Australia

Kindle.htmT

Post by Phil23 »

Hi All,

Don't know how I'd fair creating a page from scratch; html is not quite my thing.

But wondering if anyone can point me to a very basic template page that I could use to view current conditions on my Kindle.
The Kindle's "Experimental Browser" is very basic; mucks up the gauges page & index.htm comes up so so & needs to be zoomed to be clear,
but even then it's just average.

Just want a simple page with current data in a readable font.
Just the ability to pickup the Kindle from the bedside table at 4:00am & satisfy my curiosity.

Thanks

Phil

Edit:-

If someone could write a simple page example with one or two data fields in a table I could probably expand it from there.
That would be really appreciated.
:Now: :Today/Yesterday:

Image

Main Station Davis VP2+ Running Via Win10 Pro.
Secondary Stations, Ecowitt HP2551/GW1000 Via rPi 3 & 4 Running Buster GUI.
:Local Inverell Ecowitt Station: :Remote Ashford Ecowitt Station:
Top
Phil23
Posts: 884
Joined: Sat 16 Jul 2016 11:59 pm
Weather Station: Davis VP2+ & GW1000 (Standalone)
Operating System: Win10 Pro / rPi Buster
Location: Australia

Re: Kindle.htmT

Post by Phil23 »

Am trying to much around with copies of indexT.htm & weatherstyle.css renamed as kindleT.htm & kindlestyle.css.

Slowly getting results with various changes.
Main issue so far is to fit the tables on the page so I don't need to scroll right to see the numbers in the last column.
That & the fact that I have about a 1cm left margin that I could do without.

If any other kindle users would like to take a look & offer suggestions the work in progress is here.

http://weather.inverellit.com/kindle.htm

Cheers

Phil.

PS, This is what I have in the CSS

Code: Select all

@charset "UTF-8";
body {
	background-color: #FFFFFF;
	font-family: Verdana, Helvetica, sans-serif;
	font-size: 14pt;
	color: #000000;
	text-align: left;
}
#content {
	margin-top: 5%;
	margin-right: 20%;
	margin-bottom: 5%;
	margin-left: 20%;
}
h1 {
	font-size: 150%;
	font-weight: bold;
	text-transform: none;
	color: #678090;
	letter-spacing: 0.7em;
	padding-bottom: 1em;
	text-align: left;
}
h2 {
	font-size: 125%;
	font-weight: bold;
	color: #6F9DBE;
	letter-spacing: 0.4em;
	text-transform: none;
	font-family: Arial, Helvetica, sans-serif;
	text-align: left;
}
a {
	color: #FF6600;
	text-decoration: none;
	font-weight: normal;
}
a:visited {
	text-decoration: none;
	color: #CC6600;
}
a:hover {
	text-decoration: underline overline;
	color: #6F9DBE;
}
a:active {
	text-decoration: none;
}
h1,h2,h3,h4,h5,h6 {
	font-family: Arial, Helvetica, sans-serif;
}
.credits {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 70%;
	font-style: italic;
	text-transform: lowercase;
	letter-spacing: 0.3em;
	text-align: right;
}
h3 {
	font-size: 110%;
	font-weight: normal;
	color: #585858;
	letter-spacing: 0.4em;
	text-transform: lowercase;
	font-family: Arial, Helvetica, sans-serif;
	text-align: left;
}
ul {
	font-size: 75%;
	padding-bottom: 1em;
	padding-top: 1em;
	margin-left: 10%;
	list-style-type: square;
	text-transform: lowercase;
}
li {
	padding-bottom: 0.5em;
}
h2 {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 90%;
	color: #555555;
	letter-spacing: 0.15em;
	padding-bottom: .2em;
	background-color: #c0cad3;
	text-align: right;
	padding-top: .2em;
	padding-right: 1em;
}
.blockquote {
	background-color: #E7E7DE;
	margin-right: 22%;
}
caption {
	font-size: 95%;
	font-style: normal;
	font-weight: bold;
	letter-spacing: .1em;
	padding-top: 0.5em;
	padding-bottom: 0.25em;
	text-align: left;
}
table {
	font-family: Geneva, Arial, Helvetica, sans-serif;
}
.tableseparator_temp {
	font-size: 120%;
	font-weight: 400;
	background-color: #000000;
	color: #FFFFFF;
	padding: .5em;
	letter-spacing: .1em;
}
.tableseparator_rainfall {

	font-size: 120%;
	font-weight: 400;
	background-color: #000000;
	color: #FFFFFF;
	padding: .5em;
	letter-spacing: .1em;
}
.tableseparator_wind{


	font-size: 120%;
	font-weight: 400;
	background-color: #000000;
	color: #FFFFFF;
	padding: .5em;
	letter-spacing: .1em;
}
.tableseparator_pressure {



	font-size: 120%;
	font-weight: 400;
	background-color: #000000;
	color: #FFFFFF;
	padding: .5em;
	letter-spacing: .1em;
}
td {
	font-size: 100%;
	padding-top: 0.2em;
	padding-right: 0.5em;
	padding-bottom: 0.2em;
	padding-left: 0.5em;
	color: #222222;
}

.td_thumbnails {
	padding-top: 0.1em;
	padding-right: 0.2em;
	padding-bottom: 0.1em;
	padding-left: 0.0em;
}

.td_temperature_data {
	background-color: #F0F0F0;
}
.td_rainfall_data {

	background-color: #F0F0F0;
}
.td_wind_data {


	background-color: #F0F0F0;
}
.td_pressure_data {



	background-color: #F0F0F0;
}
.td_navigation_bar {
	text-align: center;
	padding-top: 1em;
	padding-bottom: 1em;
	letter-spacing: 0.2em;
	background-color: #ffffff;
}
.labels {
	font-weight: bold;
	background-position: left;
}
.site_data {
	text-align: right;
}
.colon_separator {
	font-weight: 400;
	background-position: left;
}
:Now: :Today/Yesterday:

Image

Main Station Davis VP2+ Running Via Win10 Pro.
Secondary Stations, Ecowitt HP2551/GW1000 Via rPi 3 & 4 Running Buster GUI.
:Local Inverell Ecowitt Station: :Remote Ashford Ecowitt Station:
Top
Phil23
Posts: 884
Joined: Sat 16 Jul 2016 11:59 pm
Weather Station: Davis VP2+ & GW1000 (Standalone)
Operating System: Win10 Pro / rPi Buster
Location: Australia

Re: Kindle.htmT

Post by Phil23 »

Have basically ended up with what I want.
Just simple enough to be readable on the Kindle instead of reaching for another device.
Th Kindle's Browser is pretty basic, so nothing flash.

The CSS might need a bit of cleaning up as it still has some leftovers from the original CSS I copied it from.

Anyone who thinks they might find it useful is welcome to it.
Zip file with the CSS & htmT attached below.

Cheers.
KindlePage.JPG
You do not have the required permissions to view the files attached to this post.
:Now: :Today/Yesterday:

Image

Main Station Davis VP2+ Running Via Win10 Pro.
Secondary Stations, Ecowitt HP2551/GW1000 Via rPi 3 & 4 Running Buster GUI.
:Local Inverell Ecowitt Station: :Remote Ashford Ecowitt Station:
Top
User avatar
beteljuice
Posts: 3292
Joined: Tue 09 Dec 2008 1:37 pm
Weather Station: None !
Operating System: W10 - Threadripper 16core, etc
Location: Dudley, West Midlands, UK

Re: Kindle.htmT

Post by beteljuice »

Thank you for sharing ;)
Image
......................Imagine, what you will KNOW tomorrow !
Top
Phil23
Posts: 884
Joined: Sat 16 Jul 2016 11:59 pm
Weather Station: Davis VP2+ & GW1000 (Standalone)
Operating System: Win10 Pro / rPi Buster
Location: Australia

Re: Kindle.htmT

Post by Phil23 »

Just had a really scary thought....

If I was clever & didn't know zero about PHP, It could be written in that & just grab the data from realtime.txt & display that when the page loaded.

Would mean I wouldn't need to upload it in realtime.

Don't think I'll go there.
:Now: :Today/Yesterday:

Image

Main Station Davis VP2+ Running Via Win10 Pro.
Secondary Stations, Ecowitt HP2551/GW1000 Via rPi 3 & 4 Running Buster GUI.
:Local Inverell Ecowitt Station: :Remote Ashford Ecowitt Station:
Top
User avatar
beteljuice
Posts: 3292
Joined: Tue 09 Dec 2008 1:37 pm
Weather Station: None !
Operating System: W10 - Threadripper 16core, etc
Location: Dudley, West Midlands, UK

Re: Kindle.htmT

Post by beteljuice »

Or ......

Javascript (ajax) of which there are many grab routines about (You already have at least one).
Edit: ... can the Kindle work with JS ?
Then the page would update realtime without being 'refreshed'.

.... A project for you :geek:
Image
......................Imagine, what you will KNOW tomorrow !
Top
Phil23
Posts: 884
Joined: Sat 16 Jul 2016 11:59 pm
Weather Station: Davis VP2+ & GW1000 (Standalone)
Operating System: Win10 Pro / rPi Buster
Location: Australia

Re: Kindle.htmT

Post by Phil23 »

First round of temptation got to me...

Had to go & see if http://weather.inverellit.com/banner.php displayed on the Kindle; it did...

Could try using that as a starting point, but am presuming there is a better way to go about it as banner.php essentially creates a png graphic, as opposed to putting text on a page.
:Now: :Today/Yesterday:

Image

Main Station Davis VP2+ Running Via Win10 Pro.
Secondary Stations, Ecowitt HP2551/GW1000 Via rPi 3 & 4 Running Buster GUI.
:Local Inverell Ecowitt Station: :Remote Ashford Ecowitt Station:
Top
User avatar
beteljuice
Posts: 3292
Joined: Tue 09 Dec 2008 1:37 pm
Weather Station: None !
Operating System: W10 - Threadripper 16core, etc
Location: Dudley, West Midlands, UK

Re: Kindle.htmT

Post by beteljuice »

you wrote:... as banner.php essentially creates a png graphic, as opposed to putting text on a page.
Not the friendliest or now most complete grab routine, but it will do to play with ;)

Rethink .. banner.php essentially puts text into a graphic.

... your html 'template' becomes php with the 'grab' part, then 'echo' values from grab instead of <#wbtag>.

Plenty of examples in your main site .. - do you have cu-tags.php or whatever it's called ? - you wouldn't need the grab routine because its already been done ! - just 'include' and 'echo' :geek:
Image
......................Imagine, what you will KNOW tomorrow !
Top
Phil23
Posts: 884
Joined: Sat 16 Jul 2016 11:59 pm
Weather Station: Davis VP2+ & GW1000 (Standalone)
Operating System: Win10 Pro / rPi Buster
Location: Australia

Re: Kindle.htmT

Post by Phil23 »

Current versions of both pages in relation to a cross referencing post.

http://w.inverellit.com/kindle.htm
&
http://w.inverellit.com/k.php

I know it's not ideal & it is still work in progress (particularly pressure trend IF statements).
But at least I now have 2 Kindle viewable pages I can view without getting out of bed......

Cheers

Phil.

Edit:- the PHP pages requires the Sandoval.ttf to be loaded on the website.
https://www.dafont.com/sandoval.font


kindleT.htm

Code: Select all

<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<meta name="description" content="<#location> weather data" />
<meta name="keywords" content="Cumulus, <#location> weather data, weather, data, weather station" />
<title><#location> weather</title>
<link href="kindlestyle.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="content">
<h1><a href="index.htm">Phil's Weather</a></h1>
<p><b>Forecast:</b> <#forecast></p>
<table style="width:100%;border-collapse: collapse; border-spacing: 0;" >
  <caption>Conditions at local time <#time></caption>
  <tr>
    <td colspan="4" class="tableseparator">Temperature and Humidity </td>
  </tr>
  <tr class="td_data">
    <td class="labels">Temperature</td>
    <td><#temp>&nbsp;<#tempunit></td>
    <td class="labels">Humidity</td>
    <td><#hum>%</td>
  </tr>
  <tr class="td_data">
    <td class="labels">Change/Hour</td>
    <td><#TempChangeLastHour>&nbsp;<#tempunit></td>
    <td class="labels">Dew&nbsp;Point </td>
    <td><#dew>&nbsp;<#tempunit></td>
  </tr>
  <tr class="td_data">
    <td class="labels">Minimum</td>
    <td><#tempTL>&nbsp;<#tempunit></td>
    <td class="labels">Evapotrans</td>
    <td><#ET>&nbsp;<#rainunit></td>
  </tr>
  <!-- Solar data. If you don't have a solar sensor, you may wish to delete everything from here to the next comment -->
  <tr class="td_data">
    <td class="labels">Maximum</td>
    <td><#tempTH>&nbsp;<#tempunit></td>
    <td class="labels">Solar</td>
    <td><#SolarRad>&nbsp;W/m&sup2;</td>
  </tr>
  <!-- End of solar data -->
  <tr class="td_data">
    <td class="labels">Apparent</td>
    <td><#apptemp>&nbsp;<#tempunit></td>
    <td class="labels">THW Index</td>
    <td><#THWindex></td>
  </tr>
  <tr>
    <td colspan="4" class="tableseparator">Rainfall</td>
  </tr>
  <tr class="td_data">
    <td class="labels">Rainfall&nbsp;Today</td>
    <td><#rfall>&nbsp;<#rainunit></td>
    <td class="labels">Rainfall&nbsp;Rate</td>
    <td><#rrate>&nbsp;<#rainunit>/hr</td>
  </tr>
  <tr class="td_data">
    <td class="labels">Last Hour</td>
    <td><#rhour>&nbsp;<#rainunit></td>
    <td class="labels">This&nbsp;Month</td>
    <td><#rmonth>&nbsp;<#rainunit></td>
  </tr>
  <tr class="td_data">
    <td class="labels">Since&nbsp;Midnight</td>
    <td><#rmidnight>&nbsp;<#rainunit></td>
    <td class="labels">This&nbsp;Year</td>
    <td><#ryear>&nbsp;<#rainunit></td>
  </tr>
  <tr class="td_data">
    <td class="labels">Last&nbsp;24&nbsp;Hours</td>
    <td><#r24hour>&nbsp;<#rainunit></td>
    <td></td>
    <td></td>
  </tr>

  <tr>
    <td colspan="4" class="tableseparator">Wind</td>
  </tr>
  <tr class="td_data">
    <td class="labels">Average</td>
    <td><#wspeed>&nbsp;<#windunit></td>
    <td class="labels">Hi&nbsp;Average</td>
    <td><#windTM>&nbsp;<#windunit>&nbsp;@&nbsp;<#TwindTM></td>
  </tr>
  <tr class="td_data">
    <td class="labels">Gusts</td>
    <td><#wgust>&nbsp;<#windunit></td>
    <td class="labels">Hi&nbsp;Gusts</td>
    <td><#wgustTM>&nbsp;<#windunit>&nbsp;@&nbsp;<#TwgustTM></td>
  </tr>
  <tr class="td_data">
    <td class="labels">Bearing</td>
    <td><#avgbearing>&deg; <#wdir></td>
    <td class="labels">Wind Run</td>
    <td><#windrun>&nbsp;<#windrununit></td>
  </tr>
  <tr>
    <td colspan="4" class="tableseparator">Pressure</td>
  </tr>
  <tr class="td_data">
    <td class="labels">Barometer&nbsp;</td>
    <td><#press>&nbsp;<#pressunit></td>
    <td class="labels"><#presstrend></td>
    <td><#presstrendval>&nbsp;<#pressunit>/hr</td>
  </tr>
  <tr>
  <tr>
    <td colspan="4" class="tableseparator">Sun & Moon</td>
  </tr>
</table>
<!-- Almanac -->
<table style="width:100%;border-collapse: collapse; border-spacing: 0;" >
  <tbody>
  <tr class="td_data">
    <td class="labels">Dawn:</td>
    <td class="site_data" style="text-align: left;"><#dawn></td>
    <td class="labels">Sunrise:</td>
    <td class="site_data" style="text-align: left;"><#sunrise></td>
    <td class="labels">Moonrise:</td>
    <td class="site_data" style="text-align: left;"><#moonrise></td>
  </tr>
  <tr class="td_data">
    <td class="labels">Dusk:</td>
     <td class="site_data" style="text-align: left;"><#dusk></td>
    <td class="labels">Sunset:&nbsp;</td>
    <td class="site_data" style="text-align: left;"><#sunset></td>
    <td class="labels">Moonset:</td>
    <td class="site_data" style="text-align: left;"><#moonset></td>
  </tr>
  <tr class="td_data">
    <td class="labels">Daylight:</td>
    <td class="site_data" style="text-align: left;"><#daylightlength></td>
    <td class="labels">Length:</td>
    <td class="site_data" style="text-align: left;"><#daylength></td>
    <td class="labels">Phase:</td>
    <td class="site_data" style="text-align: left;"><#moonphase></td>
  </tr>
</tbody>
</table>
<!-- END Almanac -->


</div>
</body>
</html>
PHP Version,

Code: Select all

<?php
############################################################################
# A Project of TNET Services, Inc.
############################################################################
#
#   Project:    Cumulus Project 
#   Package:    Cumulus Weather Banner
#   Module:     banner.php
#   Version:    3.0 - October 19th, 2008
#   Purpose:    Outputs a plain weather graphic based upon
#               the Cumulus realtime.txt file
#   Authors:    Kevin W. Reed <programs@tnet.com>
#               TNET Services, Inc.
#   Copyright:  (c) 1992-2008 Copyright TNET Services, Inc.
#
#   License:    
#
#   This program is free software; you can redistribute it and/or
#   modify it under the terms of the GNU General Public License
#   as published by the Free Software Foundation; either version 2
#   of the License, or (at your option) any later version.
#   
#   This program is distributed in the hope that it will be useful,
#   but WITHOUT ANY WARRANTY; without even the implied warranty of
#   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
#   GNU General Public License for more details.
#   
#   You should have received a copy of the GNU General Public License
#   along with this program; if not, write to the Free Software
#   Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA  02111-1307, 
#   USA.
#
############################################################################
#   HISTORY
############################################################################
#
#   1.0 Released Oct 4th 2008 
#       Initial Release
#
#   1.1 Released Oct 5th 2008
#       Added TTF Support
#       Added Check for Rain and if none output No Rain Today
#
#   1.2 Released Oct 5th 2008
#       Corrected ISO Date format, was missing the 20 to make the year
#       a 4 digit value.  Realtime.txt data has it as a 2 digit year
#       value.
#
#   1.3 Released Oct 6th 2008
#       Added new field $SITE['dateiso']  If yes, the date is formated
#       in ISO format (YYYY-MM-DD), else it will use a worded month
#       Date (Oct 6 2008)
#
#   1.4 Released Oct 8th 2008
#       Increased the default size of the Cumulus Version Date line to
#       make it more readable. 
#
#   2.0 Released Oct 9th 2008
#       Reconfigured to use new write functions that provide right, left
#       center to position the text more accurately
#
#   3.0 Released Oct 19th, 2008
#       Reconfigured to use extended realtime.txt format that was
#       Released with Cumulus 1.8.2 Beta.
#
############################################################################
#   This document uses Tab 4 Settings
############################################################################
$DATA   = array();
$SITE   = array();
############################################################################
# CONFIGURATION INFORMATION
############################################################################
$SITE['version']        = "3.0";
$SITE['hloc']           = "./";
$SITE['datafile']       = "realtime.txt";
$SITE['image_width']    = 1072;
$SITE['image_height']   = 1448;
#---------------------------------------------------------------------------
$SITE['fontdir']        = "fonts/";     # must contain ttf font files!
$SITE['usettf']         = "yes";        # Set to No to use default fonts
#---------------------------------------------------------------------------
$SITE['format']         = "png";        # Options: jpeg  gif  png 
$SITE['dateiso']        = "no";
$SITE['sitename']       = "Phil's Weather";
#---------------------------------------------------------------------------
// Current field names (matches tag fields) used
$SITE['cvalues'] = array(
    "date","time","temp","hum","dew","wspeed","wgust","avgbearing","rrate",
    "rfall","press","wdir","beaufort","windunit","tempunit","pressunit","rainunit",
    "windrun","presstrend","rmonth","ryear","rfallY","intemp","inhum","wchill",
    "temptrendval","tempTH","TtempTH","tempTL","TtempTL",
    "windTM","TwindTM","wgustTM","TwgustTM",
    "pressTH","TpressTH","pressTL","TpressTL",
    "cversion","cbuild");
############################################################################

############################################################################
# SOURCECODE VIEW
############################################################################
if ( isset($_REQUEST['view']) && $_REQUEST['view'] == 'sce' ) {
    $filenameReal = __FILE__;
    $download_size = filesize($filenameReal);
    header('Pragma: public');
    header('Cache-Control: private');
    header('Cache-Control: no-cache, must-revalidate');
    header("Content-type: text/plain");
    header("Accept-Ranges: bytes");
    header("Content-Length: $download_size");
    header('Connection: close');
    readfile($filenameReal);
    exit;
}
############################################################################
# Reference: Cumulus Format of realtime.txt file
############################################################################
#   Field       Pos     Example     Description
#   date        0       18/10/08    date (always dd/mm/yy)
#   time        1       16:03:45    time (always hh:mm:ss)
#   temp        2       8.4         outside temperature
#   hum         3       84          relative humidity
#   dew         4       5.8         dewpoint
#   wspeed      5       24.2        wind speed (average)
#   wgust       6       33.0        wind speed (gust)
#   avgbearing  7       261         wind bearing
#   rrate       8       0.0         current rain rate
#   rfall       9       1.0         rain today
#   press       10      999.7       barometer
#   wdir        11      W           wind direction
#   beaufort    12      6           wind speed (beaufort)
#   windunit    13      mph         wind units
#   tempunit    14      C           temperature units
#   pressunit   15      mb          pressure units
#   rainunit    16      mm          rain units
#   windrun     17      146.6       wind run (today)
#   presstrend  18      +0.1        pressure trend value
#   rmonth      19      85.2        monthly rain
#   ryear       20      588.4       yearly rain
#   rfallY      21      11.6        yesterday's rainfall
#   intemp      22      20.3        inside temperature
#   inhum       23      57          inside humidity
#   wchll       24      3.6         wind chill
#   temptrendval 25     -0.7        temperature trend value
#   tempTH      26      10.9        today's high temp
#   TtempTH     27      12:00       time of today's high temp (hh:mm)
#   tempTL      28      7.8         today's low temp
#   TtempTL     29      14:41       time of today's low temp (hh:mm)
#   windTM      30      37.4        today's high wind speed (average)
#   TwindTM     31      14:38       time of today's hi wind (avg) (hh:mm)
#   wgustTM     32      44.0        today's high wind gust
#   TwgustTM    33      14:28       time of today's high wind gust (hh:mm)
#   pressTH     34      999.8       today's high pressure
#   TpressTH    35      16:01       time of today's high pressure (hh:mm)
#   pressTL     36      998.4       today's low pressure
#   TpressTL    37      12:06       time of today's low pressure (hh:mm)
#   cversion    38      1.8.2       Cumulus version
#   cbuild      39      459         Cumulus build no
############################################################################


// Path to our font file
$font1 = $SITE['fontdir'] . "arialbd.ttf";
$font2 = $SITE['fontdir'] . "arial.ttf";
$font3 = $SITE['fontdir'] . "verdana.ttf";
$font4 = $SITE['fontdir'] . "sandoval.ttf";

// Read data into array
$DATA = get_raw($SITE['hloc'] . $SITE['datafile'],' ');

$months = array ("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug",
    "Sep","Oct","Nov","Dec");

if ( $SITE['dateiso'] == "yes" ) {
    // Fix date to use ISO formatted date
    $DATA[0] = "20" . substr($DATA[0],6,2) . '-' . substr($DATA[0],3,2) . '-' . 
        substr($DATA[0],0,2);
} else {
    // Fix date to use Month formatted date
    $DATA[0] = $months[intval(substr($DATA[0],3,2)) -1 ] . 
        " " . intval(substr($DATA[0],0,2)) . " " .
        "20" . substr($DATA[0],6,2);
}

// Fix time by removing seconds from the field
$DATA[1] = substr($DATA[1],0,5);


// Output the header to let the browser know we are
// sending a graphic file format
header("Content-type: image/" . $SITE['format'] );
$im = @imagecreatetruecolor($SITE['image_width'], $SITE['image_height'])
    or die("Cannot Initialize new GD image stream");
    
// Set colors we want to use...
// first background is a white background
$background_color   = imagecolorallocate($im, 0xE0, 0xE0, 0xE0);
$black              = imagecolorallocate($im, 0x00, 0x00, 0x00);
$white              = imagecolorallocate($im, 0xF0, 0xF0, 0xF0);
$green              = imagecolorallocate($im, 0x00, 0x40, 0x00);
$blue               = imagecolorallocate($im, 0x00, 0x00, 0xff);
$red                = imagecolorallocate($im, 0xff, 0x00, 0x00);
$lblue               = imagecolorallocate($im, 0x80, 0xE8, 0xE8);
$lgreen              = imagecolorallocate($im, 0x40, 0xFF, 0x40);

//$baseimg = imagecreatefromjpeg("background.jpg");

//imagecopy($im,$baseimg,0,0,0,0,$SITE['image_width'], $SITE['image_height']);
//imagedestroy($baseimg);

// Make a Border Around the box
ImageRectangle($im, 0, 0, $SITE['image_width'] -1 , 
    $SITE['image_height'] -1, $white);

// Print Station Name
//$text = $SITE['sitename'];

//if ($SITE['usettf'] == "yes" ) {
//    $size = 11;
//    imagettftextbox($im, $size, 0, 0, 4, $white, $font1, $text, $SITE['image_width'], "left");
//} else {
//    $size = 5;
//    imageWriteString($im, $size, $text, $white, "left", 3);
//}

// Print Time (top right corner)
$text = ret_value("time");
if ($SITE['usettf'] == "yes" ) {
    $size = 36;
    imagettftextbox($im, $size, 0, 0, 10, $white, $font1, $text, $SITE['image_width'], "right");
} else {
    $size = 2;
    imageWriteString($im, $size, $text, $white, "right", 1);
}
// Print Date (top right corner)
$text = ret_value("date");
if ($SITE['usettf'] == "yes" ) {
    $size = 36;
    imagettftextbox($im, $size, 0, 0, 10, $white, $font1, $text, $SITE['image_width'], "left");
} else {
    $size = 2;
    imageWriteString($im, $size, $text, $white, "right", 1);
}


// Print Cumulus version info
//$text = "Cumulus v" . ret_value("cversion") . ' #' . ret_value("cbuild");
//if ($SITE['usettf'] == "yes" ) {
//    $size = 6;
//    imagettftextbox($im, $size, 0, 0, 14, $white, $font3, $text, $SITE['image_width'], "right");
//} else {
//    $size = 2;
//    imageWriteString($im, $size, $text, $white, "right", 11);
//}

// Print Temp
$text = ret_value("temp") . ret_value("tempunit");
//$text = ret_value("temp") . '°' . ret_value("tempunit");
//$text = ret_value("temp") . '&#176;' . ret_value("tempunit");
if ($SITE['usettf'] == "yes" ) {
    $size = 180;
    imagettftextbox($im, $size, 0, 0, 150, $red, $font4, $text, $SITE['image_width'], "center");
} else {
    $size = 5;
    imageWriteString($im, $size, $text, $red, "center", 23);
}

// Print Humitidy Centered
$text = "Humidity. " . ret_value("hum") . "%";
if ($SITE['usettf'] == "yes" ) {
    $size = 64;
    imagettftextbox($im, $size, 0, 0, 350, $lgreen, $font4, $text, $SITE['image_width'], "center");
} else {
    $size = 3;
    imageWriteString($im, $size, $text, $white, "center", 40);
}

// Print Dewpoint Centered
$text = "Dew Point. " . ret_value("dew") . ret_value("tempunit");
if ($SITE['usettf'] == "yes" ) {
    $size = 64;
    imagettftextbox($im, $size, 0, 0, 450, $lgreen, $font4, $text, $SITE['image_width'], "center");
} else {
    $size = 3;
    imageWriteString($im, $size, $text, $white, "center", 40);
}

// Print windspeed
$text = "Wind: " . ret_value("wdir") . " @ " . ret_value("wspeed") . ret_value("windunit");
if ($SITE['usettf'] == "yes" ) {
    $size = 48;
    imagettftextbox($im, $size, 0, 0, 650, $lblue, $font1, $text, $SITE['image_width'], "center");
} else {
    $size = 5;
    imageWriteString($im, $size, $text, $white, "left", 23);
}


// Print Wind gust
$text = "Gust: " . ret_value("wgust") . ret_value("windunit");
if ($SITE['usettf'] == "yes" ) {
    $size = 48;
    imagettftextbox($im, $size, 0, 0, 730, $lblue, $font1, $text, $SITE['image_width'], "center");
} else {
    $size = 2;
    imageWriteString($im, $size, $text, $white, "left", 39);
}

// Print Baro
$text = "Barometer: " . ret_value("press") . ' ' . ret_value("pressunit");
if ($SITE['usettf'] == "yes" ) {
    $size = 48;
    imagettftextbox($im, $size, 0, 0, 850, $white, $font1, $text, $SITE['image_width'], "center");
} else {
    $size = 2;
    imageWriteString($im, $size, $text, $white, "right", 39);
}

// Print Baro Change
$text = "Change: " . ret_value("presstrend") . ' ' . ret_value("pressunit") . '/hour';
if ($SITE['usettf'] == "yes" ) {
    $size = 48;
    imagettftextbox($im, $size, 0, 0, 900, $white, $font1, $text, $SITE['image_width'], "center");
} else {
    $size = 2;
    imageWriteString($im, $size, $text, $white, "right", 39);
}
// Print Baro Trend
if (ret_value("presstrend") > "0.00" ) {
    $text = "Rising";
    $py = 22;
} elseif (ret_value("presstrend") < "-2.00" ) {
    $text = "Falling More than -2.00";
    $py = 25;

} elseif (ret_value("presstrend") < "-1.20" ) {
    $text = "Falling More than -1.20";
    $py = 25;

} elseif (ret_value("presstrend") < "-0.53" ) {
    $text = "Falling More than -0.53";
    $py = 250;
}
  else {
    $text = "Other";
    $py = 25;
}
if ($SITE['usettf'] == "yes" ) {
    $size = 48;
    imagettftextbox($im, $size, 0, 0, 980, $white, $font1, $text, $SITE['image_width'], "center");
} else {
    $size = 5;
    imageWriteString($im, $size, $text, $white, "right", 23);
}

// Print Rain
if (ret_value("rfall") == "0.00" ) {
    $text = "No Rain Today";
    $py = 22;
} else {
    $text = "   Rain: " . ret_value("rfall") . ' ' . ret_value("rainunit");
    $py = 25;
}
if ($SITE['usettf'] == "yes" ) {
    $size = 48;
    imagettftextbox($im, $size, 0, 0, 1050, $white, $font1, $text, $SITE['image_width'], "center");
} else {
    $size = 5;
    imageWriteString($im, $size, $text, $white, "right", 23);
}
// Print Rain Rate
if (ret_value("rrate") == "0.00" ) {
    $text = "Rain Rate Nil";
    $py = 22;
} else {
    $text = "   Rain Rate: " . ret_value("rrate") . ' ' . ret_value("rainunit") . '/hour ';
    $py = 25;
}
if ($SITE['usettf'] == "yes" ) {
    $size = 48;
    imagettftextbox($im, $size, 0, 0, 1130, $white, $font1, $text, $SITE['image_width'], "center");
} else {
    $size = 5;
    imageWriteString($im, $size, $text, $white, "right", 23);
}




// Output the image in the format we are
// setup.

if ($SITE['format'] == "png" ) {
    imagepng($im);
}

if ($SITE['format'] == "jpeg" ) {
    imagejpeg($im); 
}

if ($SITE['format'] == "gif" ) {
    imagegif($im);  
}

// We be done... destroy the image
imagedestroy($im);

exit;

############################################################################
# FUNCTIONS
############################################################################

// Function to read the data file with the
// Delimiter provided

function get_raw( $rawfile , $del ) {
    $rawdata = array();
    $fd = fopen( $rawfile, "r" );
    if ( $fd ) {
        $rawinfo = '';
        while (! feof ( $fd ) ) {
            $rawinfo .= fread( $fd, 8192 );
        }
        fclose($fd);
        $rawdata = explode ( $del, $rawinfo );
    } else {
        $rawdata[0]= -9999;
    }
    return $rawdata;
}


// function outputs a string centered in the image
function center_text ( $image, $size, $string, $y, $color) {
    $px = ((imagesx($image)/2) - ( ImageFontWidth($size) * 
    strlen($string) ) / 2);
    imagestring($image, $size, $px, $y,$string, $color);
}


// Function snarfed off of a PHP forum.  User sk89q

function imagettftextbox(&$image, $size, $angle, $left, $top, $color, 
    $font, $text, $max_width, $align)
{
        $text_lines = explode("\n", $text); // Supports line breaks!
       
        $lines = array();
        $line_widths = array();
       
        $largest_line_height = 0;
       
        foreach($text_lines as $block)
        {
            $current_line = ''; // Reset current line
           
            $words = explode(' ', $block); // Split the text array of single words
           
            $first_word = TRUE;
           
            $last_width = 0;
           
            for($i = 0; $i < count($words); $i++)
            {
                $item = $words[$i];
                $dimensions = imagettfbbox($size, $angle, $font, 
                    $current_line . ($first_word ? '' : ' ') . $item);
                $line_width = $dimensions[2] - $dimensions[0];
                $line_height = $dimensions[1] - $dimensions[7];
               
                if($line_height > $largest_line_height) 
                    $largest_line_height = $line_height;
               
                if($line_width > $max_width && !$first_word)
                {
                    $lines[] = $current_line;
                   
                    $line_widths[] = $last_width ? $last_width : $line_width;
                   
                    /*if($i == count($words))
                    {
                        continue;
                    }*/
                   
                    $current_line = $item;
                }
                else
                {
                    $current_line .= ($first_word ? '' : ' ') . $item;
                }
               
                if($i == count($words) - 1)
                {
                    $lines[] = $current_line;
                   
                    $line_widths[] = $line_width;
                }
               
                $last_width = $line_width;
                   
                $first_word = FALSE;
            }
           
            if($current_line)
            {
                $current_line = $item;
            }
        }
       
        $i = 0;
        foreach($lines as $line)
        {
            if($align == "center")
            {
                $left_offset = ($max_width - $line_widths[$i]) / 2;
            }
            elseif($align == "right")
            {
                $left_offset = ($max_width - $line_widths[$i] - 6);
            }
            if ($align == "left") {
                $left_offset = 5;
            }
            imagettftext($image, $size, $angle, $left + $left_offset, 
                $top + $largest_line_height + ($largest_line_height * $i), 
                $color, $font, $line);
            $i++;
        }
       
        return $largest_line_height * count($lines);
}

// Similar function for use with standard GD fonts.

function imageWriteString(&$img, $font, $text, $color, $position_x = 'center', $position_y = 'center') {
    // initialize internal variables
    $x = null;
    $y = null;

    if($font < 0 || $font > 5){ $font = 0; }
    $num = array(array(4.6, 6),
                 array(4.6, 6),
                 array(5.6, 12),
                 array(6.5, 12),
                 array(7.6, 16),
                 array(8.5, 16));

    $width = ceil(strlen($text) * $num[$font][0]);
    $height = $num[$font][1] + 2;

    // handle position x
    if (is_string($position_x)) {
        switch($position_x) {
            case 'left':
                $position_x = 5;
                break;
            case 'right':
                $position_x = -8;
                break;
            default:
            case 'center':
                $x     = (imagesx($img) - $width - 8) / 2;
                break;
        }
    }
    if (!isset($x)) {
        if(is_numeric($position_x)) {
            if ($position_x >= 0) {
                $x = $position_x; // left
            } else {
                $x = imagesx($img) - $width + $position_x - 8; // right
            }
        } else {
            $x     = (imagesx($img) - $width - 8) / 2; // default / error value: center
        }
    }

    // handle position y
    if (is_string($position_y)) {
        switch($position_y) {
            case 'top':
                $position_y = 5;
                break;
            case 'bottom':
                $position_y = -5;
                break;
            default:
            case 'center':
                $y     = (Imagesy($img) - ($num[$font][1] + 2))/2;
                break;
        }
    }
    if (!isset($y)) {
        if (is_numeric($position_y)) {
            if ($position_y >= 0) {
                $y = $position_y; // top
            } else {
                $y = Imagesy($img) - $height + $position_y; // bottom
            }
        } else {
            $y     = (Imagesy($img) - ($num[$font][1] + 2))/2; // default / error value: center
        }
    }
    imagestring($img, $font, $x, $y, $text, $color);
}

function ret_value($lookup) {
    global $SITE, $DATA;
    
    $rtn = array_search  ( $lookup  , $SITE['cvalues'] );
    
    if ($rtn !== FALSE) {
        return( $DATA[$rtn] );
    } else {
        return("-");
    }
}

############################################################################
# END OF MODULES
############################################################################
:Now: :Today/Yesterday:

Image

Main Station Davis VP2+ Running Via Win10 Pro.
Secondary Stations, Ecowitt HP2551/GW1000 Via rPi 3 & 4 Running Buster GUI.
:Local Inverell Ecowitt Station: :Remote Ashford Ecowitt Station:
Top
Phil23
Posts: 884
Joined: Sat 16 Jul 2016 11:59 pm
Weather Station: Davis VP2+ & GW1000 (Standalone)
Operating System: Win10 Pro / rPi Buster
Location: Australia

Vertical Positioning in PHP code.

Post by Phil23 »

Could someone please explain why vertical positioning of the line with "Change" in it moves up when I shorten that line of text?
Seems like 2 characters is the breaking point.

It's just based on the Banner.php code & is generally working, but this positional thing is a mystery to me & testing sanity.

This is the code snippet, & only thing I see related is the ["image_width'] bit.
Starts at line 318 in the full code attached.

Code: Select all

// Print Baro Change
//$text = "Change: " . ret_value("presstrend") . ' ' . ret_value("pressunit") . '/hour';
$text = "Change: " . ret_value("presstrend") . ' ' . ret_value("pressunit") . '/hour';
if ($SITE['usettf'] == "yes" ) {
    $size = 48;
    imagettftextbox($im, $size, 0, 0, 900, $white, $font1, $text, $SITE['image_width'], "center");
Thanks

Phil.
K1.jpg
K2.jpg
You do not have the required permissions to view the files attached to this post.
:Now: :Today/Yesterday:

Image

Main Station Davis VP2+ Running Via Win10 Pro.
Secondary Stations, Ecowitt HP2551/GW1000 Via rPi 3 & 4 Running Buster GUI.
:Local Inverell Ecowitt Station: :Remote Ashford Ecowitt Station:
Top
Post Reply

Return to “Cumulus MX Current (releases since b3043)”