Jake Vanderwerf
9 days ago ed57c386db34d8693ca75311972d0929ebe5f488
assets/js/concise/quill.js
@@ -94,15 +94,30 @@
                  h1: function() { this.quill.format('header', 1); },
                  h2: function() { this.quill.format('header', 2); },
                  h3: function() { this.quill.format('header', 3); },
                  'jvb_bold': function() {this.quill.format('bold', true)},
                  'jvb_italic': function() {this.quill.format('italic', true)},
                  'jvb_strike': function() {this.quill.format('strike', true)},
                  'jvb_underline': function() {this.quill.format('underline', true)},
                  'jvb_bold': function() {
                     const format = this.quill.getFormat();
                     this.quill.format('bold', !format.bold);
                  },
                  'jvb_italic': function() {
                     const format = this.quill.getFormat();
                     this.quill.format('italic', !format.italic);
                  },
                  'jvb_strike': function() {
                     const format = this.quill.getFormat();
                     this.quill.format('strike', !format.strike);
                  },
                  'jvb_underline': function() {
                     const format = this.quill.getFormat();
                     this.quill.format('underline', !format.underline);
                  },
                  'jvb_align': function(value) {
                     this.quill.format('align', value === this.quill.getFormat().list ? false : value);
                     const format = this.quill.getFormat();
                     this.quill.format('align', value === format.align ? false : value);
                  },
                  'jvb_list': function(value) {
                     this.quill.format('list', value === this.quill.getFormat().list ? false : value);
                     // value will be either "bullet" or "ordered" depending on which button was clicked
                     const format = this.quill.getFormat();
                     this.quill.format('list', value === format.list ? false : value);
                  },
                  'jvb_link': function(value) {
                     if (value) {
@@ -166,6 +181,8 @@
                     }
                  },
                  'jvb_image': function() {
                     const objectID = textarea.dataset.postId || textarea.closest('form')?.dataset.postId;
                     const input = document.createElement('input');
                     input.setAttribute('type', 'file');
                     input.setAttribute('accept', 'image/jpeg,image/png,image/gif,image/webp');
@@ -217,7 +234,7 @@
                           this.quill.insertEmbed(range.index, 'image', result.url);
                        } catch (error) {
                           this.handleError('Upload error:', error);
                           console.error('Upload error:', error);
                           this.quill.insertText(range.index, 'Failed to upload image. Please try again.', {
                              'color': '#f00',
                              'italic': true
@@ -244,9 +261,40 @@
      instances.push(quill);
      quill.on('selection-change', function(range) {
         if (!range) return;
         const format = quill.getFormat(range);
         // Update button states
         const formatButtons = {
            'ql-jvb_bold': 'bold',
            'ql-jvb_italic': 'italic',
            'ql-jvb_underline': 'underline',
            'ql-jvb_strike': 'strike'
         };
         Object.entries(formatButtons).forEach(([buttonClass, formatName]) => {
            const button = toolbar.querySelector(`.${buttonClass}`);
            if (button) {
               button.classList.toggle('active', !!format[formatName]);
            }
         });
         // Update list button states
         toolbar.querySelectorAll('.ql-jvb_list').forEach(button => {
            const value = button.getAttribute('value');
            button.classList.toggle('ql-active', format.list === value);
         });
         // Update alignment button states
         toolbar.querySelectorAll('.ql-jvb_align').forEach(button => {
            const value = button.getAttribute('value');
            button.classList.toggle('ql-active', format.align === value);
         });
         const alignmentTools = toolbar.querySelector('.ql-align');
         if (alignmentTools) {
            if (range && range.length === 0) {
            if (range.length === 0) {
               // Get the focused element
               const [leaf] = this.quill.getLeaf(range.index);
               if (leaf && leaf.domNode && leaf.domNode.tagName === 'IMG') {