老爱不干活,AI 来帮忙——尝试用 ChatGPT 给论坛添加 Markdown 功能

五级用户 ma_er233 2023-6-9 2589

Markdown

就是一种标记语言,和 HTML、BBCode 一个类型(回复可见的那个 [ttreply]``[\ttreply] 好像就是 BBCode,Steam 评价也是)。我反正挺喜欢 Markdown,简洁好记、方便打、就算不渲染出来也能读……之前也有人问过老爱,他自谦不会,那我只好自力更生,可我又不大会编程,就只好来问 ChatGPT 喽

这回的脚本可比上一帖 我也叫ChatGPT给写了个回复脚本,不过这次能用 复杂多了,就结果而言,还是比较成功的,前面那贴就是用这个脚本发的,你以为是水?其实是我在痛苦的找 Bug……

效果:

Screenshot 2023-06-09 062633.png

编辑器整个换了,ChatGPT 自作主张用的 SimpleMDE,我看着还行,编辑器的按钮、预览都能用。发帖的时候 Markdown 转 HTML、编辑的时候 HTML 转 Markdown 也都基本正常。原理是,把原先的老编辑器给隐藏掉(还在 HTML 里,只是 style="display: none;"),然后新编辑器和老编辑器同步,这样插入登录可见之类的还能用,发帖的时候就转成 HTML。可惜传图片不知道为啥一直没法同步,于是我就右下角加了个“点此更新”的按钮

就算我不大会编程,这也明显不高效,留着个隐藏的老编辑器干啥?为啥要同步着输入?直接把这些按钮背后的脚本改了,叫它们直接用在新编辑器上不就得了?可我不会啊……叫 ChatGPT 改脚本,就不知道为啥跑不了,只好这么将就将就。Screw it, it works.?

当然也有不大行的,比如引用。它自动转出来的 HTML 是 <blockquote></blockquote> 但是老男人网只能用 <blockquote class="blockquote"></blockquote> 不知道为啥 ChatGPT 弄出来的各种东西都没法加上这个 Class,导致没法用引用,而回复的时候的那个引用,一改帖子它重新转一次 HTML,也没有了,比较烦人……至于 Error Handling、和别的脚本的兼容性之类的,基本没有嗯,毕竟确实不会编程。能找到哪报错就烧高香,具体的是真不懂。有 @rock 大佬在,我就是班门弄斧折腾着玩的

具体功能状况:

能用的:
  • 加粗
  • 斜体
  • 大小标题
  • 列表
  • 链接
  • 图片(套链接的也能用)
  • 登录、回复可见(好像是可以)
  • 编程语句
  • 预览、全屏、实时对比……
不能用的:
  • 引用
  • 删除线(不怪我,网站不允许)
  • 表格(同上)
  • 上标下标(用 Unicode 字符就是)
  • 还有好多扩展的 Markdown 用法
  • 估计还有我没发现的嗯……

总结:

其实感觉还行,除了引用是个问题,别的就算不高效,但也能用,算是个胜利嗯。

语言模型可真是个好东西,Javascript 要入门至少也得几个月,想写出来这个肯定更久。而我这就会点学校教的 VB、Python 的纯外行,却也能借语言模型实现目的,一晚上就整出来了,nice,还没试过的老男人可以试试把玩把玩

代码放回复,欢迎试用(我是关着老男人助手测的,有可能会冲突,不太确定)。希望能抛砖引玉,由大佬整个更好的出来……


上一篇:原来塞尔达还有改编的漫画……
下一篇:这个开源你会买么
最新回复 (24)
  • 五级用户 ma_er233 2023-6-9
    0 2
    // ==UserScript==
    // @name         Oldman OldMark
    // @namespace    http://tampermonkey.net/
    // @version      2.2
    // @description  Added a bit of Markdown, destroyed a lot of formerly working stuff, lol.
    // @match        https://bbs.oldmanemu.net/thread-create-*
    // @match        https://bbs.oldmanemu.net/post-create-*
    // @match        https://bbs.oldmanemu.net/post-update-*
    // @grant        none
    // ==/UserScript==
    
    (function() {
        'use strict';
    
        // Load the required libraries
        var script1 = document.createElement('script');
        script1.src = "https://cdn.jsdelivr.net/npm/marked@3/marked.min.js";
        document.head.appendChild(script1);
    
        var script2 = document.createElement('script');
        script2.src = "https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.js";
        document.head.appendChild(script2);
    
        var script3 = document.createElement('script');
        script3.src = "https://cdn.jsdelivr.net/npm/turndown@7";
        document.head.appendChild(script3);
    
        var link = document.createElement('link');
        link.rel = "stylesheet";
        link.href = "https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.css";
        document.head.appendChild(link);
    
        // Wait for the libraries to load
        setTimeout(function() {
            // Find the forum text editor
            var forumEditor = document.querySelector('.edui-container');
    
            // Create a new textarea element for the markdown editor
            var markdownEditor = document.createElement('textarea');
            markdownEditor.id = 'markdown-editor';
            forumEditor.parentNode.insertBefore(markdownEditor, forumEditor);
    
            // Initialize the SimpleMDE markdown editor
            var simplemde = new SimpleMDE({
                element: document.getElementById('markdown-editor'),
                renderingConfig: {
                    singleLineBreaks: false,
                    codeSyntaxHighlighting: true,
                },
                spellChecker: false,
                previewRender: function(plainText) {
                    return marked(plainText);
                }
            });
    
            // Hide the original forum text editor
            forumEditor.style.display = 'none';
    
            // Convert existing content in the old editor to markdown in the new markdown editor
            var oldEditorContent = forumEditor.querySelector('.edui-body-container').innerHTML;
            var markdownText = htmlToMarkdown(oldEditorContent);
            simplemde.value(markdownText);
    
            simplemde.codemirror.on("change", function(){
                var markdownText = simplemde.value();
                var htmlText = marked(markdownText);
                forumEditor.querySelector('.edui-body-container').innerHTML = htmlText;
            });
    
            // Listen for clicks on the specified buttons and input only on the specified URL
            var primaryButtons = document.querySelectorAll('.btn.btn-primary');
            if (primaryButtons.length > 0) {
                primaryButtons[0].addEventListener('click', updateMarkdown);
                if (primaryButtons.length > 1) {
                    primaryButtons[1].addEventListener('click', updateMarkdown);
                }
            }
            function updateMarkdown() {
                var updatedContent = forumEditor.querySelector('.edui-body-container').innerHTML;
                var updatedMarkdown = htmlToMarkdown(updatedContent);
                simplemde.value(updatedMarkdown);
            }
    
            // Create the third button
            var button3 = document.createElement('button');
            button3.type = 'button';
            button3.className = 'btn btn-primary';
            button3.textContent = '上传完成后点此更新';
            button3.addEventListener('click', updateMarkdown);
    
            // Create a container div for the buttons
            var buttonContainer = document.createElement('div');
            buttonContainer.style.textAlign = 'right';
            buttonContainer.style.marginBottom = '5px';
    
            // Append the buttons to the container div
            buttonContainer.appendChild(button3);
            buttonContainer.appendChild(document.createTextNode('\u00A0')); // Add a space between buttons
    
            // Find the target div to insert the container div above
            var targetDiv = document.querySelector('#ss_ttk');
    
            // Insert the container div before the target div
            targetDiv.parentNode.insertBefore(buttonContainer, targetDiv);
    
            // When submitting the form, convert the markdown into HTML and insert it into the original forum text editor
            var form = document.querySelector('form');
            form.addEventListener('submit', function() {
                var markdownText = simplemde.value();
                var htmlText = marked(markdownText);
                forumEditor.querySelector('.edui-body-container').innerHTML = htmlText;
            });
    
        }, 1000);
    
        // Helper function to convert HTML to markdown using Turndown
        function htmlToMarkdown(html) {
            var turndownService = new TurndownService({ headingStyle: 'atx' });
            return turndownService.turndown(html);
        }
    })();
  • 五级用户 onimerokyo 2023-6-9
    0 3
    不明觉厉
  • 管理员 Oldman 2023-6-9
    1 4
    有什么区别吗?
  • 受限用户 钉龙十 2023-6-9
    0 5
  • 五级用户 ma_er233 2023-6-9
    0 6
    Oldman 有什么区别吗?

    我排版方便啊……
    标题就加个#,列表就加个-,链接就加个[](),还弄什么word复制。全键盘操作,最爽了

  • 六级用户 一条大辉狼 2023-6-9
    0 7
    讲真,对于多数人特别是有富文本编辑器存在的时候,MD并没多大意义
    不过还是要给LZ的研究精神点赞哦
  • 六级用户 阿列克小谢 2023-6-9
    0 8
    Oldman 有什么区别吗?
    看不出来
  • 受限用户 钉龙十 2023-6-9
    0 9
  • 六级用户 阿列克小谢 2023-6-9
    0 10
    钉龙十 小谢起床啦
    再睡一会!
  • 受限用户 钉龙十 2023-6-9
    0 11
  • 五级用户 ma_er233 2023-6-9
    0 12
    一条大辉狼 讲真,对于多数人特别是有富文本编辑器存在的时候,MD并没多大意义 不过还是要给LZ的研究精神点赞哦

    谢谢

    虽然肯定不如富文本编辑器直白,但是纯键盘操作还是比一会抬手用一次鼠标,点个加粗之类的方便……而且毕竟是纯文本,也不存在复制一下格式全乱了的问题

  • 五级用户 ma_er233 2023-6-9
    1 13
    阿列克小谢 看不出来

    当然没区别,最后还不都是html的<p></p>、<strong></strong>之类。用的人方便了而已

  • 六级用户 阿列克小谢 2023-6-9
    0 14
    钉龙十 太阳公公都晒你的红屁股了,还睡!
    昨天夜战三百回合,累了
  • 受限用户 钉龙十 2023-6-9
    0 15
  • 六级用户 阿列克小谢 2023-6-9
    0 16
    钉龙十 熬夜玩H game啊?
    熬夜啪啪啪!
  • 受限用户 钉龙十 2023-6-9
    0 17
  • 三级用户 Иван 2023-6-9
    0 18
    什么时候网页能用python当脚本?js太难用了……
  • 四级用户 haskaxi 2023-6-9
    0 19
    好奇是怎么告诉chatgpt,你要写油猴脚本,还要适配本坛的,交流过程能分享下嘛
  • 四级用户 guowenwei 2023-6-9
    0 20
    好像看懂了,有似乎没有看懂……
    • 老男人游戏网配套论坛
      26
        立即登录 立即注册
发新帖
本论坛禁止发布SWITCH和PS4相关资源,若有其他侵权内容,请致邮3360342659#qq.com(#替换成@)删除。