From bacc1810f8618db55e6fd26ee50e65514819c556 Mon Sep 17 00:00:00 2001
From: dartcafe <github@dartcafe.de>
Date: Sun, 1 Mar 2020 10:11:39 +0100
Subject: [PATCH 1/3] create date option sequence - initial commit

---
 src/js/components/Base/PollItemDate.vue       |   8 +-
 src/js/components/Base/PollItemText.vue       |   4 +-
 .../SideBar/SideBarTabOptionsDate.vue         | 113 +++++++++++++++---
 src/js/store/modules/options.js               |   6 +-
 4 files changed, 106 insertions(+), 25 deletions(-)

diff --git a/src/js/components/Base/PollItemDate.vue b/src/js/components/Base/PollItemDate.vue
index 5a6a57518..a504ccec7 100644
--- a/src/js/components/Base/PollItemDate.vue
+++ b/src/js/components/Base/PollItemDate.vue
@@ -23,7 +23,7 @@
 <template>
 	<li class="poll-item date">
 		<div class="pollOption">
-			{{ moment.unix(option.timestamp).format('LLLL') }}
+			{{ moment.unix(option.timestamp).format('llll') }}
 		</div>
 		<slot name="actions" />
 	</li>
@@ -62,7 +62,7 @@ export default {
 		padding-right: 8px;
 		line-height: 2em;
 		min-height: 4em;
-		overflow: hidden;
+		overflow: visible;
 		white-space: nowrap;
 
 		&:active,
@@ -74,8 +74,8 @@ export default {
 		> div {
 			display: flex;
 			flex: 1;
-			font-size: 1.2em;
-			opacity: 0.7;
+			// font-size: 1.2em;
+			opacity: 1;
 			white-space: normal;
 			padding-right: 4px;
 			&.avatar {
diff --git a/src/js/components/Base/PollItemText.vue b/src/js/components/Base/PollItemText.vue
index 3d823b38a..45710bee2 100644
--- a/src/js/components/Base/PollItemText.vue
+++ b/src/js/components/Base/PollItemText.vue
@@ -76,7 +76,7 @@ export default {
 		padding-right: 8px;
 		line-height: 2em;
 		min-height: 4em;
-		overflow: hidden;
+		overflow: visible;
 		white-space: nowrap;
 		&:active,
 		&:hover {
@@ -88,7 +88,7 @@ export default {
 			display: flex;
 			flex: 1;
 			font-size: 1.2em;
-			opacity: 0.7;
+			opacity: 1;
 			white-space: normal;
 			padding-right: 4px;
 			&.avatar {
diff --git a/src/js/components/SideBar/SideBarTabOptionsDate.vue b/src/js/components/SideBar/SideBarTabOptionsDate.vue
index ccbd1a78f..0a2ce7c16 100644
--- a/src/js/components/SideBar/SideBarTabOptionsDate.vue
+++ b/src/js/components/SideBar/SideBarTabOptionsDate.vue
@@ -39,17 +39,17 @@
 			</label>
 			<div>
 				<div class="selectUnit">
-					<input v-model="move.step">
+					<input v-model="shift.step">
 					<Multiselect
-						v-model="move.unit"
-						:options="move.units"
+						v-model="shift.unit"
+						:options="dateUnits"
 						label="name"
 						track-by="value" />
 				</div>
 			</div>
 			<div>
 				<ButtonDiv icon="icon-history" :title="t('polls', 'Shift')"
-					@click="shiftDates(move)" />
+					@click="shiftDates(shift)" />
 			</div>
 		</div>
 
@@ -65,15 +65,44 @@
 						<ActionButton icon="icon-delete" @click="removeOption(option)">
 							{{ t('polls', 'Delete option') }}
 						</ActionButton>
+						<ActionButton icon="icon-add" @click="cloneOptionModal(option)">
+							{{ t('polls', 'Clone option') }}
+						</ActionButton>
 					</Actions>
 				</template>
 			</PollItemDate>
 		</ul>
+		<Modal v-if="modal" :can-close="false">
+			<div class="modal__content">
+				<h2>{{ t('polls', 'Clone to option sequence') }}</h2>
+
+				<p>{{ t('polls', 'Create a sequence of date options starting with {dateOption}.', { dateOption: moment.unix(sequence.baseOption.timestamp).format('LLLL')}) }}</p>
+				<div>
+					<label class="title"> {{ t('polls', 'Step width: ') }} </label>
+					<input v-model="sequence.step">
+					<label class="title"> {{ t('polls', 'Step unit: ') }} </label>
+					<Multiselect
+						v-model="sequence.unit"
+						:options="dateUnits"
+						label="name"
+						track-by="value" />
+					<label class="title"> {{ t('polls', 'Number of items to create: ') }} </label>
+					<input v-model="sequence.amount">
+				</div>
+
+				<div class="modal__buttons">
+					<ButtonDiv :title="t('polls', 'Cancel')"
+						@click="closeModal" />
+					<ButtonDiv :primary="true" :title="t('polls', 'CreateSequence')"
+						@click="createSequence" />
+				</div>
+			</div>
+		</Modal>
 	</div>
 </template>
 
 <script>
-import { Actions, ActionButton, DatetimePicker, Multiselect } from '@nextcloud/vue'
+import { Actions, ActionButton, DatetimePicker, Modal, Multiselect } from '@nextcloud/vue'
 import { mapGetters, mapState } from 'vuex'
 import PollItemDate from '../Base/PollItemDate'
 
@@ -83,25 +112,33 @@ export default {
 	components: {
 		Actions,
 		ActionButton,
+		DatetimePicker,
+		Modal,
 		Multiselect,
-		PollItemDate,
-		DatetimePicker
+		PollItemDate
 	},
 
 	data() {
 		return {
 			lastOption: '',
-			move: {
-				step: 1,
+			modal: false,
+			sequence: {
+				baseOption: {},
 				unit: { name: t('polls', 'Week'), value: 'week' },
-				units: [
-					{ name: t('polls', 'Minute'), value: 'minute' },
-					{ name: t('polls', 'Hour'), value: 'hour' },
-					{ name: t('polls', 'Day'), value: 'day' },
-					{ name: t('polls', 'Week'), value: 'week' },
-					{ name: t('polls', 'Month'), value: 'month' },
-					{ name: t('polls', 'Year'), value: 'year' }
-				]
+				step: 1,
+				amount: 1
+			},
+			dateUnits: [
+				{ name: t('polls', 'Minute'), value: 'minute' },
+				{ name: t('polls', 'Hour'), value: 'hour' },
+				{ name: t('polls', 'Day'), value: 'day' },
+				{ name: t('polls', 'Week'), value: 'week' },
+				{ name: t('polls', 'Month'), value: 'month' },
+				{ name: t('polls', 'Year'), value: 'year' }
+			],
+			shift: {
+				step: 1,
+				unit: { name: t('polls', 'Week'), value: 'week' }
 			}
 		}
 	},
@@ -126,7 +163,6 @@ export default {
 		optionDatePicker() {
 			return {
 				editable: false,
-				minuteStep: 1,
 				type: 'datetime',
 				format: moment.localeData().longDateFormat('L') + ' ' + moment.localeData().longDateFormat('LT'),
 
@@ -170,6 +206,28 @@ export default {
 			})
 		},
 
+		closeModal() {
+			this.modal = false
+		},
+
+		createSequence() {
+			for (var i = 0; i < this.sequence.amount; i++) {
+				this.$store.dispatch('addOptionAsync', {
+					pollOptionText: moment.unix(this.sequence.baseOption.timestamp).add(
+						this.sequence.step * (i + 1),
+						this.sequence.unit.value
+					).format('YYYY-MM-DD HH:mm:ss')
+				})
+			}
+			this.modal = false
+			this.sequence.baseOption = {}
+		},
+
+		cloneOptionModal(option) {
+			this.modal = true
+			this.sequence.baseOption = option
+		},
+
 		removeOption(option) {
 			this.$store.dispatch('removeOptionAsync', { option: option })
 		}
@@ -180,6 +238,25 @@ export default {
 </script>
 
 <style lang="scss">
+	.modal__content {
+		padding: 14px;
+		display: flex;
+		flex-direction: column;
+		color: var(--color-main-text);
+		input {
+			width: 100%;
+		}
+	}
+
+	.modal__buttons {
+		display: flex;
+		justify-content: end;
+		.button {
+			margin-left: 10px;
+			margin-right: 0;
+		}
+	}
+
 	.config-box {
 		display: flex;
 		flex-direction: column;
diff --git a/src/js/store/modules/options.js b/src/js/store/modules/options.js
index 7de519c1b..e15d9a4eb 100644
--- a/src/js/store/modules/options.js
+++ b/src/js/store/modules/options.js
@@ -127,7 +127,11 @@ const actions = {
 		option.pollId = context.rootState.poll.id
 
 		if (context.rootState.poll.type === 'datePoll') {
-			option.timestamp = moment(payload.pollOptionText).unix()
+			if (payload.timestamp) {
+				option.timestamp = payload.timestamp
+			} else {
+				option.timestamp = moment(payload.pollOptionText).unix()
+			}
 			option.order = option.timestamp
 			option.pollOptionText = moment.utc(payload.pollOptionText).format('YYYY-MM-DD HH:mm:ss')
 

From 99b70d3c01fe289537d0ac70c2b07b4b49c9b63d Mon Sep 17 00:00:00 2001
From: dartcafe <github@dartcafe.de>
Date: Sun, 1 Mar 2020 10:11:39 +0100
Subject: [PATCH 2/3] create date option sequence - initial commit

---
 src/js/components/Base/PollItemDate.vue       |   8 +-
 src/js/components/Base/PollItemText.vue       |   4 +-
 .../SideBar/SideBarTabOptionsDate.vue         | 113 +++++++++++++++---
 src/js/store/modules/options.js               |   6 +-
 4 files changed, 106 insertions(+), 25 deletions(-)

diff --git a/src/js/components/Base/PollItemDate.vue b/src/js/components/Base/PollItemDate.vue
index 5a6a57518..a504ccec7 100644
--- a/src/js/components/Base/PollItemDate.vue
+++ b/src/js/components/Base/PollItemDate.vue
@@ -23,7 +23,7 @@
 <template>
 	<li class="poll-item date">
 		<div class="pollOption">
-			{{ moment.unix(option.timestamp).format('LLLL') }}
+			{{ moment.unix(option.timestamp).format('llll') }}
 		</div>
 		<slot name="actions" />
 	</li>
@@ -62,7 +62,7 @@ export default {
 		padding-right: 8px;
 		line-height: 2em;
 		min-height: 4em;
-		overflow: hidden;
+		overflow: visible;
 		white-space: nowrap;
 
 		&:active,
@@ -74,8 +74,8 @@ export default {
 		> div {
 			display: flex;
 			flex: 1;
-			font-size: 1.2em;
-			opacity: 0.7;
+			// font-size: 1.2em;
+			opacity: 1;
 			white-space: normal;
 			padding-right: 4px;
 			&.avatar {
diff --git a/src/js/components/Base/PollItemText.vue b/src/js/components/Base/PollItemText.vue
index 3d823b38a..45710bee2 100644
--- a/src/js/components/Base/PollItemText.vue
+++ b/src/js/components/Base/PollItemText.vue
@@ -76,7 +76,7 @@ export default {
 		padding-right: 8px;
 		line-height: 2em;
 		min-height: 4em;
-		overflow: hidden;
+		overflow: visible;
 		white-space: nowrap;
 		&:active,
 		&:hover {
@@ -88,7 +88,7 @@ export default {
 			display: flex;
 			flex: 1;
 			font-size: 1.2em;
-			opacity: 0.7;
+			opacity: 1;
 			white-space: normal;
 			padding-right: 4px;
 			&.avatar {
diff --git a/src/js/components/SideBar/SideBarTabOptionsDate.vue b/src/js/components/SideBar/SideBarTabOptionsDate.vue
index ccbd1a78f..0a2ce7c16 100644
--- a/src/js/components/SideBar/SideBarTabOptionsDate.vue
+++ b/src/js/components/SideBar/SideBarTabOptionsDate.vue
@@ -39,17 +39,17 @@
 			</label>
 			<div>
 				<div class="selectUnit">
-					<input v-model="move.step">
+					<input v-model="shift.step">
 					<Multiselect
-						v-model="move.unit"
-						:options="move.units"
+						v-model="shift.unit"
+						:options="dateUnits"
 						label="name"
 						track-by="value" />
 				</div>
 			</div>
 			<div>
 				<ButtonDiv icon="icon-history" :title="t('polls', 'Shift')"
-					@click="shiftDates(move)" />
+					@click="shiftDates(shift)" />
 			</div>
 		</div>
 
@@ -65,15 +65,44 @@
 						<ActionButton icon="icon-delete" @click="removeOption(option)">
 							{{ t('polls', 'Delete option') }}
 						</ActionButton>
+						<ActionButton icon="icon-add" @click="cloneOptionModal(option)">
+							{{ t('polls', 'Clone option') }}
+						</ActionButton>
 					</Actions>
 				</template>
 			</PollItemDate>
 		</ul>
+		<Modal v-if="modal" :can-close="false">
+			<div class="modal__content">
+				<h2>{{ t('polls', 'Clone to option sequence') }}</h2>
+
+				<p>{{ t('polls', 'Create a sequence of date options starting with {dateOption}.', { dateOption: moment.unix(sequence.baseOption.timestamp).format('LLLL')}) }}</p>
+				<div>
+					<label class="title"> {{ t('polls', 'Step width: ') }} </label>
+					<input v-model="sequence.step">
+					<label class="title"> {{ t('polls', 'Step unit: ') }} </label>
+					<Multiselect
+						v-model="sequence.unit"
+						:options="dateUnits"
+						label="name"
+						track-by="value" />
+					<label class="title"> {{ t('polls', 'Number of items to create: ') }} </label>
+					<input v-model="sequence.amount">
+				</div>
+
+				<div class="modal__buttons">
+					<ButtonDiv :title="t('polls', 'Cancel')"
+						@click="closeModal" />
+					<ButtonDiv :primary="true" :title="t('polls', 'CreateSequence')"
+						@click="createSequence" />
+				</div>
+			</div>
+		</Modal>
 	</div>
 </template>
 
 <script>
-import { Actions, ActionButton, DatetimePicker, Multiselect } from '@nextcloud/vue'
+import { Actions, ActionButton, DatetimePicker, Modal, Multiselect } from '@nextcloud/vue'
 import { mapGetters, mapState } from 'vuex'
 import PollItemDate from '../Base/PollItemDate'
 
@@ -83,25 +112,33 @@ export default {
 	components: {
 		Actions,
 		ActionButton,
+		DatetimePicker,
+		Modal,
 		Multiselect,
-		PollItemDate,
-		DatetimePicker
+		PollItemDate
 	},
 
 	data() {
 		return {
 			lastOption: '',
-			move: {
-				step: 1,
+			modal: false,
+			sequence: {
+				baseOption: {},
 				unit: { name: t('polls', 'Week'), value: 'week' },
-				units: [
-					{ name: t('polls', 'Minute'), value: 'minute' },
-					{ name: t('polls', 'Hour'), value: 'hour' },
-					{ name: t('polls', 'Day'), value: 'day' },
-					{ name: t('polls', 'Week'), value: 'week' },
-					{ name: t('polls', 'Month'), value: 'month' },
-					{ name: t('polls', 'Year'), value: 'year' }
-				]
+				step: 1,
+				amount: 1
+			},
+			dateUnits: [
+				{ name: t('polls', 'Minute'), value: 'minute' },
+				{ name: t('polls', 'Hour'), value: 'hour' },
+				{ name: t('polls', 'Day'), value: 'day' },
+				{ name: t('polls', 'Week'), value: 'week' },
+				{ name: t('polls', 'Month'), value: 'month' },
+				{ name: t('polls', 'Year'), value: 'year' }
+			],
+			shift: {
+				step: 1,
+				unit: { name: t('polls', 'Week'), value: 'week' }
 			}
 		}
 	},
@@ -126,7 +163,6 @@ export default {
 		optionDatePicker() {
 			return {
 				editable: false,
-				minuteStep: 1,
 				type: 'datetime',
 				format: moment.localeData().longDateFormat('L') + ' ' + moment.localeData().longDateFormat('LT'),
 
@@ -170,6 +206,28 @@ export default {
 			})
 		},
 
+		closeModal() {
+			this.modal = false
+		},
+
+		createSequence() {
+			for (var i = 0; i < this.sequence.amount; i++) {
+				this.$store.dispatch('addOptionAsync', {
+					pollOptionText: moment.unix(this.sequence.baseOption.timestamp).add(
+						this.sequence.step * (i + 1),
+						this.sequence.unit.value
+					).format('YYYY-MM-DD HH:mm:ss')
+				})
+			}
+			this.modal = false
+			this.sequence.baseOption = {}
+		},
+
+		cloneOptionModal(option) {
+			this.modal = true
+			this.sequence.baseOption = option
+		},
+
 		removeOption(option) {
 			this.$store.dispatch('removeOptionAsync', { option: option })
 		}
@@ -180,6 +238,25 @@ export default {
 </script>
 
 <style lang="scss">
+	.modal__content {
+		padding: 14px;
+		display: flex;
+		flex-direction: column;
+		color: var(--color-main-text);
+		input {
+			width: 100%;
+		}
+	}
+
+	.modal__buttons {
+		display: flex;
+		justify-content: end;
+		.button {
+			margin-left: 10px;
+			margin-right: 0;
+		}
+	}
+
 	.config-box {
 		display: flex;
 		flex-direction: column;
diff --git a/src/js/store/modules/options.js b/src/js/store/modules/options.js
index 7de519c1b..e15d9a4eb 100644
--- a/src/js/store/modules/options.js
+++ b/src/js/store/modules/options.js
@@ -127,7 +127,11 @@ const actions = {
 		option.pollId = context.rootState.poll.id
 
 		if (context.rootState.poll.type === 'datePoll') {
-			option.timestamp = moment(payload.pollOptionText).unix()
+			if (payload.timestamp) {
+				option.timestamp = payload.timestamp
+			} else {
+				option.timestamp = moment(payload.pollOptionText).unix()
+			}
 			option.order = option.timestamp
 			option.pollOptionText = moment.utc(payload.pollOptionText).format('YYYY-MM-DD HH:mm:ss')
 

From 434fe094c197a882114643452a1c6d1f1cc3047c Mon Sep 17 00:00:00 2001
From: dartcafe <github@dartcafe.de>
Date: Tue, 3 Mar 2020 20:48:15 +0100
Subject: [PATCH 3/3] little styling

---
 src/js/components/SideBar/SideBarTabOptionsDate.vue | 12 +++++-------
 1 file changed, 5 insertions(+), 7 deletions(-)

diff --git a/src/js/components/SideBar/SideBarTabOptionsDate.vue b/src/js/components/SideBar/SideBarTabOptionsDate.vue
index 0a2ce7c16..0f4b923af 100644
--- a/src/js/components/SideBar/SideBarTabOptionsDate.vue
+++ b/src/js/components/SideBar/SideBarTabOptionsDate.vue
@@ -78,23 +78,21 @@
 
 				<p>{{ t('polls', 'Create a sequence of date options starting with {dateOption}.', { dateOption: moment.unix(sequence.baseOption.timestamp).format('LLLL')}) }}</p>
 				<div>
-					<label class="title"> {{ t('polls', 'Step width: ') }} </label>
+					<h3> {{ t('polls', 'Step width: ') }} </h3>
 					<input v-model="sequence.step">
-					<label class="title"> {{ t('polls', 'Step unit: ') }} </label>
+					<h3> {{ t('polls', 'Step unit: ') }} </h3>
 					<Multiselect
 						v-model="sequence.unit"
 						:options="dateUnits"
 						label="name"
 						track-by="value" />
-					<label class="title"> {{ t('polls', 'Number of items to create: ') }} </label>
+					<h3> {{ t('polls', 'Number of items to create: ') }} </h3>
 					<input v-model="sequence.amount">
 				</div>
 
 				<div class="modal__buttons">
-					<ButtonDiv :title="t('polls', 'Cancel')"
-						@click="closeModal" />
-					<ButtonDiv :primary="true" :title="t('polls', 'CreateSequence')"
-						@click="createSequence" />
+					<ButtonDiv :title="t('polls', 'Cancel')" @click="closeModal" />
+					<ButtonDiv :primary="true" :title="t('polls', 'OK')" @click="createSequence" />
 				</div>
 			</div>
 		</Modal>