Leisuretimedock/blessing-skin-server
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix previewing high-res texture on upload page

Browse Source
This commit is contained in:
Pig Fang 2018-09-13 23:46:23 +08:00
parent 972c639730
commit 764c4ae94d
2 changed files with 24 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
resources/assets/src/components/skinlib/Upload.vue
View File

@ -48,7 +48,7 @@
<div class="form-group">
<label for="file" v-t="'skinlib.upload.select-file'"></label>
<div class="file-dnd">
<img v-if="hasFile" :src="texture">
<img v-if="hasFile" :src="texture" :width="width2d" />
<h3 v-else v-t="'skinlib.upload.dropZone'"></h3>
</div>
<file-upload
@ -132,6 +132,7 @@ export default {
privacyNotice: blessing.extra.privacyNotice,
scorePublic: blessing.extra.scorePublic,
scorePrivate: blessing.extra.scorePrivate,
width2d: 64,
};
},
computed: {
@ -187,6 +188,10 @@ export default {
this.name = matched ? matched[1] : file.name;
}
this.texture = URL.createObjectURL(file.file);
const image = new Image();
image.src = this.texture;
image.onload = () => this.width2d = image.width > 400 ? 400 : image.width;
},
remove() {
this.$refs.upload.clear();

18
resources/assets/tests/components/skinlib/Upload.test.js
View File

@ -71,6 +71,22 @@ test('display score cost', () => {
test('process input file', () => {
window.URL.createObjectURL = jest.fn().mockReturnValue('file-url');
jest.spyOn(window, 'Image')
.mockImplementationOnce(function () {
this.src = '';
this.onload = null;
Object.defineProperty(this, 'onload', {
set: fn => fn()
});
})
.mockImplementationOnce(function () {
this.src = '';
this.width = 500;
this.onload = null;
Object.defineProperty(this, 'onload', {
set: fn => fn()
});
});
const blob = new Blob;
const wrapper = mount(Upload, {
stubs: ['file-upload']
@ -90,6 +106,8 @@ test('process input file', () => {
expect(wrapper.vm.name).toBe('789');
expect(wrapper.vm.texture).toBe('file-url');
window.Image.mockRestore();
});
test('upload file', async () => {