CSS reset

In my Web Developer Bootcamp 2021 course I follow on Udemy, this CSS reset code by Eric A. Meyer was used. It is meant to give your CSS styling a common starting ground, preventing each browser from applying their own styling to your carefully designed page..

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

Outlook.Application

Using the Outlook.Application object to read e-mails from Visual Foxpro.

Trying to read e-mail using POP3 or IMAP proved to be hell to me. Documentation is not present or hardly legible. Because we use Microsoft® Outlook® at our company, I was able to connect to Outlook using the Outlook.Application object.

This simple code finds all mails in a certain folder (loTelecomMap):

loOutlook = CREATEOBJECT("Outlook.application")
loMAPI = loOutlook.GetNameSpace("MAPI")
loTelecomMap = loMAPI.GetDefaultFolder(6).Folders([Business]).folders([Telecom])
loMails = loTelecomMap.Items
loMessage = loMails.Find("[Subject]='Mail subject title'") && starts with the last (newest) message
DO WHILE NOT ISNULL(loMessage)
 ldDate = TTOD(loMessage.ReceivedTime)
 lcMessage = loMessage.Body
 lcHTMLsource = loMessage.HTMLbody
 * More actions on the loMessage object
 loMessage = loMails.FindNext() && Next message
ENDDO
RELEASE loOutlook

I had great help using a whitepaper by Andrew MacNeill. Linking to his page is prohibited, so you have to copy-and-paste the URL yourself: http://www.aksel.com/whitepapers/OutlookAutomation.htm. To accommodate for possible closing of that reference, I have included the pages contents (the whitepaper) in PDF form on this page.

Read from Excel using MS ODBC

If you just want to read the contents of an Excel spreadsheet, there is an easier way using the Microsoft Excel (ODBC) Driver.

In a previous post (Foxpro and Excel) we have shown how to control Excel using the Excel.Application object. But if you are just interested in the contents, there is an even easier way to achieve this: The Microsoft Excel (ODBC) driver. that is present on most systems with MS Office installed.

Source: Importing data from a Microsoft Excel 2007 workbook using Visual FoxPro 9.0 (Microsoft Support)

To get an SQL connection to an Excel sheet is no more difficult than this:

lcXLfile = [c:\temp\demo.xlsx]

* Warning: The driver wil never fail! 
* If the file does not exist, this driver wil create the file.
IF !FILE(lcXLfile)
 ? [Excel file not found]
 RETURN .F.
ENDIF

lcConnection = [DRIVER={Microsoft Excel Driver (*.xls, *.xlsx, *.xlsm, *.xlsb)};DBQ=]+lcXLfile
lnHandle = SQLSTRINGCONNECT(lcConnection)
* Get all sheetnames in a cursor (every sheet is a Table)
? SQLTABLES(lnHandle,[],[crSheets])
lcQuery = [SELECT * FROM ]+TRIM(STRTRAN(crSheets.Table_Name,['],["]))
? SQLEXEC(lnHandle, lcQuery, [crResults])
SQLDISCONNECT(lnHandle)

The SQLTABLES command creates a cursor with a row for each sheet in the Excel file. You can filter the kind of tables in the second parameter. This is a typical row:

Field name Field type Length Example
TABLE_CAT Memo 4 C:\TEMP\DEMO.XLSX
TABLE_SCHEM Character 128 .NULL.
TABLE_NAME Character 128 ‘Sheet1$’
TABLE_TYPE Character 128 TABLE
REMARKS Character 254 .NULL.
SQLTABLES structure

Remarks

Quotes in the SQLTABLES result

The TABLE_NAME field contains single quotes, These seem not to work in a SQL statement. So you have to replace them with double quotes. Check out the lcQuery line in the code above..

Field names in queries

Only when a sheet is properly filled the field names in queries are automatically named correctly: The titles in the first row are accepted as fieldnames. However, if the first row is left blank or there are multiple tables on a page, the result becomes erratic.. In this situation some or all fields get the title F1. and so on (number being the column number).

Field types

It seems the unaltered query results deliver just 2 kinds of columns: Numbers and Memo’s. Both columns may contain .NULL. values.

Quotes in query’s

To compare or use strings in SQL query’s, you need to use the single quotes again. For instance:

lcQuery = [SELECT * FROM "Sheet1$" WHERE surname='de Graaf']
SQLEXEC(lnHandle,lcQuery,[crDeGraaf])

Double complex because the sheet (table) name has to be encapsulated in double quotes, while a compare string has to be encapsulated in single quotes.. I can’t think of a reason for this odd behavior.

Read only

As to be expected, this ODBC method to an Excel file is limited to reading the file. Trying to insert or update using SQL commands renders the result that the query has to be updatable.

Weer API raadplegen

Voor sommige doeleinden is het handig om de weergegevens/ het weerbericht te kunnen gebruiken. De KNMI heeft een API, maar de documentatie is werkelijk onnavolgbaar.

Veel eenvoudiger is het raadplegen via weerlive.nl. Zij maken de KNMI weer API echt makkelijk.

Weerlive.nl is een doorgeefluik! Ik heb gemerkt dat de ingevoerde login gegevens ook werken op OpenWeatherMap.org. En aangezien ik liever de werkelijke bron gebruik zal ik deze hier uitleggen:

Jasper, 2021.02.03

OpenWeatherMap.org

Hier kan je van 200.000 steden op de wereld gratis weergegevens ophalen. Lees hoe het werkt (in het Engels) op https://openweathermap.org/appid#signup. Je kan je gratis registreren en je kan vervolgens meerdere API keys maken waarmee je gegevens kan ophalen. Let wel: er is een quotum, en er wordt geadviseerd om per locatie maximaal elke 10 minuten de gegevens op te vragen. De query is eenvoudig opgebouwd, maar je hebt wel 2 parameters meer nodig dan bij Weerlive.nl omdat het een globaal systeem is. De uiteindelijke URL ziet er bijvoorbeeld als volgt uit:

https://api.openweathermap.org/data/2.5/weather?q=Purmerend&appid=<api-key>&units=metric&lang=nl

Waarbij je <api=key> natuurlijk vervangt met je eigen API key.

Je kan je eigen API keys raadplegen en hernoemen op de Members pagina. Met units=metric zorg je ervoor dat de waarden metrisch worden weergegeven. Dus in graden celcius en meters. En de lang=nl zorgt ervoor dat de teksten in het Nederlands zijn.

De gegevensset in JSON ziet er als volgt uit:

{"coord":{"lon":4.9597,"lat":52.505},"weather":[{"id":803,"main":"Clouds","description":"half bewolkt","icon":"04n"}],"base":"stations","main":{"temp":8.99,"feels_like":8.15,"temp_min":8.33,"temp_max":9.44,"pressure":994,"humidity":92},"visibility":10000,"wind":{"speed":0.45,"deg":19,"gust":3.13},"clouds":{"all":78},"dt":1612332120,"sys":{"type":3,"id":2009151,"country":"NL","sunrise":1612336707,"sunset":1612369769},"timezone":3600,"id":2748413,"name":"Purmerend","cod":200}

Overigens beperkt de taal instelling zich puur tot de weather.description.

Weerlive.nl

De uitleg staat op de KNMI Weer API pagina. Het komt er simpelweg op neer dat je:

  1. Een gratis API key aanvraagt op deze pagina. Je vult een paar gegevens in, en je hebt meteen je API key in je e-mail zitten.
  2. Vraag de gegevens op in JSON formaat. Bijvoorbeeld https://weerlive.nl/api/json-data-10min.php?key=demo&locatie=52.0910879,5.1124231 geeft het liveweer in Utrecht. Met je eigen API key kan je 300 dataverzoeken per dag doen. Bijvoorbeeld in de vorm van https://weerlive.nl/api/json-data-10min.php?key=<APIkey>&locatie=Purmerend.
  3. Verwerk de JSON gegevens. Op de Parameters tab op de KNMI Weer API pagina zie je wat de gegevens betekenen.

Voorbeeld van een opgevraagde dataset:

{ "liveweer": [{"plaats": "Purmerend", "temp": "3.8", "gtemp": "1", "samenv": "Geheel bewolkt", "lv": "100", "windr": "ZO", "windms": "3", "winds": "2", "windk": "5.8", "windkmh": "10.8", "luchtd": " 996.5", "ldmmhg": "747", "dauwp": "3", "zicht": "8", "verw": "Bewolkt en regenachtig", "sup": "08:17", "sunder": "17:30", "image": "wolkennacht", "d0weer": "bewolkt", "d0tmax": "8", "d0tmin": "0", "d0windk": "2", "d0windknp": "6", "d0windms": "3", "d0windkmh": "11", "d0windr": "ZO", "d0neerslag": "21", "d0zon": "0", "d1weer": "regen", "d1tmax": "12", "d1tmin": "7", "d1windk": "3", "d1windknp": "8", "d1windms": "4", "d1windkmh": "15", "d1windr": "VAR", "d1neerslag": "100", "d1zon": "10", "d2weer": "halfbewolkt_regen", "d2tmax": "10", "d2tmin": "6", "d2windk": "2", "d2windknp": "6", "d2windms": "3", "d2windkmh": "11", "d2windr": "ZW", "d2neerslag": "50", "d2zon": "20", "alarm": "0"}]}

CSS Fonts

CSS Font Stack

“A complete collection of web safe CSS font stacks.”

Says Dan from Dan’s Tools

Usefull overview what fonts are available on Windows and Mac systems.

https://www.cssfontstack.com/

Web-Fonts

When you want to be certain the font looks the same on all operating systems and browsers:

https://fonts.google.com/

https://www.cssfontstack.com/Web-Fonts

To include the Actor font in your webpage:

<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Actor" />

Then use the font in your Css stylesheet:

p { font-family: Actor; font-size: 14px; font-style: normal; font-variant: normal; font-weight: 400; line-height: 20px; }

Due to the Golden Ratio displayed on https://www.cssfontstack.com/Actor .

The Web Developer Bootcamp 2021

In january 2021, I enrolled in this Udemy course. This one handles all you need for HTML, CSS and JavaScript.

“The only course you need to learn web development – HTML, CSS, JS, Node, and More!”

(Course subtitle)

It isn’t free, but it’s worth my investment. A lot is just a reminder of what I already know, but there is also a lot that is new to me and certainly improves my skills.

  • 63 hours on-demand video
  • 47 articles
  • 122 sources
  • 62 coding excercises
  • lifetime access
  • certificate of completion

Check out the introduction video below, or visit the course on Udemy.