app/assets/build/coco/app.js in coveragebook_components-0.5.0 vs app/assets/build/coco/app.js in coveragebook_components-0.5.1

- old
+ new

@@ -21585,18 +21585,18 @@ reader.readAsDataURL(file); } }; }); - // import-glob:/home/runner/work/coco/coco/app/assets/js/base|@baseComponents/**/*.js + // import-glob:/Users/mark/Projects/coveragebook/coco/app/assets/js/base|@baseComponents/**/*.js var modules = [button_exports, dropdown_exports, icon_exports, image_uploader_exports]; var __default = modules; // base/components.js var components_default = registerComponents(__default); - // import-glob:/home/runner/work/coco/coco/app/assets/js/book|@bookComponents/**/*.js + // import-glob:/Users/mark/Projects/coveragebook/coco/app/assets/js/book|@bookComponents/**/*.js var modules2 = []; var __default2 = modules2; // book/components.js var components_default2 = registerComponents(__default2); @@ -22423,10 +22423,13 @@ // helpers/path.js function stripExtension(filename) { return filename.substring(0, filename.lastIndexOf(".")) || filename; } + function basename(path) { + return path ? path.replace(/.*\//, "") : path; + } // helpers/file.js function blobToFile(blob, fileName, type) { return new File([blob], fileName, { type }); } @@ -22496,34 +22499,47 @@ canvasHeight: 500, quality: 0.7, pixelRatio: 1 }; var slide_editor_default = CocoComponent("appSlideEditor", (data2) => { + const initialData = { + layout: data2.layout, + title: data2.title, + text1: data2.text1, + bgColor: data2.bgColor, + textColor: data2.textColor, + bgImage: { + name: data2.bgImage, + data: data2.bgImage + } + }; return __spreadProps(__spreadValues({ use: [withUndo()] - }, data2), { - saved: __spreadValues({}, data2), + }, initialData), { + saved: __spreadValues({}, initialData), saving: false, ready: false, dragging: false, errors: [], thumbnailFile: null, get bgImagePicker() { return getData(this.$root.querySelector("[data-role='bg-image-picker']")); }, init() { - this._fields.forEach((name) => { - this.$watch( - name, - (value, oldValue) => this.history.add(name, value, oldValue) - ); - }); this.$watch("thumbnailFile", () => this._syncThumbnailField()); this.$watch("errors", (errors) => { errors.forEach((error2) => console.error(error2.message)); }); - this.$nextTick(() => this.ready = true); + this.$nextTick(() => { + this._fields.forEach((name) => { + this.$watch( + name, + (value, oldValue) => this.history.add(name, value, oldValue) + ); + }); + this.ready = true; + }); }, undo(name, value) { this[name] = value; }, redo(name, value) { @@ -22548,11 +22564,15 @@ message = error2.message || "Error generating slide thumbnail"; this._handleSaveError(message, { error: error2 }); return; } } - this.$refs.form.requestSubmit(); + if (this.$refs.form) { + this.$refs.form.querySelector("form").requestSubmit(); + } else { + this.submitSuccess(); + } }, submitEnd(event) { handler = wasSuccessful(event) ? "submitSuccess" : "submitError"; this[handler](event); }, @@ -22569,31 +22589,56 @@ }, directUploadError($event) { $event.preventDefault(); this._handleSaveError($event.detail.error, { event: $event }); }, + syncImageField(el, image) { + const dataTransfer = new DataTransfer(); + if (image.file && image.file instanceof File) { + dataTransfer.items.add(image.file); + } + el.files = dataTransfer.files; + }, + input: { + layout: { "x-model.fill": "layout" }, + title: { "x-model.fill": "title" }, + text1: { "x-model.fill": "text1" }, + bgColor: { "x-model.fill": "bgColorHex" }, + textColor: { "x-model.fill": "textColorHex" }, + bgImage: { "x-effect": "syncImageField($el, bgImage)" }, + bgImagePurge: { ":checked": "!hasBgImage" } + }, + get hasBgImage() { + return !!(this.bgImage && this.bgImage.data); + }, + get bgColorHex() { + return this.bgColor.replace("#", ""); + }, + get textColorHex() { + return this.textColor.replace("#", ""); + }, get slideStyles() { return { backgroundColor: this.bgColor, color: this.textColor, - backgroundImage: this.bgImage && this.bgImage.data && `url('${this.bgImage.data}')` + backgroundImage: this.hasBgImage ? `url('${this.bgImage.data}')` : "none" }; }, get slideClasses() { return { "slide-bg-dark": this.isDarkBg, "slide-bg-light": !this.isDarkBg }; }, get isDarkBg() { - return this.bgImage && this.bgImage.data || this.bgColor ? isDark(this.bgColor) : false; + return this.hasBgImage || this.bgColor ? isDark(this.bgColor) : false; }, get shouldGenerateThumbnail() { return !!this.$refs.thumbnail; }, get _fields() { - return Object.keys(data2); + return Object.keys(initialData); }, async _generateThumbnail() { const screenshotSlide = this.$refs.screenshot.firstElementChild; for (const [key, value] of Object.entries(this.slideStyles)) { screenshotSlide.style[key] = value; @@ -22618,10 +22663,13 @@ } this.$refs.thumbnail.files = dataTransfer.files; }, _handleSaveError(message2 = "Error saving slide", context = {}) { this.errors.push({ message: message2, context }); + this.errors.forEach((err) => { + console.log(err.message); + }); this.saving = false; this.$dispatch("slide:save-end", { success: false }); } }); }); @@ -24540,16 +24588,10 @@ getPicker() { return getData( this.$root.querySelector("[data-role='color-picker']").firstElementChild ); }, - get selectedColorHex() { - return this.selectedColor && this.selectedColor.replace("#", ""); - }, - set selectedColorHex(value) { - this.selectedColor == "#" + value.replace("#", ""); - }, onDropdownMount() { this.getPicker().setSelectedColor(this.selectedColor); } }; }); @@ -24573,36 +24615,44 @@ // ../../components/coco/app/elements/image_picker/image_picker.js var image_picker_exports = {}; __export(image_picker_exports, { default: () => image_picker_default }); - var image_picker_default = CocoComponent("appImagePicker", ({ image }) => { + var image_picker_default = CocoComponent("appImagePicker", ({ src }) => { return { use: [], - image: null, + image: { + name: basename(src), + file: null, + data: src + }, get name() { - return this.image && this.image.name; + return this.image.name; }, get src() { - return this.image && this.image.data; + return this.image.data; }, get hasImage() { return !!this.src; }, get uploader() { return getComponent(this.$refs.uploader.firstElementChild); }, setImage(file, silent = false) { - this.image = file; + this.image = { + file: file.file, + name: file.name, + data: file.data + }; this.uploader.setFile(file); if (silent === false) { this.$dispatch("image-picker:select", { image: this.image }); } }, clearImage(silent = false) { this.uploader.clear(); - this.image = null; + this.image = { name: null, data: null, file: null }; if (silent === false) { this.$dispatch("image-picker:clear"); } }, browseFiles() { @@ -24617,25 +24667,16 @@ // ../../components/coco/app/elements/image_picker_button/image_picker_button.js var image_picker_button_exports = {}; __export(image_picker_button_exports, { default: () => image_picker_button_default }); - var image_picker_button_default = CocoComponent("appImagePickerButton", ({ image }) => { + var image_picker_button_default = CocoComponent("appImagePickerButton", ({ src }) => { return { - selectedImage: image, - dropdown: null, - init() { - this.$watch("selectedImage", (file) => { - const dataTransfer = new DataTransfer(); - if (file && file.file instanceof File) { - dataTransfer.items.add(file.file); - } - this.$refs.fileInput.files = dataTransfer.files; - if (this.dropdown) { - this.dropdown.hide(); - } - }); + selectedImage: { + name: basename(src), + file: null, + data: src }, getPicker() { return getData( this.$root.querySelector("[data-role='image-picker'").firstElementChild ); @@ -24649,20 +24690,21 @@ this.selectedImage = { name: file.name, file, data: reader.result }; + this.dropdown.hide(); }); reader.readAsDataURL(file); }, clearSelectedImage() { this.dropdown.hide(); - this.selectedImage = null; + this.selectedImage = { name: null, data: null, file: null }; }, - setSelectedImage(image2) { + setSelectedImage(image) { this.dropdown.hide(); - this.selectedImage = image2; + this.selectedImage = image; }, onDropdownMount({ detail }) { this.dropdown = detail.dropdown; this.getPicker().setImage(this.selectedImage, true); } @@ -24696,15 +24738,20 @@ return { use: [withSizeObserver()], height: null, observer: null, value: null, - get singleLine() { - return this.assertData("multiline", "false"); - }, + options: ["multiline", "focus"], init() { this.value = this.$refs.textarea.value; + this.$nextTick(() => { + this.onResize(); + if (this.$options.focus) { + this.$refs.textarea.focus(); + this.$refs.textarea.selectionStart = this.$refs.textarea.value.length; + } + }); }, onResize() { const textarea = this.$refs.textarea; if (textarea) { const styles = window.getComputedStyle(textarea); @@ -24825,10 +24872,10 @@ }); } }; }); - // import-glob:/home/runner/work/coco/coco/app/assets/js/app|@appComponents/**/*.js + // import-glob:/Users/mark/Projects/coveragebook/coco/app/assets/js/app|@appComponents/**/*.js var modules3 = [nav_bar_exports, nav_drawer_exports, slide_editor_exports, alert_exports, button_group_exports, color_picker_exports, color_picker_button_exports, confirm_panel_exports, image_picker_exports, image_picker_button_exports, menu_button_exports, notice_exports, seamless_textarea_exports, snackbar_exports, system_banner_exports, toast_exports, toolbar_exports]; var __default3 = modules3; // app/components.js var components_default3 = registerComponents(__default3);