Added handling for AlignForStimuli.

src/app/Cockpit.Experiments.Web/App/Components/Questions/LikertScale/LikertScale.html

@@ -5,11 +5,13 @@
 		</div>
 	</div>
 	<div class="row">
-		<div class="col-xs-2" data-bind="if: HasMedia">
+		<div class="col-xs-2" data-bind="visible: IsStimuliBlockVisible">
+			<!-- ko if: HasMedia -->
 			<div data-bind="component: {name: 'Players/Audio', params: AudioInfo}"></div>
 			<p data-bind="html: AudioLabel"></p>
+			<!-- /ko -->
 		</div>
-		<div class="col-xs-10 Scale" data-bind="foreach: Items">
+		<div class="Scale" data-bind="foreach: Items, css: {'col-xs-10': IsStimuliBlockVisible, 'col-xs-12': !IsStimuliBlockVisible}">
 			<label class="text-center" data-bind="css: {disabled: !$parent.CanAnswer()}, style: {width: (100 / $parent.Items.length) + '%'}">
 				<span class="Line"></span>
 				<input type="radio" data-bind="checked: $parent.Answer, attr: {name: $parent.Id}, value: Id, enable: $parent.CanAnswer" />

src/app/Cockpit.Experiments.Web/App/Components/Questions/LikertScale/LikertScale.js

@@ -14,6 +14,8 @@ define(["require", "exports", "knockout", "Components/Questions/QuestionBase", "
             this.Answer = knockout.observable(null);
             this.HasMedia = false;
             this.AnswerIsRequired = true;
+            this.IsStimuliBlockVisible = true;
+            this._alignForStimuli = true;
             this.Id = this.Model.Id;
             this.HeaderLabel = this.GetInstrumentFormatted("HeaderLabel");
             var stimulus = this.GetInstrument("Stimulus");
@@ -23,6 +25,9 @@ define(["require", "exports", "knockout", "Components/Questions/QuestionBase", "
                 this.TrackAudioInfo("/Instrument/Stimulus", this.AudioInfo);
                 this.HasMedia = true;
             }
+            var alignForStimuli = this.GetInstrument("AlignForStimuli");
+            this._alignForStimuli = alignForStimuli === undefined || alignForStimuli === "1";
+            this.IsStimuliBlockVisible = this._alignForStimuli || this.HasMedia;
             this.CanAnswer = this.WhenAllAudioHavePlayed(this.AudioInfo, true);
             this.AnswerIsRequired = this.GetInstrument("MinNoOfScalings") !== "0";
             this.Items = this.GetItems(function (item) { return _this.ItemInfo(item); });

src/app/Cockpit.Experiments.Web/App/Components/Questions/LikertScale/LikertScale.ts

@@ -17,6 +17,9 @@ class LikertScale extends QuestionBase
 	public HasMedia: boolean = false;
 	public CanAnswer: KnockoutObservable<boolean>;
 	public AnswerIsRequired: boolean = true;
+	public IsStimuliBlockVisible:boolean = true;
+
+	private _alignForStimuli:boolean = true;
 
 	constructor(question: QuestionModel)
 	{
@@ -35,6 +38,10 @@ class LikertScale extends QuestionBase
 			this.HasMedia = true;
 		}
 
+		var alignForStimuli = this.GetInstrument("AlignForStimuli");
+		this._alignForStimuli = alignForStimuli === undefined || alignForStimuli === "1";
+		this.IsStimuliBlockVisible = this._alignForStimuli || this.HasMedia;
+
 		this.CanAnswer = this.WhenAllAudioHavePlayed(this.AudioInfo, true);
 		this.AnswerIsRequired = this.GetInstrument("MinNoOfScalings") !== "0";
 

src/app/Cockpit.Experiments.Web/App/Components/Questions/OneDScale/OneDScale.html

@@ -5,11 +5,13 @@
 		</div>
 	</div>
 	<div class="row">
-		<div class="col-xs-2" data-bind="if: HasMedia">
+		<div class="col-xs-2" data-bind="visible: IsStimuliBlockVisible">
+			<!-- ko if: HasMedia -->
 			<div data-bind="component: {name: 'Players/Audio', params: AudioInfo}"></div>
 			<p data-bind="html: AudioLabel"></p>
+			<!-- /ko -->
 		</div>
-		<div class="col-xs-10 ScaleContainer">
+		<div class="ScaleContainer" data-bind="css: {'col-xs-10': IsStimuliBlockVisible, 'col-xs-12': !IsStimuliBlockVisible}">
 			<div class="XTicks X2" data-bind="foreach: X2Ticks, style: { height: X2Height() + 'px' }">
 				<p class="Tick" data-bind="html: Label, css:{MinPosition: IsMinPosition, MaxPosition: IsMaxPosition }, Height: {Value: $parent.X2Height, Max: true}, style: {left: RelativePosition * 100 + '%'}"></p>
 			</div>

src/app/Cockpit.Experiments.Web/App/Components/Questions/OneDScale/OneDScale.js

@@ -15,6 +15,8 @@ define(["require", "exports", "knockout", "Components/Questions/QuestionBase", "
             this.AudioInfo = null;
             this.HasMedia = false;
             this.Answer = knockout.observable(null);
+            this.IsStimuliBlockVisible = true;
+            this._alignForStimuli = true;
             this.Id = this.Model.Id;
             this.HeaderLabel = this.GetInstrumentFormatted("HeaderLabel");
             this.X1Ticks = this.GetTicks("X1AxisTicks");
@@ -31,6 +33,9 @@ define(["require", "exports", "knockout", "Components/Questions/QuestionBase", "
                 this.TrackAudioInfo("/Instrument/Stimulus", this.AudioInfo);
                 this.HasMedia = true;
             }
+            var alignForStimuli = this.GetInstrument("AlignForStimuli");
+            this._alignForStimuli = alignForStimuli === undefined || alignForStimuli === "1";
+            this.IsStimuliBlockVisible = this._alignForStimuli || this.HasMedia;
             this.CanAnswer = this.WhenAllAudioHavePlayed(this.AudioInfo, true);
             if (this.HasAnswer())
                 this.Answer(this.GetAsnwer().Position);

src/app/Cockpit.Experiments.Web/App/Components/Questions/OneDScale/OneDScale.ts

@@ -33,6 +33,10 @@ class OneDScale extends QuestionBase
 	public IsValueNotSet: KnockoutComputed<boolean>;
 	public CanAnswer: KnockoutObservable<boolean>;
 
+	public IsStimuliBlockVisible: boolean = true;
+
+	private _alignForStimuli: boolean = true;
+
 	constructor(question: QuestionModel)
 	{
 		super(question);
@@ -58,6 +62,10 @@ class OneDScale extends QuestionBase
 			this.HasMedia = true;
 		}
 
+		var alignForStimuli = this.GetInstrument("AlignForStimuli");
+		this._alignForStimuli = alignForStimuli === undefined || alignForStimuli === "1";
+		this.IsStimuliBlockVisible = this._alignForStimuli || this.HasMedia;
+
 		this.CanAnswer = this.WhenAllAudioHavePlayed(this.AudioInfo, true);
 
 		if (this.HasAnswer()) this.Answer(this.GetAsnwer().Position);

src/app/Cockpit.Experiments.Web/Cockpit.Experiments.Web.csproj

@@ -33,7 +33,6 @@
     <Content Include="App\Components\Questions\ContinousScale2D\ContinousScale2D.html" />
     <Content Include="App\Components\Questions\Freetext\Freetext.html" />
     <Content Include="App\Components\Questions\RadioButtonGroup\RadioButtonGroup.html" />
-    <Content Include="App\Components\Slides\Completed\Completed.html" />
     <Content Include="App\Components\Slides\Default\Default.html" />
     <Content Include="App\Components\TextFormat\TextFormat.html" />
     <Content Include="App\Components\Welcome\Welcome.html" />
@@ -160,7 +159,6 @@
     <TypeScriptCompile Include="App\Components\Questions\QuestionBase.ts" />
     <TypeScriptCompile Include="App\Components\Questions\RadioButtonGroup\RadioButtonGroup.ts" />
     <TypeScriptCompile Include="App\Components\Questions\Unsupported\Unsupported.ts" />
-    <TypeScriptCompile Include="App\Components\Slides\Completed\Completed.ts" />
     <TypeScriptCompile Include="App\Components\Slides\Default\Default.ts" />
     <TypeScriptCompile Include="App\Components\NameConventionLoader.ts" />
     <TypeScriptCompile Include="App\Managers\Navigation.ts" />

src/app/Cockpit.Experiments.Web/default.html

@@ -5,7 +5,7 @@
 		<meta charset="utf-8" />
 		<title>Cockpit Experiments</title>
 		<script type="text/javascript">
-			var CacheBuster = 14;
+			var CacheBuster = 15;
 		</script>
 	</head>
 	<body>