<commit_before><template>
  <div class="md-editor card">
    <div class="card-block">
      <div class="toolbar-wrapper">
        <div class="toolbar toolbar-left">
          <b-button v-b-tooltip.hover.auto title="Toggle Heading 1 Current Line"
            @click="toggleHeading(1)">
            <strong>
              H1
            </strong>
          </b-button>
          <b-button v-b-tooltip.hover.auto title="Toggle Heading 2 Current Line"
            @click="toggleHeading(2)">
            <strong>
              H2
            </strong>
          </b-button>
          <b-button v-b-tooltip.hover.auto title="Toggle Heading 3 Current Line"
            @click="toggleHeading(3)">
            <strong>
              H3
            </strong>
          </b-button>
          <b-button v-b-tooltip.hover.auto title="Toggle Bold on Selection" @click="toggleBold">
            <strong>
              B
            </strong>
          </b-button>
          <b-button v-b-tooltip.hover.auto title="Toggle Italic on Selection"
            @click="toggleItalic">
            <i class="fa fa-italic"></i>
          </b-button>
          <b-button v-b-tooltip.hover.auto title="Toggle Code on Selection" @click="toggleCode">
            <i class="fa fa-code"></i>
          </b-button>
          <b-button v-b-tooltip.hover.auto title="Start List" @click="toggleList(false)">
            <i class="fa fa-list-ul"></i>
          </b-button>
          <b-button v-b-tooltip.hover.auto title="Start Numbered List" @click="toggleList(true)">
            <i class="fa fa-list-ol"></i>
          </b-button>
        </div>
        <div class="toolbar toolbar-right">
          <b-button v-b-tooltip.hover.auto title="Preview Markdown" @click="togglePreview">
            <i class="fa fa-eye"></i>
          </b-button>
          <b-button v-b-tooltip.hover.auto title="Help" @click="toggleHelp">
            <i class="fa fa-question-circle"></i>
          </b-button>
        </div>
      </div>
      <div class="toolbar-wrapper">
        <textarea style="resize: none"
          v-model="text"
          @keydown="handleKeyPress"
          v-bind:id="id"
          v-bind:class="{ preview: preview }">
        </textarea>
        <div v-show="preview" class="preview card">
          <div class="card-block" v-html="renderedPreview" >
          </div>
        </div>
        <div v-show="showHelp" class="preview card">
          <div class="card-block">
            <h5 class="text-center">Editor Help</h5>
            <p>
              This editor accepts Markdown using the CommonMark standard.
              for more information on writing Markdown read this
              <a href="http://commonmark.org/help/">document</a>
            </p>
            <h6>Editor Keybindings</h6>
            <ul>
              <li>CTRL+h: Toggle this help.</li>
              <li>CTRL+p: Toggle rendered preview.</li>
              <li>CTRL+Enter: Submit for the current form.</li>
              <li>CTRL+{1, 2, 3, 4, 5}: Toggle a heading {1, 2, 3, 4, 5} on the current line.</li>
              <li>CTRL+i Toggle italics on the selected text.</li>
              <li>CTRL+b Toggle bold on the selected text.</li>
              <li>CTRL+y Start a multi line code block.</li>
            </ul>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
 import Markdown from '@/lib/markdown'

 export default {
   name: 'editor',

   computed: {
     renderedPreview: function () {
       return Markdown.render(this.text)
     }
   },

   watch: {
     value: function (newVal, oldVal) {
       if (newVal !== oldVal) {
         this.text = newVal
       }
     },

     text: function (newVal, oldVal) {
       if (newVal !== oldVal) {
         this.$emit('input', newVal)
       }
     }
   },

   methods: {
     handleKeyPress: function (ev) {
       const boundKey = this.boundKeys[ev.key]
       // Prevent the event from being passed up the chain
       ev.stopPropagation()
       if (boundKey) {
         let txta = document.getElementById(this.id)
         let curpos = txta.selectionStart
         boundKey(ev, curpos)
       }
     },

     togglePreview: function () {
       this.preview = this.preview === false
       document.getElementById(this.id).focus()
     },

     toggleHelp: function () {
       this.showHelp = this.showHelp === false
       document.getElementById(this.id).focus()
     },

     findPreviousNewline: function (i) {
       if (i === null) {
         return null
       }

       let newPos = this.text[i] === '\n' ? i - 1 : i
       while (newPos !== 0 && this.text[newPos] !== '\n') {<commit_msg>Make help and preview exclusive<commit_after><template>
  <div class="md-editor card">
    <div class="card-block">
      <div class="toolbar-wrapper">
        <div class="toolbar toolbar-left">
          <b-button v-b-tooltip.hover.auto title="Toggle Heading 1 Current Line"
            @click="toggleHeading(1)">
            <strong>
              H1
            </strong>
          </b-button>
          <b-button v-b-tooltip.hover.auto title="Toggle Heading 2 Current Line"
            @click="toggleHeading(2)">
            <strong>
              H2
            </strong>
          </b-button>
          <b-button v-b-tooltip.hover.auto title="Toggle Heading 3 Current Line"
            @click="toggleHeading(3)">
            <strong>
              H3
            </strong>
          </b-button>
          <b-button v-b-tooltip.hover.auto title="Toggle Bold on Selection" @click="toggleBold">
            <strong>
              B
            </strong>
          </b-button>
          <b-button v-b-tooltip.hover.auto title="Toggle Italic on Selection"
            @click="toggleItalic">
            <i class="fa fa-italic"></i>
          </b-button>
          <b-button v-b-tooltip.hover.auto title="Toggle Code on Selection" @click="toggleCode">
            <i class="fa fa-code"></i>
          </b-button>
          <b-button v-b-tooltip.hover.auto title="Start List" @click="toggleList(false)">
            <i class="fa fa-list-ul"></i>
          </b-button>
          <b-button v-b-tooltip.hover.auto title="Start Numbered List" @click="toggleList(true)">
            <i class="fa fa-list-ol"></i>
          </b-button>
        </div>
        <div class="toolbar toolbar-right">
          <b-button v-b-tooltip.hover.auto title="Preview Markdown" @click="togglePreview">
            <i class="fa fa-eye"></i>
          </b-button>
          <b-button v-b-tooltip.hover.auto title="Help" @click="toggleHelp">
            <i class="fa fa-question-circle"></i>
          </b-button>
        </div>
      </div>
      <div class="toolbar-wrapper">
        <textarea style="resize: none"
          v-model="text"
          @keydown="handleKeyPress"
          v-bind:id="id"
          v-bind:class="{ preview: preview }">
        </textarea>
        <div v-show="preview" class="preview card">
          <div class="card-block" v-html="renderedPreview" >
          </div>
        </div>
        <div v-show="showHelp" class="preview card">
          <div class="card-block">
            <h5 class="text-center">Editor Help</h5>
            <p>
              This editor accepts Markdown using the CommonMark standard.
              for more information on writing Markdown read this
              <a href="http://commonmark.org/help/">document</a>
            </p>
            <h6>Editor Keybindings</h6>
            <ul>
              <li>CTRL+h: Toggle this help.</li>
              <li>CTRL+p: Toggle rendered preview.</li>
              <li>CTRL+Enter: Submit for the current form.</li>
              <li>CTRL+{1, 2, 3, 4, 5}: Toggle a heading {1, 2, 3, 4, 5} on the current line.</li>
              <li>CTRL+i Toggle italics on the selected text.</li>
              <li>CTRL+b Toggle bold on the selected text.</li>
              <li>CTRL+y Start a multi line code block.</li>
            </ul>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
 import Markdown from '@/lib/markdown'

 export default {
   name: 'editor',

   computed: {
     renderedPreview: function () {
       return Markdown.render(this.text)
     }
   },

   watch: {
     value: function (newVal, oldVal) {
       if (newVal !== oldVal) {
         this.text = newVal
       }
     },

     text: function (newVal, oldVal) {
       if (newVal !== oldVal) {
         this.$emit('input', newVal)
       }
     }
   },

   methods: {
     handleKeyPress: function (ev) {
       const boundKey = this.boundKeys[ev.key]
       // Prevent the event from being passed up the chain
       ev.stopPropagation()
       if (boundKey) {
         let txta = document.getElementById(this.id)
         let curpos = txta.selectionStart
         boundKey(ev, curpos)
       }
     },

     togglePreview: function () {
       this.preview = this.preview === false
       this.showHelp = false
       document.getElementById(this.id).focus()
     },

     toggleHelp: function () {
       this.showHelp = this.showHelp === false
       this.preview = false
       document.getElementById(this.id).focus()
     },

     findPreviousNewline: function (i) {
       if (i === null) {
         return null
       }

       let newPos = this.text[i] === '\n' ? i - 1 : i
       while (newPos !== 0 && this.text[newPos] !== '\n') {
{'fraction_non_alphanumeric': 0.14659127280486503, 'fraction_numerical': 0.00533447135388883, 'mean_word_length': 1.7305563646956015, 'pattern_counts': {'":': 0, '<': 181, '<?xml version=': 0, '>': 181, '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': '1445346', 'n_tokens_mistral': 2858, 'n_tokens_neox': 2785, 'n_words': 660}