From f5ed1f378622c6dd90c8ed8d380c94be7a794f98 Mon Sep 17 00:00:00 2001 From: Jaganaath Baskaran <95226111+Jaganaath-Baskaran@users.noreply.github.com> Date: Sun, 22 Sep 2024 18:11:26 +0530 Subject: [PATCH 1/8] As empty string needs to considered as transparent background color, modified value to null --- .../image-editor/smart-editor/smart-editor.component.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/angular/src/app/image-editor/smart-editor/smart-editor.component.ts b/angular/src/app/image-editor/smart-editor/smart-editor.component.ts index d3f4bb5..4a9d785 100644 --- a/angular/src/app/image-editor/smart-editor/smart-editor.component.ts +++ b/angular/src/app/image-editor/smart-editor/smart-editor.component.ts @@ -139,7 +139,7 @@ export class SmartEditorComponent implements OnInit{ let searchPrompt = 'Background of the image'; let aiOutput = StabilityAiModel(file, prompt, searchPrompt); aiOutput.then((result) => { - this.imageEditorObj.open(result, false, {backgroundColor: '' }); + this.imageEditorObj.open(result, false, {backgroundColor: null }); setTimeout(() => { this.bghideSpinner(); }, 100); @@ -160,7 +160,7 @@ export class SmartEditorComponent implements OnInit{ let searchPrompt = 'Background of the image'; let aiOutput = StabilityAiModel(file, prompt, searchPrompt); aiOutput.then((result) => { - this.imageEditorObj.open(result, false, {backgroundColor: '' }); + this.imageEditorObj.open(result, false, {backgroundColor: null }); setTimeout(() => { this.bghideSpinner(); }, 100); @@ -181,7 +181,7 @@ export class SmartEditorComponent implements OnInit{ const maskFile = this.base64ToFile(maskUrl, 'mask.png'); const aiOutput = StabilityAiModelMagicEraser(file, maskFile); aiOutput.then((result:any) => { - this.imageEditorObj.open(result, false, {backgroundColor: '' }); + this.imageEditorObj.open(result, false, {backgroundColor: null }); setTimeout(() => { hideSpinner(this.imageEditorObj.element); this.wrapperDiv.style.opacity = '1'; @@ -205,7 +205,7 @@ export class SmartEditorComponent implements OnInit{ removeBG(file: File) { let aiOutput = StabilityAiModelBGRemover(file); aiOutput.then((result: any) => { - this.imageEditorObj.open(result, false, {backgroundColor: '' }); + this.imageEditorObj.open(result, false, {backgroundColor: null }); setTimeout(() => { hideSpinner(this.imageEditorObj.element); this.wrapperDiv.style.opacity = '1'; From 08dec82b40a14d50e0e51c3bf0ebf6ec0cdedef3 Mon Sep 17 00:00:00 2001 From: Jaganaath Baskaran <95226111+Jaganaath-Baskaran@users.noreply.github.com> Date: Sun, 22 Sep 2024 18:13:20 +0530 Subject: [PATCH 2/8] As empty string needs to considered as transparent background color, modified value to null --- react/src/ai-components/image-editor/image-editor.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/react/src/ai-components/image-editor/image-editor.tsx b/react/src/ai-components/image-editor/image-editor.tsx index 1d7fff9..80e0d7e 100644 --- a/react/src/ai-components/image-editor/image-editor.tsx +++ b/react/src/ai-components/image-editor/image-editor.tsx @@ -113,7 +113,7 @@ function ImageEditor() { function removeBG(file: File) { let aiOutput = StabilityAiModelBGRemover(file); aiOutput.then((result: any) => { - imageEditorObj.open(result, false, { backgroundColor: '' }); + imageEditorObj.open(result, false, { backgroundColor: null }); setTimeout(() => { hideSpinner(imageEditorObj.element); wrapperDiv.style.opacity = '1'; @@ -144,7 +144,7 @@ function ImageEditor() { const maskFile = base64ToFile(maskUrl, 'mask.png'); const aiOutput = StabilityAiModelMagicEraser(file, maskFile); aiOutput.then((result: any) => { - imageEditorObj.open(result, false, { backgroundColor: '' }); + imageEditorObj.open(result, false, { backgroundColor: null }); setTimeout(() => { hideSpinner(imageEditorObj.element); wrapperDiv.style.opacity = '1'; @@ -164,7 +164,7 @@ function ImageEditor() { let searchPrompt = 'Background of the image'; let aiOutput = StabilityAiModel(file, prompt, searchPrompt); aiOutput.then((result: any) => { - imageEditorObj.open(result, false, { backgroundColor: '' }); + imageEditorObj.open(result, false, { backgroundColor: null }); setTimeout(() => { bgRemoveBtnClick(); }, 100); From 5bb93901880196ddbf039a9ee650df5d686a7fb7 Mon Sep 17 00:00:00 2001 From: Jaganaath Baskaran <95226111+Jaganaath-Baskaran@users.noreply.github.com> Date: Sun, 22 Sep 2024 18:14:46 +0530 Subject: [PATCH 3/8] As empty string needs to considered as transparent background color, modified value to null --- .../src/app/image-editor/smart-editor/smart-editor.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/typescript/src/app/image-editor/smart-editor/smart-editor.ts b/typescript/src/app/image-editor/smart-editor/smart-editor.ts index 5452fd2..2bc37d0 100644 --- a/typescript/src/app/image-editor/smart-editor/smart-editor.ts +++ b/typescript/src/app/image-editor/smart-editor/smart-editor.ts @@ -194,7 +194,7 @@ function base64ToFile(base64String: string, fileName: string) { function removeBG(file: File) { let aiOutput = StabilityAiModelBGRemover(file); aiOutput.then((result:any) => { - imageEditorObj.open(result, false, { backgroundColor: '' }); + imageEditorObj.open(result, false, { backgroundColor: null }); setTimeout(() => { hideSpinner(imageEditorObj.element); wrapperDiv.style.opacity = '1'; @@ -225,7 +225,7 @@ document.getElementById('eraseBtn')!.onclick = (): void => { const maskFile = base64ToFile(maskUrl, 'mask.png'); const aiOutput = StabilityAiModelMagicEraser(file, maskFile); aiOutput.then((result:any) => { - imageEditorObj.open(result, false, { backgroundColor: '' }); + imageEditorObj.open(result, false, { backgroundColor: null }); setTimeout(() => { hideSpinner(imageEditorObj.element); wrapperDiv.style.opacity = '1'; @@ -245,7 +245,7 @@ document.getElementById('bgChangeBtn')!.onclick = (): void => { let searchPrompt = 'Background of the image'; let aiOutput = StabilityAiModel(file, prompt, searchPrompt); aiOutput.then((result) => { - imageEditorObj.open(result, false, { backgroundColor: '' }); + imageEditorObj.open(result, false, { backgroundColor: null }); setTimeout(() => { bgRemoveBtnClick(); }, 100); From d196a4d853f3826b5a83315c8a1af25f25a787ee Mon Sep 17 00:00:00 2001 From: Jaganaath Baskaran <95226111+Jaganaath-Baskaran@users.noreply.github.com> Date: Sun, 22 Sep 2024 18:16:11 +0530 Subject: [PATCH 4/8] As empty string needs to considered as transparent background color, modified value to null --- .../ai-components/ai-image-editor/ai-smart-image-editor.vue | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/vue/src/ai-components/ai-image-editor/ai-smart-image-editor.vue b/vue/src/ai-components/ai-image-editor/ai-smart-image-editor.vue index 5ff2c3c..aadd7fc 100644 --- a/vue/src/ai-components/ai-image-editor/ai-smart-image-editor.vue +++ b/vue/src/ai-components/ai-image-editor/ai-smart-image-editor.vue @@ -224,7 +224,7 @@ export default { const wrapperDiv = this.$refs.wrapperDiv; let aiOutput = StabilityAiModelBGRemover(file); aiOutput.then((result) => { - imageEditorObj.open(result, false, { backgroundColor: '' }); + imageEditorObj.open(result, false, { backgroundColor: null }); setTimeout(() => { hideSpinner(imageEditorObj.element); wrapperDiv.style.opacity = '1'; @@ -259,7 +259,7 @@ export default { const maskFile = this.base64ToFile(maskUrl, 'mask.png'); const aiOutput = StabilityAiModelMagicEraser(file, maskFile); aiOutput.then((result) => { - imageEditorObj.open(result, false, { backgroundColor: '' }); + imageEditorObj.open(result, false, { backgroundColor: null }); setTimeout(() => { hideSpinner(imageEditorObj.element); wrapperDiv.style.opacity = '1'; @@ -281,7 +281,7 @@ export default { let searchPrompt = 'Background of the image'; let aiOutput = StabilityAiModel(file, prompt, searchPrompt); aiOutput.then((result) => { - imageEditorObj.open(result, false, { backgroundColor: '' }); + imageEditorObj.open(result, false, { backgroundColor: null }); setTimeout(() => { bgRemoveBtnClick(); }, 100); From 9305c074bd88b9694e0fad864d3fe726811e965b Mon Sep 17 00:00:00 2001 From: Jaganaath Baskaran <95226111+Jaganaath-Baskaran@users.noreply.github.com> Date: Mon, 23 Sep 2024 10:51:57 +0530 Subject: [PATCH 5/8] As empty string needs to considered as transparent background color, modified value to null --- .../app/image-editor/smart-editor/smart-editor.component.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/angular/src/app/image-editor/smart-editor/smart-editor.component.ts b/angular/src/app/image-editor/smart-editor/smart-editor.component.ts index 4a9d785..44e23f0 100644 --- a/angular/src/app/image-editor/smart-editor/smart-editor.component.ts +++ b/angular/src/app/image-editor/smart-editor/smart-editor.component.ts @@ -139,7 +139,7 @@ export class SmartEditorComponent implements OnInit{ let searchPrompt = 'Background of the image'; let aiOutput = StabilityAiModel(file, prompt, searchPrompt); aiOutput.then((result) => { - this.imageEditorObj.open(result, false, {backgroundColor: null }); + this.imageEditorObj.open(result, false, {backgroundColor: '' }); setTimeout(() => { this.bghideSpinner(); }, 100); @@ -160,7 +160,7 @@ export class SmartEditorComponent implements OnInit{ let searchPrompt = 'Background of the image'; let aiOutput = StabilityAiModel(file, prompt, searchPrompt); aiOutput.then((result) => { - this.imageEditorObj.open(result, false, {backgroundColor: null }); + this.imageEditorObj.open(result, false, {backgroundColor: '' }); setTimeout(() => { this.bghideSpinner(); }, 100); @@ -205,7 +205,7 @@ export class SmartEditorComponent implements OnInit{ removeBG(file: File) { let aiOutput = StabilityAiModelBGRemover(file); aiOutput.then((result: any) => { - this.imageEditorObj.open(result, false, {backgroundColor: null }); + this.imageEditorObj.open(result, false, {backgroundColor: '' }); setTimeout(() => { hideSpinner(this.imageEditorObj.element); this.wrapperDiv.style.opacity = '1'; From e97143db356d211d6d0238b58b208631def045d6 Mon Sep 17 00:00:00 2001 From: Jaganaath Baskaran <95226111+Jaganaath-Baskaran@users.noreply.github.com> Date: Mon, 23 Sep 2024 10:53:31 +0530 Subject: [PATCH 6/8] As empty string needs to considered as transparent background color, modified value to null --- react/src/ai-components/image-editor/image-editor.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/react/src/ai-components/image-editor/image-editor.tsx b/react/src/ai-components/image-editor/image-editor.tsx index 80e0d7e..07a5544 100644 --- a/react/src/ai-components/image-editor/image-editor.tsx +++ b/react/src/ai-components/image-editor/image-editor.tsx @@ -113,7 +113,7 @@ function ImageEditor() { function removeBG(file: File) { let aiOutput = StabilityAiModelBGRemover(file); aiOutput.then((result: any) => { - imageEditorObj.open(result, false, { backgroundColor: null }); + imageEditorObj.open(result, false, { backgroundColor: '' }); setTimeout(() => { hideSpinner(imageEditorObj.element); wrapperDiv.style.opacity = '1'; @@ -164,7 +164,7 @@ function ImageEditor() { let searchPrompt = 'Background of the image'; let aiOutput = StabilityAiModel(file, prompt, searchPrompt); aiOutput.then((result: any) => { - imageEditorObj.open(result, false, { backgroundColor: null }); + imageEditorObj.open(result, false, { backgroundColor: '' }); setTimeout(() => { bgRemoveBtnClick(); }, 100); From c2cd3abe68e38b6096283b27955b3e8e71bba2fb Mon Sep 17 00:00:00 2001 From: Jaganaath Baskaran <95226111+Jaganaath-Baskaran@users.noreply.github.com> Date: Mon, 23 Sep 2024 10:58:32 +0530 Subject: [PATCH 7/8] As empty string needs to considered as transparent background color, modified value to null --- typescript/src/app/image-editor/smart-editor/smart-editor.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/typescript/src/app/image-editor/smart-editor/smart-editor.ts b/typescript/src/app/image-editor/smart-editor/smart-editor.ts index 2bc37d0..2adedb5 100644 --- a/typescript/src/app/image-editor/smart-editor/smart-editor.ts +++ b/typescript/src/app/image-editor/smart-editor/smart-editor.ts @@ -194,7 +194,7 @@ function base64ToFile(base64String: string, fileName: string) { function removeBG(file: File) { let aiOutput = StabilityAiModelBGRemover(file); aiOutput.then((result:any) => { - imageEditorObj.open(result, false, { backgroundColor: null }); + imageEditorObj.open(result, false, { backgroundColor: '' }); setTimeout(() => { hideSpinner(imageEditorObj.element); wrapperDiv.style.opacity = '1'; @@ -245,7 +245,7 @@ document.getElementById('bgChangeBtn')!.onclick = (): void => { let searchPrompt = 'Background of the image'; let aiOutput = StabilityAiModel(file, prompt, searchPrompt); aiOutput.then((result) => { - imageEditorObj.open(result, false, { backgroundColor: null }); + imageEditorObj.open(result, false, { backgroundColor: '' }); setTimeout(() => { bgRemoveBtnClick(); }, 100); From 61e1fcf6d1c37bab4a9d3bbfb6bb749528547fd8 Mon Sep 17 00:00:00 2001 From: Jaganaath Baskaran <95226111+Jaganaath-Baskaran@users.noreply.github.com> Date: Mon, 23 Sep 2024 11:00:47 +0530 Subject: [PATCH 8/8] As empty string needs to considered as transparent background color, modified value to null --- .../ai-components/ai-image-editor/ai-smart-image-editor.vue | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/vue/src/ai-components/ai-image-editor/ai-smart-image-editor.vue b/vue/src/ai-components/ai-image-editor/ai-smart-image-editor.vue index aadd7fc..19bcd2e 100644 --- a/vue/src/ai-components/ai-image-editor/ai-smart-image-editor.vue +++ b/vue/src/ai-components/ai-image-editor/ai-smart-image-editor.vue @@ -224,7 +224,7 @@ export default { const wrapperDiv = this.$refs.wrapperDiv; let aiOutput = StabilityAiModelBGRemover(file); aiOutput.then((result) => { - imageEditorObj.open(result, false, { backgroundColor: null }); + imageEditorObj.open(result, false, { backgroundColor: '' }); setTimeout(() => { hideSpinner(imageEditorObj.element); wrapperDiv.style.opacity = '1'; @@ -281,7 +281,7 @@ export default { let searchPrompt = 'Background of the image'; let aiOutput = StabilityAiModel(file, prompt, searchPrompt); aiOutput.then((result) => { - imageEditorObj.open(result, false, { backgroundColor: null }); + imageEditorObj.open(result, false, { backgroundColor: '' }); setTimeout(() => { bgRemoveBtnClick(); }, 100);