<commit_before>/**
 * HTML Embed
 * A reuseable element for embedding HTML and associated JS.
 */

const Field   = require('../common/field')
const React   = require('react')
const toArray = list => Array.prototype.slice.call(list)

function sanitize (html) {
  let bucket = document.createElement('div')

  bucket.innerHTML = html

  let doNotAllow = toArray(bucket.querySelectorAll('script, style'))

  doNotAllow.forEach(el => el.parentNode.removeChild(el))

  return bucket.innerHTML
}

module.exports = React.createClass({

  getDefaultProps() {
    return {
      content: {
        html:   '',
        script: ''
      }
    }
  },

  shouldDisplaySandbox() {
    return this.props.content.html || this.props.content.script
  },

  getSandbox() {
    let { html = '', script = '' } = this.props.content

    let encoding   = "data:text/html;charset=utf-8,"
    let javascript = `<script src="${ script }" async></script>`
    let embeddable = encoding + escape(html + javascript)

    return <iframe className="col-block-html-frame" src={ embeddable } />
  },

  render() {
    let { html, script } = this.props.content

    return (
      <div>
        <Field className="col-block-html"
               label="HTML Embed"
               element="textarea"
               hint="Paste HTML into this field. Include related JavaScript below."
               ref="html"
               value={ html }
               onChange={ this.onHTMLChange } />

        <Field label="Embedded JavaScript URL"
               hint="Paste the JavaScript URL of the embed into this field."
               ref="script"
               value={ script }
               onChange={ this.onScriptChange } />
<commit_msg>Add margin correction to html embed<commit_after>/**
 * HTML Embed
 * A reuseable element for embedding HTML and associated JS.
 */

const Field   = require('../common/field')
const React   = require('react')
const toArray = list => Array.prototype.slice.call(list)

function sanitize (html) {
  let bucket = document.createElement('div')

  bucket.innerHTML = html

  let doNotAllow = toArray(bucket.querySelectorAll('script, style'))

  doNotAllow.forEach(el => el.parentNode.removeChild(el))

  return bucket.innerHTML
}

module.exports = React.createClass({

  getDefaultProps() {
    return {
      content: {
        html:   '',
        script: ''
      }
    }
  },

  shouldDisplaySandbox() {
    return this.props.content.html || this.props.content.script
  },

  getSandbox() {
    let { html = '', script = '' } = this.props.content

    let encoding   = "data:text/html;charset=utf-8,"
    let style      = "<style>body { margin: 0 }</style>"
    let javascript = `<script src="${ script }" async></script>`
    let embeddable = encoding + escape(style + html + javascript)

    return <iframe className="col-block-html-frame" src={ embeddable } />
  },

  render() {
    let { html, script } = this.props.content

    return (
      <div>
        <Field className="col-block-html"
               label="HTML Embed"
               element="textarea"
               hint="Paste HTML into this field. Include related JavaScript below."
               ref="html"
               value={ html }
               onChange={ this.onHTMLChange } />

        <Field label="Embedded JavaScript URL"
               hint="Paste the JavaScript URL of the embed into this field."
               ref="script"
               value={ script }
               onChange={ this.onScriptChange } />

{'fraction_non_alphanumeric': 0.1279036420992257, 'fraction_numerical': 0.0008603383997705764, 'mean_word_length': 2.3603082851637764, 'pattern_counts': {'":': 0, '<': 17, '<?xml version=': 0, '>': 21, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2731383', 'n_tokens_mistral': 999, 'n_tokens_neox': 957, 'n_words': 248}