import React, { Component, PropTypes } from 'react';
import serialize from 'serialize-javascript';

class Html extends Component {
  getInitialStateHtml(initialState) {
    return `window.__INITIAL_STATE__ = ${serialize(initialState)};`;
  }

  renderAnalyticsCode(isProduction) {
    if (!isProduction) {
      return null;
    }

    const scriptString = `
      var _paq = _paq || [];
      _paq.push(['trackPageView']);
      _paq.push(['enableLinkTracking']);
      (function() {
        var u="//analytics.hel.ninja/piwik/";
        _paq.push(['setTrackerUrl', u+'piwik.php']);
        _paq.push(['setSiteId', 4]);
        var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
        g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);
      })();
    `;
    return (
      <div>
        <script dangerouslySetInnerHTML={{ __html: scriptString }} />
        <noscript>
          <p><img alt="" src="//analytics.hel.ninja/piwik/piwik.php?idsite=4" style={{ border: 0 }} /></p>
        </noscript>
      </div>
    );
  }

  renderStylesLink(appCssSrc, isProduction) {
    if (!isProduction) {
      return null;
    }

    return <link href={appCssSrc} rel="stylesheet" />;
  }

  render() {
    const {
      appCssSrc,
      appScriptSrc,
      initialState,
      isProduction,
    } = this.props;
    const initialStateHtml = this.getInitialStateHtml(initialState);

    return (
      <html lang="fi">
        <head>
          <meta charSet="utf-8" />
          <meta httpEquiv="X-UA-Compatible" content="IE=edge" />
          <meta content="width=device-width, initial-scale=1" name="viewport" />
          <link rel="shortcut icon" href="/favicon.ico" />
          {this.renderStylesLink(appCssSrc, isProduction)}
          <title>Varaamo</title>
        </head>
        <body>
          <div id="root" />
          <script dangerouslySetInnerHTML={{ __html: initialStateHtml }} />
          <script src={appScriptSrc} />
          {this.renderAnalyticsCode(isProduction)}
        </body>
      </html>
    );
  }
}

Html.propTypes = {
  appCssSrc: PropTypes.string.isRequired,
  appScriptSrc: PropTypes.string.isRequired,
  initialState: PropTypes.object.isRequired,
  isProduction: PropTypes.bool.isRequired,
};

export default Html;

@@ -609,17 +609,17 @@
 iteId', 
-4
+5
 %5D);%0A    

Fix Piwik site id