Page 1 of 1
How to get a WebGadget to load a font resource?
Posted: Sat Dec 28, 2013 3:48 am
by Mistrel
On Windows, I'm having a lot of trouble getting a web gadget to load a font resource. This is more a problem with Internet Explorer than PureBasic itself, however PB is inheriting this problem by design.
My css is:
Code: Select all
@font-face {
font-family:AFont;
src:url(file://c:/testfont.ttf);
}
html,body {
font-family:AFont;
font-size:12pt;
}
Also tried:
I also tried loading the font as an application resource with AddFontMemResourceEx() so that I could refer to it locally:
All of the non-local css examples are confirmed to work with Chrome but do not work with Internet Explorer. How can I reference a font resource in a web gadget which is not available on the system?
Re: How to get a WebGadget to load a font resource?
Posted: Sat Dec 28, 2013 5:38 am
by Mistrel
The following works but only if the font is installed on the system:
However, this means that the application will need to be installed and most likely invoke administrator permission to do so.
Still looking for a user mode solution.
Re: How to get a WebGadget to load a font resource?
Posted: Sat Dec 28, 2013 6:00 am
by Mistrel
Mystery solved.
When running the embedded web gadget of Windows 7, the web control is derived from IE 8. Font formats .ttf and .otf are unsupported. As of IE9, .woff is supported, but even after installing IE9 or higher, the embedded control still uses the old renderer; at least PureBasic does.
However, IE8 and earlier support Embedded OpenType (.eot) and this DOES work when loaded from disk! This is described on MSDN for the "@font-face rule":
http://msdn.microsoft.com/en-us/library ... s.85).aspx
This feature enables you to use specific fonts that might not be available on your local system. In Internet Explorer 8 and earlier, the URL must point to an Embedded OpenType (EOT) file (.eot or .ote format). No other font formats are supported.
Re: How to get a WebGadget to load a font resource?
Posted: Sat Dec 28, 2013 8:18 am
by IdeasVacuum
Well, given that EOT has already been superseded by WOFF, and that EOT is limited to IE, it's probably easier to distribute the ttf, given that installation of a font is trivial anyway.
Re: How to get a WebGadget to load a font resource?
Posted: Sat Dec 28, 2013 8:53 am
by Shield
Just register the TTF file on program startup as a font (AddFontResourceEx_()).
I didn't test it, but I think it should work.
-> To refer to it, it should be enough to just write the name.
Do note that the name might differ from the filename, this might be why your attempt didn't work.
Re: How to get a WebGadget to load a font resource?
Posted: Mon Dec 30, 2013 3:15 pm
by Mistrel
Shield wrote:Just register the TTF file on program startup as a font (AddFontResourceEx_()).
I didn't test it, but I think it should work.

I mentioned this in my post. I used AddFontMemResourceEx_() which is the same thing. I can confirm that the font loads by using it in an editor gadget but it does NOT work with the web gadget. I thought the same thing. It SHOULD work! But it does not.
IdeasVacuum wrote:Well, given that EOT has already been superseded by WOFF, and that EOT is limited to IE, it's probably easier to distribute the ttf, given that installation of a font is trivial anyway.
You might think so but then the application is not guaranteed to run as expected if the user does not have permission to install system-wide fonts. This is what AddFontResourceEx and AddFontMemResourceEx are for. Unfortunately, they do not appear to work with an IE ActiveX control.
Re: How to get a WebGadget to load a font resource?
Posted: Mon Dec 30, 2013 4:07 pm
by Shield
It works perfectly fine:
Code: Select all
EnableExplicit
Define filename.s = "Romanesco-Regular.ttf"
Define fontname.s = "Romanesco"
AddFontResource_(filename)
OpenWindow(0, 0, 0, 400, 400, "")
WebGadget(0, 0, 0, 400, 400, "")
SetGadgetItemText(0, #PB_Web_HtmlCode, "<html><head><style>#foobar{font-size: 32pt; font-family:'" + fontname + "';}</style></head><body><div id='foobar'>Hello World</body></html>")
Repeat
If WaitWindowEvent() = #PB_Event_CloseWindow
Break
EndIf
ForEver
RemoveFontResource_(filename)
Re: How to get a WebGadget to load a font resource?
Posted: Mon Dec 30, 2013 5:49 pm
by naw
You can use Google fonts if your App is internet connected:
<HEAD>
<LINK HREF='
http://fonts.googleapis.com/css?family=Poller+One' REL='stylesheet' TYPE='text/css'>
<STYLE>
BODY { font-family: 'Poller One'; }
</STYLE>
</HEAD>
<BODY>
<H1> Test </H1>
</BODY>
Re: How to get a WebGadget to load a font resource?
Posted: Mon Dec 30, 2013 11:25 pm
by Mohawk70
cover more browsers
@font-face
{
font-family: 'MyFont';
src: url('myfont.eot'); /* IE9 Compatible */
src: url('myfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('myfont.woff') format('woff'), /* Modern Browsers */
url('myfont.ttf') format('truetype'), /* Safari, Android, iOS */
url('myfont.svg#svgFontName') format('svg'); /* Legacy iOS */
}