From 32af46e42c40d9f2ac48eca7b71a34a882e34b57 Mon Sep 17 00:00:00 2001
From: Kevin Granger <shipowlata@gmail.com>
Date: Tue, 26 Nov 2013 19:03:15 +0100
Subject: [PATCH] // Import WIP

---
 admin-dev/themes/default/css/admin-theme.css  |   2 +-
 .../scss/admin-theme/_admin-backward.sass     |   2 +-
 .../controllers/import/helpers/form/form.tpl  | 592 +++++++++---------
 .../controllers/import/helpers/view/view.tpl  | 156 ++---
 4 files changed, 389 insertions(+), 363 deletions(-)

diff --git a/admin-dev/themes/default/css/admin-theme.css b/admin-dev/themes/default/css/admin-theme.css
index 0511d0e5d..b4d305b21 100644
--- a/admin-dev/themes/default/css/admin-theme.css
+++ b/admin-dev/themes/default/css/admin-theme.css
@@ -3543,4 +3543,4 @@ a.link-social:hover { text-decoration: none; }
 .bootstrap #dash_version iframe { height: 80px; width: 100%; }
 .bootstrap .adminsearch #content .panel .panel, .bootstrap .adminsearch #content #header_notifs_icon_wrapper .notifs_panel .panel, #header_notifs_icon_wrapper .bootstrap .adminsearch #content .notifs_panel .panel, .bootstrap .adminsearch #content #dash_version .panel, .bootstrap .adminsearch #content .panel #header_notifs_icon_wrapper .notifs_panel, #header_notifs_icon_wrapper .bootstrap .adminsearch #content .panel .notifs_panel, .bootstrap .adminsearch #content #header_notifs_icon_wrapper .notifs_panel .notifs_panel, #header_notifs_icon_wrapper .bootstrap .adminsearch #content .notifs_panel .notifs_panel, .bootstrap .adminsearch #content #dash_version #header_notifs_icon_wrapper .notifs_panel, #header_notifs_icon_wrapper .bootstrap .adminsearch #content #dash_version .notifs_panel, .bootstrap .adminsearch #content .panel #dash_version, .bootstrap .adminsearch #content #header_notifs_icon_wrapper .notifs_panel #dash_version, #header_notifs_icon_wrapper .bootstrap .adminsearch #content .notifs_panel #dash_version, .bootstrap .adminsearch #content #dash_version #dash_version { padding: 0; margin: 0; border: none; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; -webkit-box-shadow: 0; box-shadow: 0; }
 
-#content.nobootstrap { background-color: white; width: 1200px; padding: 80px 40px; }
+#content.nobootstrap { background-color: white; min-width: 1200px; padding: 80px 40px; }
diff --git a/admin-dev/themes/default/scss/admin-theme/_admin-backward.sass b/admin-dev/themes/default/scss/admin-theme/_admin-backward.sass
index da3f7b97d..bbb4c4829 100644
--- a/admin-dev/themes/default/scss/admin-theme/_admin-backward.sass
+++ b/admin-dev/themes/default/scss/admin-theme/_admin-backward.sass
@@ -1,4 +1,4 @@
 #content.nobootstrap
 	background-color: white
-	width: 1200px
+	min-width: 1200px
 	padding: 80px 40px
\ No newline at end of file
diff --git a/admin-dev/themes/default/template/controllers/import/helpers/form/form.tpl b/admin-dev/themes/default/template/controllers/import/helpers/form/form.tpl
index cd7df8564..c7a0b5f45 100644
--- a/admin-dev/themes/default/template/controllers/import/helpers/form/form.tpl
+++ b/admin-dev/themes/default/template/controllers/import/helpers/form/form.tpl
@@ -29,311 +29,333 @@
 	{l s='Your .CSV file has been sucessfully imported into your shop. Don\'t forget to Re-build the products search index.'}
 </div>
 {/if}
-<div id="upload_file_import" style="display: none">
-	<div>{l s='Only UTF-8 and ISO-8859-1 encoding are allowed'}</div>
-	<form action="{$current}&token={$token}" method="post" enctype="multipart/form-data" class="form-horizontal">
+
+<div class="row">
+	<div class="col-lg-8">
+		{* Import fieldset *}
 		<div class="panel">
-			<div class="form-group">
-				<label class="control-label col-lg-3">{l s='Select your CSV file'}</label>
-				<div class="col-lg-9">
-					<div class="row">
-						<div class="col-lg-7">
-							<input id="file" type="file" name="file" class="hide" />
-							<div class="dummyfile input-group">
-								<span class="input-group-addon"><i class="icon-file"></i></span>
-								<input id="file-name" type="text" class="disabled" name="filename" readonly />
-								<span class="input-group-btn">
-									<button id="file-selectbutton" type="button" name="submitAddAttachments" class="btn btn-default">
-										<i class="icon-folder-open"></i> {l s='Choose a file'}
-									</button>
-								</span>
-							</div>
-						</div>
-					</div>
-					<div class="row">
-						<div class="col-lg-7">
-							<p class="help-block">
-								{l s='You can also upload your file via FTP to the following directory:'} {$path_import}.
-							</p>
-						</div>
+			<h3>
+				<i class="icon-upload"></i>
+				{l s='Import'}
+			</h3>
+			<!-- <div id="upload_file_import">
+				<form action="{$current}&token={$token}" method="post" enctype="multipart/form-data" class="form-horizontal">
+					<button type="submit" name="submitFileUpload" class="btn btn-default">
+						<i class="icon-upload-alt"></i>
+						{l s='Upload'}
+					</button>
+				</form>
+			</div> -->
+			<form id="preview_import" action="{$current}&token={$token}" method="post" enctype="multipart/form-data" class="form-horizontal">
+				<div class="form-group">
+					<label class="control-label col-lg-4">{l s='What kind of entity would you like to import?'} </label>
+					<div class="col-lg-8">
+						<select name="entity" id="entity">
+							{foreach $entities AS $entity => $i }
+							<option value="{$i}"{if $entity_selected == $i} selected="selected"{/if}>
+								{$entity}
+							</option>
+							{/foreach}
+						</select>
 					</div>
 				</div>
-			</div>
-			<div class="form-group">
-				<div class="col-lg-9 col-lg-offset-3">
-					<button type="submit" name="submitFileUpload" class="btn btn-default"><i class="icon-upload"></i> {l s='Upload'}</button>
+				<hr>
+				<div class="form-group" id="csv_file_uploader">
+					<label class="control-label col-lg-4">{l s='Select your CSV file'}</label>
+					<div class="col-lg-8">
+						<input id="file" type="file" name="file" class="hide" />
+						<div class="dummyfile input-group">
+							<span class="input-group-addon"><i class="icon-file"></i></span>
+							<input id="file-name" type="text" class="disabled" name="filename" readonly />
+							<span class="input-group-btn">
+								<button id="file-selectbutton" type="button" name="submitAddAttachments" class="btn btn-default">
+									<i class="icon-folder-open"></i> {l s='Choose a file'}
+								</button>
+							</span>
+						</div>
+						<p class="help-block">
+							{l s="You can also re-use a file that you already uploaded."}
+							<a href="#" onclick="$('#csv_files_history').slideToggle();$('#csv_file_uploader').slideToggle(); return false;">Click here</a>.
+						</p>
+					</div>
+					<!-- <div class="alert alert-info">
+						{l s='Only UTF-8 and ISO-8859-1 encoding are allowed'}.<br/>
+						{l s='You can also upload your file via FTP to the following directory:'} {$path_import}.
+					</div> -->
 				</div>
-			</div>
-		</div>
-	</form>
-</div>
-
-{* Import fieldset *}
-<form id="preview_import" action="{$current}&token={$token}" method="post" enctype="multipart/form-data" class="form-horizontal">
-	
-	<div class="panel">
-		<h3>
-			<i class="icon-upload"></i>
-			{l s='Import'}
-		</h3>
-		<div class="form-group">
-			<label class="control-label col-lg-3">
-				{if count($files_to_import) > 1}
-					{l s='Your CSV file (%d files):' sprintf=count($files_to_import)}
-				{else}
-					{l s='Your CSV file (%d file):' sprintf=count($files_to_import)}
-				{/if}
-			</label>
-			<div class="col-lg-6">
-				{if count($files_to_import)}
-					<select name="csv">
-						{foreach $files_to_import AS $filename}
-							<option value="{$filename}"{if $csv_selected == $filename} selected="selected"{/if}>{$filename|escape:'html':'UTF-8'}</option>
-						{/foreach}
-					</select>
-				{/if}
-				<a href="#upload_file_import" id="upload_file_import_link" class="btn btn-default">
-					<i class="icon-plus-sign-alt"></i>
-					{l s='Upload'}
-				</a>
-
-			</div>
-		</div>
-		<div class="form-group">
-			<div class="col-lg-6">
-				<p class="panel">
-					<a href="#" onclick="$('#sample_files_import').slideToggle(); return false;">
-						{l s='Click to view our sample import csv files.'}
-					</a>
-				</p>
-				<div id="sample_files_import" style="display:none" class="list-group">
-					<a class="list-group-item" href="../docs/csv_import/categories_import.csv" target="_blank">
-						<i class="icon-download"></i>
-						{l s='Sample Categories file'}
-					</a>
-					<a class="list-group-item" href="../docs/csv_import/products_import.csv" target="_blank">
-						<i class="icon-download"></i>
-						{l s='Sample Products file'}
-					</a>
-					<a class="list-group-item" href="../docs/csv_import/combinations_import.csv" target="_blank">
-						<i class="icon-download"></i>
-						{l s='Sample Combinations file'}
-					</a>
-					<a class="list-group-item" href="../docs/csv_import/customers_import.csv" target="_blank">
-						<i class="icon-download"></i>
-						{l s='Sample Customers file'}
-					</a>
-					<a class="list-group-item" href="../docs/csv_import/addresses_import.csv" target="_blank">
-						<i class="icon-download"></i>
-						{l s='Sample Addresses file'}
-					</a>
-					<a class="list-group-item" href="../docs/csv_import/manufacturers_import.csv" target="_blank">
-						<i class="icon-download"></i>
-						{l s='Sample Manufacturers file'}
-					</a>
-					<a class="list-group-item" href="../docs/csv_import/suppliers_import.csv" target="_blank">
-						<i class="icon-download"></i>
-						{l s='Sample Suppliers file'}
-					</a>
-					<a class="list-group-item" href="../docs/csv_import/alias_import.csv" target="_blank">
-						<i class="icon-download"></i>
-						{l s='Sample Alias file'}
-					</a>
-					{if $PS_ADVANCED_STOCK_MANAGEMENT}
-						<a class="list-group-item" href="../docs/csv_import/supply_orders_import.csv" target="_blank">
-							<i class="icon-download"></i>
-							{l s='Supply Orders sample file'}
-						</a>
-						<a class="list-group-item" href="../docs/csv_import/supply_orders_details_import.csv" target="_blank">
-							<i class="icon-download"></i>
-							{l s='Supply Orders Details sample file'}
-						</a>
+				<!-- <div class="form-group">
+					<label class="control-label col-lg-3">
+						{if count($files_to_import) > 1}
+							{l s='Your CSV file (%d files):' sprintf=count($files_to_import)}
+						{else}
+							{l s='Your CSV file (%d file):' sprintf=count($files_to_import)}
+						{/if}
+					</label>
+					<div class="col-lg-9">
+					{if count($files_to_import)}
+						<select name="csv">
+							{foreach $files_to_import AS $filename}
+								<option value="{$filename}"{if $csv_selected == $filename} selected="selected"{/if}>{$filename|escape:'html':'UTF-8'}</option>
+							{/foreach}
+						</select>
 					{/if}
+					</div>
+				</div> -->
+				<div class="form-group" id="csv_files_history" style="display:none;" >
+					<div class="panel">
+						<div class="panel-heading">
+							<!-- {l s='Click to view your csv files.'} -->
+							{l s='History of uploaded .CSV'}
+							<span class="badge">{$files_to_import|count}</span>
+							<button type="button" class="btn btn-link pull-right" onclick="$('#csv_files_history').slideToggle();$('#csv_file_uploader').slideToggle(); return false;">
+								<i class="icon-remove"></i>
+							</button>
+						</div>
+						<table class="table">
+							{foreach $files_to_import AS $filename}
+							<tr >
+								<td>
+									{$filename}
+								</td>
+								<td>
+									<div class="btn-group pull-right">
+										<button type="button" class="btn btn-default">
+											<i class="icon-ok"></i>
+											{l s='Use'}
+										</button>
+										<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+											<i class="icon-chevron-down"></i>
+										</button>
+										<ul class="dropdown-menu" role="menu">
+											<li>
+												<a href="{$current}&token={$token}&csvfilename={$filename|@base64_encode}" target="_blank">
+													<i class="icon-download"></i>
+													{l s='Download'}
+												</a>
+											</li>
+											<li class="divider"></li>
+											<li>
+												<a href="{$current}&token={$token}&csvfilename={$filename|@base64_encode}&delete=1">
+													<i class="icon-trash"></i>
+													{l s='Delete'}
+												</a>
+											</li>
+										</ul>
+									</div>
+								</td>
+							</tr>
+							{/foreach}
+						</table>
+					</div>
+				</div>
+				<hr>
+				<div class="form-group">
+					<label class="control-label col-lg-4">
+						<span title="" data-toggle="tooltip" class="label-tooltip" data-original-title="{l s='The locale must be installed'}">
+							{l s='Language of the file'}
+						</span>
+					</label>
+					<div class="col-lg-8">
+						<select name="iso_lang">
+							{foreach $languages AS $lang}
+								<option value="{$lang.iso_code}" {if $lang.id_lang == $id_language} selected="selected"{/if}>{$lang.name}</option>
+							{/foreach}
+						</select>
+					</div>
+				</div>			
+				<div class="form-group">
+					<label for="convert" class="control-label col-lg-4">{l s='ISO-8859-1 encoded file?'} </label>
+					<div class="col-lg-8">
+						<label class="switch-light prestashop-switch fixed-width-lg">
+							<input name="convert" id="convert" type="checkbox" />
+							<span>
+								<span>{l s='Yes'}</span>
+								<span>{l s='No'}</span>
+							</span>
+							<a class="slide-button btn btn-default"></a>
+						</label>
+					</div>
+				</div>
+				<div class="form-group">
+					<label class="control-label col-lg-4">{l s='Field separator'} </label>
+					<div class="col-lg-8">
+						<input class="fixed-width-xs" type="text" value="{if isset($separator_selected)}{$separator_selected|escape:'html':'UTF-8'}{else};{/if}" name="separator"/>
+						<div class="help-block">{l s='e.g. '} 1; Ipod; 129.90; 5</div>
+					</div>
+				</div>
+				<div class="form-group">
+					<label class="control-label col-lg-4">{l s='Multiple value separator'} </label>
+					<div class="col-lg-8">
+						<input class="fixed-width-xs" type="text" value="{if isset($multiple_value_separator_selected)}{$multiple_value_separator_selected|escape:'html':'UTF-8'}{else},{/if}" name="multiple_value_separator"/>
+						<div class="help-block">{l s='e.g. '} Ipod; red.jpg, blue.jpg, green.jpg; 129.90</div>
+					</div>
+				</div>
+				<hr>
+				<div class="form-group">
+					<label for="truncate" class="control-label col-lg-4">{l s='Delete all'} <span id="entitie">{l s='categories'}</span> {l s='before import?'} </label>
+					<div class="col-lg-8">
+						<label class="switch-light prestashop-switch fixed-width-lg">
+							<input name="truncate" id="truncate" type="checkbox"/>
+							<span>
+								<span>{l s='Yes'}</span>
+								<span>{l s='No'}</span>
+							</span>
+							<a class="slide-button btn btn-default"></a>
+						</label>
+					</div>
+				</div>
+				<div class="form-group" style="display: none">
+					<label for="match_ref" class="control-label col-lg-4">{l s='Use product reference as key?'}</label>
+					<div class="col-lg-8">
+						<label class="switch-light prestashop-switch fixed-width-lg">
+							<input name="match_ref" id="match_ref" type="checkbox" />
+							<span>
+								<span>{l s='Yes'}</span>
+								<span>{l s='No'}</span>
+							</span>
+							<a class="slide-button btn btn-default"></a>
+						</label>
+					</div>
+				</div>
+				<div class="form-group">
+					<label for="regenerate" class="control-label col-lg-4">{l s='No thumbnails regeneration'}</label>
+					<div class="col-lg-8">
+						<label class="switch-light prestashop-switch fixed-width-lg">
+							<input name="regenerate" id="regenerate" type="checkbox" />
+							<span>
+								<span>{l s='Yes'}</span>
+								<span>{l s='No'}</span>
+							</span>
+							<a class="slide-button btn btn-default"></a>
+						</label>
+					</div>
+				</div>
+				<div class="form-group">
+					<label for="forceIDs" class="control-label col-lg-4">
+						<span title="" data-toggle="tooltip" class="label-tooltip" data-original-title="{l s='If you don\'t use this option, all ID\'s will be auto-incremented.'}">
+							{l s='Force all ID\'s during import?'} 
+						</span>
+					</label>
+					<div class="col-lg-8">
+						<label class="switch-light prestashop-switch fixed-width-lg">
+							<input name="forceIDs" id="forceIDs" type="checkbox"/>
+							<span>
+								<span>{l s='Yes'}</span>
+								<span>{l s='No'}</span>
+							</span>
+							<a class="slide-button btn btn-default"></a>
+						</label>
+					</div>
+				</div>
+				<hr>
+				<div class="form-group">
+					<div class="col-lg-9 col-lg-push-3">
+						<button type="submit" name="submitImportFile" id="submitImportFile" class="btn btn-default pull-right" {if empty($files_to_import)}disabled{/if}>
+							{l s='Next step'}
+							<i class="icon-circle-arrow-right"></i>
+						</button>
+					</div>
 				</div>
-			</div>
-			<div class="col-lg-6">
-				<p class="panel">
-					<a href="#" onclick="$('#csv_files_import').slideToggle(); return false;">
-						{l s='Click to view your csv files.'}
-					</a>
-				</p>
 
-				<ul id="csv_files_import" style="display:none;" class="list-group">
-					{foreach $files_to_import AS $filename}
-					<li>
-						<a href="{$current}&token={$token}&csvfilename={$filename|@base64_encode}">{$filename}</a>&nbsp;&nbsp;
-						<a href="{$current}&token={$token}&csvfilename={$filename|@base64_encode}&delete=1" class="btn btn-default">
-							<i class="icon-trash"></i> {l s='Delete'}
-						</a>
-					</li>
-					{/foreach}
-				</ul>
-			</div>
-		</div>
+				{if empty($files_to_import)}
+				<div class="alert alert-info">{l s='You must upload a file in order to proceed to the next step'}</div>
+				{/if}
 
-		<div class="form-group">
-			<label class="control-label col-lg-3">{l s='What kind of entity would you like to import?'} </label>
-			<div class="col-lg-9">
-				<select name="entity" id="entity">
-					{foreach $entities AS $entity => $i}
-						<option value="{$i}"{if $entity_selected == $i} selected="selected"{/if}>
-							{$entity}
-						</option>
-					{/foreach}
-				</select>
-			</div>
-		</div>
-		<div class="form-group">
-			<label class="control-label col-lg-3">
-				<span title="" data-toggle="tooltip" class="label-tooltip" data-original-title="{l s='The locale must be installed'}">
-					{l s='Language of the file'}
-				</span>
-			</label>
-			<div class="col-lg-9">
-				<select name="iso_lang">
-					{foreach $languages AS $lang}
-						<option value="{$lang.iso_code}" {if $lang.id_lang == $id_language} selected="selected"{/if}>{$lang.name}</option>
-					{/foreach}
-				</select>
-			</div>
-		</div>			
-		<div class="form-group">
-			<label for="convert" class="control-label col-lg-3">{l s='ISO-8859-1 encoded file?'} </label>
-			<div class="col-lg-9">
-				<label class="switch-light prestashop-switch fixed-width-lg">
-					<input name="convert" id="convert" type="checkbox" />
-					<span>
-						<span>{l s='Yes'}</span>
-						<span>{l s='No'}</span>
-					</span>
-					<a class="slide-button btn btn-default"></a>
-				</label>
-			</div>
-		</div>
-		<div class="form-group">
-			<label class="control-label col-lg-3">{l s='Field separator'} </label>
-			<div class="col-lg-9">
-				<input type="text" value="{if isset($separator_selected)}{$separator_selected|escape:'html':'UTF-8'}{else};{/if}" name="separator"/>
-				<div class="help-block">{l s='e.g. '} 1; Ipod; 129.90; 5</div>
-			</div>
-		</div>
-		<div class="form-group">
-			<label class="control-label col-lg-3">{l s='Multiple value separator'} </label>
-			<div class="col-lg-9">
-				<input type="text" value="{if isset($multiple_value_separator_selected)}{$multiple_value_separator_selected|escape:'html':'UTF-8'}{else},{/if}" name="multiple_value_separator"/>
-				<div class="help-block">{l s='e.g. '} Ipod; red.jpg, blue.jpg, green.jpg; 129.90</div>
-			</div>
-		</div>
-		<div class="form-group">
-			<label for="truncate" class="control-label col-lg-3">{l s='Delete all'} <span id="entitie">{l s='categories'}</span> {l s='before import?'} </label>
-			<div class="col-lg-9">
-				<label class="switch-light prestashop-switch fixed-width-lg">
-					<input name="truncate" id="truncate" type="checkbox"/>
-					<span>
-						<span>{l s='Yes'}</span>
-						<span>{l s='No'}</span>
-					</span>
-					<a class="slide-button btn btn-default"></a>
-				</label>
-			</div>
-		</div>
-		<div class="form-group" style="display: none">
-			<label for="match_ref" class="control-label col-lg-3">{l s='Use product reference as key?'}</label>
-			<div class="col-lg-9">
-				<label class="switch-light prestashop-switch fixed-width-lg">
-					<input name="match_ref" id="match_ref" type="checkbox" />
-					<span>
-						<span>{l s='Yes'}</span>
-						<span>{l s='No'}</span>
-					</span>
-					<a class="slide-button btn btn-default"></a>
-				</label>
-			</div>
-		</div>
-		<div class="form-group">
-			<label for="regenerate" class="control-label col-lg-3">{l s='No thumbnails regeneration'}</label>
-			<div class="col-lg-6">
-				<input name="regenerate" id="regenerate" type="checkbox" />
-			</div>
-		</div>
-		<div class="form-group">
-			<label for="forceIDs" class="control-label col-lg-3">
-				<span title="" data-toggle="tooltip" class="label-tooltip" data-original-title="{l s='If you don\'t use this option, all ID\'s will be auto-incremented.'}">
-					{l s='Force all ID\'s during import?'} 
-				</span>
-			</label>
-			<div class="col-lg-9">
-				<label class="switch-light prestashop-switch fixed-width-lg">
-					<input name="forceIDs" id="forceIDs" type="checkbox"/>
-					<span>
-						<span>{l s='Yes'}</span>
-						<span>{l s='No'}</span>
-					</span>
-					<a class="slide-button btn btn-default"></a>
-				</label>
-			</div>
-		</div>
-		<div class="form-group">
-			<div class="col-lg-6 col-lg-push-3">
-				<button type="submit" name="submitImportFile" id="submitImportFile" class="btn btn-default" {if empty($files_to_import)}disabled{/if}>
-					<i class="icon-circle-arrow-right"></i>
-					{l s='Next step'}
-				</button>
-			</div>
-		</div>
+				<div class="alert alert-warning import_products_categories">
+					<p>{l s='Note that the category import does not support categories of the same name.'}</p>
+					<p>{l s='Note that you can have several products with the same reference.'}</p>
+				</div>
 
-		{if empty($files_to_import)}
-		<div class="alert alert-info">{l s='You must upload a file in order to proceed to the next step'}</div>
-		{/if}
+				<div class="alert alert-warning import_supply_orders_details">
+					<p>{l s='Importing Supply Order Details will reset products ordered, if there are any.'}</p>
+				</div>
 
-		<div class="alert alert-warning import_products_categories">
-			<p>{l s='Note that the category import does not support categories of the same name.'}</p>
-			<p>{l s='Note that you can have several products with the same reference.'}</p>
+				{if !count($files_to_import)}
+					<div class="alert alert-warning">
+						<p>{l s='There is no CSV file available. Please upload one using the \'Upload\' button above.'}</p>
+						<ul>
+							<li>{l s='You can read information on CSV import at:'}
+								<a href="http://doc.prestashop.com/display/PS16/CSV+Import+Parameters" target="_blank">http://doc.prestashop.com/display/PS16/CSV+Import+Parameters</a>
+							</li>
+							<li>{l s='Read more about CSV format at:'}
+								<a href="http://en.wikipedia.org/wiki/Comma-separated_values" target="_blank">http://en.wikipedia.org/wiki/Comma-separated_values</a>
+							</li>
+						</ul>
+					</div>
+				{/if}
+			</form>
 		</div>
-		<div class="alert alert-warning import_supply_orders_details">
-			<p>{l s='Importing Supply Order Details will reset products ordered, if there are any.'}</p>
-		</div>
-		{if !count($files_to_import)}
-			<div class="alert alert-warning">
-				<p>{l s='There is no CSV file available. Please upload one using the \'Upload\' button above.'}</p>
-				<ul>
-					<li>{l s='You can read information on CSV import at:'}
-						<a href="http://doc.prestashop.com/display/PS16/CSV+Import+Parameters" target="_blank">http://doc.prestashop.com/display/PS16/CSV+Import+Parameters</a>
-					</li>
-					<li>{l s='Read more about CSV format at:'}
-						<a href="http://en.wikipedia.org/wiki/Comma-separated_values" target="_blank">http://en.wikipedia.org/wiki/Comma-separated_values</a>
-					</li>
-				</ul>
-			</div>
-		{/if}
 	</div>
-</form>
+	<div class="col-lg-4">
+		{* Available and required fields *}
+		<div class="panel">
+			<h3>
+				<i class="icon-list-alt"></i>
+				{l s='Available fields'}
+			</h3>
+			<div id="availableFields" class="alert alert-warning">
+				{$available_fields}
+			</div>
+			<p>{l s='* Required field'}</p>
+		</div>
+		<div class="panel">
+			<a href="#" onclick="$('#sample_files_import').slideToggle(); return false;">
+				{l s='Click to view our sample import csv files.'}
+			</a>
 
-<div class="panel">
-	<h3>
-		<i class="icon-download"></i>
-		{l s='Available fields'}
-	</h3>
-	<div id="availableFields" class="alert alert-warning">
-		{$available_fields}
+			<div id="sample_files_import" class="list-group" style="display:none">
+				<a class="list-group-item" href="../docs/csv_import/categories_import.csv" target="_blank">
+					<i class="icon-download"></i>
+					{l s='Sample Categories file'}
+				</a>
+				<a class="list-group-item" href="../docs/csv_import/products_import.csv" target="_blank">
+					<i class="icon-download"></i>
+					{l s='Sample Products file'}
+				</a>
+				<a class="list-group-item" href="../docs/csv_import/combinations_import.csv" target="_blank">
+					<i class="icon-download"></i>
+					{l s='Sample Combinations file'}
+				</a>
+				<a class="list-group-item" href="../docs/csv_import/customers_import.csv" target="_blank">
+					<i class="icon-download"></i>
+					{l s='Sample Customers file'}
+				</a>
+				<a class="list-group-item" href="../docs/csv_import/addresses_import.csv" target="_blank">
+					<i class="icon-download"></i>
+					{l s='Sample Addresses file'}
+				</a>
+				<a class="list-group-item" href="../docs/csv_import/manufacturers_import.csv" target="_blank">
+					<i class="icon-download"></i>
+					{l s='Sample Manufacturers file'}
+				</a>
+				<a class="list-group-item" href="../docs/csv_import/suppliers_import.csv" target="_blank">
+					<i class="icon-download"></i>
+					{l s='Sample Suppliers file'}
+				</a>
+				<a class="list-group-item" href="../docs/csv_import/alias_import.csv" target="_blank">
+					<i class="icon-download"></i>
+					{l s='Sample Alias file'}
+				</a>
+				{if $PS_ADVANCED_STOCK_MANAGEMENT}
+				<a class="list-group-item" href="../docs/csv_import/supply_orders_import.csv" target="_blank">
+					<i class="icon-download"></i>
+					{l s='Supply Orders sample file'}
+				</a>
+				<a class="list-group-item" href="../docs/csv_import/supply_orders_details_import.csv" target="_blank">
+					<i class="icon-download"></i>
+					{l s='Supply Orders Details sample file'}
+				</a>
+				{/if}
+			</div>
+		</div>
 	</div>
-	<p>{l s='* Required field'}</p>
 </div>
 
 <script type="text/javascript">
 	$(document).ready(function(){
 		var truncateAuthorized = {$truncateAuthorized|intval};
 		activeClueTip();
-		$("a#upload_file_import_link").fancybox({
-				'titleShow' : false,
-				'transitionIn' : 'elastic',
-				'transitionOut' : 'elastic',
-				'autoDimensions' : false,
-				'autoSize'   : false,
-				'width' : 700,
-				'height' : 300
-		});
-
+		
 		$('#preview_import').submit(function(e){
 			if ($('#truncate').get(0).checked)
 				if (truncateAuthorized)
diff --git a/admin-dev/themes/default/template/controllers/import/helpers/view/view.tpl b/admin-dev/themes/default/template/controllers/import/helpers/view/view.tpl
index 48b0d9b42..abc9e3fa6 100644
--- a/admin-dev/themes/default/template/controllers/import/helpers/view/view.tpl
+++ b/admin-dev/themes/default/template/controllers/import/helpers/view/view.tpl
@@ -63,88 +63,92 @@
 		});
 	</script>
 	<div id="container-customer" class="panel">
-	<h3><i class="icon-list-alt"></i> {l s='View your data'}</h3>
-	<div class="alert alert-info">
-		<p>{l s='Please map each column of your source CSV file to one of the destination columns.'}</p>
-	</div>
-	<div class="form-horizontal">
-		<div class="form-group" {if !$import_matchs}style="display:none"{/if}>
-			<label class="control-label col-lg-3">{l s='Load a mapping configuration'}</label>
-			<div id="selectDivImportMatchs" class="col-lg-7">
-				<select id="valueImportMatchs">
-					{foreach $import_matchs as $match}
-						<option id="{$match.id_import_match}" value="{$match.match}">{$match.name}</option>
-					{/foreach}
-				</select>
+		<h3><i class="icon-list-alt"></i> {l s='View your data'}</h3>
+		<div class="alert alert-info">
+			<p>{l s='Please map each column of your source CSV file to one of the destination columns.'}</p>
+		</div>
+		<div class="form-horizontal">
+			<div class="form-group" {if !$import_matchs}style="display:none"{/if}>
+				<label class="control-label col-lg-3">{l s='Load a mapping configuration'}</label>
+				<div id="selectDivImportMatchs" class="col-lg-7">
+					<select id="valueImportMatchs">
+						{foreach $import_matchs as $match}
+							<option id="{$match.id_import_match}" value="{$match.match}">{$match.name}</option>
+						{/foreach}
+					</select>
+				</div>
+				<div class="col-lg-2">
+					<a id="loadImportMatchs" href="#" class="btn btn-default"><i class="icon-cogs"></i> {l s='Load'}</a>
+					<a id="deleteImportMatchs" href="#" class="btn btn-default"><i class="icon-remove"></i> {l s='Delete'}</a>
+				</div>
 			</div>
-			<div class="col-lg-2">
-				<a id="loadImportMatchs" href="#" class="btn btn-default"><i class="icon-cogs"></i> {l s='Load'}</a>
-				<a id="deleteImportMatchs" href="#" class="btn btn-default"><i class="icon-remove"></i> {l s='Delete'}</a>
+			<div class="form-group">
+				<label class="control-label col-lg-3" for="newImportMatchs">{l s='Save your mapping configuration'}</label>
+				<div class="col-lg-7">
+					<input type="text" name="newImportMatchs" id="newImportMatchs" />		
+				</div>
+				<div class="col-lg-2">
+					<a id="saveImportMatchs" class="btn btn-default" href="#"><i class="icon-save"></i> {l s='Save'}</a>
+				</div>
 			</div>
 		</div>
-		<div class="form-group">
-			<label class="control-label col-lg-3" for="newImportMatchs">{l s='Save your mapping configuration'}</label>
-			<div class="col-lg-7">
-				<input type="text" name="newImportMatchs" id="newImportMatchs" />		
-			</div>
-			<div class="col-lg-2">
-				<a id="saveImportMatchs" class="btn btn-default" href="#"><i class="icon-save"></i> {l s='Save'}</a>
-			</div>
+		<div id="error_duplicate_type" class="alert alert-warning" style="display:none;">
+			{l s='Columns cannot have the same value type'}
 		</div>
-	</div>
-	<div id="error_duplicate_type" class="alert alert-warning" style="display:none;">
-		{l s='Columns cannot have the same value type'}
-	</div>
-	<div id="required_column" class="alert alert-warning" style="display:none;">
-		{l s='Column'} <span id="missing_column">&nbsp;</span> {l s='must be set'}
-	</div>
-	<form action="{$current}&token={$token}" method="post" id="import_form" name="import_form" class="form-horizontal">
-		<input type="hidden" name="csv" value="{$fields_value.csv}" />
-		<input type="hidden" name="convert" value="{$fields_value.convert}" />
-		<input type="hidden" name="regenerate" value="{$fields_value.regenerate}" />
-		<input type="hidden" name="entity" value="{$fields_value.entity}" />
-		<input type="hidden" name="iso_lang" value="{$fields_value.iso_lang}" />
-		{if $fields_value.truncate}
-			<input type="hidden" name="truncate" value="1" />
-		{/if}
-		{if $fields_value.forceIDs}
-			<input type="hidden" name="forceIDs" value="1" />
-		{/if}
-		{if $fields_value.match_ref}
-			<input type="hidden" name="match_ref" value="1" />
-		{/if}
-		<input type="hidden" name="separator" value="{$fields_value.separator}" />
-		<input type="hidden" name="multiple_value_separator" value="{$fields_value.multiple_value_separator}" />
-		<div class="form-group">
-			<label class="control-label col-lg-3" for="skip">{l s='Lines to skip'}</label>
-			<div class="col-lg-7">
-				<input type="text" name="skip" id="skip" value="1" />
-				<p class="help-block">{l s='This number indicates how many of the first lines of your CSV file should be skipped when importing the data. For instance set it to 1 if the first row of your file contains headers.'}</p>
-			</div>
+		<div id="required_column" class="alert alert-warning" style="display:none;">
+			{l s='Column'} <span id="missing_column">&nbsp;</span> {l s='must be set'}
 		</div>
-		<div class="form-group">
-			<div class="col-lg-12">
-				{section name=nb_i start=0 loop=$nb_table step=1}
-					{assign var=i value=$smarty.section.nb_i.index}
-					{$data.$i}
-				{/section}
-				<button id="btn_left" type="button" class="btn btn-default pull-left" onclick="showTable(current - 1);">
-					<i class="icon-chevron-sign-left"></i>
-				</button>
-				<button id="btn_right" type="button" class="btn btn-default pull-right" onclick="showTable(current + 1);">
-					<i class="icon-chevron-sign-right"></i>
-				</button>
+		<form action="{$current}&token={$token}" method="post" id="import_form" name="import_form" class="form-horizontal">
+			<input type="hidden" name="csv" value="{$fields_value.csv}" />
+			<input type="hidden" name="convert" value="{$fields_value.convert}" />
+			<input type="hidden" name="regenerate" value="{$fields_value.regenerate}" />
+			<input type="hidden" name="entity" value="{$fields_value.entity}" />
+			<input type="hidden" name="iso_lang" value="{$fields_value.iso_lang}" />
+			{if $fields_value.truncate}
+				<input type="hidden" name="truncate" value="1" />
+			{/if}
+			{if $fields_value.forceIDs}
+				<input type="hidden" name="forceIDs" value="1" />
+			{/if}
+			{if $fields_value.match_ref}
+				<input type="hidden" name="match_ref" value="1" />
+			{/if}
+			<input type="hidden" name="separator" value="{$fields_value.separator}" />
+			<input type="hidden" name="multiple_value_separator" value="{$fields_value.multiple_value_separator}" />
+			<div class="form-group">
+				<label class="control-label col-lg-3" for="skip">{l s='Lines to skip'}</label>
+				<div class="col-lg-7">
+					<input type="text" name="skip" id="skip" value="1" />
+					<p class="help-block">{l s='This number indicates how many of the first lines of your CSV file should be skipped when importing the data. For instance set it to 1 if the first row of your file contains headers.'}</p>
+				</div>
 			</div>
-		</div>
-		<hr>
-		<div class="form-group">
-			<div class="col-lg-12">
-				<button name="import" type="submit" onclick="return (validateImportation(new Array({$res})));" id="import" class="btn btn-default pull-right">
-					<i class="icon-ok text-success"></i>
-					{l s='Import .CSV data'}
-				</button>
+			<div class="form-group">
+				<div class="col-lg-12">
+					{section name=nb_i start=0 loop=$nb_table step=1}
+						{assign var=i value=$smarty.section.nb_i.index}
+						{$data.$i}
+					{/section}
+					<button id="btn_left" type="button" class="btn btn-default pull-left" onclick="showTable(current - 1);">
+						<i class="icon-chevron-sign-left"></i>
+					</button>
+					<button id="btn_right" type="button" class="btn btn-default pull-right" onclick="showTable(current + 1);">
+						<i class="icon-chevron-sign-right"></i>
+					</button>
+				</div>
 			</div>
-		</div>
-	</form>
+			<hr>
+			<div class="form-group">
+				<div class="col-lg-12">
+					<button type="button" class="btn btn-default">
+						<i class="icon-remove text-danger"></i>
+						{l s='Cancel'}
+					</button>
+					<button id="import" name="import" type="submit" onclick="return (validateImportation(new Array({$res})));"  class="btn btn-default pull-right">
+						<i class="icon-ok text-success"></i>
+						{l s='Import .CSV data'}
+					</button>
+				</div>
+			</div>
+		</form>
 	</div>
 {/block}