⚡ linked things

src/app/config/PollConfig.ts

@@ -44,6 +44,7 @@ export const defaultAnswers = [{
  * configuration of the poll, add new fields at will
  */
 export class PollConfig {
+    expiracyDateDefaultInDays = 60;
     step = 0;
     stepMax = 3;
     pollType = 'classic';// classic or date
@@ -56,11 +57,12 @@ export class PollConfig {
     // access
     visibility = 'link_only'; // visible to anyone with the link:
     voteChoices = 'only_yes'; // possible answers to a vote choice: only "yes", "yes, maybe, no"
-    expirationDate = new Date().toString().substr(0, 10); // expiracy date
+    expirationDate = ''; // expiracy date
     passwordAccess = 0;
     password = '';
     customUrl = '';
-    canModifyAnswers = "self";// everybody, self, nobody (= just admin)
+    canModifyAnswers = 1;// everybody, self, nobody (= just admin)
+    whoModifiesAnswers = "self";// everybody, self, nobody (= just admin)
     whoCanChangeAnswers = 'everybody';// everybody, self, nobody (= just admin)
     dateList: DateOption[] = defaultDates; // sets of days as strings, config to set identical time for days in a special days poll
     timeList: DateOption[] = timeOfDay; // ranges of time expressed as strings

src/app/pages/kind/kind.component.scss

@@ -5,9 +5,10 @@ section {
         border-bottom: 6px solid #000;
     }
 
-  & + & {
+    + section {
-      margin-top: 3rem;
+        margin: 0 !important;
     }
+
 }
 
 article {

src/app/pages/visibility/visibility.component.html

@@ -79,7 +79,8 @@
         <select
             name="modificationScope"
             id="modificationScope"
-            [(ngModel)]="config.canModifyAnswers">
+            [(ngModel)]="config.whoModifiesAnswers"
+            [disabled]="!config.canModifyAnswers">
             <option value="self">
                 {{"visibility.modfiy_their"|translate}}
             </option>
@@ -101,7 +102,9 @@
         <br>
         {{"visibility.access_url_key"|translate}}
     </label>
+    <br>
     <input type="text"
+           class="input-lg"
            name="url"
            id="url"
            [(ngModel)]="config.customUrl">

src/app/pages/visibility/visibility.component.ts

@@ -16,6 +16,7 @@ export class VisibilityComponent extends BaseComponent implements OnInit {
 
     ngOnInit() {
         this.config.customUrl = this.makeUuid();
+        this.config.expirationDate = (this.addDaysToDate(this.config.expiracyDateDefaultInDays, new Date())).toISOString().substring(0, 10);
     }
 
     /**
@@ -28,4 +29,15 @@ export class VisibilityComponent extends BaseComponent implements OnInit {
         });
     }
 
+    /**
+     * add some days to a date, to compute intervals
+     * @param days
+     * @param date
+     */
+    addDaysToDate(days: number, date: Date) {
+        date = new Date(date.valueOf());
+        date.setDate(date.getDate() + days);
+        return date;
+    };
+
 }

src/assets/scss/atoms/_forms.scss

@@ -1,9 +1,16 @@
 @charset "UTF-8";
-input[type="date"]::after{
+
-  content:"au format JJ/MM/AAAA";
+.input-lg {
+    display: block;
+    width: 100%;
+}
+
+input[type="date"]::after {
+    content: "au format JJ/MM/AAAA";
     display: inline-block;
     position: relative;
 }
+
 input,
 select,
 textarea {
@@ -16,8 +23,8 @@ textarea {
 input,
 select {
     display: inline-block;
-  margin-bottom:10px;
+    margin-bottom: 10px;
-  margin-left:5px;
+    margin-left: 5px;
 }
 
 textarea {
@@ -28,15 +35,15 @@ textarea {
 select,
 option {
     // delete default display
-  -webkit-appearance : none;
+    -webkit-appearance: none;
-  -moz-appearance : none;
+    -moz-appearance: none;
 
     background: none;
     border-radius: 0;
 
     background-color: transparent;
     background-image: url("./assets/img/fleche_bas.svg");
-  padding-right:1.5rem;
+    padding-right: 1.5rem;
 
     background-repeat: no-repeat;
     background-size: 9px 8px;

src/assets/scss/useful_classes.scss

@@ -4,3 +4,7 @@
     display: flex;
     justify-content: flex-end;
 }
+
+.pull-right {
+    float: right;
+}