Merge pull request #2294 from vogdb/issue-2294

Integrate Webfontloader
cargomedia · Aug 23, 2016 · 34e993b · 34e993b
2 parents 2a4a66d + 976d21f
commit 34e993b
Show file tree

Hide file tree

Showing 7 changed files with 31 additions and 7 deletions.
diff --git a/client-vendor/before-body/03-webfontloader/webfontloader.js b/client-vendor/before-body/03-webfontloader/webfontloader.js
@@ -0,0 +1,9 @@
+(function(d) {
+  var config = document.documentElement.getAttribute('data-web-font-loader');
+  if (config) {
+    WebFontConfig = JSON.parse(config);
+    var wf = d.createElement('script'), s = d.scripts[0];
+    wf.src = 'https://ajax.googleapis.com/ajax/libs/webfont/1.6.16/webfont.js';
+    s.parentNode.insertBefore(wf, s);
+  }
+})(document);
diff --git a/layout/default/Layout/Abstract/default.tpl b/layout/default/Layout/Abstract/default.tpl
@@ -1,5 +1,5 @@
 <!doctype html>{block name="before-html"}{/block}
-<html {if $render->getLanguage()}lang="{$render->getLanguage()->getAbbreviation()}"{/if} class="{block name='html-class'}{/block}">
+<html {if $render->getLanguage()}lang="{$render->getLanguage()->getAbbreviation()}"{/if} class="{block name='html-class'}{/block}" {if isset($webFontLoaderConfig)}data-web-font-loader='{$webFontLoaderConfig}'{/if}>
   {capture name='pageContent'}{$renderAdapter->fetchPage()}{/capture}
   <head>
     <meta charset="utf-8">

diff --git a/layout/default/css/mixins.less b/layout/default/css/mixins.less
@@ -1,3 +1,13 @@
+.font-webFontLoader(@fontFamily) {
+  font-family: @fontFamily;
+  transition: opacity @transitionDuration;
+  opacity: 0;
+
+  html.wf-active &, html.wf-inactive & {
+    opacity: 1;
+  }
+}
+
 .clearfix {
   &::after {
     content: "";

diff --git a/layout/default/variables.less b/layout/default/variables.less
@@ -86,6 +86,8 @@
 @usertextFontColorHeading: #505050;
 @emoticonSize: unit(@usertextLineheight, em);
 
+@transitionDuration: 150ms;
+
 // Easing Variables from https://github.com/emagnier/sass-less-stylus.easing
 // Ease In
 @ease-in-quad:      cubic-bezier(0.550, 0.085, 0.680, 0.530);

diff --git a/library/CM/RenderAdapter/Layout.php b/library/CM/RenderAdapter/Layout.php
@@ -33,6 +33,10 @@ public function fetch() {
         $viewResponse->set('pageDescription', $this->fetchDescription());
         $viewResponse->set('pageKeywords', $this->fetchKeywords());
         $viewResponse->set('renderAdapter', $this);
+        $webFontLoaderConfig = $this->getRender()->getSite()->getWebFontLoaderConfig();
+        if ($webFontLoaderConfig) {
+            $viewResponse->set('webFontLoaderConfig', CM_Params::encode($webFontLoaderConfig, true));
+        }
 
         $environmentDefault = new CM_Frontend_Environment($this->getRender()->getEnvironment()->getSite());
         $renderDefault = new CM_Frontend_Render($environmentDefault);
@@ -53,7 +57,6 @@ public function fetch() {
         if ($this->getRender()->getLanguageRewrite()) {
             $options['urlLanguage'] = $this->getRender()->getLanguage();
         }
-        $options['typekit'] = $this->getRender()->getSite()->getTypekitConfig();
         $options['debug'] = CM_Bootloader::getInstance()->isDebug();
         $options['stream'] = $serviceManager->getStreamMessage()->getClientOptions();
         if ($viewer = $this->getRender()->getViewer()) {

diff --git a/library/CM/Site/Abstract.php b/library/CM/Site/Abstract.php
@@ -130,12 +130,12 @@ public function getUrlCdn() {
     /**
      * @return array
      */
-    public function getTypekitConfig() {
+    public function getWebFontLoaderConfig() {
         $config = $this->getConfig();
-        if (!isset($config->typekit)) {
+        if (!isset($config->webFontLoaderConfig)) {
             return null;
         }
-        return $config->typekit;
+        return $config->webFontLoaderConfig;
     }
 
     /**

diff --git a/tests/library/CM/Site/AbstractTest.php b/tests/library/CM/Site/AbstractTest.php
@@ -46,10 +46,10 @@ public function testGetUrlCdn() {
         $this->assertEquals('http://www.cdn.com', $site->getUrlCdn());
     }
 
-    public function testGetTypekit() {
+    public function testGetWebFontLoaderConfig() {
         /** @var CM_Site_Abstract $site */
         $site = $this->getMockForAbstractClass('CM_Site_Abstract');
-        $this->assertEquals(null, $site->getTypekitConfig());
+        $this->assertEquals(null, $site->getWebFontLoaderConfig());
     }
 
     public function testIsUrlMatch() {