{% extends '../../base.html.twig' %}

{% block body %}
  <div class="container-fluid">
    <div class="row flex-xl-nowrap">
      {% include '../../../documentation/navbar.html.twig' with {
        'route' : nodefony.route
      } %}
      <main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5" style="top: 5rem;">

        <div class="page-header">
          <h1>
            CDN
          </h1>
        </div>

        <h2>We can use Nginx to test render static files as CDN
        </h2>
        <div class="doc2">
          <h4>
            Example nginx configuration :
          </h4>

          <pre><code class="hljs nginx">
server {
  listen       80;
  listen       443 ssl;
  server_name  <b>statics.domain.com</b>;

  ssl_certificate  /path_to_nodefony/config/certificates/nodefony.fr/fullchain.pem;
  ssl_certificate_key /path_to_nodefony/config/certificates/nodefony.fr/privkey.pem;
  ssl_trusted_certificate /path_to_nodefony/config/certificates/nodefony.fr/fullchain.pem;

  location ~* \.(gif|jpg|jpeg|png|wmv|avi|mpg|mpeg|mp4|webm|htm|html|js|css|mp3|swf|ico|flv|woff.?|ttf)$ {
    access_log off;
    root /path_to_nodefony/web;
    expires 7d;
    add_header access-control-allow-origin  *;
  }
}
          </code></pre>
        </div>
        <div class="doc2">
          <h4>
            Example nodefony CDN configuration : ./config/config.js
          </h4>
          <pre><code class="hljs javascript">module.exports = {
  system: {
    domain: "0.0.0.0",
    domainAlias: [
      "^127.0.0.1$",
      "^localhost$"
    ],
    httpPort: 5151,
    httpsPort: 5152,
    domainCheck: false,
    locale: "en_en",
    /**
     * SERVERS
     */
    servers: {
      <h3>statics: false,</h3>
      protocol: "2.0", //  2.0 || 1.1
      http: true,
      https: true,
      ws: true,
      wss: true,
      certificats: {
        key: path.resolve("config", "certificates", "server", "privkey.pem"),
        cert: path.resolve("config", "certificates", "server", "fullchain.pem"),
        ca: path.resolve("config", "certificates", "ca", "nodefony-starter-root-ca.crt.pem"),
        options: {
          rejectUnauthorized: true
        }
      }
    },
    /**
     *       ASSETS CDN
     *
     *       You set cdn with string
     *       CDN :    "cdn.nodefony-starter.com",
     *       or
     *       CDN:
     *          global: "cdn.nodefony-starter.com",
     *       or
     *       CDN:{
     *         stylesheet:[
     *           "cdn.nodefony-starter.com"
     *         ],
     *         javascript:[
     *           "cdn.nodefony-starter.com"
     *         ],
     *         image:[
     *           "cdn.nodefony-starter.com",
     *           "cdn.nodefony-starter.fr"
     *         ],
     *         font:[
     *           "cdn.nodefony-starter.com"
     *         ]
     *      },
     */
    CDN: {
      <h3>global: statics.domain.com</h3>
    }
  }
}
          </code></pre>
        </div>

        <h2>Use CDN In views
        </h2>
        <div class="doc2">
          <h4>
            Example base.html.twig :
          </h4>

          <pre><code class="hljs twig">
&lthtml&gt
  &lthead&gt
&#123% block head %&#125 &#123% endblock %&#125
&#123% block meta %&#125
	&ltmeta charset="utf-8"&gt
	&ltmeta http-equiv="content-type" content="text/html; charset=UTF-8"&gt
	&ltmeta http-equiv="X-UA-Compatible" content="IE=edge"&gt
	&ltmeta name="viewport" content="width=device-width, initial-scale=1"&gt
	&ltmeta name="generator" content="Nodefony (https://nodefony.net)"&gt
	&ltmeta name="keywords" content="web,Framework,realtime,node.js,symfony,javascript,npm,linux"&gt
	&ltlink rel="manifest" href="/app/manifest.json"&gt
&#123% endblock %&#125

&#123% block description %&#125
	&ltmeta name="description" content="Node.js full-stack web framework Symfony Like"&gt
&#123% endblock %&#125

      &lttitle&gt&#123% block title %&#125NODEFONY&#123% endblock %&#125&lt/title&gt

      &#123% block stylesheets %&#125
	&lt!-- WEBPACK BUNDLE --&gt
	&ltlink rel="stylesheet" href="&#123&#123<b>CDN('stylesheet')</b>&#125&#125/app/assets/css/app.css" /&gt
&#123% endblock %&#125

  &lt/head&gt
  &ltbody&gt
&#123% block body %&#125&#123% endblock %&#125
&#123% block footer %&#125&#123% endblock %&#125
      &#123% block javascripts %&#125
	&lt!-- WEBPACK BUNDLE --&gt
	&ltscript type="text/javascript" src="&#123&#123<b>CDN('javascript')</b>&#125&#125/app/assets/js/app.js"&gt&lt/script&gt
&#123% endblock %&#125
  &lt/body&gt
&lt/html&gt
        	</code></pre>
        </div>


      </main>
    </div>
  </div>
{% endblock %}