Code: Select all
@font-face {
font-family: 'Zector';
src: url('Zector.woff2') format('woff2'),
url('Zector.woff') format('woff'),
url('Zector.ttf') format('truetype');
}
Code: Select all
; TEST LOAD GLOBAL FONT =======================================================================================
EnableJS
if ('FontFace' in window) {
var font = new FontFace('Zector', 'url(./resources/Fonts/Zector.ttf)');
font.load().then(function(loadedFont) {
document.fonts.add(loadedFont);
// Make a global style
var style = document.createElement('style');
style.textContent = `
* {
font-family: 'Zector', sans-serif;
}
`;
document.head.appendChild(style);
console.log('Font applied to whole document.');
}).catch(function(error) {
console.error('Error loading font:', error.message || error);
});
} else {
console.error('FontFace not compatible with this environment.');
}
DisableJS;
; TEST LOAD FONT =======================================================================================
If OpenWindow(0, 0, 0, 270, 190, "TextGadget", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)
TextGadget(0, 10, 10, 250, 20, "TextGadget Standard (Left)")
TextGadget(1, 10, 70, 250, 20, "TextGadget Center", #PB_Text_Center)
TextGadget(2, 10, 40, 250, 20, "TextGadget Right", #PB_Text_Right)
TextGadget(3, 10, 100, 250, 20, "TextGadget Border", #PB_Text_Border)
TextGadget(4, 10, 130, 250, 20, "TextGadget Center + Border", #PB_Text_Center | #PB_Text_Border)
TextGadget(5, 10, 160, 250, 20, "<b>Bold</b> TextGadget") ; Using HTML markup
EndIf
Code: Select all
If OpenWindow(0, 0, 0, 270, 190, "TextGadget", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)
Define textwithfont=TextGadget(0, 10, 10, 250, 20, "TextGadget Standard (Left)")
TextGadget(1, 10, 70, 250, 20, "TextGadget Center", #PB_Text_Center)
TextGadget(2, 10, 40, 250, 20, "TextGadget Right", #PB_Text_Right)
TextGadget(3, 10, 100, 250, 20, "TextGadget Border", #PB_Text_Border)
TextGadget(4, 10, 130, 250, 20, "TextGadget Center + Border", #PB_Text_Center | #PB_Text_Border)
TextGadget(5, 10, 160, 250, 20, "<b>Bold</b> TextGadget") ; Using HTML markup
EnableJS
var font = new FontFace('Zector', 'url(./resources/Fonts/Zector.ttf)');
font.load().then(function(loadedFont) {
document.fonts.add(loadedFont);
$(v_textwithfont.gadget).css('font-family', 'Zector, sans-serif');
}).catch(function(error) {
spider.debug.Print('Error loading the font:'+error.message+' '+error);
})
DisableJS;
EndIf
Code: Select all
Procedure.i LoadFontZector(gadget_id.i);<- would be nice to have the font family and path as parameters
!var font = new FontFace('Zector','url(./font/Zector.ttf)');
!font.load().then(function(loadedFont) {
!document.fonts.add(loadedFont);
!$(v_gadget_id.gadget).css('font-family','Zector, sans-serif');
!}).catch(function(error) {
!return 0;
!})
ProcedureReturn LoadFont(#PB_Any,"Zector",12,#PB_Font_HighQuality)
EndProcedure
Code: Select all
Procedure.i LoadCustomFont(gadget_id=#PB_Any,FFamily.s="Arial", FPath.s="", FSize=10);<- would be nice to have the font family and path as parameters
!var font = new FontFace(v_ffamily,'url(v_fpath)');
!font.load().then(function(loadedFont) {
!document.fonts.add(loadedFont);
!$(v_gadget_id.gadget).css('font-family',v_ffamily+', sans-serif');
!}).catch(function(error) {
!return 0;
!})
ProcedureReturn LoadFont(gadget_id,FFamily,FSize,#PB_Font_HighQuality)
EndProcedure