Display images from background folder

Signed-off-by: Marco <marcoambrosini@icloud.com>

15 files changed, 27 insertions, 22 deletions

diff --git a/img/backgrounds/1.jpg b/img/backgrounds/1.jpg
deleted file mode 100644
index 53af21302..000000000
--- a/img/backgrounds/1.jpg
+++ /dev/null
diff --git a/img/backgrounds/2.jpg b/img/backgrounds/2.jpg
deleted file mode 100644
index 5ffc2b997..000000000
--- a/img/backgrounds/2.jpg
+++ /dev/null
diff --git a/img/backgrounds/3.jpg b/img/backgrounds/3.jpg
deleted file mode 100644
index 110ce6fad..000000000
--- a/img/backgrounds/3.jpg
+++ /dev/null
diff --git a/img/backgrounds/4.jpg b/img/backgrounds/4.jpg
deleted file mode 100644
index 412496c1c..000000000
--- a/img/backgrounds/4.jpg
+++ /dev/null
diff --git a/img/backgrounds/5.jpg b/img/backgrounds/5.jpg
deleted file mode 100644
index b97acbece..000000000
--- a/img/backgrounds/5.jpg
+++ /dev/null
diff --git a/img/backgrounds/6.jpg b/img/backgrounds/6.jpg
deleted file mode 100644
index 88163cae4..000000000
--- a/img/backgrounds/6.jpg
+++ /dev/null
diff --git a/img/backgrounds/La_Fenice_Opera_House_from_the_stage.jpg b/img/backgrounds/La_Fenice_Opera_House_from_the_stage.jpg
new file mode 100644
index 000000000..6ff6d80a1
--- /dev/null
+++ b/img/backgrounds/La_Fenice_Opera_House_from_the_stage.jpg
diff --git a/img/backgrounds/Long_Room_Interior,_Trinity_College_Dublin,_Ireland_-_Diliff.jpg b/img/backgrounds/Long_Room_Interior,_Trinity_College_Dublin,_Ireland_-_Diliff.jpg
new file mode 100644
index 000000000..44f537dfb
--- /dev/null
+++ b/img/backgrounds/Long_Room_Interior,_Trinity_College_Dublin,_Ireland_-_Diliff.jpg
diff --git a/img/backgrounds/StockSnap_BY59S6FSEP.jpg b/img/backgrounds/StockSnap_BY59S6FSEP.jpg
new file mode 100644
index 000000000..5ac34dc61
--- /dev/null
+++ b/img/backgrounds/StockSnap_BY59S6FSEP.jpg
diff --git a/img/backgrounds/StockSnap_RKQU798YK0.jpg b/img/backgrounds/StockSnap_RKQU798YK0.jpg
new file mode 100644
index 000000000..bb2bec74f
--- /dev/null
+++ b/img/backgrounds/StockSnap_RKQU798YK0.jpg
diff --git a/img/backgrounds/StockSnap_Y5OWUE5TW7.jpg b/img/backgrounds/StockSnap_Y5OWUE5TW7.jpg
new file mode 100644
index 000000000..25b9e2d2f
--- /dev/null
+++ b/img/backgrounds/StockSnap_Y5OWUE5TW7.jpg
diff --git a/img/backgrounds/StockSnap_ZZ1IHRDEML.jpg b/img/backgrounds/StockSnap_ZZ1IHRDEML.jpg
new file mode 100644
index 000000000..ae55710f6
--- /dev/null
+++ b/img/backgrounds/StockSnap_ZZ1IHRDEML.jpg
diff --git a/img/backgrounds/Wooden_footbridge_in_Shinjuku_Gyoen_National_Garden,_Tokyo,_Japan,_a_sunny_day_with_blue_sky.jpg b/img/backgrounds/Wooden_footbridge_in_Shinjuku_Gyoen_National_Garden,_Tokyo,_Japan,_a_sunny_day_with_blue_sky.jpg
new file mode 100644
index 000000000..29c76f450
--- /dev/null
+++ b/img/backgrounds/Wooden_footbridge_in_Shinjuku_Gyoen_National_Garden,_Tokyo,_Japan,_a_sunny_day_with_blue_sky.jpg
diff --git a/img/backgrounds/iss036e005944~orig.jpg b/img/backgrounds/iss036e005944~orig.jpg
new file mode 100644
index 000000000..d50217e66
--- /dev/null
+++ b/img/backgrounds/iss036e005944~orig.jpg
diff --git a/src/components/MediaSettings/VideoBackgroundEditor.vue b/src/components/MediaSettings/VideoBackgroundEditor.vue
index c0e31c15e..f06a321ac 100644
--- a/src/components/MediaSettings/VideoBackgroundEditor.vue
+++ b/src/components/MediaSettings/VideoBackgroundEditor.vue
@@ -39,18 +39,20 @@
 			<Blur :size="20" />
 			{{ t('spreed', 'Blur') }}
 		</button>
-		<button class="background-editor__element"
-			@click="clickImportInput">
-			<Upload :size="20" />
-			{{ t('spreed', 'Upload') }}
-		</button>
-		<button class="background-editor__element"
-			:class="{'background-editor__element--selected': isCustomBackground }"
-			@click="openPicker">
-			<Folder :size="20" />
-			{{ t('spreed', 'Files') }}
-		</button>
-		<button v-for="path in backgrounds"
+		<template v-if="canUploadBackgrounds">
+			<button class="background-editor__element"
+				@click="clickImportInput">
+				<Upload :size="20" />
+				{{ t('spreed', 'Upload') }}
+			</button>
+			<button class="background-editor__element"
+				:class="{'background-editor__element--selected': isCustomBackground }"
+				@click="openPicker">
+				<Folder :size="20" />
+				{{ t('spreed', 'Files') }}
+			</button>
+		</template>
+		<button v-for="path in predefinedBackgroundsURLs"
 			:key="path"
 			aria-label="TODO: add image names as aria labels"
 			class="background-editor__element"
@@ -63,6 +65,7 @@
 				:size="40"
 				fill-color="#fff" />
 		</button>
+
 		<!--native file picker, hidden -->
 		<input v-show="false"
 			id="custom-background-file"
@@ -82,6 +85,7 @@ import CheckBold from 'vue-material-design-icons/CheckBold.vue'
 import Folder from 'vue-material-design-icons/Folder.vue'
 import Upload from 'vue-material-design-icons/Upload.vue'
 
+import { getCapabilities } from '@nextcloud/capabilities'
 import { getFilePickerBuilder, showError } from '@nextcloud/dialogs'
 import { imagePath, generateUrl } from '@nextcloud/router'
 
@@ -90,6 +94,9 @@ import BrowserStorage from '../../services/BrowserStorage.js'
 import client from '../../services/DavClient.js'
 import { findUniquePath } from '../../utils/fileUpload.js'
 
+const canUploadBackgrounds = getCapabilities()?.spreed?.config?.call?.['can-upload-background']
+const predefinedBackgrounds = getCapabilities()?.spreed?.config?.call?.['predefined-backgrounds']
+
 let picker
 
 export default {
@@ -118,6 +125,9 @@ export default {
 	data() {
 		return {
 			selectedBackground: undefined,
+			predefinedBackgrounds,
+			canUploadBackgrounds,
+			getCapabilities,
 		}
 	},
 
@@ -127,20 +137,15 @@ export default {
 		},
 
 		isCustomBackground() {
-			return !this.backgrounds.includes(this.selectedBackground)
+			return !this.predefinedBackgroundsURLs.includes(this.selectedBackground)
 				&& this.selectedBackground !== 'none'
 				&& this.selectedBackground !== 'blur'
 		},
 
-		backgrounds() {
-			return [
-				imagePath('spreed', 'backgrounds/1.jpg'),
-				imagePath('spreed', 'backgrounds/2.jpg'),
-				imagePath('spreed', 'backgrounds/3.jpg'),
-				imagePath('spreed', 'backgrounds/4.jpg'),
-				imagePath('spreed', 'backgrounds/5.jpg'),
-				imagePath('spreed', 'backgrounds/6.jpg'),
-			]
+		predefinedBackgroundsURLs() {
+			return predefinedBackgrounds.map(fileName => {
+				return imagePath('spreed', 'backgrounds/' + fileName)
+			})
 		},
 	},