<commit_before>import './wishes-button.css';

// Less typing
const d = document;
const on = (elm, name, fn) => elm.addEventListener(name, fn, false);

let globalID = 0;  // used to create unique CSS IDs for inserted elements

const Button = options => `<a class="wishes-feedback-button" href="#">${options.open}</a>`;

const Dialog = options => `
  <div style="display: none;" class="wishes-dialog">
    <form class="wishes-form" action="">
    <h5 class="wishes-dialog-title">${options.title}</h5>
    <a class="wishes-dialog-close" href="#">&times;</a>
    <textarea class="wishes-text" rows="${options.rows}"
           placeholder="${options.placeholder}" maxlength="${options.maxLength}"></textarea>
    <button class="wishes-button wishes-button-submit" type="submit">${options.send}</button>
    <button class="wishes-button wishes-button-cancel" type="button">Cancel</button>
    </form>
  </div>
`;

const noop = () => {};

const defaults = {
  url: null,
  open: 'Feedback',
  title: 'Send feedback',
  placeholder: 'Describe your issue or share your ideas',
  send: 'Send',
  maxLength: 500,
  rows: 5,
  onSubmit: noop,
  extra: null,
};
class WishesButton {
  // TODO: Allow an element or URL to be passed as first argument
  constructor(options) {
    this.options = Object.assign({}, defaults, options);

    const newID = globalID++;
    this.elm = d.createElement('div');
    this.elm.id = `__wishes-button-${newID}`;
    this.elm.innerHTML = Button(this.options) + Dialog(this.options);
    d.body.appendChild(this.elm);
    const select = this.elm.querySelector.bind(this.elm);

    this.$button = select('.wishes-feedback-button');
    on(this.$button, 'click', this.onClick.bind(this));

    this.$dialog = select('.wishes-dialog');
    this.$input = select('.wishes-text');
    this.$close = select('.wishes-dialog-close');
    this.$cancel = select('.wishes-button-cancel');
    this.$form = select('.wishes-form');
    this.$submit = select('.wishes-button-submit');
    on(this.$close, 'click', this.onDismiss.bind(this));
    on(this.$cancel, 'click', this.onDismiss.bind(this));
    on(this.$form, 'submit', this.onSubmit.bind(this));
  }
  show() {
    this.$button.style.display = '';
  }
  hide() {
    this.$button.style.display = 'none';
  }
  showDialog() {
    this.$dialog.style.display = '';
    this.$input.focus();
  }
  hideDialog() {
    this.$dialog.style.display = 'none';
  }
  onClick(e) {
    e && e.preventDefault();
    this.hide();
    this.showDialog();
  }
  onDismiss(e) {
    e && e.preventDefault();<commit_msg>Don't hide button<commit_after>import './wishes-button.css';

// Less typing
const d = document;
const on = (elm, name, fn) => elm.addEventListener(name, fn, false);

let globalID = 0;  // used to create unique CSS IDs for inserted elements

const Button = options => `<a class="wishes-feedback-button" href="#">${options.open}</a>`;

const Dialog = options => `
  <div style="display: none;" class="wishes-dialog">
    <form class="wishes-form" action="">
    <h5 class="wishes-dialog-title">${options.title}</h5>
    <a class="wishes-dialog-close" href="#">&times;</a>
    <textarea class="wishes-text" rows="${options.rows}"
           placeholder="${options.placeholder}" maxlength="${options.maxLength}"></textarea>
    <button class="wishes-button wishes-button-submit" type="submit">${options.send}</button>
    <button class="wishes-button wishes-button-cancel" type="button">Cancel</button>
    </form>
  </div>
`;

const noop = () => {};

const defaults = {
  url: null,
  open: 'Feedback',
  title: 'Send feedback',
  placeholder: 'Describe your issue or share your ideas',
  send: 'Send',
  maxLength: 500,
  rows: 5,
  onSubmit: noop,
  extra: null,
};
class WishesButton {
  // TODO: Allow an element or URL to be passed as first argument
  constructor(options) {
    this.options = Object.assign({}, defaults, options);

    const newID = globalID++;
    this.elm = d.createElement('div');
    this.elm.id = `__wishes-button-${newID}`;
    this.elm.innerHTML = Button(this.options) + Dialog(this.options);
    d.body.appendChild(this.elm);
    const select = this.elm.querySelector.bind(this.elm);

    this.$button = select('.wishes-feedback-button');
    on(this.$button, 'click', this.onClick.bind(this));

    this.$dialog = select('.wishes-dialog');
    this.$input = select('.wishes-text');
    this.$close = select('.wishes-dialog-close');
    this.$cancel = select('.wishes-button-cancel');
    this.$form = select('.wishes-form');
    this.$submit = select('.wishes-button-submit');
    on(this.$close, 'click', this.onDismiss.bind(this));
    on(this.$cancel, 'click', this.onDismiss.bind(this));
    on(this.$form, 'submit', this.onSubmit.bind(this));
  }
  show() {
    this.$button.style.display = '';
  }
  showDialog() {
    this.$dialog.style.display = '';
    this.$input.focus();
  }
  hideDialog() {
    this.$dialog.style.display = 'none';
  }
  onClick(e) {
    e && e.preventDefault();
    this.showDialog();
  }
  onDismiss(e) {
    e && e.preventDefault();
{'fraction_non_alphanumeric': 0.1907491599130263, 'fraction_numerical': 0.0027673453251630758, 'mean_word_length': 3.720149253731343, 'pattern_counts': {'":': 0, '<': 35, '<?xml version=': 0, '>': 43, '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': '290464', 'n_tokens_mistral': 1654, 'n_tokens_neox': 1632, 'n_words': 337}