From 514529ca602e1a90b4c14ea14e9b2476be122ee1 Mon Sep 17 00:00:00 2001
From: Sandeep Mandal <sandeepmandal415@gmail.com>
Date: Fri, 23 Oct 2020 20:42:58 +0530
Subject: [PATCH 1/3] Wizard step 3 and 5 enhanced accordingly

---
 .../forms/wizard/custom-form-input.hbs        |  11 +-
 .../forms/wizard/sessions-speakers-step.hbs   | 379 +++++++++---------
 2 files changed, 187 insertions(+), 203 deletions(-)

diff --git a/app/components/forms/wizard/custom-form-input.hbs b/app/components/forms/wizard/custom-form-input.hbs
index b42400a5105..a5c29592191 100644
--- a/app/components/forms/wizard/custom-form-input.hbs
+++ b/app/components/forms/wizard/custom-form-input.hbs
@@ -1,10 +1,10 @@
 <div class="ui hidden divider"></div>
-<h3 class="ui dividing header">
+<div class="ui dividing">
   <i class="checkmark box icon"></i>
-  <div class="content">
+  <span class="content">
     {{t 'Add Custom Form Field'}}
-  </div>
-</h3>
+  </span>
+</div>
 <div {{did-update this.updated @field}} class="ui action input" style="width: inherit;">
   <Input type="text" placeholder="Field Name" @value={{this.name}} />
   <UiDropdown class="ui selection dropdown" @selected={{this.type}} @onChange={{action (mut this.type)}}>
@@ -17,5 +17,6 @@
       <div class="item" data-value="number">Number</div>
     </div>
   </UiDropdown>
-  <button class="ui button" {{action 'addFormField'}} disabled={{not this.validIdentifier}}>{{if @field (t 'Save') (t 'Add')}}</button>
+  <button class="ui button" {{action 'addFormField'}}
+    disabled={{not this.validIdentifier}}>{{if @field (t 'Save') (t 'Add')}}</button>
 </div>
\ No newline at end of file
diff --git a/app/templates/components/forms/wizard/sessions-speakers-step.hbs b/app/templates/components/forms/wizard/sessions-speakers-step.hbs
index 5c839b73c73..a88d2596b51 100644
--- a/app/templates/components/forms/wizard/sessions-speakers-step.hbs
+++ b/app/templates/components/forms/wizard/sessions-speakers-step.hbs
@@ -1,4 +1,5 @@
-<form class="ui form {{if this.isLoading 'loading'}}" autocomplete="off" {{action 'move' 'forward' on='submit' preventDefault=true}}>
+<form class="ui form {{if this.isLoading 'loading'}}" autocomplete="off"
+  {{action 'move' 'forward' on='submit' preventDefault=true}}>
 
   <div class="ui centered grid">
     <div class="column">
@@ -19,213 +20,201 @@
   </div>
 
   {{#if this.data.event.isSessionsSpeakersEnabled}}
-    <br>
-    <h3 class="ui dividing header">
-      <i class="ordered list icon"></i>
-      <div class="content">
-        {{t 'Sessions, Microlocations, Session Types'}}
-      </div>
-    </h3>
-    <div class="field">
-      <label class="required">Tracks</label>
-      {{#each this.tracks as |track|}}
-        <div class="{{if this.device.isMobile 'grouped'}} fields">
-          <div class="{{unless this.device.isMobile 'three wide'}} field">
-            <Input @type="text" @name="track" @value={{track.name}} placeholder="Name" />
-          </div>
-          <div class="{{unless this.device.isMobile 'four wide'}} field">
-            <Widgets::Forms::ColorPicker @value={{track.color}} @fontColor={{track.fontColor}}>
-              {{#if (gt this.tracks.length 1)}}
-                <button class="ui icon red button" type="button" {{action 'removeItem' track}}>
-                  <i class="minus icon"></i>
-                </button>
-              {{/if}}
-              <button class="ui icon primary button" type="button" {{action 'addItem' 'track'}}>
-                <i class="plus icon"></i>
-              </button>
-            </Widgets::Forms::ColorPicker>
-          </div>
-          <div class="{{unless this.device.isMobile 'two wide'}} field">
-            <input title="Preview"
-                   class="preview"
-                   value="{{if track.name track.name (t 'Preview Text')}}"
-                   readonly
-                   style={{css background-color=track.color color=(text-color track.color)}}>
-          </div>
-        </div>
-      {{/each}}
-    </div>
-
-    <div class="field">
-      <label class="required">{{t 'Microlocations or Virtual Online Rooms'}}</label>
-      {{#each this.microlocations as |microlocation|}}
-        <div class="{{if this.device.isMobile 'grouped'}} fields">
-          <div class="{{unless this.device.isMobile 'three wide'}} field">
-            <Input @type="text" @value={{microlocation.name}} placeholder="Name" />
-          </div>
-          <div class="{{unless this.device.isMobile 'four wide'}} field">
-            <div class="ui action input fluid">
-              <Input @type="number" @value={{microlocation.floor}} placeholder="Floor" />
-              {{#if (gt this.microlocations.length 1)}}
-                <button class="ui icon red button" type="button" {{action 'removeItem' microlocation}}>
-                  <i class="minus icon"></i>
-                </button>
-              {{/if}}
-              <button class="ui icon primary button" type="button" {{action 'addItem' 'microlocation'}}>
-                <i class="plus icon"></i>
-              </button>
-            </div>
-          </div>
-        </div>
-      {{/each}}
+  <br>
+  <h3 class="ui dividing header">
+    <i class="ordered list icon"></i>
+    <div class="content">
+      {{t 'Sessions, Microlocations, Session Types'}}
     </div>
-    <div class="field">
-      <label class="required">{{t 'Session Types'}}</label>
-      {{#each this.sessionTypes as |sessionType|}}
-        <div class="{{if this.device.isMobile 'grouped'}} fields">
-          <div class="{{unless this.device.isMobile 'three wide'}} field">
-            <Input @type="text" @name="session" @value={{sessionType.name}} placeholder="Name" />
-          </div>
-          <div class="{{unless this.device.isMobile 'four wide'}} field">
-            <div class="ui action input fluid">
-              <Widgets::Forms::TimePicker @value={{sessionType.length}} @placeholder="HH:MM" @icon={{false}} />
-              {{#if (gt this.sessionTypes.length 1)}}
-                <button class="ui icon red button" type="button" {{action 'removeItem' sessionType}}>
-                  <i class="minus icon"></i>
-                </button>
-              {{/if}}
-              <button class="ui icon primary button" type="button" {{action 'addItem' 'sessionType'}}>
-                <i class="plus icon"></i>
-              </button>
-            </div>
-          </div>
-        </div>
-      {{/each}}
+  </h3>
+  <div class="field">
+    <label class="required">Tracks</label>
+    {{#each this.tracks as |track|}}
+    <div class="{{if this.device.isMobile 'grouped'}} fields">
+      <div class="{{unless this.device.isMobile 'three wide'}} field">
+        <Input @type="text" @name="track" @value={{track.name}} placeholder="Name" />
+      </div>
+      <div class="{{unless this.device.isMobile 'four wide'}} field">
+        <Widgets::Forms::ColorPicker @value={{track.color}} @fontColor={{track.fontColor}}>
+          {{#if (gt this.tracks.length 1)}}
+          <button class="ui icon red button" type="button" {{action 'removeItem' track}}>
+            <i class="minus icon"></i>
+          </button>
+          {{/if}}
+          <button class="ui icon primary button" type="button" {{action 'addItem' 'track'}}>
+            <i class="plus icon"></i>
+          </button>
+        </Widgets::Forms::ColorPicker>
+      </div>
+      <div class="{{unless this.device.isMobile 'two wide'}} field">
+        <input title="Preview" class="preview" value="{{if track.name track.name (t 'Preview Text')}}" readonly
+          style={{css background-color=track.color color=(text-color track.color)}}>
+      </div>
     </div>
+    {{/each}}
+  </div>
 
-    <br>
-    <div class="ui section divider"></div>
-    <div class="field">
-      <div class="ui slider checkbox">
-        <Input
-          @type="checkbox"
-          @checked={{this.hasCallForSpeaker}}
-          @id="add_call_for_speaker" 
-          {{action "resetCFS" on="change"}}
-          />
-        <label for="add_call_for_speaker">{{t 'Enable Call For Speakers'}}</label>
+  <div class="field">
+    <label class="required">{{t 'Microlocations or Virtual Online Rooms'}}</label>
+    {{#each this.microlocations as |microlocation|}}
+    <div class="{{if this.device.isMobile 'grouped'}} fields">
+      <div class="{{unless this.device.isMobile 'three wide'}} field">
+        <Input @type="text" @value={{microlocation.name}} placeholder="Name" />
       </div>
-    </div>
-    {{#if this.hasCallForSpeaker}}
-      <h3 class="ui dividing header">
-        <i class="announcement icon"></i>
-        <div class="content">
-          {{t 'Call for speakers'}}
+      <div class="{{unless this.device.isMobile 'four wide'}} field">
+        <div class="ui action input fluid">
+          <Input @type="number" @value={{microlocation.floor}} placeholder="Floor" />
+          {{#if (gt this.microlocations.length 1)}}
+          <button class="ui icon red button" type="button" {{action 'removeItem' microlocation}}>
+            <i class="minus icon"></i>
+          </button>
+          {{/if}}
+          <button class="ui icon primary button" type="button" {{action 'addItem' 'microlocation'}}>
+            <i class="plus icon"></i>
+          </button>
         </div>
-      </h3>
-      <div class="field">
-        <label>{{t 'Announcement'}}</label>
-        <Widgets::Forms::RichTextEditor @name="announcement" @textareaId="announcement" @value={{this.data.speakersCall.announcement}} />
       </div>
-      <div class="fields">
-        <div class="five wide field">
-          <label class="required" for="start_date">{{t 'Starts'}}</label>
-          <Widgets::Forms::DatePicker @type="text" @name="start_date" @placeholder="MM/DD/YYYY"  @onChange={{action "onChange"}} @value={{this.data.speakersCall.startsAtDate}} />
-        </div>
-        <div class="two wide field">
-          <label for="start_time">&nbsp;</label>
-          <Widgets::Forms::TimePicker @type="text" @name="start_time" @placeholder="HH:MM" @onChange={{action "onChange"}} @value={{this.data.speakersCall.startsAtTime}} />
-        </div>
-        <div class="five wide field">
-          <label class="required" for="end_date">{{t 'Ends'}}</label>
-          <Widgets::Forms::DatePicker @type="text" @name="end_date" @placeholder="MM/DD/YYYY" @rangePosition="end" @onChange={{action "onChange"}} @value={{this.data.speakersCall.endsAtDate}} />
-        </div>
-        <div class="two wide field">
-          <label for="end_time">&nbsp;</label>
-          <Widgets::Forms::TimePicker @type="text" @name="end_time" @placeholder="HH:MM" @onChange={{action "onChange"}} @value={{this.data.speakersCall.endsAtTime}} />
-        </div>
-        <div class="five wide field">
-          <label class="required" for="timezone">{{t 'Timezone'}}</label>
-          <Input @type="text" @disabled={{true}} @value={{this.data.event.timezone}} />
-        </div>
+    </div>
+    {{/each}}
+  </div>
+  <div class="field">
+    <label class="required">{{t 'Session Types'}}</label>
+    {{#each this.sessionTypes as |sessionType|}}
+    <div class="{{if this.device.isMobile 'grouped'}} fields">
+      <div class="{{unless this.device.isMobile 'three wide'}} field">
+        <Input @type="text" @name="session" @value={{sessionType.name}} placeholder="Name" />
       </div>
-      <div class="field">
-        <label>{{t 'Private Link'}}</label>
+      <div class="{{unless this.device.isMobile 'four wide'}} field">
         <div class="ui action input fluid">
-          <input type="text" name="private_link" value="{{concat this.data.event.url '/cfs/' this.data.speakersCall.hash}}" placeholder="{{concat this.data.event '/cfs/' this.data.speakersCall.hash}}" readonly>
-          <UiPopup @on="click" @content={{t "Link copied to clipboard"}} @position="bottom right">
-            <CopyButton @clipboardText={{concat this.data.event.url "/cfs/" this.data.speakersCall.hash}} @class="ui black right labeled icon copy button">
-              <i class="copy icon"></i>
-              {{t 'Copy'}}
-            </CopyButton>
-          </UiPopup>
+          <Widgets::Forms::TimePicker @value={{sessionType.length}} @placeholder="HH:MM" @icon={{false}} />
+          {{#if (gt this.sessionTypes.length 1)}}
+          <button class="ui icon red button" type="button" {{action 'removeItem' sessionType}}>
+            <i class="minus icon"></i>
+          </button>
+          {{/if}}
+          <button class="ui icon primary button" type="button" {{action 'addItem' 'sessionType'}}>
+            <i class="plus icon"></i>
+          </button>
         </div>
-        <span class="text muted">
-          {{t 'Share this link to get private submission independently of open/closed Call for Speakers at any time. (the link will be active once the event is saved)'}}
-        </span>
       </div>
-      <div class="grouped fields">
-        <label for="privacy">{{t 'Privacy'}}</label>
-        <div class="field">
-          <div class="ui radio checkbox">
-            {{widgets/forms/radio-button this.value name='privacy' id='privacy_public' value='public' checked=this.data.speakersCall.privacy}}
-            <label for="privacy_public">
-              <strong>{{t 'Public'}}:</strong>
-              {{t 'Display this publicly. Anybody will be able to submit a proposal within the dates chosen, once the event is published.'}}
-            </label>
-          </div>
-        </div>
-        <div class="field">
-          <div class="ui radio checkbox">
-            {{widgets/forms/radio-button this.value name='privacy' id='privacy_private' value='private' checked=this.data.speakersCall.privacy}}
-            <label for="privacy_private">
-              <strong>{{t 'Private'}}:</strong>
-              {{t 'Do not display this publicly. Proposals can be submitted only using the private link.'}}
-            </label>
-          </div>
-        </div>
+    </div>
+    {{/each}}
+  </div>
+
+  <br>
+  <div class="ui section divider"></div>
+  <div class="field">
+    <div class="ui slider checkbox">
+      <Input @type="checkbox" @checked={{this.hasCallForSpeaker}} @id="add_call_for_speaker"
+        {{action "resetCFS" on="change"}} />
+      <label for="add_call_for_speaker">{{t 'Enable Call For Speakers'}}</label>
+    </div>
+  </div>
+  {{#if this.hasCallForSpeaker}}
+  <h3 class="ui dividing header">
+    <i class="announcement icon"></i>
+    <div class="content">
+      {{t 'Call for speakers'}}
+    </div>
+  </h3>
+  <div class="field">
+    <label>{{t 'Announcement'}}</label>
+    <Widgets::Forms::RichTextEditor @name="announcement" @textareaId="announcement"
+      @value={{this.data.speakersCall.announcement}} />
+  </div>
+  <div class="fields">
+    <div class="five wide field">
+      <label class="required" for="start_date">{{t 'Starts'}}</label>
+      <Widgets::Forms::DatePicker @type="text" @name="start_date" @placeholder="MM/DD/YYYY"
+        @onChange={{action "onChange"}} @value={{this.data.speakersCall.startsAtDate}} />
+    </div>
+    <div class="two wide field">
+      <label for="start_time">&nbsp;</label>
+      <Widgets::Forms::TimePicker @type="text" @name="start_time" @placeholder="HH:MM" @onChange={{action "onChange"}}
+        @value={{this.data.speakersCall.startsAtTime}} />
+    </div>
+    <div class="five wide field">
+      <label class="required" for="end_date">{{t 'Ends'}}</label>
+      <Widgets::Forms::DatePicker @type="text" @name="end_date" @placeholder="MM/DD/YYYY" @rangePosition="end"
+        @onChange={{action "onChange"}} @value={{this.data.speakersCall.endsAtDate}} />
+    </div>
+    <div class="two wide field">
+      <label for="end_time">&nbsp;</label>
+      <Widgets::Forms::TimePicker @type="text" @name="end_time" @placeholder="HH:MM" @onChange={{action "onChange"}}
+        @value={{this.data.speakersCall.endsAtTime}} />
+    </div>
+    <div class="five wide field">
+      <label class="required" for="timezone">{{t 'Timezone'}}</label>
+      <Input @type="text" @disabled={{true}} @value={{this.data.event.timezone}} />
+    </div>
+  </div>
+  <div class="field">
+    <label>{{t 'Private Link'}}</label>
+    <div class="ui action input fluid">
+      <input type="text" name="private_link" value="{{concat this.data.event.url '/cfs/' this.data.speakersCall.hash}}"
+        placeholder="{{concat this.data.event '/cfs/' this.data.speakersCall.hash}}" readonly>
+      <UiPopup @on="click" @content={{t "Link copied to clipboard"}} @position="bottom right">
+        <CopyButton @clipboardText={{concat this.data.event.url "/cfs/" this.data.speakersCall.hash}}
+          @class="ui black right labeled icon copy button">
+          <i class="copy icon"></i>
+          {{t 'Copy'}}
+        </CopyButton>
+      </UiPopup>
+    </div>
+    <span class="text muted">
+      {{t 'Share this link to get private submission independently of open/closed Call for Speakers at any time. (the link will be active once the event is saved)'}}
+    </span>
+  </div>
+  <div class="grouped fields">
+    <label for="privacy">{{t 'Privacy'}}</label>
+    <div class="field">
+      <div class="ui radio checkbox">
+        {{widgets/forms/radio-button this.value name='privacy' id='privacy_public' value='public' checked=this.data.speakersCall.privacy}}
+        <label for="privacy_public">
+          <strong>{{t 'Public'}}:</strong>
+          {{t 'Display this publicly. Anybody will be able to submit a proposal within the dates chosen, once the event is published.'}}
+        </label>
       </div>
-    {{/if}}
-    <br>
-    <h3 class="ui dividing header">
-      <i class="checkmark box icon"></i>
-      <div class="content">
-        {{t 'Customize registration form'}}
+    </div>
+    <div class="field">
+      <div class="ui radio checkbox">
+        {{widgets/forms/radio-button this.value name='privacy' id='privacy_private' value='private' checked=this.data.speakersCall.privacy}}
+        <label for="privacy_private">
+          <strong>{{t 'Private'}}:</strong>
+          {{t 'Do not display this publicly. Proposals can be submitted only using the private link.'}}
+        </label>
       </div>
-    </h3>
+    </div>
+  </div>
+  {{/if}}
+  <br>
+  <h3 class="ui dividing header">
+    <i class="checkmark box icon"></i>
+    <div class="content">
+      {{t 'Customize submission forms'}}
+    </div>
+  </h3>
 
-    <div class="ui two column stackable grid">
-      <div class="column">
-        <Forms::Wizard::CustomForms::Table
-          @headerText="Collect Speaker Details"
-          @fields={{this.customForm.speaker}}
-          @updateField={{action (mut this.speakerField)}} />
+  <div class="ui two column stackable grid">
+    <div class="column">
+      <Forms::Wizard::CustomForms::Table @headerText="Collect Speaker Details" @fields={{this.customForm.speaker}}
+        @updateField={{action (mut this.speakerField)}} />
 
-        <Forms::Wizard::CustomFormInput
-          @customForms={{this.data.customForms}}
-          @event={{this.data.event}}
-          @form="speaker"
-          @field={{this.speakerField}}
-          @onSave={{action (mut this.speakerField) null}} />
+      <Forms::Wizard::CustomFormInput @customForms={{this.data.customForms}} @event={{this.data.event}} @form="speaker"
+        @field={{this.speakerField}} @onSave={{action (mut this.speakerField) null}} />
 
-      </div>
-      <div class="column">
-        <Forms::Wizard::CustomForms::Table
-          @headerText="Collect Session Details"
-          @fields={{this.customForm.session}}
-          @updateField={{action (mut this.sessionField)}} />
+    </div>
+    <div class="column">
+      <Forms::Wizard::CustomForms::Table @headerText="Collect Session Details" @fields={{this.customForm.session}}
+        @updateField={{action (mut this.sessionField)}} />
 
-        <Forms::Wizard::CustomFormInput
-          @customForms={{this.data.customForms}}
-          @event={{this.data.event}}
-          @form="session"
-          @field={{this.sessionField}}
-          @onSave={{action (mut this.sessionField) null}} />
-      </div>
+      <Forms::Wizard::CustomFormInput @customForms={{this.data.customForms}} @event={{this.data.event}} @form="session"
+        @field={{this.sessionField}} @onSave={{action (mut this.sessionField) null}} />
     </div>
-    <div class="spacer-50"></div>
+  </div>
+  <div class="spacer-50"></div>
   {{else}}
-    <div class="spacer-50"></div>
+  <div class="spacer-50"></div>
   {{/if}}
   {{!--  Hiding the Custom Widget Form, Until it is ready to be deployed for Development & Production.
   {{#each complexCustomForms as |form|}}
@@ -270,11 +259,5 @@
 
 </form>
 
-<Forms::Wizard::WizardFooter
-  @event={{this.data.event}}
-  @loading={{this.loading}}
-  @last={{true}}
-  @onSaved={{action 'saveForm'}}
-  @onSaveDraft={{action 'saveDraft'}}
-  @move={{action 'move'}} />
-  
\ No newline at end of file
+<Forms::Wizard::WizardFooter @event={{this.data.event}} @loading={{this.loading}} @last={{true}}
+  @onSaved={{action 'saveForm'}} @onSaveDraft={{action 'saveDraft'}} @move={{action 'move'}} />
\ No newline at end of file

From 77135ffc8c00768882e55ca4f0a6ae365e41fff8 Mon Sep 17 00:00:00 2001
From: Sandeep Mandal <sandeepmandal415@gmail.com>
Date: Mon, 26 Oct 2020 12:42:29 +0530
Subject: [PATCH 2/3] Copied development branch

---
 .../forms/wizard/custom-form-input.hbs        |  11 +-
 .../forms/wizard/sessions-speakers-step.hbs   | 379 +++++++++---------
 2 files changed, 203 insertions(+), 187 deletions(-)

diff --git a/app/components/forms/wizard/custom-form-input.hbs b/app/components/forms/wizard/custom-form-input.hbs
index a5c29592191..b42400a5105 100644
--- a/app/components/forms/wizard/custom-form-input.hbs
+++ b/app/components/forms/wizard/custom-form-input.hbs
@@ -1,10 +1,10 @@
 <div class="ui hidden divider"></div>
-<div class="ui dividing">
+<h3 class="ui dividing header">
   <i class="checkmark box icon"></i>
-  <span class="content">
+  <div class="content">
     {{t 'Add Custom Form Field'}}
-  </span>
-</div>
+  </div>
+</h3>
 <div {{did-update this.updated @field}} class="ui action input" style="width: inherit;">
   <Input type="text" placeholder="Field Name" @value={{this.name}} />
   <UiDropdown class="ui selection dropdown" @selected={{this.type}} @onChange={{action (mut this.type)}}>
@@ -17,6 +17,5 @@
       <div class="item" data-value="number">Number</div>
     </div>
   </UiDropdown>
-  <button class="ui button" {{action 'addFormField'}}
-    disabled={{not this.validIdentifier}}>{{if @field (t 'Save') (t 'Add')}}</button>
+  <button class="ui button" {{action 'addFormField'}} disabled={{not this.validIdentifier}}>{{if @field (t 'Save') (t 'Add')}}</button>
 </div>
\ No newline at end of file
diff --git a/app/templates/components/forms/wizard/sessions-speakers-step.hbs b/app/templates/components/forms/wizard/sessions-speakers-step.hbs
index a88d2596b51..5c839b73c73 100644
--- a/app/templates/components/forms/wizard/sessions-speakers-step.hbs
+++ b/app/templates/components/forms/wizard/sessions-speakers-step.hbs
@@ -1,5 +1,4 @@
-<form class="ui form {{if this.isLoading 'loading'}}" autocomplete="off"
-  {{action 'move' 'forward' on='submit' preventDefault=true}}>
+<form class="ui form {{if this.isLoading 'loading'}}" autocomplete="off" {{action 'move' 'forward' on='submit' preventDefault=true}}>
 
   <div class="ui centered grid">
     <div class="column">
@@ -20,201 +19,213 @@
   </div>
 
   {{#if this.data.event.isSessionsSpeakersEnabled}}
-  <br>
-  <h3 class="ui dividing header">
-    <i class="ordered list icon"></i>
-    <div class="content">
-      {{t 'Sessions, Microlocations, Session Types'}}
-    </div>
-  </h3>
-  <div class="field">
-    <label class="required">Tracks</label>
-    {{#each this.tracks as |track|}}
-    <div class="{{if this.device.isMobile 'grouped'}} fields">
-      <div class="{{unless this.device.isMobile 'three wide'}} field">
-        <Input @type="text" @name="track" @value={{track.name}} placeholder="Name" />
-      </div>
-      <div class="{{unless this.device.isMobile 'four wide'}} field">
-        <Widgets::Forms::ColorPicker @value={{track.color}} @fontColor={{track.fontColor}}>
-          {{#if (gt this.tracks.length 1)}}
-          <button class="ui icon red button" type="button" {{action 'removeItem' track}}>
-            <i class="minus icon"></i>
-          </button>
-          {{/if}}
-          <button class="ui icon primary button" type="button" {{action 'addItem' 'track'}}>
-            <i class="plus icon"></i>
-          </button>
-        </Widgets::Forms::ColorPicker>
-      </div>
-      <div class="{{unless this.device.isMobile 'two wide'}} field">
-        <input title="Preview" class="preview" value="{{if track.name track.name (t 'Preview Text')}}" readonly
-          style={{css background-color=track.color color=(text-color track.color)}}>
+    <br>
+    <h3 class="ui dividing header">
+      <i class="ordered list icon"></i>
+      <div class="content">
+        {{t 'Sessions, Microlocations, Session Types'}}
       </div>
+    </h3>
+    <div class="field">
+      <label class="required">Tracks</label>
+      {{#each this.tracks as |track|}}
+        <div class="{{if this.device.isMobile 'grouped'}} fields">
+          <div class="{{unless this.device.isMobile 'three wide'}} field">
+            <Input @type="text" @name="track" @value={{track.name}} placeholder="Name" />
+          </div>
+          <div class="{{unless this.device.isMobile 'four wide'}} field">
+            <Widgets::Forms::ColorPicker @value={{track.color}} @fontColor={{track.fontColor}}>
+              {{#if (gt this.tracks.length 1)}}
+                <button class="ui icon red button" type="button" {{action 'removeItem' track}}>
+                  <i class="minus icon"></i>
+                </button>
+              {{/if}}
+              <button class="ui icon primary button" type="button" {{action 'addItem' 'track'}}>
+                <i class="plus icon"></i>
+              </button>
+            </Widgets::Forms::ColorPicker>
+          </div>
+          <div class="{{unless this.device.isMobile 'two wide'}} field">
+            <input title="Preview"
+                   class="preview"
+                   value="{{if track.name track.name (t 'Preview Text')}}"
+                   readonly
+                   style={{css background-color=track.color color=(text-color track.color)}}>
+          </div>
+        </div>
+      {{/each}}
     </div>
-    {{/each}}
-  </div>
 
-  <div class="field">
-    <label class="required">{{t 'Microlocations or Virtual Online Rooms'}}</label>
-    {{#each this.microlocations as |microlocation|}}
-    <div class="{{if this.device.isMobile 'grouped'}} fields">
-      <div class="{{unless this.device.isMobile 'three wide'}} field">
-        <Input @type="text" @value={{microlocation.name}} placeholder="Name" />
-      </div>
-      <div class="{{unless this.device.isMobile 'four wide'}} field">
-        <div class="ui action input fluid">
-          <Input @type="number" @value={{microlocation.floor}} placeholder="Floor" />
-          {{#if (gt this.microlocations.length 1)}}
-          <button class="ui icon red button" type="button" {{action 'removeItem' microlocation}}>
-            <i class="minus icon"></i>
-          </button>
-          {{/if}}
-          <button class="ui icon primary button" type="button" {{action 'addItem' 'microlocation'}}>
-            <i class="plus icon"></i>
-          </button>
+    <div class="field">
+      <label class="required">{{t 'Microlocations or Virtual Online Rooms'}}</label>
+      {{#each this.microlocations as |microlocation|}}
+        <div class="{{if this.device.isMobile 'grouped'}} fields">
+          <div class="{{unless this.device.isMobile 'three wide'}} field">
+            <Input @type="text" @value={{microlocation.name}} placeholder="Name" />
+          </div>
+          <div class="{{unless this.device.isMobile 'four wide'}} field">
+            <div class="ui action input fluid">
+              <Input @type="number" @value={{microlocation.floor}} placeholder="Floor" />
+              {{#if (gt this.microlocations.length 1)}}
+                <button class="ui icon red button" type="button" {{action 'removeItem' microlocation}}>
+                  <i class="minus icon"></i>
+                </button>
+              {{/if}}
+              <button class="ui icon primary button" type="button" {{action 'addItem' 'microlocation'}}>
+                <i class="plus icon"></i>
+              </button>
+            </div>
+          </div>
         </div>
-      </div>
+      {{/each}}
     </div>
-    {{/each}}
-  </div>
-  <div class="field">
-    <label class="required">{{t 'Session Types'}}</label>
-    {{#each this.sessionTypes as |sessionType|}}
-    <div class="{{if this.device.isMobile 'grouped'}} fields">
-      <div class="{{unless this.device.isMobile 'three wide'}} field">
-        <Input @type="text" @name="session" @value={{sessionType.name}} placeholder="Name" />
-      </div>
-      <div class="{{unless this.device.isMobile 'four wide'}} field">
-        <div class="ui action input fluid">
-          <Widgets::Forms::TimePicker @value={{sessionType.length}} @placeholder="HH:MM" @icon={{false}} />
-          {{#if (gt this.sessionTypes.length 1)}}
-          <button class="ui icon red button" type="button" {{action 'removeItem' sessionType}}>
-            <i class="minus icon"></i>
-          </button>
-          {{/if}}
-          <button class="ui icon primary button" type="button" {{action 'addItem' 'sessionType'}}>
-            <i class="plus icon"></i>
-          </button>
+    <div class="field">
+      <label class="required">{{t 'Session Types'}}</label>
+      {{#each this.sessionTypes as |sessionType|}}
+        <div class="{{if this.device.isMobile 'grouped'}} fields">
+          <div class="{{unless this.device.isMobile 'three wide'}} field">
+            <Input @type="text" @name="session" @value={{sessionType.name}} placeholder="Name" />
+          </div>
+          <div class="{{unless this.device.isMobile 'four wide'}} field">
+            <div class="ui action input fluid">
+              <Widgets::Forms::TimePicker @value={{sessionType.length}} @placeholder="HH:MM" @icon={{false}} />
+              {{#if (gt this.sessionTypes.length 1)}}
+                <button class="ui icon red button" type="button" {{action 'removeItem' sessionType}}>
+                  <i class="minus icon"></i>
+                </button>
+              {{/if}}
+              <button class="ui icon primary button" type="button" {{action 'addItem' 'sessionType'}}>
+                <i class="plus icon"></i>
+              </button>
+            </div>
+          </div>
         </div>
-      </div>
+      {{/each}}
     </div>
-    {{/each}}
-  </div>
 
-  <br>
-  <div class="ui section divider"></div>
-  <div class="field">
-    <div class="ui slider checkbox">
-      <Input @type="checkbox" @checked={{this.hasCallForSpeaker}} @id="add_call_for_speaker"
-        {{action "resetCFS" on="change"}} />
-      <label for="add_call_for_speaker">{{t 'Enable Call For Speakers'}}</label>
-    </div>
-  </div>
-  {{#if this.hasCallForSpeaker}}
-  <h3 class="ui dividing header">
-    <i class="announcement icon"></i>
-    <div class="content">
-      {{t 'Call for speakers'}}
-    </div>
-  </h3>
-  <div class="field">
-    <label>{{t 'Announcement'}}</label>
-    <Widgets::Forms::RichTextEditor @name="announcement" @textareaId="announcement"
-      @value={{this.data.speakersCall.announcement}} />
-  </div>
-  <div class="fields">
-    <div class="five wide field">
-      <label class="required" for="start_date">{{t 'Starts'}}</label>
-      <Widgets::Forms::DatePicker @type="text" @name="start_date" @placeholder="MM/DD/YYYY"
-        @onChange={{action "onChange"}} @value={{this.data.speakersCall.startsAtDate}} />
-    </div>
-    <div class="two wide field">
-      <label for="start_time">&nbsp;</label>
-      <Widgets::Forms::TimePicker @type="text" @name="start_time" @placeholder="HH:MM" @onChange={{action "onChange"}}
-        @value={{this.data.speakersCall.startsAtTime}} />
-    </div>
-    <div class="five wide field">
-      <label class="required" for="end_date">{{t 'Ends'}}</label>
-      <Widgets::Forms::DatePicker @type="text" @name="end_date" @placeholder="MM/DD/YYYY" @rangePosition="end"
-        @onChange={{action "onChange"}} @value={{this.data.speakersCall.endsAtDate}} />
-    </div>
-    <div class="two wide field">
-      <label for="end_time">&nbsp;</label>
-      <Widgets::Forms::TimePicker @type="text" @name="end_time" @placeholder="HH:MM" @onChange={{action "onChange"}}
-        @value={{this.data.speakersCall.endsAtTime}} />
-    </div>
-    <div class="five wide field">
-      <label class="required" for="timezone">{{t 'Timezone'}}</label>
-      <Input @type="text" @disabled={{true}} @value={{this.data.event.timezone}} />
-    </div>
-  </div>
-  <div class="field">
-    <label>{{t 'Private Link'}}</label>
-    <div class="ui action input fluid">
-      <input type="text" name="private_link" value="{{concat this.data.event.url '/cfs/' this.data.speakersCall.hash}}"
-        placeholder="{{concat this.data.event '/cfs/' this.data.speakersCall.hash}}" readonly>
-      <UiPopup @on="click" @content={{t "Link copied to clipboard"}} @position="bottom right">
-        <CopyButton @clipboardText={{concat this.data.event.url "/cfs/" this.data.speakersCall.hash}}
-          @class="ui black right labeled icon copy button">
-          <i class="copy icon"></i>
-          {{t 'Copy'}}
-        </CopyButton>
-      </UiPopup>
-    </div>
-    <span class="text muted">
-      {{t 'Share this link to get private submission independently of open/closed Call for Speakers at any time. (the link will be active once the event is saved)'}}
-    </span>
-  </div>
-  <div class="grouped fields">
-    <label for="privacy">{{t 'Privacy'}}</label>
+    <br>
+    <div class="ui section divider"></div>
     <div class="field">
-      <div class="ui radio checkbox">
-        {{widgets/forms/radio-button this.value name='privacy' id='privacy_public' value='public' checked=this.data.speakersCall.privacy}}
-        <label for="privacy_public">
-          <strong>{{t 'Public'}}:</strong>
-          {{t 'Display this publicly. Anybody will be able to submit a proposal within the dates chosen, once the event is published.'}}
-        </label>
+      <div class="ui slider checkbox">
+        <Input
+          @type="checkbox"
+          @checked={{this.hasCallForSpeaker}}
+          @id="add_call_for_speaker" 
+          {{action "resetCFS" on="change"}}
+          />
+        <label for="add_call_for_speaker">{{t 'Enable Call For Speakers'}}</label>
       </div>
     </div>
-    <div class="field">
-      <div class="ui radio checkbox">
-        {{widgets/forms/radio-button this.value name='privacy' id='privacy_private' value='private' checked=this.data.speakersCall.privacy}}
-        <label for="privacy_private">
-          <strong>{{t 'Private'}}:</strong>
-          {{t 'Do not display this publicly. Proposals can be submitted only using the private link.'}}
-        </label>
+    {{#if this.hasCallForSpeaker}}
+      <h3 class="ui dividing header">
+        <i class="announcement icon"></i>
+        <div class="content">
+          {{t 'Call for speakers'}}
+        </div>
+      </h3>
+      <div class="field">
+        <label>{{t 'Announcement'}}</label>
+        <Widgets::Forms::RichTextEditor @name="announcement" @textareaId="announcement" @value={{this.data.speakersCall.announcement}} />
       </div>
-    </div>
-  </div>
-  {{/if}}
-  <br>
-  <h3 class="ui dividing header">
-    <i class="checkmark box icon"></i>
-    <div class="content">
-      {{t 'Customize submission forms'}}
-    </div>
-  </h3>
+      <div class="fields">
+        <div class="five wide field">
+          <label class="required" for="start_date">{{t 'Starts'}}</label>
+          <Widgets::Forms::DatePicker @type="text" @name="start_date" @placeholder="MM/DD/YYYY"  @onChange={{action "onChange"}} @value={{this.data.speakersCall.startsAtDate}} />
+        </div>
+        <div class="two wide field">
+          <label for="start_time">&nbsp;</label>
+          <Widgets::Forms::TimePicker @type="text" @name="start_time" @placeholder="HH:MM" @onChange={{action "onChange"}} @value={{this.data.speakersCall.startsAtTime}} />
+        </div>
+        <div class="five wide field">
+          <label class="required" for="end_date">{{t 'Ends'}}</label>
+          <Widgets::Forms::DatePicker @type="text" @name="end_date" @placeholder="MM/DD/YYYY" @rangePosition="end" @onChange={{action "onChange"}} @value={{this.data.speakersCall.endsAtDate}} />
+        </div>
+        <div class="two wide field">
+          <label for="end_time">&nbsp;</label>
+          <Widgets::Forms::TimePicker @type="text" @name="end_time" @placeholder="HH:MM" @onChange={{action "onChange"}} @value={{this.data.speakersCall.endsAtTime}} />
+        </div>
+        <div class="five wide field">
+          <label class="required" for="timezone">{{t 'Timezone'}}</label>
+          <Input @type="text" @disabled={{true}} @value={{this.data.event.timezone}} />
+        </div>
+      </div>
+      <div class="field">
+        <label>{{t 'Private Link'}}</label>
+        <div class="ui action input fluid">
+          <input type="text" name="private_link" value="{{concat this.data.event.url '/cfs/' this.data.speakersCall.hash}}" placeholder="{{concat this.data.event '/cfs/' this.data.speakersCall.hash}}" readonly>
+          <UiPopup @on="click" @content={{t "Link copied to clipboard"}} @position="bottom right">
+            <CopyButton @clipboardText={{concat this.data.event.url "/cfs/" this.data.speakersCall.hash}} @class="ui black right labeled icon copy button">
+              <i class="copy icon"></i>
+              {{t 'Copy'}}
+            </CopyButton>
+          </UiPopup>
+        </div>
+        <span class="text muted">
+          {{t 'Share this link to get private submission independently of open/closed Call for Speakers at any time. (the link will be active once the event is saved)'}}
+        </span>
+      </div>
+      <div class="grouped fields">
+        <label for="privacy">{{t 'Privacy'}}</label>
+        <div class="field">
+          <div class="ui radio checkbox">
+            {{widgets/forms/radio-button this.value name='privacy' id='privacy_public' value='public' checked=this.data.speakersCall.privacy}}
+            <label for="privacy_public">
+              <strong>{{t 'Public'}}:</strong>
+              {{t 'Display this publicly. Anybody will be able to submit a proposal within the dates chosen, once the event is published.'}}
+            </label>
+          </div>
+        </div>
+        <div class="field">
+          <div class="ui radio checkbox">
+            {{widgets/forms/radio-button this.value name='privacy' id='privacy_private' value='private' checked=this.data.speakersCall.privacy}}
+            <label for="privacy_private">
+              <strong>{{t 'Private'}}:</strong>
+              {{t 'Do not display this publicly. Proposals can be submitted only using the private link.'}}
+            </label>
+          </div>
+        </div>
+      </div>
+    {{/if}}
+    <br>
+    <h3 class="ui dividing header">
+      <i class="checkmark box icon"></i>
+      <div class="content">
+        {{t 'Customize registration form'}}
+      </div>
+    </h3>
 
-  <div class="ui two column stackable grid">
-    <div class="column">
-      <Forms::Wizard::CustomForms::Table @headerText="Collect Speaker Details" @fields={{this.customForm.speaker}}
-        @updateField={{action (mut this.speakerField)}} />
+    <div class="ui two column stackable grid">
+      <div class="column">
+        <Forms::Wizard::CustomForms::Table
+          @headerText="Collect Speaker Details"
+          @fields={{this.customForm.speaker}}
+          @updateField={{action (mut this.speakerField)}} />
 
-      <Forms::Wizard::CustomFormInput @customForms={{this.data.customForms}} @event={{this.data.event}} @form="speaker"
-        @field={{this.speakerField}} @onSave={{action (mut this.speakerField) null}} />
+        <Forms::Wizard::CustomFormInput
+          @customForms={{this.data.customForms}}
+          @event={{this.data.event}}
+          @form="speaker"
+          @field={{this.speakerField}}
+          @onSave={{action (mut this.speakerField) null}} />
 
-    </div>
-    <div class="column">
-      <Forms::Wizard::CustomForms::Table @headerText="Collect Session Details" @fields={{this.customForm.session}}
-        @updateField={{action (mut this.sessionField)}} />
+      </div>
+      <div class="column">
+        <Forms::Wizard::CustomForms::Table
+          @headerText="Collect Session Details"
+          @fields={{this.customForm.session}}
+          @updateField={{action (mut this.sessionField)}} />
 
-      <Forms::Wizard::CustomFormInput @customForms={{this.data.customForms}} @event={{this.data.event}} @form="session"
-        @field={{this.sessionField}} @onSave={{action (mut this.sessionField) null}} />
+        <Forms::Wizard::CustomFormInput
+          @customForms={{this.data.customForms}}
+          @event={{this.data.event}}
+          @form="session"
+          @field={{this.sessionField}}
+          @onSave={{action (mut this.sessionField) null}} />
+      </div>
     </div>
-  </div>
-  <div class="spacer-50"></div>
+    <div class="spacer-50"></div>
   {{else}}
-  <div class="spacer-50"></div>
+    <div class="spacer-50"></div>
   {{/if}}
   {{!--  Hiding the Custom Widget Form, Until it is ready to be deployed for Development & Production.
   {{#each complexCustomForms as |form|}}
@@ -259,5 +270,11 @@
 
 </form>
 
-<Forms::Wizard::WizardFooter @event={{this.data.event}} @loading={{this.loading}} @last={{true}}
-  @onSaved={{action 'saveForm'}} @onSaveDraft={{action 'saveDraft'}} @move={{action 'move'}} />
\ No newline at end of file
+<Forms::Wizard::WizardFooter
+  @event={{this.data.event}}
+  @loading={{this.loading}}
+  @last={{true}}
+  @onSaved={{action 'saveForm'}}
+  @onSaveDraft={{action 'saveDraft'}}
+  @move={{action 'move'}} />
+  
\ No newline at end of file

From 0f0c2cb2b12ba1e94f1741577f948e21500140d6 Mon Sep 17 00:00:00 2001
From: Sandeep Mandal <sandeepmandal415@gmail.com>
Date: Mon, 26 Oct 2020 12:48:14 +0530
Subject: [PATCH 3/3] Simplified Wizards

---
 app/components/forms/wizard/custom-form-input.hbs         | 8 ++++----
 .../components/forms/wizard/sessions-speakers-step.hbs    | 2 +-
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/app/components/forms/wizard/custom-form-input.hbs b/app/components/forms/wizard/custom-form-input.hbs
index b42400a5105..7c0d1958fbe 100644
--- a/app/components/forms/wizard/custom-form-input.hbs
+++ b/app/components/forms/wizard/custom-form-input.hbs
@@ -1,10 +1,10 @@
 <div class="ui hidden divider"></div>
-<h3 class="ui dividing header">
+<div class="ui dividing">
   <i class="checkmark box icon"></i>
-  <div class="content">
+  <span class="content">
     {{t 'Add Custom Form Field'}}
-  </div>
-</h3>
+  </span>
+</div>
 <div {{did-update this.updated @field}} class="ui action input" style="width: inherit;">
   <Input type="text" placeholder="Field Name" @value={{this.name}} />
   <UiDropdown class="ui selection dropdown" @selected={{this.type}} @onChange={{action (mut this.type)}}>
diff --git a/app/templates/components/forms/wizard/sessions-speakers-step.hbs b/app/templates/components/forms/wizard/sessions-speakers-step.hbs
index 5c839b73c73..c9034343721 100644
--- a/app/templates/components/forms/wizard/sessions-speakers-step.hbs
+++ b/app/templates/components/forms/wizard/sessions-speakers-step.hbs
@@ -190,7 +190,7 @@
     <h3 class="ui dividing header">
       <i class="checkmark box icon"></i>
       <div class="content">
-        {{t 'Customize registration form'}}
+        {{t 'Customize submission forms'}}
       </div>
     </h3>