Import Word files to BookStack Page

[KAE3]

Describe the feature you'd like

I have many legacy Word documentation files containing text and images. I want to import these to generate new Pages. Tried copying & pasting from the Word file into new Pages but that is time consuming and error prone. A similar issue was raised in 2021 then closed .

Describe the benefits this would bring to existing BookStack users

Importing Word makes the difference in whether or not BookSmart is the right tool for documentation when historical documentation is in Word. Manual copy & paste of the Word file contents into a Word page is not a practical workaround.

Can the goal of this request already be achieved via other means?

There is a solution here but it would be much more convenient if it was directly built into BookStack.

Have you searched for an existing open/closed issue?

• [X] I have searched for existing issues and none cover my fundemental request

How long have you been using BookStack?

Not using yet, just scoping

Additional context

No response

[ssddanbrown]

Thanks for the request, but from my point of view my feelings remain the same as per #3064 and I haven't really seen any other change in state/circumstance since that issue that would change the position on supporting such a feature.

[KAE3]

I understand, thanks.

[ssddanbrown]

This issue did get me thinking about a non-official hack solution, based upon my API script you linked.

Here's a version that can be added to the "Custom HTML Head Content" customization setting:

<script src="https://cdn.jsdelivr.net/npm/mammoth@1.5.1/mammoth.browser.min.js" defer></script>
<script type="module">
    function convertAndInsertDocx(editor, file) {
        const reader = new FileReader();
        reader.onload = async function(loadEvent) {
            const arrayBuffer = loadEvent.target.result;
            const {value: html, messages} = await window.mammoth.convertToHtml({arrayBuffer});
            if (messages.length > 0) {
                console.error(messages);
                window.$events.emit('warning', `${messages.length} warnings logged to browser console during conversion`);
            }
            editor.insertContent(html);
        }
        reader.readAsArrayBuffer(file);
    }

    window.addEventListener('editor-tinymce::setup', event => {
        const editor = event.detail.editor;
        editor.on('drop', event => {
            const files = event?.dataTransfer?.files || [];
            for (const file of files) {
                if (file.type === 'application/vnd.openxmlformats-officedocument.wordprocessingml.document' && window.mammoth) {
                    convertAndInsertDocx(editor, file);
                }
            }
        });
    });
</script>

Once added, you could then drag and drop a .docx file into the WYSIWYG editor and it's contents will be inserted as HTML. Conversion is very rough, will get a dismissiable editor popup message regarding not supported file type, might break or have problems on future updates. Tested only on Firefox on my dev system/instance.

I'd be interested to know if that kinda works for you. I may add this to our hacks page.

[KAE3]

Thanks! Hope to try this once I figure it out some basics.

[ssddanbrown]

I've now added this as a hack here: https://www.bookstackapp.com/hacks/wysiwyg-docx-import/

But since there's no further follow-up, and this is not something I'd look to add to the core project as touched upon above, I'll go ahead and close this off.

[samantarya]

Hi, thank you very much for this hack. Can I ask how can I apply this hack to a bookstack instance? Also is it possible to apply it to the demo instance?