Welcome to the Cumulus Support forum.

Latest Cumulus MX release v3.0.0 build 3050 - 1 May 2019.
Legacy Cumulus 1 release v1.9.4 (build 1099) - 28 November 2014

See the Wiki for downloading either version.

Kindle.htmT

Discussion of version 3 of Cumulus, which runs on Windows, Linux, and OS X. All Cumulus MX queries in here, please.

Moderator: mcrossley

Post Reply
Phil23
Posts: 192
Joined: Sat 16 Jul 2016 11:59 pm
Weather Station: Davis Vantage Pro2 Plus
Operating System: Win7 Pro
Location: Australia

Kindle.htmT

Post by Phil23 » Mon 15 Jul 2019 10:29 pm

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.
Image

Phil23
Posts: 192
Joined: Sat 16 Jul 2016 11:59 pm
Weather Station: Davis Vantage Pro2 Plus
Operating System: Win7 Pro
Location: Australia

Re: Kindle.htmT

Post by Phil23 » Tue 16 Jul 2019 12:11 am

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;
}

Image

Phil23
Posts: 192
Joined: Sat 16 Jul 2016 11:59 pm
Weather Station: Davis Vantage Pro2 Plus
Operating System: Win7 Pro
Location: Australia

Re: Kindle.htmT

Post by Phil23 » Tue 16 Jul 2019 10:05 pm

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.
Image

User avatar
beteljuice
Posts: 2710
Joined: Tue 09 Dec 2008 1:37 pm
Weather Station: None !
Operating System: ex XP SP3 - now W10 laptop grr
Location: Dudley, West Midlands, UK

Re: Kindle.htmT

Post by beteljuice » Tue 16 Jul 2019 10:28 pm

Thank you for sharing ;)
Image
......................Imagine, what you will KNOW tomorrow !

Phil23
Posts: 192
Joined: Sat 16 Jul 2016 11:59 pm
Weather Station: Davis Vantage Pro2 Plus
Operating System: Win7 Pro
Location: Australia

Re: Kindle.htmT

Post by Phil23 » Tue 30 Jul 2019 9:13 pm

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.
Image

User avatar
beteljuice
Posts: 2710
Joined: Tue 09 Dec 2008 1:37 pm
Weather Station: None !
Operating System: ex XP SP3 - now W10 laptop grr
Location: Dudley, West Midlands, UK

Re: Kindle.htmT

Post by beteljuice » Tue 30 Jul 2019 9:23 pm

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 !

Phil23
Posts: 192
Joined: Sat 16 Jul 2016 11:59 pm
Weather Station: Davis Vantage Pro2 Plus
Operating System: Win7 Pro
Location: Australia

Re: Kindle.htmT

Post by Phil23 » Wed 31 Jul 2019 4:05 am

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.
Image

User avatar
beteljuice
Posts: 2710
Joined: Tue 09 Dec 2008 1:37 pm
Weather Station: None !
Operating System: ex XP SP3 - now W10 laptop grr
Location: Dudley, West Midlands, UK

Re: Kindle.htmT

Post by beteljuice » Wed 31 Jul 2019 2:44 pm

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 !

Post Reply