Updated link in Development branch section in README.md

README.md

@@ -76,7 +76,7 @@ It consumes the API exposed by master branch deployment of open event server, ho
 #### Development branch
 
 The **development** branch of open-event-frontend gets deployed at [https://open-event-frontend.now.sh/](https://open-event-frontend.now.sh/)
-It consumes the API exposed by development branch of open event server, hosted at [https://test.eventyay.com](https://test.eventyay.com)
+It consumes the API exposed by development branch of open event server, hosted at [https://test-api.eventyay.com/](https://test-api.eventyay.com)
 
 ### Release Cycle
 

app/components/forms/add-tag-form.hbs

@@ -0,0 +1,46 @@
+<div class="d-flex align-center mb-4">
+  <h2 class="header m-0">
+    {{t 'Tags'}}
+  </h2>
+</div>
+<div class="ui form">
+  <div class="field">
+    {{#each this.tagList as |tag index|}}
+      <div class="{{if this.device.isMobile 'grouped'}} fields">
+        <div class="{{unless this.device.isMobile 'three wide'}} field">
+          <Input 
+            @type="text" 
+            @name="tag" 
+            @value={{tag.name}} 
+            placeholder={{t "Name" }} 
+            @readonly={{tag.isReadOnly}}
+            required
+          />
+        </div>
+        <div class="{{unless this.device.isMobile 'four wide'}} field tag-form">
+          <Widgets::Forms::ColorPicker @value={{tag.color}} @fontColor={{tag.fontColor}} required>
+            {{#unless tag.isReadOnly}}
+              <button class="ui icon red button remove-tag" type="button" {{action 'removeItem' tag}}>
+                <i class="minus icon"></i>
+              </button>
+            {{/unless}}
+            {{#if (eq index ( sub this.tagList.length 1 ) ) }}
+            <button class="ui icon primary button add-tag" type="button" {{action 'addItem' 'tag' }}>
+              <i class="plus icon"></i>
+            </button>
+            {{/if}}
+          </Widgets::Forms::ColorPicker>
+        </div>
+        <div class="{{unless this.device.isMobile 'two wide'}} field">
+          <input title="Preview" class="preview" value="{{if tag.name tag.name (t 'Preview Text')}}" readonly
+            style={{css background-color=tag.color color=(text-color tag.color)}}>
+        </div>
+      </div>
+    {{/each}}
+  </div>
+  <button type="submit" class="ui teal submit button update-changes mt-4" {{action 'submit'}}>
+    {{t 'Submit'}}
+  </button>
+  <br>
+  <p>{{t 'You need to hit "Submit" to save your changes.'}}</p>
+</div>

app/components/forms/add-tag-form.js

@@ -0,0 +1,69 @@
+import classic from 'ember-classic-decorator';
+import Component from '@ember/component';
+import { action, computed } from '@ember/object';
+import FormMixin from 'open-event-frontend/mixins/form';
+import { inject as service } from '@ember/service';
+import { tracked } from '@glimmer/tracking';
+
+@classic
+export default class AddTagForm extends Component.extend(FormMixin) {
+  @service errorHandler;
+  @tracked tagsDeleted = [];
+
+  @computed('[email protected]', 'tagsDeleted.@each')
+  get tagList() {
+    return this.data.tags.filter(tag => !this.tagsDeleted.includes(tag));
+  }
+
+  willDestroyElement() {
+    const tagsNeedRemove = [];
+    this.data.tags.forEach(tag => {
+      if (!tag.id) {
+        tagsNeedRemove.pushObject(tag);
+      } else {
+        if (tag?.changedAttributes()) {
+          tag.rollbackAttributes();
+        }
+      }
+    });
+    if (tagsNeedRemove.length > 0) {
+      this.data.tags.removeObjects(tagsNeedRemove);
+    }
+    this._super(...arguments);
+  }
+
+  @action
+  addItem() {
+    this.data.tags.pushObject(this.store.createRecord('tag'));
+  }
+
+  @action
+  removeItem(tag) {
+    if (tag.id) {
+      this.tagsDeleted.pushObject(tag);
+    } else {
+      this.data.tags.removeObject(tag);
+    }
+  }
+
+  @action
+  async submit() {
+    try {
+      this.data.tags.forEach(tag => {
+        if (this.tagsDeleted.includes(tag)) {
+          tag.deleteRecord();
+        }
+        tag.save();
+      });
+      this.notify.success(
+        this.l10n.t('Your tag has been saved.'),
+        { id: 'tag_save' }
+      );
+    } catch (error) {
+      this.notify.error(
+        this.l10n.t('Tag failed.'),
+        { id: 'tag_save' }
+      );
+    }
+  }
+}

app/components/nav-bar.js

@@ -86,6 +86,23 @@ export default class NavBar extends Component {
     return !(String(this.session.currentRouteName).includes('events.view'));
   }
 
+  @computed('isNotPublicPageRoute')
+  get checkShowClassCssPublic() {
+    if (this.session.isAuthenticated) {
+      if (this.isNotPublicPageRoute) {
+        return 'au-home-page';
+      } else {
+        return 'au-public-page';
+      }
+    } else {
+      if (this.isNotPublicPageRoute) {
+        return 'un-home-page';
+      } else {
+        return 'un-public-page';
+      }
+    }
+  }
+
   @action
   handleKeyPress() {
     if (event.keyCode === 13 || event.which === 13) {
@@ -120,6 +137,7 @@ export default class NavBar extends Component {
     });
   }
 
+
   @action
   handleClick() {
     this.router.replaceWith('public.index',  this.globalData.idEvent);

app/components/public/stream/join-video.ts

@@ -26,6 +26,7 @@ export default class JoinVideo extends Component<Args> {
   openPanel(): void {
     if (this.args.canAccess) {
       this.args.showSidePanel?.();
+      this.eventCheckIn(this.args.event.identifier)
       this.router.transitionTo({ queryParams: { side_panel: true } });
     } else {
       if (this.session.isAuthenticated) {
@@ -35,4 +36,16 @@ export default class JoinVideo extends Component<Args> {
       }
     }
   }
+
+  async eventCheckIn(event_identifier: string) {
+    try {
+      const data:any = {
+        'check_in_type' : 'event',
+        'is_check_in'   : true
+      };
+      await this.loader.post(`events/${event_identifier}/virtual/check-in`, data);
+    } catch (e) {
+      // Ignore error to prevent stackoverflow
+    }
+  }
 }

app/components/public/stream/side-panel.hbs

@@ -59,7 +59,7 @@
     <div class="chat-video-room">
       <div>
         <div class="ui inverted vertical fluid menu borderless stream-side-menu">
-          {{#each this.streams as |stream|}}
+          {{#each this.streamList as |stream|}}
             <a href={{href-to 'public.stream.view' @event stream.slugName stream.id }} class="{{if (eq @currentRoom.microlocationId stream.microlocationId) 'video-active'}} item stream-item d-flex items-center" {{on "click" (fn @setupRoomChat stream) }} >
                 <span class="stream-preview-letter" style={{css background-color=(object-at (abs (mod stream.hash this.colors.length)) this.colors)}}>{{truncate (uppercase stream.name) 1 false}}</span>
                 <span class="ml-2">{{stream.name}}</span>

app/components/public/stream/side-panel.ts

@@ -46,6 +46,7 @@ export default class PublicStreamSidePanel extends Component<Args> {
   @tracked showChat = false;
   @tracked showRoomChat = false;
   @tracked showVideoRoom = false;
+  @tracked languageList: any = [];
 
   @tracked translationChannels = [{
     id   : '0',
@@ -147,14 +148,22 @@ export default class PublicStreamSidePanel extends Component<Args> {
           isGlobalEventRoom : rooms.data.filter((room: any) => room.relationships['video-stream'].data ? room.relationships['video-stream'].data.id === stream.id : null).map((room: any) => room.attributes['is-global-event-room'])[0],
           chatRoomName      : rooms.data.filter((room: any) => room.relationships['video-stream'].data ? room.relationships['video-stream'].data.id === stream.id : null).map((room: any) => room.attributes['chat-room-name'])[0],
           microlocationId   : rooms.data.filter((room: any) => room.relationships['video-stream'].data ? room.relationships['video-stream'].data.id === stream.id : null).map((room: any) => room.id)[0],
-          hash              : stringHashCode(stream.attributes.name + stream.id)
-        })).forEach(async(stream: any) => {
+          hash              : stringHashCode(stream.attributes.name + stream.id),
+          translations      : []
+        })).forEach((stream: any) => {
           this.addStream(stream)
         });
-        this.streams.forEach(async(stream: any) => {
-          const res = await this.fetchTranslationChannels(stream.id)
-          stream.translations = res
-        });
+        const languageLists: any = [];
+        Promise.all(this.streams.map(async(stream: any) => {
+          const res = await this.fetchTranslationChannels(stream.id);
+          const item = {
+            streamId: stream.id
+          }
+          languageLists.push(item);
+          stream.translations = res;
+        })).then(() => {
+          this.languageList = languageLists;
+        })
       } catch (e) {
         console.error('Error while loading rooms in video stream', e);
       }
@@ -174,4 +183,9 @@ export default class PublicStreamSidePanel extends Component<Args> {
     this.loading = false;
     this.streams = [...this.streams];
   }
+
+  @computed('[email protected]')
+  get streamList() {
+    return this.streams;
+  }
 }

app/components/public/stream/video-stream.hbs

@@ -8,19 +8,25 @@
     <iframe style="position: absolute;width: 100%; height: 100%; border: 0px;" src="{{this.iframeUrl}}" title="{{this.iframeTitle}}" allow="camera; microphone; display-capture" allowfullscreen="true"/>
   {{/if}}
 
-{{#if this.selectingLanguage.selectingLanguage}}
-
-  <iframe style="position: absolute;width: 50%; height: 100%; z-index: -1" id="video-player-translation" width="50%" height="50%" frameborder="0" title="YouTube Live Stream Translation"
-          src="https://www.youtube.com/embed/{{this.selectingLanguage.translationYoutubeId}}?enablejsapi=1&autoplay=1&modestbranding=1&loop=1&controls=0&disablekb=1"
-  gesture="media" allow="autoplay; encrypted-media" allowfullscreen="true"></iframe>
-{{/if}}
-
   {{#if (eq @videoStream.videoChannel.provider 'jitsi')}}
     <Public::Stream::JitsiStream @videoStream={{@videoStream}} />
   {{/if}}
+  {{#if this.selectingLanguage.selectingLanguage}}
+    <iframe
+      style="position: absolute;width: 50%; height: 100%; z-index: -1"
+      id="video-player-translation"
+      frameborder="0" 
+      title="YouTube Live Stream Translation"
+      src="https://www.youtube.com/embed/{{this.selectingLanguage.translationYoutubeId}}?enablejsapi=1&mute=0&autoplay=1&modestbranding=1&loop=1&controls=0&disablekb=1"
+      gesture="media" allow="autoplay; encrypted-media" allowfullscreen="true"></iframe>
+  {{/if}}
   {{#if (eq this.provider 'youtube')}}
-      <iframe style="position: absolute;width: 100%; height: 100%;" id="video-player" width="50%" height="50%" frameborder="0" title="YouTube Live Stream"
-              src="https://www.youtube.com/embed/{{this.youtubeId}}?enablejsapi=1&playlist={{this.youtubeId}}&autoplay=1&modestbranding=1&loop={{if @videoStream.extra.loop 1 0}}&mute={{if (eq this.selectingLanguage.selectingLanguage null) 0 1}}&controls=0&disablekb=1"
+    <iframe 
+      style="position: absolute; width: 100%; height: 100%;" 
+      id="video-player" 
+      frameborder="0" 
+      title="YouTube Live Stream"
+      src="https://www.youtube.com/embed/{{this.youtubeId}}?enablejsapi=1&playlist={{this.youtubeId}}&autoplay=1&modestbranding=1&loop={{if @videoStream.extra.loop 1 0}}&mute={{if this.selectingLanguage.selectingLanguage 1 0}}&controls=0&disablekb=1"
       gesture="media" allow="autoplay; encrypted-media" allowfullscreen="true"></iframe>
   {{/if}}
   {{#if (and (eq @videoStream.videoChannel.provider 'vimeo') this.vimeoId)}}

app/components/public/stream/video-stream.ts

@@ -170,11 +170,28 @@ export default class PublicStreamVideoStream extends Component<Args> {
       this.selectingLanguage.setName(null);
     }
     this.selectingLanguage.setTranslationRoomId(stream.id)
+    this.eventCheckIn(this.args.event.identifier, stream.microlocationId)
   }
 
   @action
   hideStreamYard() {
     this.selectingLanguage.setStreamYardVisibility(false);
   }
 
+  async eventCheckIn(event_identifier: string, microlocation_id: number) {
+    try {
+      const data:any = {
+        'check_in_type' : 'room',
+        microlocation_id,
+        'is_check_in'   : true
+      };
+      if (microlocation_id === undefined) {
+        data.check_in_type = 'virtual-room'
+      }
+      await this.loader.post(`events/${event_identifier}/virtual/check-in`, data);
+    } catch (e) {
+      // Ignore error to prevent stackoverflow
+    }
+  }
+
 }

app/components/tables/headers/select-all.js

@@ -0,0 +1,12 @@
+import classic from 'ember-classic-decorator';
+import Component from '@ember/component';
+import { action } from '@ember/object';
+
+@classic
+export default class SelectAll extends Component {
+
+  @action
+  toggleSelectAll(value) {
+    this.column.actions.toggleSelectAll(value);
+  }
+}

app/components/tables/utilities/add-tag.js

@@ -0,0 +1,14 @@
+import classic from 'ember-classic-decorator';
+import Component from '@ember/component';
+import { action } from '@ember/object';
+import $ from 'jquery';
+
+@classic
+export default class AddTag extends Component {
+
+  @action
+  onSelectTag(tag_id) {
+    $(this.element).find('input').trigger('blur');
+    this.selectTag(tag_id);
+  }
+}

app/components/ui-table/cell/events/view/tickets/attendees/cell-select.js

@@ -0,0 +1,6 @@
+import classic from 'ember-classic-decorator';
+import Component from '@ember/component';
+
+@classic
+export default class CellSelect extends Component {
+}

app/components/ui-table/cell/events/view/tickets/attendees/cell-tag.js

@@ -0,0 +1,38 @@
+import classic from 'ember-classic-decorator';
+import Component from '@ember/component';
+import { computed, action } from '@ember/object';
+import { htmlSafe } from '@ember/string';
+
+@classic
+export default class CellTag extends Component {
+  didInsertElement() {
+    this._super(...arguments);
+  }
+
+  @action
+  removeTag() {
+    const attendee = this.props.row;
+    if (attendee) {
+      attendee.set('tagId', '');
+      attendee.save();
+    }
+  }
+
+  @computed('record')
+  get attendeeTagName() {
+    const tag = this.props?.options?.tags?.find(tag => parseInt(tag.id) === this.record);
+    if (tag) {
+      return tag.name;
+    }
+    return '';
+  }
+
+  @computed('record')
+  get attendeeTagColor() {
+    const tag = this.props?.options?.tags?.find(tag => parseInt(tag.id) === this.record);
+    if (tag) {
+      return htmlSafe('background-color:' + tag.color + '; display: inline-flex');
+    }
+    return '';
+  }
+}

app/controllers/events/view/tags.js

@@ -0,0 +1,6 @@
+import Controller from '@ember/controller';
+import { inject as service } from '@ember/service';
+
+export default class extends Controller {
+  @service errorHandler;
+}