import React, { PropTypes } from 'react';
import { analytics, oauth } from '../config';

function Html({ title, description, style, script, children }) {
  return (
    <html className="no-js" lang="">
      <head>
        <meta charSet="utf-8" />
        <meta httpEquiv="x-ua-compatible" content="ie=edge" />
        <title>{title}</title>
        <link
          rel="alternate"
          type="application/json+oembed"
          href={`${oauth.discord.url}/api/v1/oembed?type=photo&url=f&title=${title}&description=${description}`}
          title={title}
        />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
        <link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32" />
        <link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16" />
        <link rel="manifest" href="/manifest.json" />
        <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#102372" />
        <link rel="shortcut icon" href="/favicon.ico" />
        <meta name="msapplication-config" content="/browserconfig.xml" />
        <meta name="theme-color" content="#ffffff" />

        <style id="css" dangerouslySetInnerHTML={{ __html: style }} />
      </head>
      <body>
        <div id="app" dangerouslySetInnerHTML={{ __html: children }} />
        {script && <script src={script} />}
        {analytics.google.trackingId &&
          <script
            dangerouslySetInnerHTML={{ __html:
            'if (typeof(window) !== "undefined" && window.self === window.top) {' +
            'window.ga=function(){ga.q.push(arguments)};ga.q=[];ga.l=+new Date;' +
            `ga('create','${analytics.google.trackingId}','auto');ga('send','pageview')}` }}
          />
        }
        {analytics.google.trackingId &&
          <script src="https://www.google-analytics.com/analytics.js" async defer />
        }
      </body>
    </html>
  );
}

/*
function inFrame() {
  console.log("Checked This");
  if (typeof(window) === 'undefined') {
    console.log("Cant Find Window");
    return false;
  }
  if (window.hasOwnProperty("frameElement")) {
    try {
      return !!window.frameElement
    } catch(e) {
      console.error("inFrame() Error", e);
    }
  }
  try {
    return window.self !== window.top;
  } catch (e) {
    console.error("inFrame() Error 2", e);
    return true;
  }
}
*/

Html.propTypes = {
  title: PropTypes.string.isRequired,
  description: PropTypes.string,
  style: PropTypes.string.isRequired,
  script: PropTypes.string,
  children: PropTypes.string,
};

export default Html;

@@ -1524,92 +1524,8 @@
 ml:%0A
-            'if (typeof(window) !== %22undefined%22 && window.self === window.top) %7B' +%0A
     
@@ -1619,81 +1619,244 @@
     
-%60ga('
+'ga(%22
 create
-','$%7Banalytics.google.trackingId%7D','
+%22,%22(typeof(window)!==%22undefined%22&&window.self===window.top&&' +%0A            %60$%7Banalytics.google.embedTrackingId%7D)?$%7Banalytics.google.trackingId%7D:$%7Banalytics.google.embedTrackingId%7D%60 +%0A            ',%22
 auto
-'
+%22
 );ga(
-'
+%22
 send
-','
+%22,%22
 pageview
 ')%7D%60
@@ -1855,12 +1855,11 @@
 view
-')%7D%60
+%22)'
  %7D%7D%0A

add an analytics id to track only when in iFrame