Merge pull request #42 from interflux-electronics/feature/event-regis…

…tration

Event registrations

app/models/event-attendee.js

@@ -0,0 +1,12 @@
+import Model, { attr, belongsTo } from '@ember-data/model';
+
+export default class EventAttendeeModel extends Model {
+  @attr('string') firstName;
+  @attr('string') lastName;
+  @attr('string') role;
+  @attr('string') company;
+  @attr('string') email;
+
+  @belongsTo('event') event;
+  @belongsTo('person') person;
+}

app/models/event.js

@@ -1,4 +1,4 @@
-import Model, { attr, belongsTo } from '@ember-data/model';
+import Model, { attr, belongsTo, hasMany } from '@ember-data/model';
 
 export default class EventModel extends Model {
   @attr('string') name;
@@ -8,8 +8,21 @@ export default class EventModel extends Model {
   @attr('string') city;
   @attr('string') description;
 
+  @attr('boolean') hasRegistrationForm;
+  @attr('boolean') askFirstName;
+  @attr('boolean') askLastName;
+  @attr('boolean') askRole;
+  @attr('boolean') askCompany;
+
+  @attr('string') confirmationEmailSubject;
+  @attr('string') confirmationEmailBody;
+  @attr('string') confirmationEmailBcc;
+
   @belongsTo('country') country;
 
+  @hasMany('event-attendee') eventAttendees;
+  @hasMany('permalink') permalinks;
+
   get datesCombined() {
     if (!this.startDate) {
       return null;

app/models/permalink.js

@@ -1,11 +1,13 @@
-import Model, { attr } from '@ember-data/model';
+import Model, { attr, belongsTo } from '@ember-data/model';
 import ENV from 'interflux/config/environment';
 
 export default class PermalinkModel extends Model {
   @attr('string') slug;
   @attr('string') redirectTo;
   @attr('string') notes;
 
+  @belongsTo('event') event;
+
   get redirectFrom() {
     return `${ENV.publicHost}/QR/${this.slug}`;
   }

app/pods/components/button/style.scss

@@ -124,6 +124,7 @@ button {
     }
 
     // Used as save button modal form UIs
+    // TODO: rename to .button.small.green
     &.save {
       background: $green-1;
       color: white;

app/pods/components/dot-dot-dot-menu/style.scss

@@ -54,7 +54,7 @@
       }
     }
   }
-  .dropdown {
+  .popout {
     position: absolute;
     height: 0;
     top: 50%;
@@ -77,7 +77,6 @@
       button {
         display: flex;
         align-items: center;
-        display: flex;
         background: white;
         height: 40px;
         padding: 0;

app/pods/components/dot-dot-dot-menu/template.hbs

@@ -1,7 +1,7 @@
 <div class='dot-dot-dot-menu' {{did-insert this.onInsert}}>
   <Button @icon='ellipsis-vertical' @onClick={{this.onClick}} />
   {{#if this.showDropdown}}
-    <div class='dropdown'>
+    <div class='popout'>
       <div class='offset'>
         <div class='pane'>
           {{yield}}

app/pods/components/modal/style.scss

@@ -143,6 +143,24 @@
       > ul.list + h2 {
         margin-top: 20px;
       }
+      p + .buttons {
+        margin-top: 20px;
+      }
+      .buttons + .list {
+        margin-top: 20px;
+      }
+      > .error {
+        margin: 0 40px;
+      }
+      .buttons + .error {
+        margin-top: 20px;
+      }
+      .error + ul.list {
+        margin-top: 20px;
+      }
+      p + ul.list {
+        margin-top: 20px;
+      }
       hr {
         border: 0;
         border-top: 1px dashed $grey-2;
@@ -256,6 +274,14 @@
           .left {
             display: flex;
             align-items: center;
+            &.stacked {
+              flex-direction: column;
+              align-items: flex-start;
+              padding: 10px 14px;
+              p {
+                line-height: 150%;
+              }
+            }
             span.no-link {
               line-height: 46px;
               padding: 0 15px;
@@ -355,6 +381,13 @@
           padding: 0 4px;
         }
       }
+      > .buttons {
+        padding: 0 40px;
+        &.horizontal {
+          display: flex;
+          gap: 6px;
+        }
+      }
     }
     button.danger-red + p {
       margin-top: 20px;

app/pods/secure/events/event/controller.js

@@ -1,16 +1,115 @@
 import Controller from '@ember/controller';
 import { service } from '@ember/service';
 import { action } from '@ember/object';
+import { tracked } from '@glimmer/tracking';
 
 export default class EventController extends Controller {
   @service store;
   @service router;
 
+  @tracked error;
+
+  get event() {
+    return this.model.event;
+  }
+
+  get links() {
+    return this.event.permalinks.rejectBy('isNew').map((link) => {
+      const languages = {
+        'interflux.com': 'English',
+        'interflux.es': 'Spanish',
+        'interflux.de': 'German',
+        'interflux.fr': 'French'
+      };
+      const language = languages[link.host];
+
+      return {
+        label: `${language} link`,
+        permalink: link,
+        language
+      };
+    });
+  }
+
+  get hasEnglishLink() {
+    return this.links.any((link) => link.language === 'English');
+  }
+
+  get hasGermanLink() {
+    return this.links.any((link) => link.language === 'German');
+  }
+
+  get hasFrenchLink() {
+    return this.links.any((link) => link.language === 'French');
+  }
+
+  get hasSpanishLink() {
+    return this.links.any((link) => link.language === 'Spanish');
+  }
+
+  get hasAllLinks() {
+    return (
+      this.hasEnglishLink &&
+      this.hasGermanLink &&
+      this.hasFrenchLink &&
+      this.hasSpanishLink
+    );
+  }
+
   @action
   async destroyRecord() {
     console.warn(`destroying record ${this.model.event.id}`);
     await this.model.event.destroyRecord();
     console.warn('destroyed');
     this.router.transitionTo('secure.events');
   }
+
+  @action
+  createLink(language) {
+    console.log(`create permalink for ${language}`);
+
+    const hosts = {
+      English: 'interflux.com',
+      Spanish: 'interflux.es',
+      German: 'interflux.de',
+      French: 'interflux.fr'
+    };
+
+    const properties = {
+      slug: null, // to be auto-generated by Rails
+      redirectTo: `https://${hosts[language]}/event/${this.event.id}`,
+      notes: `This link opens the ${language} registration form for the evenet "${this.event.name}".`,
+      event: this.event
+    };
+
+    console.log(properties);
+
+    const permalink = this.store.createRecord('permalink', properties);
+
+    const success = () => {
+      console.log('success');
+    };
+
+    const fail = (error) => {
+      console.error('fail', error);
+      this.error = true;
+    };
+
+    const done = () => {
+      console.log('done');
+      // this.isSaving = false;
+    };
+
+    permalink
+      .save({
+        adapterOptions: {
+          whitelist: ['slug', 'redirectTo', 'notes', 'event']
+        }
+      })
+      .then(success)
+      .catch(fail)
+      .finally(done);
+
+    console.log(permalink);
+  }
 }

app/pods/secure/events/event/route.js

@@ -5,7 +5,7 @@ export default class WebinarRoute extends ModalRoute {
   model(params) {
     return hash({
       event: this.store.findRecord('event', params.id, {
-        include: ['country'].join(',')
+        include: ['country', 'permalinks', 'event_attendees'].join(',')
       })
     });
   }