<commit_before>import { __moduleExports as mdRipple } from '@material/ripple/dist/mdc.ripple';
import { __moduleExports as mdTextfield } from '@material/textfield/dist/mdc.textfield';
import { __moduleExports as mdSnackbar } from '@material/snackbar/dist/mdc.snackbar';
import { template as _, noop } from 'lodash';

import { layout } from '../../components/layout';

import template from './contact.html';
import style from './contact.css';
import data from './contact.json';

import dataZh from './languages/contact-zh.json';
import dataJa from './languages/contact-ja.json';

const imports = {
  style
};

const common = (language: string = 'en'): void => {
  const name = document.querySelector('#name');
  const nameLabel = document.querySelector('#name + .mdc-textfield__label');
  const email = document.querySelector('#email');
  const emailLabel = document.querySelector('#email + .mdc-textfield__label');
  const comment = document.querySelector('#comment');
  const commentLabel = document.querySelector('#comment + .mdc-textfield__label');
  const sendButton = document.querySelector('#send-button');

  const sendToastEl = document.querySelector('#send-toast');
  const sendToast = new mdSnackbar.MDCSnackbar(sendToastEl);

  firebase.auth()
    .onAuthStateChanged(user => {
      if (user) {
        sendButton.onclick = (): void => {
          if (name.value !== '' && email.value !== '' && comment.value !== '') {
            firebase.database()
              .ref('users')
              .push({ id: user.uid, name: name.value, email: email.value, message: comment.value });

            name.value = '';
            email.value = '';
            comment.value = '';
            nameLabel.classList.remove('mdc-textfield__label--float-above');
            emailLabel.classList.remove('mdc-textfield__label--float-above');
            commentLabel.classList.remove('mdc-textfield__label--float-above');

            language === 'en' ? sendToast.show({ message: 'Thanks for your comment.' }) : noop();
            language === 'zh' ? sendToast.show({ message: '感謝您的評論' }) : noop();
            language === 'ja' ? sendToast.show({ message: 'あなたのコメントをありがとう' }) : noop();
          } else {
            language === 'en' ? sendToast.show({ message: 'Not valid!' }) : noop();
            language === 'zh' ? sendToast.show({ message: '無效！' }) : noop();
            language === 'ja' ? sendToast.show({ message: '有効ではありません！' }) : noop();
          }
        };
      } else {
        // console.log('There was no anonymous session. Creating a new anonymous user.');
        firebase.auth().signInAnonymously();
      }
    });

  [].forEach.call(
    document.querySelectorAll('.mdc-button'),
    ripple => mdRipple.MDCRipple.attachTo(ripple)
  );

  [].forEach.call(
    document.querySelectorAll('.mdc-textfield'),
    textfield => mdTextfield.MDCTextfield.attachTo(textfield)
  );
};

export const contact = (): void => {
  page('/contact', () => {
    layout(_(template, { imports })(data), 'contact');
    common();
  });

  page('/zh/contact', () => {
    layout(_(template, { imports })(dataZh), 'contact', 'zh');<commit_msg>780th Commit<commit_after>import { __moduleExports as mdRipple } from '@material/ripple/dist/mdc.ripple';
import { __moduleExports as mdTextfield } from '@material/textfield/dist/mdc.textfield';
import { __moduleExports as mdSnackbar } from '@material/snackbar/dist/mdc.snackbar';
import { template as _, noop } from 'lodash';

import { layout } from '../../components/layout';

import template from './contact.html';
import style from './contact.css';
import data from './contact.json';

import dataZh from './languages/contact-zh.json';
import dataJa from './languages/contact-ja.json';

const imports = {
  style
};

const common = (language: string = 'en'): void => {
  const name = document.querySelector('#name');
  const email = document.querySelector('#email');
  const comment = document.querySelector('#comment');
  const sendButton = document.querySelector('#send-button');

  const sendToastEl = document.querySelector('#send-toast');
  const sendToast = new mdSnackbar.MDCSnackbar(sendToastEl);

  firebase.auth()
    .onAuthStateChanged(user => {
      if (user) {
        sendButton.onclick = (): void => {
          const textfieldInputs = document.querySelectorAll('.mdc-textfield__input');
          const empty = [].filter.call(textfieldInputs, textfieldInput => textfieldInput.value === '');

          if (!empty.length) {
            firebase.database()
              .ref('users')
              .push({ id: user.uid, name: name.value, email: email.value, message: comment.value });

            [].forEach.call(
              textfieldInputs,
              textfieldInput => textfieldInput.value = ''
            );

            [].forEach.call(
              document.querySelectorAll('.mdc-textfield__label'),
              textfieldLabel => textfieldLabel.classList.remove('mdc-textfield__label--float-above')
            );

            language === 'en' ? sendToast.show({ message: 'Thanks for your comment.' }) : noop();
            language === 'zh' ? sendToast.show({ message: '感謝您的評論' }) : noop();
            language === 'ja' ? sendToast.show({ message: 'あなたのコメントをありがとう' }) : noop();
          } else {
            language === 'en' ? sendToast.show({ message: 'Not valid!' }) : noop();
            language === 'zh' ? sendToast.show({ message: '無效！' }) : noop();
            language === 'ja' ? sendToast.show({ message: '有効ではありません！' }) : noop();
          }
        };
      } else {
        firebase.auth().signInAnonymously();
      }
    });

  [].forEach.call(
    document.querySelectorAll('.mdc-button'),
    button => mdRipple.MDCRipple.attachTo(button)
  );

  [].forEach.call(
    document.querySelectorAll('.mdc-textfield'),
    textfield => mdTextfield.MDCTextfield.attachTo(textfield)
  );
};

export const contact = (): void => {
  page('/contact', () => {
    layout(_(template, { imports })(data), 'contact');
    common();
  });

  page('/zh/contact', () => {
    layout(_(template, { imports })(dataZh), 'contact', 'zh');
{'fraction_non_alphanumeric': 0.17064400130761687, 'fraction_numerical': 0.0004903563255966002, 'mean_word_length': 3.001962066710268, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 22, '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': '4413070', 'n_tokens_mistral': 1870, 'n_tokens_neox': 1853, 'n_words': 370}