import OS from '../../common/mios'; import { apiUrl } from '../../config'; import CropWindow from '../views/components/crop-window.vue'; import ProgressDialog from '../views/components/progress-dialog.vue'; export default (os: OS) => (cb, file = null) => { const fileSelected = file => { const w = new CropWindow({ propsData: { image: file, title: 'アバターとして表示する部分を選択', aspectRatio: 1 / 1 } }).$mount(); w.$once('cropped', blob => { const data = new FormData(); data.append('i', os.i.account.token); data.append('file', blob, file.name + '.cropped.png'); os.api('drive/folders/find', { name: 'アイコン' }).then(iconFolder => { if (iconFolder.length === 0) { os.api('drive/folders/create', { name: 'アイコン' }).then(iconFolder => { upload(data, iconFolder); }); } else { upload(data, iconFolder[0]); } }); }); w.$once('skipped', () => { set(file); }); document.body.appendChild(w.$el); }; const upload = (data, folder) => { const dialog = new ProgressDialog({ propsData: { title: '新しいアバターをアップロードしています' } }).$mount(); document.body.appendChild(dialog.$el); if (folder) data.append('folder_id', folder.id); const xhr = new XMLHttpRequest(); xhr.open('POST', apiUrl + '/drive/files/create', true); xhr.onload = e => { const file = JSON.parse((e.target as any).response); (dialog as any).close(); set(file); }; xhr.upload.onprogress = e => { if (e.lengthComputable) (dialog as any).update(e.loaded, e.total); }; xhr.send(data); }; const set = file => { os.api('i/update', { avatar_id: file.id }).then(i => { os.i.avatar_id = i.avatar_id; os.i.avatar_url = i.avatar_url; os.apis.dialog({ title: '%fa:info-circle%アバターを更新しました', text: '新しいアバターが反映されるまで時間がかかる場合があります。', actions: [{ text: 'わかった' }] }); if (cb) cb(i); }); }; if (file) { fileSelected(file); } else { os.apis.chooseDriveFile({ multiple: false, title: '%fa:image%アバターにする画像を選択' }).then(file => { fileSelected(file); }); } };