#163

locales/en.yml

@@ -356,6 +356,12 @@ mobile:
       location: "Location"
       description: "Description"
       birthday: "Birthday"
+      avatar: "Avatar"
+      banner: "Banner"
+      avatar-saved: "Avatar updated successfully"
+      banner-saved: "Banner updated successfully"
+      set-avatar: "Choose an avatar"
+      set-banner: "Choose a banner"
       save: "Save"
       saved: "Profile updated successfully"
 

locales/ja.yml

@@ -356,6 +356,12 @@ mobile:
       location: "場所"
       description: "自己紹介"
       birthday: "誕生日"
+      avatar: "アバター"
+      banner: "バナー"
+      avatar-saved: "アバターを保存しました"
+      banner-saved: "バナーを保存しました"
+      set-avatar: "アバターを選択する"
+      set-banner: "バナーを選択する"
       save: "保存"
       saved: "プロフィールを保存しました"
 

src/web/app/mobile/tags/page/settings/profile.tag

@@ -34,6 +34,14 @@
 		<p>%i18n:mobile.tags.mk-profile-setting.birthday%</p>
 		<input ref="birthday" type="date" value={ I.profile.birthday }/>
 	</label>
+	<label>
+		<p>%i18n:mobile.tags.mk-profile-setting.avatar%</p>
+		<button onclick={ setAvatar } disabled={ avatarSaving }>%i18n:mobile.tags.mk-profile-setting.set-avatar%</button>
+	</label>
+	<label>
+		<p>%i18n:mobile.tags.mk-profile-setting.banner%</p>
+		<button onclick={ setBanner } disabled={ bannerSaving }>%i18n:mobile.tags.mk-profile-setting.set-banner%</button>
+	</label>
 	<button class="save" onclick={ save } disabled={ saving }><i class="fa fa-check"></i>%i18n:mobile.tags.mk-profile-setting.save%</button>
 	<style>
 		:scope
@@ -84,6 +92,48 @@
 		this.mixin('i');
 		this.mixin('api');
 
+		this.setAvatar = () => {
+			const i = riot.mount(document.body.appendChild(document.createElement('mk-drive-selector')), {
+				multiple: false
+			})[0];
+			i.one('selected', file => {
+				this.update({
+					avatarSaving: true
+				});
+
+				this.api('i/update', {
+					avatar_id: file.id
+				}).then(() => {
+					this.update({
+						avatarSaving: false
+					});
+
+					alert('%i18n:mobile.tags.mk-profile-setting.avatar-saved%');
+				});
+			});
+		};
+
+		this.setBanner = () => {
+			const i = riot.mount(document.body.appendChild(document.createElement('mk-drive-selector')), {
+				multiple: false
+			})[0];
+			i.one('selected', file => {
+				this.update({
+					bannerSaving: true
+				});
+
+				this.api('i/update', {
+					banner_id: file.id
+				}).then(() => {
+					this.update({
+						bannerSaving: false
+					});
+
+					alert('%i18n:mobile.tags.mk-profile-setting.banner-saved%');
+				});
+			});
+		};
+
 		this.save = () => {
 			this.update({
 				saving: true