From db0a8722469ecd2ee6e710ccc7982089bbb5ed3f Mon Sep 17 00:00:00 2001
From: Dawn Ahukanna <ahukanna@uk.ibm.com>
Date: Fri, 13 Mar 2015 17:06:52 +0000
Subject: [PATCH] 1. Bug-fixes for left over hardcoded strings. 2. Added style
 elements in app.css stylesheet. 3. Moved "Back to Gallery" button on the same
 line as the tutorial.shortdescription and removed literal strings to tutorial
 _data.json file.

---
 src/_data.json                    |  4 ++--
 src/_includes/details.ejs         |  6 +++---
 src/_includes/steps.ejs           | 15 +++++++--------
 src/_layout.ejs                   |  3 ---
 src/css/_custom.scss              |  6 ++++--
 src/css/app.css                   |  3 ++-
 src/tutorialExample/en/_data.json | 12 ++++++++----
 7 files changed, 26 insertions(+), 23 deletions(-)

diff --git a/src/_data.json b/src/_data.json
index 428865e..66b4bdc 100644
--- a/src/_data.json
+++ b/src/_data.json
@@ -27,7 +27,7 @@
 		"repoUrlFilepathJs":"/ot4i.tutorials/dist/js/main.js",
 		
 		"repoUrlFilepathFoundationModernizr":"/ot4i.tutorials/dist/js/vendor/modernizr.js",
-		"repoUrlFilepathFoundationJquery":"ot4i.tutorials/dist/js/vendor/jquery.js",
+		"repoUrlFilepathFoundationJquery":"/ot4i.tutorials/dist/js/vendor/jquery.js",
 		"repoUrlFilepathFoundationJs":"/ot4i.tutorials/dist/js/vendor/foundation.min.js",
 		
 		"repoUrlFilepathJson2":"/ot4i.tutorials/dist/js/json2.js",
@@ -74,7 +74,7 @@
 		"repoUrlFilepathJs":"/ot4i.tutorials/dist/js/main.js",
 		
 		"repoUrlFilepathFoundationModernizr":"/ot4i.tutorials/dist/js/vendor/modernizr.js",
-		"repoUrlFilepathFoundationJquery":"ot4i.tutorials/dist/js/vendor/jquery.js",
+		"repoUrlFilepathFoundationJquery":"/ot4i.tutorials/dist/js/vendor/jquery.js",
 		"repoUrlFilepathFoundationJs":"/ot4i.tutorials/dist/js/vendor/foundation.min.js",
 		
 		"repoUrlFilepathJson2":"/ot4i.tutorials/dist/js/json2.js",
diff --git a/src/_includes/details.ejs b/src/_includes/details.ejs
index a3869e8..319603e 100644
--- a/src/_includes/details.ejs
+++ b/src/_includes/details.ejs
@@ -47,11 +47,11 @@
           </div>
           <div class="row" style="margin-left: 1rem; text-align: center;">
             <action>
-              <div class="small radius button" id="startTutorial" onclick="startTutorialFromDetailsScreen()"> <%= content._common.buttonStartTutorial.text %>
+              <div class="small radius button" id="<%= content._common.buttonStartTutorial.idName %>" onclick="<%= content._common.buttonStartTutorial.method %>;"> <%= content._common.buttonStartTutorial.name %>
             </div>
             </action>
-            <div class="small radius button" id="backToGallery" onclick="backToGallery()"> <%= content._common.buttonBackToGallery.text %>
-            </div>
+            <div class="small radius button" id="<%= content._common.buttonBackToGallery.idName %>" onclick="<%= content._common.buttonBackToGallery.method %>;"> <%= content._common.buttonBackToGallery.name %>
+			</div>
           </div>
         </div>
       </div>
diff --git a/src/_includes/steps.ejs b/src/_includes/steps.ejs
index cae450e..2d4fd05 100644
--- a/src/_includes/steps.ejs
+++ b/src/_includes/steps.ejs
@@ -17,18 +17,17 @@
 	  	<div class="row">
 			<a href="javascript:;" onclick="openHelpSystem('<%= tutorialCommon.helpLink.link %>');" class="small right helplink"><%= tutorialCommon.helpLink.text %></a> 
 		</div>
-		<div class="row"><p></p></div>
-		<div class="row">
-			<div class="small radius button right" id="backToGallery" onclick="backToGallery()"> <%= content._common.buttonBackToGallery.text %>
-			</div>
-		</div>
 	  </div>
 	</div> 
 	<hr />
 	<div class="row">
-	  <div class="small-12 medium-12 large-12 columns">
-	    <h5> <%= tutorialCommon.shortDescription %> </h5>
-	  </div>
+		<div class="small-10 medium-10 large-10 columns">
+		<h5> <%= tutorialCommon.shortDescription %> </h5>
+		</div>
+		<div class="small-2 medium-2 large-2 columns center-item">
+			<div class="small radius button" id="<%= content._common.buttonBackToGallery.idName %>" onclick="<%= content._common.buttonBackToGallery.method %>"> <%= content._common.buttonBackToGallery.name %>
+			</div>
+		</div>
 	</div>
 	<div class="row">          
 		  <div class="small-12 medium-12 large-12 columns">
diff --git a/src/_layout.ejs b/src/_layout.ejs
index b111f73..f360b29 100644
--- a/src/_layout.ejs
+++ b/src/_layout.ejs
@@ -35,11 +35,8 @@
 <!-- header::End -->
 <!-- body::Start -->
 		<%- yield %><% /* DNA-Comment: Insert content here. */ %>
-		<script src="http://ot4i.github.io/ot4i.tutorials/dist/js/vendor/jquery.js"></script><% /* DNA-Comment: Foundation5 5.4.7 jquery */ %>
 		<script src="<%= header.repoUrlProtocol %><%= header.repoUrlSite %><%= header.repoUrlFilepathFoundationJquery %>"></script><% /* DNA-Comment: Foundation5 5.4.7 jquery */ %>
-		<script src="http://ot4i.github.io/ot4i.tutorials/dist/js/vendor/foundation.min.js"></script><% /* DNA-Comment: Foundation5 5.4.7 JavaScript */ %>
 		<script src="<%= header.repoUrlProtocol %><%= header.repoUrlSite %><%= header.repoUrlFilepathFoundationJs %>"></script><% /* DNA-Comment: Foundation5 5.4.7 JavaScript */ %>
-		<script src="http://ot4i.github.io/ot4i.tutorials/dist/js/main.js"></script><% /* DNA-Comment: Custom JavaScript */ %>
 		<script src="<%= header.repoUrlProtocol %><%= header.repoUrlSite %><%= header.repoUrlFilepathJs %>"></script><% /* DNA-Comment: Custom JavaScript */ %>
 	</body>
 <!-- body::End -->
diff --git a/src/css/_custom.scss b/src/css/_custom.scss
index c62d19a..06373c5 100644
--- a/src/css/_custom.scss
+++ b/src/css/_custom.scss
@@ -272,7 +272,9 @@ p
   padding: 0rem 0.5rem;
 }
 
-#backToGallery
+.center-item
 {
-	margin:0px;
+	text-align: center;
+	margin-left: auto;
+    margin-right: auto;
 }
\ No newline at end of file
diff --git a/src/css/app.css b/src/css/app.css
index 4f33bb5..56e86c5 100644
--- a/src/css/app.css
+++ b/src/css/app.css
@@ -1,4 +1,5 @@
 html, body {font-size: 85%; margin: 0 5px; }
 .icon-image {display: inline;}
 h5.tabdescription { margin: 10px 0; } 
-h4.tkaction { margin-top: 10px; text-align: center; }
\ No newline at end of file
+h4.tkaction { margin-top: 10px; text-align: center;}
+#backToGallery{ margin:0px;}
\ No newline at end of file
diff --git a/src/tutorialExample/en/_data.json b/src/tutorialExample/en/_data.json
index 47d5016..7f83e5e 100644
--- a/src/tutorialExample/en/_data.json
+++ b/src/tutorialExample/en/_data.json
@@ -9,11 +9,15 @@
 			{
                 "buttonBackToGallery": 
 				{
-                    "text": "Back To Gallery"
+                    "name": "Back To Gallery",
+					"method": "backToGallery()",
+					"idName": "backToGallery"	
                 },
                 "buttonStartTutorial": 
 				{
-                    "text": "Start Tutorial"
+                    "name": "Start Tutorial",
+					"method": "startTutorialFromDetailsScreen()",
+					"idName": "startTutorial"
                 }
             }
         }
@@ -212,10 +216,10 @@
                                 "details": 
 								[
                                     {
-                                        "details": "Open the HTTPInputMessageFlow, and click the Flow Exerciser icon <img src='http://ot4i.github.io/ot4i.tutorials/dist/images/icons/iib/startFlowExerciser.png' alt='' /> to start recording the message path through the flow."
+                                        "details": "Open the HTTPInputMessageFlow, and click the Flow Exerciser icon <img src='<%= header.repoUrlProtocol %><%= header.repoUrlSite %>/dist/images/icons/iib/startFlowExerciser.png' alt='' /> to start recording the message path through the flow."
                                     },
                                     {
-                                        "details": "Click the Send Message icon <img src='http://ot4i.github.io/ot4i.tutorials/dist/images/icons/iib/sendMessage.png' alt='' /> to select a message to send to the flow."
+                                        "details": "Click the Send Message icon <img src='<%= header.repoUrlProtocol %><%= header.repoUrlSite %>/dist/images/icons/iib/sendMessage.png' alt='' /> to select a message to send to the flow."
                                     },
                                     {
                                         "details": "Choose the ExampleInputMessage1, edit the message data if you like, and click Send. Your request message is sent to the HTTP input node.",