<commit_before><template>
  <form id="editor"></form>
</template>

<script>
import { mapState } from 'vuex'
import { files as api } from '@/api'
import buttons from '@/utils/buttons'

import ace from 'ace-builds/src-min-noconflict/ace.js'
import modelist from 'ace-builds/src-min-noconflict/ext-modelist.js'
import 'ace-builds/webpack-resolver'
import { theme } from '@/utils/constants'

export default {
  name: 'editor',
  computed: {
    ...mapState(['req'])
  },
  data: function () {
    return {}
  },
  created () {
    window.addEventListener('keydown', this.keyEvent)
    document.getElementById('save-button').addEventListener('click', this.save)
  },
  beforeDestroy () {
    window.removeEventListener('keydown', this.keyEvent)
    document.getElementById('save-button').removeEventListener('click', this.save)
    this.editor.destroy();
  },
  mounted: function () {
    const fileContent = this.req.content || '';

    this.editor = ace.edit('editor', {
      maxLines: Infinity,
      minLines: 20,
      value: fileContent,
      showPrintMargin: false,
      readOnly: this.req.type === 'textImmutable',
      theme: 'ace/theme/chrome',
      mode: modelist.getModeForPath(this.req.name).mode,
      wrap: true
    })

    if (theme == 'dark') {
      this.editor.setTheme("ace/theme/twilight");
    }
  },
  methods: {
    keyEvent (event) {
      if (!event.ctrlKey && !event.metaKey) {
        return
      }<commit_msg>fix: add a workaround to fix window freezing when viewing a large file #992<commit_after><template>
  <form id="editor"></form>
</template>

<script>
import { mapState } from 'vuex'
import { files as api } from '@/api'
import buttons from '@/utils/buttons'

import ace from 'ace-builds/src-min-noconflict/ace.js'
import modelist from 'ace-builds/src-min-noconflict/ext-modelist.js'
import 'ace-builds/webpack-resolver'
import { theme } from '@/utils/constants'

export default {
  name: 'editor',
  computed: {
    ...mapState(['req'])
  },
  data: function () {
    return {}
  },
  created () {
    window.addEventListener('keydown', this.keyEvent)
    document.getElementById('save-button').addEventListener('click', this.save)
  },
  beforeDestroy () {
    window.removeEventListener('keydown', this.keyEvent)
    document.getElementById('save-button').removeEventListener('click', this.save)
    this.editor.destroy();
  },
  mounted: function () {
    const fileContent = this.req.content || '';

    this.editor = ace.edit('editor', {
      maxLines: 80,
      minLines: 20,
      value: fileContent,
      showPrintMargin: false,
      readOnly: this.req.type === 'textImmutable',
      theme: 'ace/theme/chrome',
      mode: modelist.getModeForPath(this.req.name).mode,
      wrap: true
    })

    if (theme == 'dark') {
      this.editor.setTheme("ace/theme/twilight");
    }
  },
  methods: {
    keyEvent (event) {
      if (!event.ctrlKey && !event.metaKey) {
        return
      }
{'fraction_non_alphanumeric': 0.15803814713896458, 'fraction_numerical': 0.0030653950953678476, 'mean_word_length': 3.244219653179191, 'pattern_counts': {'":': 0, '<': 13, '<?xml version=': 0, '>': 13, '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': '5512981', 'n_tokens_mistral': 943, 'n_tokens_neox': 931, 'n_words': 189}