Mercurial > zeropaste

comparison app/javascript/application.js @ 489:361ab9e7ffad

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Replace webpacker with esbuild and use plain js instead of coffee
author nanaya <me@nanaya.net>
date Tue, 17 Jan 2023 02:34:06 +0900
parents app/javascript/src/main.coffee@b493db1f40b0
children
comparison
equal deleted inserted replaced
488:994ae0349ade 489:361ab9e7ffad
1 import 'bootstrap';
2 import hljs from 'highlight.js';
3 import * as commonmark from 'commonmark';
4
5 /* global $ */
6 $(document).on('click', '.js-paste-clear', (e) => {
7 e.preventDefault();
8 $('.js-paste-paste')
9 .val('')
10 .focus();
11 });
12
13 function loadLanguageItems () {
14 const $languageSelectBox = $('#paste_language');
15 if ($languageSelectBox.length === 0) return;
16
17 for (const language of hljs.listLanguages().sort()) {
18 $languageSelectBox.append($(
19 '<option />',
20 { text: language, value: language }
21 ));
22 }
23 }
24
25 function markdownfy (plaintext) {
26 const reader = new commonmark.Parser();
27 const writer = new commonmark.HtmlRenderer({ safe: true });
28
29 return writer.render(reader.parse(plaintext));
30 }
31
32 function pasteText () {
33 return $('.js-paste-paste').val() || $('.js-paste-pl').text();
34 }
35
36 function highlightText () {
37 const $hlBox = $('.js-paste-hl');
38 if ($hlBox.attr('data-processed') === '1') return;
39
40 $hlBox.text(pasteText());
41
42 const highlight = () => hljs.highlightBlock($hlBox[0]);
43 window.setTimeout(highlight, 0);
44
45 $hlBox.attr('data-processed', '1');
46 }
47
48 function markdownText () {
49 const $mdBox = $('.js-paste-md');
50 if ($mdBox.attr('data-processed') === '1') return;
51
52 $mdBox.html(markdownfy(pasteText()));
53 $mdBox.find('a').attr('rel', 'nofollow');
54 $mdBox.attr('data-processed', '1');
55 }
56
57 function setHash (e) {
58 let newLocation = `#${e.currentTarget.getAttribute('data-mode')}`;
59 if (newLocation === '#pl') {
60 newLocation = window.location.pathname;
61 }
62
63 window.history.replaceState(null, '', newLocation);
64 }
65
66 function showPreview (e) {
67 e.preventDefault();
68 const text = pasteText();
69 if (text === '') return;
70 $('.js-paste-preview-md-box').html(markdownfy(text));
71 $('.js-paste-preview-md-modal').modal('show');
72 }
73
74 function switchToCurrentHash () {
75 if ($('.js-showing-paste').length === 0) return;
76
77 const format = window.location.hash.slice(1);
78
79 if (!['pl', 'hl', 'md'].includes(format)) return;
80
81 $('.js-show-tab[data-mode=#{format}]').click();
82 }
83
84 $(loadLanguageItems);
85 $(switchToCurrentHash);
86 $(document).on('click', '.js-paste-preview-md', showPreview);
87 $(document).on('click', '.js-show-tab[data-mode=hl]', highlightText);
88 $(document).on('click', '.js-show-tab[data-mode=md]', markdownText);
89 $(document).on('click', '.js-show-tab', setHash);