From 6606e8d05788ff957bf58de37022c58e39a35638 Mon Sep 17 00:00:00 2001 From: Jordan Handy <6423379+jordanhandy@users.noreply.github.com> Date: Sat, 8 Apr 2023 19:57:48 -0400 Subject: [PATCH 1/7] add placeholder for transformation parameters setting --- src/settings-tab.ts | 22 ++++++++++++++++++++++ 1 file changed, 22 insertions(+) diff --git a/src/settings-tab.ts b/src/settings-tab.ts index 6ecd641..c22ec7a 100755 --- a/src/settings-tab.ts +++ b/src/settings-tab.ts @@ -85,5 +85,27 @@ export default class CloudinaryUploaderSettingTab extends PluginSettingTab { } }) }); + const textFragment = document.createDocumentFragment(); + const link = document.createElement("a"); + link.href="https://cloudinary.com/documentation/transformation_reference"; + link.text="View Cloudinary's transformation reference for guidance."; + textFragment.append("Add a comma-delimited default set of transformations to your uploads. "); + textFragment.append(link); + new Setting(containerEl) + .setName("Default Transformation Parameters") + .setDesc(textFragment); + .addText((text) => { + text + .setValue(this.plugin.settings.transformParams) + .onChange(async (value) => { + try { + this.plugin.settings.transformParams = value; + await this.plugin.saveSettings(); + } + catch (e) { + console.log(e) + } + }) + }); } } \ No newline at end of file From 12963f1881ff50b2d118598d25de8983c04fd19a Mon Sep 17 00:00:00 2001 From: Jordan Handy <6423379+jordanhandy@users.noreply.github.com> Date: Sat, 8 Apr 2023 20:11:38 -0400 Subject: [PATCH 2/7] transformation option add --- main.js | 28 ++++++++++++++++++++++++++-- src/main.ts | 11 ++++++++++- src/settings-tab.ts | 2 +- 3 files changed, 37 insertions(+), 4 deletions(-) diff --git a/main.js b/main.js index b90a42f..4c8b97b 100755 --- a/main.js +++ b/main.js @@ -2679,6 +2679,22 @@ var CloudinaryUploaderSettingTab = class extends import_obsidian.PluginSettingTa } }); }); + const textFragment = document.createDocumentFragment(); + const link = document.createElement("a"); + link.href = "https://cloudinary.com/documentation/transformation_reference"; + link.text = "View Cloudinary's transformation reference for guidance."; + textFragment.append("Add a comma-delimited default set of transformations to your uploads. "); + textFragment.append(link); + new import_obsidian.Setting(containerEl).setName("Default Transformation Parameters").setDesc(textFragment).addText((text) => { + text.setValue(this.plugin.settings.transformParams).onChange(async (value) => { + try { + this.plugin.settings.transformParams = value; + await this.plugin.saveSettings(); + } catch (e) { + console.log(e); + } + }); + }); } }; var settings_tab_default = CloudinaryUploaderSettingTab; @@ -2688,7 +2704,8 @@ var DEFAULT_SETTINGS = { cloudName: null, uploadPreset: null, folder: null, - f_auto: false + f_auto: false, + transformParams: null }; var CloudinaryUploader = class extends import_obsidian2.Plugin { setupPasteHandler() { @@ -2712,8 +2729,15 @@ var CloudinaryUploader = class extends import_obsidian2.Plugin { data: formData }).then((res) => { console.log(res); - const url = import_object_path.default.get(res.data, "secure_url"); + let url = import_object_path.default.get(res.data, "secure_url"); let imgMarkdownText = ""; + if (this.settings.transformParams) { + const splitURL = url.split("/upload/", 2); + let modifiedURL = ""; + modifiedURL = splitURL[0] += "/upload/" + this.settings.transformParams + "/" + splitURL[1]; + imgMarkdownText = `![](${modifiedURL})`; + url = modifiedURL; + } if (this.settings.f_auto) { const splitURL = url.split("/upload/", 2); let modifiedURL = ""; diff --git a/src/main.ts b/src/main.ts index 93d35f1..886b9d4 100755 --- a/src/main.ts +++ b/src/main.ts @@ -18,6 +18,7 @@ interface CloudinarySettings { uploadPreset: string; folder: string; f_auto: boolean; + transformParams: string; //maxWidth: number; TODO // enableResize: boolean; TODO } @@ -28,6 +29,7 @@ const DEFAULT_SETTINGS: CloudinarySettings = { uploadPreset: null, folder: null, f_auto: false, + transformParams: null, //maxWidth: 4096, TODO //enableResize: false, TODO later }; @@ -65,8 +67,15 @@ export default class CloudinaryUploader extends Plugin { }).then(res => { // Get response public URL of uploaded image console.log(res); - const url = objectPath.get(res.data, 'secure_url') + let url = objectPath.get(res.data, 'secure_url') let imgMarkdownText =""; + if(this.settings.transformParams){ + const splitURL = url.split("/upload/",2); + let modifiedURL=''; + modifiedURL = splitURL[0]+="/upload/"+this.settings.transformParams+"/"+splitURL[1]; + imgMarkdownText = `![](${modifiedURL})`; + url = modifiedURL + } if(this.settings.f_auto){ const splitURL = url.split("/upload/",2); let modifiedURL=''; diff --git a/src/settings-tab.ts b/src/settings-tab.ts index c22ec7a..7b8f493 100755 --- a/src/settings-tab.ts +++ b/src/settings-tab.ts @@ -93,7 +93,7 @@ export default class CloudinaryUploaderSettingTab extends PluginSettingTab { textFragment.append(link); new Setting(containerEl) .setName("Default Transformation Parameters") - .setDesc(textFragment); + .setDesc(textFragment) .addText((text) => { text .setValue(this.plugin.settings.transformParams) From b65d47f6b28cafe005f633763c4d43f8aa836f4f Mon Sep 17 00:00:00 2001 From: Jordan Handy <6423379+jordanhandy@users.noreply.github.com> Date: Sat, 8 Apr 2023 20:27:30 -0400 Subject: [PATCH 3/7] add better description of options --- main.js | 24 ++++++++++++++++++++---- src/settings-tab.ts | 26 +++++++++++++++++++++++--- 2 files changed, 43 insertions(+), 7 deletions(-) diff --git a/main.js b/main.js index 4c8b97b..bf759f1 100755 --- a/main.js +++ b/main.js @@ -2669,7 +2669,23 @@ var CloudinaryUploaderSettingTab = class extends import_obsidian.PluginSettingTa } }); }); - new import_obsidian.Setting(containerEl).setName("f_auto Option").setDesc("Enable f_auto option for image uploads").addToggle((toggle) => { + containerEl.createEl("h4", {text: "URL Manipulations / Transformation"}); + let textFragment = document.createDocumentFragment(); + let link = document.createElement("a"); + link.href = "https://cloudinary.com/documentation/transformation_reference"; + link.text = " Cloudinary documentation"; + textFragment.append("The settings below are meant for default image transformations. As they only touch the resulting URL, this should not cause any upload errors, however, if syntax is incorrect, your images will not be referenced correctly (won't render). Be mindful of your Cloudinary transformation limits and use the"); + textFragment.append(link); + textFragment.append(" for guidance."); + containerEl.createEl("p", {text: textFragment}); + textFragment = document.createDocumentFragment(); + link = document.createElement("a"); + link.href = "https://cloudinary.com/documentation/image_optimization#automatic_format_selection_f_auto"; + link.text = "f_auto option"; + textFragment.append("Enable the "); + textFragment.append(link); + textFragment.append(" for uploads"); + new import_obsidian.Setting(containerEl).setName("f_auto Option").setDesc(textFragment).addToggle((toggle) => { toggle.setValue(this.plugin.settings.f_auto).onChange(async (value) => { try { this.plugin.settings.f_auto = value; @@ -2679,14 +2695,14 @@ var CloudinaryUploaderSettingTab = class extends import_obsidian.PluginSettingTa } }); }); - const textFragment = document.createDocumentFragment(); - const link = document.createElement("a"); + textFragment = document.createDocumentFragment(); + link = document.createElement("a"); link.href = "https://cloudinary.com/documentation/transformation_reference"; link.text = "View Cloudinary's transformation reference for guidance."; textFragment.append("Add a comma-delimited default set of transformations to your uploads. "); textFragment.append(link); new import_obsidian.Setting(containerEl).setName("Default Transformation Parameters").setDesc(textFragment).addText((text) => { - text.setValue(this.plugin.settings.transformParams).onChange(async (value) => { + text.setPlaceholder("w_150,h_150").setValue(this.plugin.settings.transformParams).onChange(async (value) => { try { this.plugin.settings.transformParams = value; await this.plugin.saveSettings(); diff --git a/src/settings-tab.ts b/src/settings-tab.ts index 7b8f493..674dea7 100755 --- a/src/settings-tab.ts +++ b/src/settings-tab.ts @@ -69,9 +69,28 @@ export default class CloudinaryUploaderSettingTab extends PluginSettingTab { } }) }); + containerEl.createEl("h4", { text: "URL Manipulations / Transformation" }); + let textFragment = document.createDocumentFragment(); + let link = document.createElement("a"); + link.href = "https://cloudinary.com/documentation/transformation_reference"; + link.text = " Cloudinary documentation" + textFragment.append("The settings below are meant for default image transformations. As they only touch the resulting URL, this should not cause any upload errors, however, if syntax is incorrect, your images will not be referenced correctly (won't render). Be mindful of your Cloudinary transformation limits and use the") + textFragment.append(link); + textFragment.append(" for guidance."); + containerEl.createEl("p", { text: textFragment }); + + + textFragment = document.createDocumentFragment(); + link = document.createElement("a"); + link.href="https://cloudinary.com/documentation/image_optimization#automatic_format_selection_f_auto"; + link.text="f_auto option"; + textFragment.append("Enable the "); + textFragment.append(link); + textFragment.append(" for uploads"); + new Setting(containerEl) .setName("f_auto Option") - .setDesc("Enable f_auto option for image uploads") + .setDesc(textFragment) .addToggle((toggle) => { toggle .setValue(this.plugin.settings.f_auto) @@ -85,8 +104,8 @@ export default class CloudinaryUploaderSettingTab extends PluginSettingTab { } }) }); - const textFragment = document.createDocumentFragment(); - const link = document.createElement("a"); + textFragment = document.createDocumentFragment(); + link = document.createElement("a"); link.href="https://cloudinary.com/documentation/transformation_reference"; link.text="View Cloudinary's transformation reference for guidance."; textFragment.append("Add a comma-delimited default set of transformations to your uploads. "); @@ -96,6 +115,7 @@ export default class CloudinaryUploaderSettingTab extends PluginSettingTab { .setDesc(textFragment) .addText((text) => { text + .setPlaceholder("w_150,h_150") .setValue(this.plugin.settings.transformParams) .onChange(async (value) => { try { From 17a595d7297f5636b81330a18ba95c1e5a211db9 Mon Sep 17 00:00:00 2001 From: Jordan Handy <6423379+jordanhandy@users.noreply.github.com> Date: Sat, 8 Apr 2023 20:36:39 -0400 Subject: [PATCH 4/7] improve settings descriptions --- main.js | 9 +++++++-- src/settings-tab.ts | 9 +++++++-- 2 files changed, 14 insertions(+), 4 deletions(-) diff --git a/main.js b/main.js index bf759f1..d8a550f 100755 --- a/main.js +++ b/main.js @@ -2672,9 +2672,14 @@ var CloudinaryUploaderSettingTab = class extends import_obsidian.PluginSettingTa containerEl.createEl("h4", {text: "URL Manipulations / Transformation"}); let textFragment = document.createDocumentFragment(); let link = document.createElement("a"); + const linkTransformation = document.createElement("a"); + linkTransformation.text = "transformation limits "; + linkTransformation.href = "https://cloudinary.com/documentation/transformation_counts"; + textFragment.append("The settings below are meant for default image transformations. As they only touch the resulting URL, this should not cause any upload errors, however, if syntax is incorrect, your images will not be referenced correctly (won't render). Be mindful of your Cloudinary "); + textFragment.append(linkTransformation); + textFragment.append(" and use the "); link.href = "https://cloudinary.com/documentation/transformation_reference"; link.text = " Cloudinary documentation"; - textFragment.append("The settings below are meant for default image transformations. As they only touch the resulting URL, this should not cause any upload errors, however, if syntax is incorrect, your images will not be referenced correctly (won't render). Be mindful of your Cloudinary transformation limits and use the"); textFragment.append(link); textFragment.append(" for guidance."); containerEl.createEl("p", {text: textFragment}); @@ -2699,7 +2704,7 @@ var CloudinaryUploaderSettingTab = class extends import_obsidian.PluginSettingTa link = document.createElement("a"); link.href = "https://cloudinary.com/documentation/transformation_reference"; link.text = "View Cloudinary's transformation reference for guidance."; - textFragment.append("Add a comma-delimited default set of transformations to your uploads. "); + textFragment.append("Add a comma-delimited default set of transformations to your uploads. You do NOT need to include f_auto here if already enabled above."); textFragment.append(link); new import_obsidian.Setting(containerEl).setName("Default Transformation Parameters").setDesc(textFragment).addText((text) => { text.setPlaceholder("w_150,h_150").setValue(this.plugin.settings.transformParams).onChange(async (value) => { diff --git a/src/settings-tab.ts b/src/settings-tab.ts index 674dea7..c75aef5 100755 --- a/src/settings-tab.ts +++ b/src/settings-tab.ts @@ -72,9 +72,14 @@ export default class CloudinaryUploaderSettingTab extends PluginSettingTab { containerEl.createEl("h4", { text: "URL Manipulations / Transformation" }); let textFragment = document.createDocumentFragment(); let link = document.createElement("a"); + const linkTransformation = document.createElement("a"); + linkTransformation.text="transformation limits "; + linkTransformation.href="https://cloudinary.com/documentation/transformation_counts"; + textFragment.append("The settings below are meant for default image transformations. As they only touch the resulting URL, this should not cause any upload errors, however, if syntax is incorrect, your images will not be referenced correctly (won't render). Be mindful of your Cloudinary "); + textFragment.append(linkTransformation); + textFragment.append(" and use the "); link.href = "https://cloudinary.com/documentation/transformation_reference"; link.text = " Cloudinary documentation" - textFragment.append("The settings below are meant for default image transformations. As they only touch the resulting URL, this should not cause any upload errors, however, if syntax is incorrect, your images will not be referenced correctly (won't render). Be mindful of your Cloudinary transformation limits and use the") textFragment.append(link); textFragment.append(" for guidance."); containerEl.createEl("p", { text: textFragment }); @@ -108,7 +113,7 @@ export default class CloudinaryUploaderSettingTab extends PluginSettingTab { link = document.createElement("a"); link.href="https://cloudinary.com/documentation/transformation_reference"; link.text="View Cloudinary's transformation reference for guidance."; - textFragment.append("Add a comma-delimited default set of transformations to your uploads. "); + textFragment.append("Add a comma-delimited default set of transformations to your uploads. You do NOT need to include f_auto here if already enabled above."); textFragment.append(link); new Setting(containerEl) .setName("Default Transformation Parameters") From 16c8ec48c02ba42e051d78c7ebbe960c2df7be12 Mon Sep 17 00:00:00 2001 From: Jordan Handy <6423379+jordanhandy@users.noreply.github.com> Date: Sat, 8 Apr 2023 21:12:40 -0400 Subject: [PATCH 5/7] add comments --- main.js | 2 +- src/main.ts | 4 ++++ src/settings-tab.ts | 7 ++++++- 3 files changed, 11 insertions(+), 2 deletions(-) diff --git a/main.js b/main.js index d8a550f..21ec05a 100755 --- a/main.js +++ b/main.js @@ -2704,7 +2704,7 @@ var CloudinaryUploaderSettingTab = class extends import_obsidian.PluginSettingTa link = document.createElement("a"); link.href = "https://cloudinary.com/documentation/transformation_reference"; link.text = "View Cloudinary's transformation reference for guidance."; - textFragment.append("Add a comma-delimited default set of transformations to your uploads. You do NOT need to include f_auto here if already enabled above."); + textFragment.append("Add a comma-delimited default set of transformations to your uploads. You do NOT need to include f_auto here if already enabled above. "); textFragment.append(link); new import_obsidian.Setting(containerEl).setName("Default Transformation Parameters").setDesc(textFragment).addText((text) => { text.setPlaceholder("w_150,h_150").setValue(this.plugin.settings.transformParams).onChange(async (value) => { diff --git a/src/main.ts b/src/main.ts index 886b9d4..e36d4b2 100755 --- a/src/main.ts +++ b/src/main.ts @@ -69,6 +69,8 @@ export default class CloudinaryUploader extends Plugin { console.log(res); let url = objectPath.get(res.data, 'secure_url') let imgMarkdownText =""; + + // Split URL to allow for appending transformations if(this.settings.transformParams){ const splitURL = url.split("/upload/",2); let modifiedURL=''; @@ -81,6 +83,8 @@ export default class CloudinaryUploader extends Plugin { let modifiedURL=''; modifiedURL = splitURL[0]+="/upload/f_auto/"+splitURL[1]; imgMarkdownText = `![](${modifiedURL})`; + + // leave stamdard of no transformations added }else{ imgMarkdownText = `![](${url})`; } diff --git a/src/settings-tab.ts b/src/settings-tab.ts index c75aef5..ab06c80 100755 --- a/src/settings-tab.ts +++ b/src/settings-tab.ts @@ -70,14 +70,19 @@ export default class CloudinaryUploaderSettingTab extends PluginSettingTab { }) }); containerEl.createEl("h4", { text: "URL Manipulations / Transformation" }); + + // Allow for inline hyperlinks with anchor tags let textFragment = document.createDocumentFragment(); let link = document.createElement("a"); + const linkTransformation = document.createElement("a"); linkTransformation.text="transformation limits "; linkTransformation.href="https://cloudinary.com/documentation/transformation_counts"; + textFragment.append("The settings below are meant for default image transformations. As they only touch the resulting URL, this should not cause any upload errors, however, if syntax is incorrect, your images will not be referenced correctly (won't render). Be mindful of your Cloudinary "); textFragment.append(linkTransformation); textFragment.append(" and use the "); + link.href = "https://cloudinary.com/documentation/transformation_reference"; link.text = " Cloudinary documentation" textFragment.append(link); @@ -113,7 +118,7 @@ export default class CloudinaryUploaderSettingTab extends PluginSettingTab { link = document.createElement("a"); link.href="https://cloudinary.com/documentation/transformation_reference"; link.text="View Cloudinary's transformation reference for guidance."; - textFragment.append("Add a comma-delimited default set of transformations to your uploads. You do NOT need to include f_auto here if already enabled above."); + textFragment.append("Add a comma-delimited default set of transformations to your uploads. You do NOT need to include f_auto here if already enabled above. "); textFragment.append(link); new Setting(containerEl) .setName("Default Transformation Parameters") From 6695d8a0f9c68f6987467daa8c9d79ad8192a040 Mon Sep 17 00:00:00 2001 From: Jordan Handy <6423379+jordanhandy@users.noreply.github.com> Date: Sat, 8 Apr 2023 21:13:10 -0400 Subject: [PATCH 6/7] update manifest --- manifest.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/manifest.json b/manifest.json index 1c4807e..dd454af 100755 --- a/manifest.json +++ b/manifest.json @@ -5,5 +5,5 @@ "author": "Jordan Handy", "isDesktopOnly": true, "minAppVersion": "0.11.0", - "version": "0.1.6" + "version": "0.2.0" } From 332800c074b5a0a1c36fe4679226b8d90dd1dade Mon Sep 17 00:00:00 2001 From: Jordan Handy <6423379+jordanhandy@users.noreply.github.com> Date: Sat, 8 Apr 2023 21:13:57 -0400 Subject: [PATCH 7/7] update README --- README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/README.md b/README.md index 2c11bc5..d510c14 100755 --- a/README.md +++ b/README.md @@ -23,6 +23,8 @@ This plugin allows you to automatically upload images pasted to Obsidian directl - Cloud Name - Upload Preset Name ([Set that here](https://cloudinary.com/documentation/upload_presets)) - Set a Folder Name +5. Optional configuration + - Cloudinary default transformation parameters ## Unsigned vs. Signed Uploads to Cloudinary The uploads to Cloudinary are unsigned. [You can read more about that here](https://cloudinary.com/documentation/upload_images#unsigned_upload). A signed upload would require the use of an API key and secret, and I opted against asking for that in the plugin configuration, as a choice for security reasons.