Let public users change their email address

Signed-off-by: dartcafe <github@dartcafe.de>

appinfo/routes.php

@@ -30,6 +30,7 @@ return [
 		['name' => 'public#get_options', 'url' => '/s/{token}/options', 'verb' => 'GET'],
 		['name' => 'public#get_votes', 'url' => '/s/{token}/votes', 'verb' => 'GET'],
 		['name' => 'public#get_subscription', 'url' => '/s/{token}/subscription', 'verb' => 'GET'],
+		['name' => 'public#set_email_address', 'url' => '/s/{token}/email', 'verb' => 'PUT'],
 
 		['name' => 'public#set_vote', 'url' => '/s/{token}/vote', 'verb' => 'PUT'],
 		['name' => 'public#add_comment', 'url' => '/s/{token}/comment', 'verb' => 'POST'],

lib/Controller/PublicController.php

@@ -316,6 +316,18 @@ class PublicController extends Controller {
 		}
 	}
 
+	/**
+	 * Set EmailAddress
+	 * @PublicPage
+	 * @NoAdminRequired
+	 */
+	public function setEmailAddress(string $token, ?string $emailAddress = ''): DataResponse {
+		return $this->response(function () use ($token, $emailAddress) {
+			return ['share' => $this->shareService->setEmailAddress($token, $emailAddress, true)];
+		});
+	}
+
+
 	/**
 	 * Create a personal share from a public share
 	 * or update an email share with the username

lib/Controller/ShareController.php

@@ -99,7 +99,7 @@ class ShareController extends Controller {
 	 * Add share
 	 * @NoAdminRequired
 	 */
-	public function add($pollId, $type, $userId = ''): DataResponse {
+	public function add(int $pollId, string $type, $userId = ''): DataResponse {
 		return $this->responseCreate(function () use ($pollId, $type, $userId) {
 			return ['share' => $this->shareService->add($pollId, $type, $userId)];
 		});
@@ -109,7 +109,7 @@ class ShareController extends Controller {
 	 * Set email address
 	 * @NoAdminRequired
 	 */
-	public function setEmailAddress($token, $emailAddress): DataResponse {
+	public function setEmailAddress(string $token, ?string $emailAddress = ''): DataResponse {
 		return $this->response(function () use ($token, $emailAddress) {
 			return ['share' => $this->shareService->setEmailAddress($token, $emailAddress)];
 		});

lib/Service/ShareService.php

@@ -237,7 +237,7 @@ class ShareService {
 	 *
 	 * @return Share
 	 */
-	public function setEmailAddress(string $token, string $emailAddress): Share {
+	public function setEmailAddress(string $token, string $emailAddress, bool $emptyIsValid = false): Share {
 		try {
 			$this->share = $this->shareMapper->findByToken($token);
 		} catch (DoesNotExistException $e) {
@@ -245,7 +245,7 @@ class ShareService {
 		}
 
 		if ($this->share->getType() === Share::TYPE_EXTERNAL) {
-			$this->systemService->validateEmailAddress($emailAddress);
+			$this->systemService->validateEmailAddress($emailAddress, $emptyIsValid);
 			$this->share->setEmailAddress($emailAddress);
 			// TODO: Send confirmation
 			return $this->shareMapper->update($this->share);

src/js/components/Base/InputDiv.vue

@@ -26,10 +26,11 @@
 		<input ref="input"
 			:value="value"
 			:placeholder="placeholder"
-			class="input"
+			:class="['input', inputClass]"
-			@keyup.enter="$emit('input', $event.target.value)">
+			@input="$emit('update:value', $event.target.value)"
-		<ButtonDiv v-if="!useNumModifiers && !noSubmit" submit @click="$emit('input', $refs.input.value)" />
+			@keyup.enter="$emit('submit', $event.target.value)">
 		<div v-if="useNumModifiers" class="modifyer add icon icon-add" @click="$emit('add')" />
+		<ButtonDiv v-if="!useNumModifiers && !noSubmit" submit @click="$emit('submit', $refs.input.value)" />
 	</div>
 </template>
 
@@ -49,6 +50,10 @@ export default {
 			type: [String, Number],
 			required: true,
 		},
+		inputClass: {
+			type: String,
+			default: '',
+		},
 		placeholder: {
 			type: String,
 			default: '',

src/js/components/Base/PublicEmail.vue

@@ -0,0 +1,160 @@
+<!--
+  - @copyright Copyright (c) 2018 René Gieling <github@dartcafe.de>
+  -
+  - @author René Gieling <github@dartcafe.de>
+  -
+  - @license GNU AGPL version 3 or any later version
+  -
+  - This program is free software: you can redistribute it and/or modify
+  - it under the terms of the GNU Affero General Public License as
+  - published by the Free Software Foundation, either version 3 of the
+  - License, or (at your option) any later version.
+  -
+  - This program is distributed in the hope that it will be useful,
+  - but WITHOUT ANY WARRANTY; without even the implied warranty of
+  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  - GNU Affero General Public License for more details.
+  -
+  - You should have received a copy of the GNU Affero General Public License
+  - along with this program.  If not, see <http://www.gnu.org/licenses/>.
+  -
+  -->
+
+<template>
+	<div class="public-email">
+		<!-- <div class="input-wrapper">
+			<input v-model="emailAddress" v-tooltip="check.result" :class="['input', check.status]"
+				:placeholder="t('polls', 'Optional email address')" @keyup.enter="submitEmailAddress">
+			<ButtonDiv submit @click="submitEmailAddress" />
+		</div> -->
+
+		<InputDiv v-tooltip="check.result"
+			:value.sync="emailAddress"
+			:class="check.status"
+			:input-class="check.status"
+			:placeholder="t('polls', 'Optional email address')"
+			@submit="submitEmailAddress" />
+		<h3>{{ t("polls", "With your email address you can subscribe to notifications and you will receive your personal link to this poll.") }}</h3>
+	</div>
+</template>
+
+<script>
+import debounce from 'lodash/debounce'
+import axios from '@nextcloud/axios'
+// import ButtonDiv from '../Base/ButtonDiv'
+import InputDiv from '../Base/InputDiv'
+import { showError, showSuccess } from '@nextcloud/dialogs'
+import { generateUrl } from '@nextcloud/router'
+import { mapState } from 'vuex'
+
+export default {
+	name: 'PublicEmail',
+
+	components: {
+		// ButtonDiv,
+		InputDiv,
+	},
+
+	data() {
+		return {
+			checkingEmailAddress: false,
+			isValidEmailAddress: false,
+		}
+	},
+
+	computed: {
+		...mapState({
+			share: state => state.share,
+		}),
+
+		emailAddress: {
+			get() {
+				return this.share.emailAddress
+			},
+			set(value) {
+				this.$store.commit('share/setEmailAddress', value)
+			},
+		},
+
+		check() {
+			if (this.checkingEmailAddress) {
+				return {
+					result: t('polls', 'Checking email address …'),
+					status: 'checking',
+				}
+			} else {
+				if (this.emailAddress.length < 1) {
+					return {
+						result: '',
+						status: '',
+					}
+				} else if (!this.isValidEmailAddress) {
+					return {
+						result: t('polls', 'Invalid email address.'),
+						status: 'error',
+					}
+				} else {
+					return {
+						result: t('polls', 'valid email address.'),
+						status: 'success',
+					}
+				}
+			}
+		},
+	},
+
+	watch: {
+		emailAddress: function() {
+			if (this.emailAddress.length > 0) {
+				this.checkingEmailAddress = true
+				this.validateEmailAddress()
+			} else {
+				this.checkingEmailAddress = false
+				this.isValidEmailAddress = false
+			}
+		},
+	},
+
+	methods: {
+		validateEmailAddress: debounce(function() {
+			if (this.emailAddress.length > 0) {
+				return axios.get(generateUrl('apps/polls/check/emailaddress') + '/' + this.emailAddress)
+					.then(() => {
+						this.isValidEmailAddress = true
+						this.checkingEmailAddress = false
+					})
+					.catch(() => {
+						this.isValidEmailAddress = false
+						this.checkingEmailAddress = false
+					})
+			} else {
+				this.isValidEmailAddress = false
+				this.checkingEmailAddress = false
+			}
+		}, 500),
+
+		submitEmailAddress() {
+			if (this.isValidEmailAddress || this.emailAddress.length === 0) {
+				this.$store.dispatch('share/updateEmailAddress', { emailAddress: this.emailAddress })
+					.then((response) => {
+						showSuccess(t('polls', 'Email address {emailAddress} saved.', { emailAddress: this.emailAddress }))
+					})
+					.catch(() => {
+						showError(t('polls', 'Error saving email address {emailAddress}', { emailAddress: this.emailAddress }))
+					})
+			}
+		},
+	},
+}
+</script>
+
+<style lang="scss" scoped>
+.input-wrapper {
+	display: flex;
+}
+
+input {
+	width: 240px;
+}
+
+</style>

src/js/components/Comments/CommentAdd.vue

@@ -24,7 +24,7 @@
 	<div class="comment">
 		<UserItem v-bind="acl" />
 		<InputDiv v-model="comment" class="addComment" :placeholder="t('polls', 'New comment …')"
-			@input="writeComment()" />
+			@submit="writeComment()" />
 	</div>
 </template>
 

src/js/components/Options/OptionsTextAdd.vue

@@ -23,7 +23,7 @@
 <template>
 	<ConfigBox v-if="!closed" :title="t('polls', 'Add a new text option')" icon-class="icon-add">
 		<InputDiv v-model="newPollText" :placeholder="t('polls', 'Enter option text')"
-			@input="addOption()" />
+			@submit="addOption()" />
 	</ConfigBox>
 </template>
 

src/js/store/modules/share.js

@@ -46,6 +46,10 @@ const mutations = {
 		Object.assign(state, payload.share)
 	},
 
+	setEmailAddress(state, payload) {
+		state.emailAddress = payload
+	},
+
 	reset(state) {
 		Object.assign(state, defaultShares())
 	},
@@ -93,6 +97,28 @@ const actions = {
 
 	},
 
+	updateEmailAddress(context, payload) {
+		let endPoint = 'apps/polls'
+		if (context.rootState.route.name === 'publicVote') {
+			endPoint = endPoint + '/s/' + context.rootState.route.params.token
+		} else {
+			return
+		}
+
+		return axios.put(generateUrl(endPoint + '/email'), {
+			emailAddress: payload.emailAddress,
+		})
+			.then((response) => {
+				context.commit('set', { share: response.data.share })
+				return response.data
+			})
+			.catch((error) => {
+				console.error('Error writing email address', { error: error.response }, { payload: payload })
+				throw error
+			})
+
+	},
+
 	resendInvitation(context, payload) {
 		let endPoint = 'apps/polls'
 		if (context.rootState.route.name === 'publicVote') {

src/js/views/Vote.vue

@@ -84,6 +84,7 @@
 		</div>
 
 		<div class="area__footer">
+			<PublicEmail />
 			<Subscription v-if="acl.allowSubscribe" />
 			<ParticipantsList v-if="acl.allowSeeUsernames" />
 		</div>
@@ -108,6 +109,7 @@ import ParticipantsList from '../components/Base/ParticipantsList'
 import PersonalLink from '../components/Base/PersonalLink'
 import PollInformation from '../components/Base/PollInformation'
 import PublicRegisterModal from '../components/Base/PublicRegisterModal'
+import PublicEmail from '../components/Base/PublicEmail'
 import Subscription from '../components/Subscription/Subscription'
 import VoteTable from '../components/VoteTable/VoteTable'
 
@@ -124,6 +126,7 @@ export default {
 		PersonalLink,
 		PollInformation,
 		PublicRegisterModal,
+		PublicEmail,
 		Subscription,
 		VoteTable,
 	},