Skip to content

Load Daniel font before rendering, provide default styling using inline css #128

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 9 commits into from

Conversation

StefRave
Copy link
Contributor

right after the theme is loaded and before diagram.drawSvg

  • Added support in snap theme to specify div name (compatible to Raphaël theme)
  • Fix Raphaël and Snap detection
  • Fixed unit test run

…after

the theme is loaded and before diagram.drawSvg
* Added support in snap theme to specify div name (compatible to Raphaël theme)
* Fix Raphaël and Snap detection
* Fixed unit test run
@@ -23,6 +23,7 @@
* License information:
* http://creativecommons.org/licenses/by-nd/3.0/
*/
if (typeof Raphael !== "undefined") {
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks, I was being lazy :)

@StefRave
Copy link
Contributor Author

I thought my in my first commit, the rendering of SVG was performed when the font was loaded. Only I forgot that I added the Font to the windows font store. This caused the Daniel font to load quickly on my PC.
The current solution adds an invisible div tag to the DOM. On the window.load event, the font will have been loaded. This will probably also mean that WebFontLoader is probably not needed anymore. I will check that some other time.

The current version uses an embedded stylesheet, which is possible to be overridden in the web page. What do you think of this solution?

The current solution still needs: <style type="text/css">@font-face { font-family: 'Daniel'; font-style: normal; font-weight: normal; src: local('Daniel'), url('../fonts/daniel/daniel.otf') format('opentype'); } </style> in the html page.

  • We could embed this also in the embedded SGV stylesheet, but it will be a problem with the url.
  • We could embed the complete font in base64 in the embedded stylesheet (like http://blog.patdavid.net/2012/08/embedding-fonts-with-css-and-base64.html). This is the only solution which completely backwards compatible, but will blow up the SVG. However, the Raphaël SVG "hand" files where also huge, because each letter was rendered using path.

What do you think is the way to go?

@StefRave StefRave changed the title Moved WebFont.load to theme-snap.js so the font will be loaded Load Daniel font before rendering, provide default styling using inline css Aug 30, 2015
@StefRave
Copy link
Contributor Author

Closed, because font rendering is supported in version 2

@StefRave StefRave closed this Dec 27, 2016
@StefRave StefRave deleted the bramp/svg branch December 27, 2016 15:05
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants