зеркало из https://github.com/nextcloud/server.git
fix(theming): user background picker
Signed-off-by: John Molakvoæ <skjnldsv@protonmail.com>
This commit is contained in:
John Molakvoæ
Ferdinand Thiessen
Родитель
93acc47761
Коммит
5831d4f536
|
|
@ -19,10 +19,14 @@
|
|||
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
*
|
||||
*/
|
||||
|
||||
import { getRequestToken } from '@nextcloud/auth'
|
||||
import Vue from 'vue'
|
||||
import App from './AdminTheming.vue'
|
||||
|
||||
import { refreshStyles } from './helpers/refreshStyles.js'
|
||||
import App from './AdminTheming.vue'
|
||||
|
||||
// eslint-disable-next-line camelcase
|
||||
__webpack_nonce__ = btoa(getRequestToken())
|
||||
|
||||
Vue.prototype.OC = OC
|
||||
Vue.prototype.t = t
|
||||
|
|
|
|||
|
|
@ -91,17 +91,18 @@
|
|||
|
||||
<script>
|
||||
import { generateFilePath, generateRemoteUrl, generateUrl } from '@nextcloud/router'
|
||||
import { getCurrentUser } from '@nextcloud/auth'
|
||||
import { getFilePickerBuilder, showError } from '@nextcloud/dialogs'
|
||||
import { loadState } from '@nextcloud/initial-state'
|
||||
import { Palette } from 'node-vibrant/lib/color.js'
|
||||
import axios from '@nextcloud/axios'
|
||||
import Check from 'vue-material-design-icons/Check.vue'
|
||||
import Close from 'vue-material-design-icons/Close.vue'
|
||||
import ImageEdit from 'vue-material-design-icons/ImageEdit.vue'
|
||||
import debounce from 'debounce'
|
||||
import NcColorPicker from '@nextcloud/vue/dist/Components/NcColorPicker.js'
|
||||
import Vibrant from 'node-vibrant'
|
||||
import { Palette } from 'node-vibrant/lib/color.js'
|
||||
import { getFilePickerBuilder } from '@nextcloud/dialogs'
|
||||
import { getCurrentUser } from '@nextcloud/auth'
|
||||
|
||||
import Check from 'vue-material-design-icons/Check.vue'
|
||||
import Close from 'vue-material-design-icons/Close.vue'
|
||||
import ImageEdit from 'vue-material-design-icons/ImageEdit.vue'
|
||||
|
||||
const backgroundImage = loadState('theming', 'backgroundImage')
|
||||
const shippedBackgroundList = loadState('theming', 'shippedBackgrounds')
|
||||
|
|
@ -109,11 +110,6 @@ const themingDefaultBackground = loadState('theming', 'themingDefaultBackground'
|
|||
const defaultShippedBackground = loadState('theming', 'defaultShippedBackground')
|
||||
|
||||
const prefixWithBaseUrl = (url) => generateFilePath('theming', '', 'img/background/') + url
|
||||
const picker = getFilePickerBuilder(t('theming', 'Select a background from your files'))
|
||||
.setMultiSelect(false)
|
||||
.setType(1)
|
||||
.setMimeTypeFilter(['image/png', 'image/gif', 'image/jpeg', 'image/svg+xml', 'image/svg'])
|
||||
.build()
|
||||
|
||||
export default {
|
||||
name: 'BackgroundSettings',
|
||||
|
|
@ -255,8 +251,30 @@ export default {
|
|||
this.pickColor(...args)
|
||||
}, 200),
|
||||
|
||||
async pickFile() {
|
||||
const path = await picker.pick()
|
||||
pickFile() {
|
||||
const picker = getFilePickerBuilder(t('theming', 'Select a background from your files'))
|
||||
.allowDirectories(false)
|
||||
.setMimeTypeFilter(['image/png', 'image/gif', 'image/jpeg', 'image/svg+xml', 'image/svg'])
|
||||
.setMultiSelect(false)
|
||||
.addButton({
|
||||
id: 'select',
|
||||
label: t('theming', 'Select background'),
|
||||
callback: (nodes) => {
|
||||
this.applyFile(nodes[0]?.path)
|
||||
},
|
||||
type: 'primary',
|
||||
})
|
||||
.build()
|
||||
picker.pick()
|
||||
},
|
||||
|
||||
async applyFile(path) {
|
||||
if (!path || typeof path !== 'string' || path.trim().length === 0 || path === '/') {
|
||||
console.error('No valid background have been selected', { path })
|
||||
showError(t('theming', 'No background have been selected'))
|
||||
return
|
||||
}
|
||||
|
||||
this.loading = 'custom'
|
||||
|
||||
// Extract primary color from image
|
||||
|
|
|
|||
|
|
@ -19,10 +19,14 @@
|
|||
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
*
|
||||
*/
|
||||
|
||||
import { getRequestToken } from '@nextcloud/auth'
|
||||
import Vue from 'vue'
|
||||
import App from './UserThemes.vue'
|
||||
|
||||
import { refreshStyles } from './helpers/refreshStyles.js'
|
||||
import App from './UserThemes.vue'
|
||||
|
||||
// eslint-disable-next-line camelcase
|
||||
__webpack_nonce__ = btoa(getRequestToken())
|
||||
|
||||
Vue.prototype.OC = OC
|
||||
Vue.prototype.t = t
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@
|
|||
"@nextcloud/capabilities": "^1.0.4",
|
||||
"@nextcloud/dialogs": "^5.0.0-beta.2",
|
||||
"@nextcloud/event-bus": "^3.1.0",
|
||||
"@nextcloud/files": "3.0.0-beta.18",
|
||||
"@nextcloud/files": "^3.0.0-beta.19",
|
||||
"@nextcloud/initial-state": "^2.0.0",
|
||||
"@nextcloud/l10n": "^2.1.0",
|
||||
"@nextcloud/logger": "^2.5.0",
|
||||
|
|
@ -3872,9 +3872,9 @@
|
|||
"integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
|
||||
},
|
||||
"node_modules/@nextcloud/files": {
|
||||
"version": "3.0.0-beta.18",
|
||||
"resolved": "https://registry.npmjs.org/@nextcloud/files/-/files-3.0.0-beta.18.tgz",
|
||||
"integrity": "sha512-uu+55g21ps7ZtoVqFNliShtHclWO3p7mHv1Sy0qGjwWmQPu4fKjixgQ9SscdLL+9tXSmDR94qB3XuKe4EZ8hNQ==",
|
||||
"version": "3.0.0-beta.19",
|
||||
"resolved": "https://registry.npmjs.org/@nextcloud/files/-/files-3.0.0-beta.19.tgz",
|
||||
"integrity": "sha512-4VYTlscjR7f4svcZbSjrZrq+KKi3GYPels8PvyolYqMOBLWC4xjOrp5HFa20D7hnL/2Ynwymz3WeJBMP5YW1AQ==",
|
||||
"dependencies": {
|
||||
"@nextcloud/auth": "^2.1.0",
|
||||
"@nextcloud/l10n": "^2.2.0",
|
||||
|
|
|
|||
|
|
@ -45,7 +45,7 @@
|
|||
"@nextcloud/capabilities": "^1.0.4",
|
||||
"@nextcloud/dialogs": "^5.0.0-beta.2",
|
||||
"@nextcloud/event-bus": "^3.1.0",
|
||||
"@nextcloud/files": "3.0.0-beta.18",
|
||||
"@nextcloud/files": "^3.0.0-beta.19",
|
||||
"@nextcloud/initial-state": "^2.0.0",
|
||||
"@nextcloud/l10n": "^2.1.0",
|
||||
"@nextcloud/logger": "^2.5.0",
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче