fix: move `build directory to resources/shop`

2025-10-04 10:00:24 +02:00
parent 34fc1c33bf
commit 7a189abf0b
93 changed files with 26 additions and 25 deletions
--- a/resources/shop/js/include/app.js
+++ b/resources/shop/js/include/app.js
@@ -0,0 +1,8 @@
+function sleep(ms) {
+  return new Promise(resolve => setTimeout(resolve, ms));
+}
+
+(function($) {
+	numeral.locale('fr');
+
+})(jQuery); // End of use strict
--- a/resources/shop/js/include/appender.js
+++ b/resources/shop/js/include/appender.js
@@ -0,0 +1,69 @@
+(function ($) {
+	$.fn.appender = function (settings) {
+		let appendArea = this;
+		let rowHtml = $(settings.rowSection)[0].outerHTML;
+
+		settings.hideSection ? $(settings.rowSection).remove() : "";
+
+		let rowCounter = 1;
+
+		if (settings.rowNumberStart) {
+			rowCounter = Number(settings.rowNumberStart);
+		}
+
+		$(document).on('click', settings.addBtn, function (event) {
+			$(appendArea).append(rowHtml);
+
+			if (settings.appendEffect === 'fade') {
+				$(settings.rowSection).last().hide().fadeIn();
+			} else if (settings.appendEffect === 'slide') {
+				$(settings.rowSection).last().hide().slideDown(200);
+			}
+
+			$(settings.rowSection).last().addClass(settings.addClass);
+
+			$(settings.rowNumber).last().text(rowCounter);
+
+			type = (settings.type) ? settings.type : settings.rowSection;
+			
+			$(type).each(function(rowIndex) {
+				$(this).find('input[name]').each(function() {
+					var name = $(this).attr('name');
+					name = name.replace(/\[[0-9]?\]/g, '['+rowIndex+']');
+					$(this).attr('name',name);
+				});
+				$(this).find('select[name]').each(function() {
+					var name = $(this).attr('name');
+					name = name.replace(/\[[0-9]?\]/g, '['+rowIndex+']');
+					$(this).attr('name',name);
+				});
+				$(this).find('textarea[name]').each(function() {
+					var name = $(this).attr('name');
+					name = name.replace(/\[[0-9]?\]/g, '['+rowIndex+']');
+					$(this).attr('name',name);
+				});
+				$(this).find('.appender').each(function() {
+					$(this).data('id',rowIndex);
+				});
+			});
+
+			rowCounter++;
+
+			if (settings.callback) {
+				settings.callback();
+			}
+
+		});
+
+
+		if (settings.deleteBtn) {
+			$(document).on('click', settings.deleteBtn, function (e) {
+				$(e.target).closest(settings.rowSection).remove();
+				if (settings.callback) {
+					settings.callback();
+				}
+			})
+		}
+	};
+
+}(jQuery));
--- a/resources/shop/js/include/boilerplate.js
+++ b/resources/shop/js/include/boilerplate.js
@@ -0,0 +1,49 @@
+$('.sidebar-toggle').on('click', function (event) {
+	event.preventDefault();
+	if (Boolean(sessionStorage.getItem('sidebar-toggle-collapsed'))) {
+		sessionStorage.setItem('sidebar-toggle-collapsed', '');
+	} else {
+		sessionStorage.setItem('sidebar-toggle-collapsed', '1');
+	}
+});
+
+$(function () {
+	
+	$(document).tooltip({
+		container: 'body',
+		selector: '[data-toggle="tooltip"]',
+		delay: { "show": 500, "hide": 100 },
+		html: true,
+		trigger: 'hover',
+	})
+
+	setInterval(function () {
+		var timestamp = Math.round(+new Date() / 1000);
+		if (Math.round(+new Date() / 1000) === (session.expire - 10)) {
+			session.expire = timestamp + session.lifetime;
+			$.ajax({
+				url: session.keepalive,
+				type: 'post',
+				data: {id: session.id}
+			})
+		}
+	}, 1000)
+});
+
+$('.logout').click(function (e) {
+	e.preventDefault();
+	if (bootbox.confirm($(this).attr('data-question'), function (e) {
+		if (e === false) {
+			return;
+		}
+		$('#logout-form').submit();
+	})) {
+	}
+});
+
+(function () {
+	if (Boolean(sessionStorage.getItem('sidebar-toggle-collapsed'))) {
+		var body = document.getElementsByTagName('body')[0];
+		body.className = body.className + ' sidebar-collapse';
+	}
+})();
--- a/resources/shop/js/include/confirm.js
+++ b/resources/shop/js/include/confirm.js
@@ -0,0 +1,75 @@
+var confirm_delete_options = {
+	title: "Etes-vous sur ?",
+	text: "Cet enregistrement sera effacé.",
+	type: "warning",
+	showCancelButton: true,
+	confirmButtonClass: "btn-danger",
+	confirmButtonText: "Oui !",
+	cancelButtonText: "Annuler"
+};
+
+function confirm_delete(id, route,callback) {
+	console.log(route);
+	Swal.fire(confirm_delete_options).then(function(result) {
+		if (result.value) {
+			$.ajax({
+				url : route,
+				method : 'DELETE',
+				data: {id:id},
+				success : function(resp){
+					if (resp.success) {
+						console.log(resp);
+						callback();
+						Swal.fire("Supprimé !", "L'enregistrement a été supprimé.", "success");
+					} else {
+						Swal.fire("Erreur!", "L'enregistrement n'a pu être supprimé pour les raisons suivantes : "+resp.message, "danger");
+						if(resp.code == 401){
+							location.reload();
+						}
+					}
+				}
+			});
+		} else if (result.dismiss === Swal.DismissReason.cancel) {
+
+		}
+	})
+}
+
+function confirm(route,options,callback) {
+	var confirm_options = {
+		title: options.title,
+		text: options.text,
+		type: "warning",
+		showCancelButton: true,
+		confirmButtonClass: "btn-danger",
+		confirmButtonText: "Oui !",
+		cancelButtonText: "Annuler",
+		success: options.success ? options.success : "L'enregistrement a été supprimé.",
+		notsuccess: options.notsuccess ? options.notsuccess : "L'enregistrement n'a pu être supprimé pour les raisons suivantes : "
+	};
+
+	console.log(route);
+	Swal.fire(confirm_options).then(function(result) {
+		if (result.value) {
+			$.ajax({
+				url : route,
+				method : 'GET',
+				success : function(resp){
+					if (resp.success) {
+						console.log(resp);
+						callback();
+						Swal.fire("Supprimé !", confirm_options.success, "success");
+					} else {
+						Swal.fire("Erreur!", confirm_options.notsuccess + resp.message, "danger");
+						if(resp.code == 401){
+							location.reload();
+						}
+					}
+				}
+			});
+		} else if (result.dismiss === Swal.DismissReason.cancel) {
+
+		}
+	})
+}
+
--- a/resources/shop/js/include/core/appender.js
+++ b/resources/shop/js/include/core/appender.js
@@ -0,0 +1,75 @@
+(function ($) {
+	$.fn.appender = function (settings) {
+		let appendArea = this;
+		let rowHtml = $(settings.rowSection)[0].outerHTML;
+
+		settings.hideSection ? $(settings.rowSection).remove() : "";
+
+		let rowCounter = 1;
+
+		if (settings.rowNumberStart) {
+			rowCounter = Number(settings.rowNumberStart);
+		}
+
+		$(document).on('click', settings.addBtn, function (event) {
+			
+			$(appendArea).append(rowHtml);
+
+			if (settings.appendEffect === 'fade') {
+				$(settings.rowSection).last().hide().fadeIn();
+			} else if (settings.appendEffect === 'slide') {
+				$(settings.rowSection).last().hide().slideDown(200);
+			}
+
+			$(settings.rowSection).last().addClass(settings.addClass);
+
+			$(settings.rowNumber).last().text(rowCounter);
+
+			if (settings.type) {
+				type = settings.type;
+			} else {
+				type = settings.rowSection;
+			}
+			
+			$(type).each(function(rowIndex) {
+				$(this).find('input[name]').each(function(){
+					var name;
+					name = $(this).attr('name');
+					name = name.replace(/\[[0-9]?\]/g, '['+rowIndex+']');
+					$(this).attr('name',name);
+				});
+				$(this).find('select[name]').each(function(){
+					var name;
+					name = $(this).attr('name');
+					name = name.replace(/\[[0-9]?\]/g, '['+rowIndex+']');
+					$(this).attr('name',name);
+				});
+				$(this).find('textarea[name]').each(function(){
+					var name;
+					name = $(this).attr('name');
+					name = name.replace(/\[[0-9]?\]/g, '['+rowIndex+']');
+					$(this).attr('name',name);
+				});
+			});
+
+			rowCounter++;
+
+			if (settings.callback) {
+				settings.callback();
+			}
+
+		});
+
+
+		if(settings.deleteBtn) {
+			$(document).on('click', settings.deleteBtn, function (e) {
+				$(e.target).closest(settings.rowSection).remove();
+				if (settings.callback) {
+					settings.callback();
+				}
+			})
+
+		}
+	};
+
+}(jQuery));
--- a/resources/shop/js/include/core/cache.js
+++ b/resources/shop/js/include/core/cache.js
@@ -0,0 +1,5 @@
+function loadCache(file, callback) {
+	file += '?v=' + cache_versions[file];
+	loadScript(file, callback);
+}
+
--- a/resources/shop/js/include/core/handlebars.js
+++ b/resources/shop/js/include/core/handlebars.js
@@ -0,0 +1,70 @@
+function renderContractDriveTPL(filename, data, selector) {
+	if (typeof(data) == 'undefined') {
+		var data = {};
+	}
+	data.translate = translate;
+	var path = '/assets/apps/ContractDrive/templates/';
+	var content = getTemplate(path + filename, data);
+	if (typeof(selector) == 'undefined')
+	{
+		return content;
+	} else {
+		$(selector).html(content);
+	}
+}
+
+function getTemplate(file, data) {
+	var source = getSource(file);
+	var template = Handlebars.compile(source);
+    return template(data);
+}
+
+function getSource(file) {
+	var source = null;
+	$.ajax({
+		async: false,
+		dataType: 'html',
+     	type: 'GET',
+     	url: file + '?' + Date.now(),
+     	success: function(data) {
+        	source = data;
+     	}
+	});
+	return source;
+}
+
+function view(template_id, data) {
+	// console.log(template_id);
+	// console.log(data);
+	var source = document.getElementById(template_id).innerHTML;
+	var template = Handlebars.compile(source);
+	return template(data);
+}
+
+function helperSelect(name, items, selected, options) {
+
+	// If the selected value is an array, then convert the
+	// select to a multiple select
+	if (selected instanceof Array) {
+		options.hash.multiple = 'multiple';
+	}
+
+	// Generate the list of options
+	var optionsHtml = '';
+	for (var i = 0, j = items.length; i < j; i++) {
+
+		// <option> attributes
+		var attr = {
+			value: items[i].value
+		};
+
+		// We can specify which options are selected by using either:
+		// * an array of selected values or
+		// * a single selected value
+		if ((selected instanceof Array && indexOf(selected, items[i].value) !== -1) || (selected === items[i].value)) {
+			attr.selected = 'selected';
+		}
+
+		optionsHtml += createElement('option', true, attr, items[i].text);
+	}
+}
--- a/resources/shop/js/include/core/helpers.js
+++ b/resources/shop/js/include/core/helpers.js
@@ -0,0 +1,21 @@
+// Array Helpers
+const countOccurrences = arr => arr.reduce((prev, curr) => (prev[curr] = ++prev[curr] || 1, prev), {});
+const isEmpty = arr => !(Array.isArray(arr) && arr.length > 0 && arr.filter(el => el === undefined).length > 0)
+const isEqual = (a, b) => JSON.stringify(a.sort()) === JSON.stringify(b.sort());
+const countBy = (arr, prop) => arr.reduce((prev, curr) => (prev[curr[prop]] = ++prev[curr[prop]] || 1, prev), {});
+const transpose = matrix => matrix[0].map((col, i) => matrix.map(row => row[i]));
+
+// Dom Helpers
+const insertAfter = (ele, anotherEle) => anotherEle.parentNode.insertBefore(ele, anotherEle.nextSibling);
+const insertBefore = (ele, anotherEle) => anotherEle.parentNode.insertBefore(ele, anotherEle);
+const insertHtmlAfter = (html, ele) => ele.insertAdjacentHTML('afterend', html);
+const insertHtmlBefore = (html, ele) => ele.insertAdjacentHTML('beforebegin', html);
+
+const goTo = url => location.href = url;
+const replace = (ele, newEle) => ele.parentNode.replaceChild(newEle, ele);
+const toNumbers = arr => arr.map(Number);
+const wait = async (milliseconds) => new Promise((resolve) => setTimeout(resolve, milliseconds));
+
+const capitalize = str => `${str.charAt(0).toUpperCase()}${str.slice(1)}`;
+const slugify = string => string.toLowerCase().replace(/\s+/g, '-').replace(/[^\w-]+/g, '');
+const isNumeric = str => !/[^0-9]/.test(str);
--- a/resources/shop/js/include/core/lang.js
+++ b/resources/shop/js/include/core/lang.js
@@ -0,0 +1,12 @@
+function initLangSelector() {
+	$('.language-choice').click(function() {
+		var lang = $(this).data('lang');
+		var url = laroute.route('language', {lang:lang});
+		window.location = url;
+	});
+}
+
+function getLang() {
+	return $('#language-btn').attr('data-current-lang');
+}
+
--- a/resources/shop/js/include/core/objectLength.js
+++ b/resources/shop/js/include/core/objectLength.js
@@ -0,0 +1,5 @@
+function objectLength(list)
+{
+	return ( typeof(list) == 'Array' ) ? list.length : Object.keys(list).length;
+}
+
--- a/resources/shop/js/include/core/session.js
+++ b/resources/shop/js/include/core/session.js
@@ -0,0 +1,6 @@
+function initAjaxCheckSession() {
+	$( document ).ajaxError(function( event, jqxhr, settings, thrownError ) {
+	    alert("Session expired. You'll be take to the login page");
+	    location.href = "/login"; 
+	});
+}
--- a/resources/shop/js/include/core/url.js
+++ b/resources/shop/js/include/core/url.js
@@ -0,0 +1,4 @@
+function openURL(url) {
+	window.location = url; 
+}
+
--- a/resources/shop/js/include/core/user.js
+++ b/resources/shop/js/include/core/user.js
@@ -0,0 +1,29 @@
+function getCurrentUser() {
+	var user = $('#current_user').html();
+	return (typeof(user) != 'undefined') ? user : false;
+}
+
+function isConnected() {
+	return getCurrentUser() ? true : false;
+}
+
+function hasRole(str) {
+	return checkRole('admin') ? true : checkRole(str); 
+}
+
+function checkRole(str) {
+	return (global.roles.indexOf(str) == -1 ) ? false : true;	
+}
+
+function isAdmin() {
+	return hasRole('admin');
+}
+
+function hasPermission(str) {
+	if (isAdmin()) {
+		return true;
+	} else {
+		return (global.permissions.indexOf(str) == -1 ) ? false : true;
+	} 
+}
+
--- a/resources/shop/js/include/datatable.js
+++ b/resources/shop/js/include/datatable.js
@@ -0,0 +1,147 @@
+function getDatatablesSelector(module) {
+	return '#' + module + '-table';
+}
+
+function getDataTables(options,route,module, nobuttons) {
+
+	var params = {
+		ajax: {
+			url: route,
+			data: function ( d ) {
+				d.where = $('#where').val();
+			}
+		},
+		buttons: (!nobuttons) ? getDatatablesButtons() : [],
+		responsive: false,
+		keys: false,
+		autoWidth: true,
+		processing: true,
+		serverSide: true,
+		lengthChange: true,
+		lengthMenu: [
+			[ 10, 25, 50, 100, -1],
+			[ '10 lignes', '25 lignes', '50 lignes', '100 lignes', 'Tous']
+		],
+		deferRender: true,
+		stateSave: false,
+		sDom: options['dom'] ? options['dom'] : getDatatablesDomDefault(),
+		fixedHeader: false,
+		fixedColumns: options['fixedColumns'],
+		colReorder: false,
+		scrollX: true,
+		scrollY: "70vh",
+		scrollCollapse: true,
+		searchDelay: 300,
+		select: false,
+		columns: options['columns'],
+		language: datatables_lang,
+		rowId: 'id',
+	};
+
+		/* // DOM Position key index //
+		
+			l - Length changing (dropdown)
+			f - Filtering input (search)
+			t - The Table! (datatable)
+			i - Information (records)
+			p - Pagination (paging)
+			r - pRocessing 
+			< and > - div elements
+			<"#id" and > - div with an id
+			<"class" and > - div with a class
+			<"#id.class" and > - div with an id and class
+			
+			Also see: http://legacy.datatables.net/usage/features
+		*/  
+
+	if (options['order']) {
+		params.order = options['order'];
+	}
+
+	// console.log(params);
+
+	var Table = $('#'+module+'-table').DataTable(params);
+	
+	handleDataTablesFilter(Table,module);
+
+	// Table.buttons().container().appendTo( $('.col-sm-6:eq(0)'));
+	
+	return Table;
+}
+
+function handleDataTablesFilter(Table) {
+	$(Table.table().container()).on('change keyup', 'thead input', function() {
+		Table.column( $(this).parent().index()+':visible' ).search( this.value ).draw();
+	});
+
+	$(Table.table().container()).on('change', 'thead select', function() {
+		Table.column( $(this).parent().index()+':visible' ).search( this.value ).draw();
+	});
+
+	$('[data-toggle="popover"]').popover({html: true});
+};
+
+function getDatatablesButtons() {
+	return ['pageLength',
+		{
+			extend: 'copyHtml5',
+			exportOptions: {
+				columns: ':visible'
+			},
+			text: '<i class="fa fa-files-o fa-lg"></i>',
+			titleAttr: 'Copier',
+			className: 'hidden-xs',
+		},
+		{
+			extend: 'excelHtml5',
+			exportOptions: {
+				columns: ':visible'
+			},
+			text: '<i class="fa fa-file-excel-o fa-lg"></i>',
+			titleAttr: 'Excel',
+			className: 'hidden-xs',
+		},
+		{
+			extend: 'pdfHtml5',
+			orientation: 'landscape',
+			pageSize: 'A4',
+			exportOptions: {
+				columns: ':visible'
+			},
+			text: '<i class="fa fa-file-pdf-o fa-lg"></i>',
+			titleAttr: 'PDF',
+			className: 'hidden-xs',
+		},
+		{
+			extend: 'print',
+			text: '<i class="fa fa-print fa-lg"></i>',
+			titleAttr: 'Imprimer',
+			className: 'hidden-xs',
+		},
+		{
+			extend: 'colvis',
+			text: '<i class="fa fa-columns fa-lg"></i>',
+			titleAttr: 'Colonnes',
+			columns: ':not(.fixed)'
+		}
+	];
+}
+
+function getDatatablesDomDefault(nobuttons) {
+	dom = (!nobuttons) ? getDatatablesHeaderDefault() : '';
+	dom += "t";
+	dom += getDatatablesFooterDefault();
+	return dom;
+}
+
+function getDatatablesHeaderDefault() {
+	return "<' row dt-toolbar-header'<'col-md-4 tool'B><'col-md-4'<'toolbar'>><'col-md-4 text-right add'>r>";
+}
+
+function getDatatablesFooterDefault() {
+	return "<'row dt-toolbar-footer'<'col-md-6'i><'col-md-6'p>>";
+}
+
+function getDatatableLang() {
+	return "/assets/plugins/datatables_lang/" + getLang() + '.json';
+}
--- a/resources/shop/js/include/fancytree.js
+++ b/resources/shop/js/include/fancytree.js
@@ -0,0 +1,94 @@
+var glyph_opts = {
+  	preset: "bootstrap3",
+  	map: {
+  	}
+};
+
+function initFancyTree(selector) {
+	$(selector).fancytree({
+		extensions: ["dnd5", "edit", "glyph", "wide"],
+		checkbox: true,
+		selectMode: 3,
+		dnd5: {
+			dragStart: function(node, data) {
+				return true;
+			},
+			dragEnter: function(node, data) {
+				return true;
+			},
+			dragDrop: function(node, data) {
+				data.otherNode.copyTo(node, data.hitMode);
+			}
+		},
+		glyph: glyph_opts,
+	  	// source: {url: "ajax-tree-taxonomy.json", debugDelay: 1000},
+	  	source: {
+	  		url: "ajax-tree-products.json",
+	  		debugDelay: 1000
+	  	},
+	  	// toggleEffect: { effect: "drop", options: {direction: "left"}, duration: 400 },
+	  	wide: {
+			iconWidth: "1em",       // Adjust this if @fancy-icon-width != "16px"
+			iconSpacing: "0.5em",   // Adjust this if @fancy-icon-spacing != "3px"
+			labelSpacing: "0.1em",  // Adjust this if padding between icon and label != "3px"
+			levelOfs: "1.5em"       // Adjust this if ul padding != "16px"
+		},
+
+		icon: function(event, data) {
+			// if( data.node.isFolder() ) {
+			//   return "glyphicon glyphicon-book";
+			// }
+		},
+		lazyLoad: function(event, data) {
+			data.result = {
+				url: "ajax-sub2.json",
+				debugDelay: 1000
+			};
+		}
+	});
+}
+
+function initFancyTreeTable(selector) {
+	$(selector).fancytree({
+		extensions: ["dnd5", "edit", "glyph", "table"],
+		checkbox: true,
+		dnd5: {
+			dragStart: function(node, data) {
+				return true;
+			},
+			dragEnter: function(node, data) {
+				return true;
+			},
+			dragDrop: function(node, data) {
+				data.otherNode.copyTo(node, data.hitMode);
+			}
+		},
+		glyph: glyph_opts,
+		source: {
+			url: "ajax-tree-taxonomy.json",
+			debugDelay: 1000
+		},
+		table: {
+			checkboxColumnIdx: 1,
+			nodeColumnIdx: 2
+		},
+		activate: function(event, data) {
+		},
+		lazyLoad: function(event, data) {
+			data.result = {
+				url: "ajax-sub2.json",
+				debugDelay: 1000
+			};
+		},
+		renderColumns: function(event, data) {
+			var node = data.node,
+			$tdList = $(node.tr).find(">td");
+			$tdList.eq(0).text(node.getIndexHier());
+			$tdList.eq(3).text(!!node.folder);
+		}
+	});	
+}
+
+$(function() {
+
+});
--- a/resources/shop/js/include/file.js
+++ b/resources/shop/js/include/file.js
@@ -0,0 +1,409 @@
+var fileManager = {
+	selected: [], // stocke les fichiers déjà enregistrés
+	currentSelected: [], // stocke les fichiers en cours
+	toRemove: [],
+	callback: null, // indique la fonction à exécuter pour le renvoi des fichiers sélectionnées à la validation de la sélection
+	subFolder: '0', // indique le sous-répertoire dans lequel les fichiers seront uploadés
+	forSubcontract: false, // indique si on upload des fichiers pour les contrats ou sous-contrats
+	js_confirm: null, // la jquery confirm
+	parent: null,
+
+	init: function(title, chosen, category, callback, forSubcontract, parent, novation) {
+		this.selected = ( typeof(chosen) != 'undefined' ) ? chosen : [];
+		this.currentSelected = [];
+		this.callback = ( typeof(callback) != 'undefined' ) ? callback : null;
+		this.forSubcontract = ( typeof(forSubcontract) != 'undefined' ) ? forSubcontract : null;
+		this.category = category; // stocke le sous-répertoire d'upload
+		this.subFolder = category; // stocke le sous-répertoire d'upload
+		this.parent = parent;
+		this.novation = ( typeof(novation) != 'undefined' ) ? true : false;
+		this.js_confirm = this.renderModal(title);
+	},
+	initAddFile: function() {
+		var that = this;
+		$('#add_files').off('click').on('click', function() {
+			var index = objectLength(that.currentSelected);
+			console.log('add_files');
+			console.log(index);
+			if (index > 1) {
+				var isValid = that.checkValidity(index - 1);
+			} else {
+				var isValid = true;
+			}
+
+			if (isValid) {
+				var infos = {
+					pdfFile: {},
+					docFile: {},
+					title: '',
+					effective_date: '',
+				};
+				that.newFile(infos);
+				that.updateImportedFilesMessage(objectLength(that.currentSelected));
+			}
+		});
+	},
+	checkValidity: function(index) {
+		// console.log('checkValidity');
+		// console.log(index);
+
+		var selector = '#uploader_files_' + index + ' form';
+		// console.log(selector);
+		var form = $(selector);
+		// console.log(form);
+		var fields = selector + ' input,' + selector + ' textarea,' + selector + ' select';
+		// console.log(selector);
+		var validity = true;
+
+		var pdfFile = this.currentSelected[index].pdfFile;
+		// console.log(typeof(pdfFile));
+
+		if (typeof(pdfFile.name) == 'undefined') {
+			console.log("Pas de fichier");
+			$(selector + '[name="import_pdf_form"] .contract-file-upload').addClass('error');
+			validity = false;
+		} else {
+			$(selector + '[name="import_pdf_form"] .contract-file-upload').removeClass('error');
+		}
+
+		$(fields).filter('[required]').each(function(i, required){
+			// console.log(required);
+			if ($(required).val() == '') {
+				if ($(required).hasClass('chosen-select')) {
+					$(required).siblings('.chosen-container').addClass('form-control error pt-0');
+				} else {
+					$(required).addClass('error');
+				}
+				// console.log('validity false');
+				// console.log(required);
+				validity = false;
+			} else {
+				if ($(required).hasClass('chosen-select')) {
+					$(required).siblings('.chosen-container').removeClass('form-control error pt-0');
+				} else {
+					$(required).removeClass('error');	
+				}
+			}
+		});
+		return validity;
+
+	},
+	initDeleteRow: function(selector) {
+		var that = this;
+		$(selector + ' button.contract-del-btn').off('click').on('click', function() {
+			var index = $(this).data('index');
+			// TODO effacer currenselect[index] et mettre dans elements à deleter
+			that.removeRow(index);
+			that.updateImportedFilesMessage(objectLength(currentSelected));
+		});
+	},
+	initDeleteFile: function(selector, selector2) {
+		// console.log(this, selector, selector2);
+		var that = this;
+		$(selector2 + ' .imported_files ul.jFiler-items-list li a.file-del-btn').off('click').on('click', function() {
+			that.removeFile(this, selector, selector2);
+		});
+	},
+	renderModal: function(title) {
+		var that = this;
+		var confirm = $.confirm({
+			title: title,
+			columnClass: 'col-md-9',
+			content: function() {
+				var content = '\
+					<div class="row">\
+						<div class="col-12" id="files_selection"></div>\
+						<div class="col-12 text-center text-white mb-2" id="no_imported_files">'+translate.getText.no_imported_files+'</div>\
+						<div class="col-12 text-center mb-0"><button class="btn btn-xs btn-success uppercase weight-700" id="add_files"><i class="glyph-icon icon-plus"></i> '+translate.getText.new_file+'</button></div>\
+					</div>\
+				';
+				return content;
+			},
+			onContentReady: function() {
+				if ( objectLength(that.selected) > 0 ) {
+					$.each(that.selected, function(i, elem) {
+						that.newFile(that.selected[i]);
+					});
+				}
+				that.initAddFile();
+				that.updateImportedFilesMessage(objectLength(that.currentSelected));
+
+			},
+			type: 'orange',
+			theme: 'theme2',
+			typeAnimated: true,
+			buttons: {
+				validate: {
+					text: '<i class="glyph-icon icon-elusive-ok"></i>' + translate.getText.validate,
+					btnClass: 'btn-green',
+					action: function() {
+						var isValid = true;
+						$.each(that.currentSelected, function(i, elem) {
+							var selector = '#uploader_files_' + i;
+							isValid = isValid && that.checkValidity(i);
+							// vérifie qu'il y ait bien un fichier PDF d'uploadé
+							/*
+							$(selector + ' .contract-file-upload').removeClass('error');
+							if ( typeof(that.currentSelected[i].pdfFile.name) === 'undefined' ) {
+								$(selector + ' .contract-file-upload').addClass('error');
+							}
+							*/
+						});
+
+						if (!isValid) {
+							return false;
+						} else {
+							// retourne les fichiers sélectionnés en appelant la fonction de retour des paramètres
+							that.returnSelection();
+						}
+					}
+				},
+				close: {
+					text: '<i class="glyph-icon icon-elusive-cancel"></i>'+translate.getText.cancel,
+					btnClass: 'btn-red',
+					action: function() { }
+				}
+			}
+		});
+		return confirm;
+	},
+	renderUploader: function(index, file, selector, uploadRoute, extensions, chooseText) {
+		console.log("renderUploader");
+		console.log(selector);
+		var that = this;
+		console.log(that);
+		renderUploaderFiler(index, file, selector, uploadRoute, extensions, chooseText, that);
+	},
+	newFile: function(file) {
+		console.log('newFile');
+		console.log(file);
+		// empile les contrats sélectionnés
+		this.currentSelected.push(file);
+		// charge le contrat sélectionné
+		this.newUploader(file);
+		initChosen();
+		initValidator();
+	},
+	newUploader: function(file) {
+		console.log('new uploader');
+		console.log(file);
+		var that = this;
+		console.log(that.novation);
+		// var index = getIndexOf(this.currentSelected, file.id);
+		var count = objectLength(this.currentSelected);
+		var index = count - 1;
+		var path = '/assets/apps/ContractDrive/templates/';
+		if (that.novation) {
+			var third_parties = null;
+			 $.ajax({
+				async: false,
+				method: "POST",
+				dataType: "json",
+				url: laroute.route("Stack.API.ThirdParty.getThirdParties"),
+				data: { third_party_type: 'counterpart' }
+			}).done(function(response) {
+				third_parties = response.listing;
+			});
+		} else {
+			var third_parties = null;
+		}
+		// console.log(third_parties);
+		var extra = ((that.category == 3) && (count == 1)) ? false : true;
+		var data = {
+			index: index,
+			count: count,
+			id: (typeof(file.id) !== 'undefined') ? file.id : null,
+			translate: translate,
+			novation: that.novation,
+			extra: extra,
+			category: that.category,
+			third_parties: third_parties
+		};
+		var content = getTemplate(path + 'files-uploader.html', data);
+
+		$('#files_selection').append(content);
+		var selector = '#uploader_files_' + index;
+		
+		this.initDeleteRow(selector);
+
+		// initialise les file uploader
+		this.parent.initFilesUploader(file, index);
+		this.renderFiles(file, selector);
+
+		// désaffiche le titre et la date de signature pour le 1er fichier de catégorie "contrat" à upload
+		if ( that.subFolder == '3' && index == 0 && !(that.forSubcontract) ) {
+			$(selector + ' form[name="import_file_infos_form"]').hide();
+		}
+
+		var picker = getDaterangePicker(selector + ' form[name="import_file_infos_form"] input[name="import_file_infos_date"]');
+		
+		$(selector + ' form[name="import_file_infos_form"] input[name="import_file_infos_date"]').next('span.add-on').off('click').on('click', function() {
+			$(selector + ' form[name="import_file_infos_form"] input[name="import_file_infos_date"]').trigger('click');
+		});
+		
+		// sur changement de date
+		/*
+		$(selector + ' form[name="import_file_infos_form"] input[name="import_file_infos_date"]').on('apply.daterangepicker', function(ev, picker) {
+			$(selector + ' form[name="import_file_infos_form"] input[name="import_file_infos_effective_date"]').val(picker.startDate.format(dateRangePickerLanguage.format));
+		});
+		*/		
+	},
+	createFile: function(item, index, file) {
+		//console.log(that.currentSelected);
+		if (file.extension == 'pdf') {
+			this.currentSelected[index].pdfFile = file;
+			this.currentSelected[index].pdfFile.isNew = true;
+		} else {
+			this.currentSelected[index].docFile = file;
+			this.currentSelected[index].docFile.isNew = true;
+		}
+		// enregistre le fichier dans les fichiers uploadés en cours
+		$(item).find('.jFiler-item-others').html('\
+						<span><i class="glyph-icon icon-file"></i> <b>'+translate.getText.type+':</b> '+strtoupper(file.extension)+'</span>\
+						<div class="current-status text-success"><i class="icon-jfi-check-circle"></i></div>\
+			');
+		$(item).find('.jFiler-item-icon i').removeClass('icon-jfi-file-o').removeClass('jfi-file-ext-docx').addClass('icon-file-uploaded '+strtolower(file.extension));
+		this.addFileInfo(index);
+	},
+	addFileInfo: function(index) {
+		console.log('addFileInfo');
+		console.log(index);
+		if (typeof(index) != 'undefined') {
+			var selector = '#uploader_files_' + index;
+			this.currentSelected[index].title = $(selector + ' form[name="import_file_infos_form"] input[name="import_file_infos_title"]').val();
+			var effective_date = $(selector + ' form[name="import_file_infos_form"] input[name="import_file_infos_date"]').val();
+			console.log('effective_date');
+			console.log(effective_date);
+			this.currentSelected[index].effective_date = effective_date;
+			var third_party_id = $(selector + ' form[name="import_file_infos_form"] select[name="third_party_out"]').val();
+			if (typeof(third_party_id) != 'undefined') {
+				this.currentSelected[index].novation = {};
+				this.currentSelected[index].novation.third_party_id = third_party_id;
+				this.currentSelected[index].novation.name = $(selector + ' form[name="import_file_infos_form"] select[name="third_party_out"] option:selected').text();
+			}
+			console.log(this.currentSelected[index]);
+		}
+	},
+	removeRow: function(index) {
+		console.log('remove row');
+		console.log(index);
+		$('#uploader_files_' + index).remove();
+		this.toRemove.push(this.currentSelected[index]);
+		this.currentSelected.splice(index, 1);
+		console.log(this.currentSelected);
+		console.log(this.toRemove);
+		this.reIndex();
+	},
+	removeFile: function(item, selector, selector2) {
+		var id = $(item).data('id');
+		console.log(id);
+		console.log(item);
+		console.log(selector);
+		console.log(selector2);
+		// $(item).parent().parent().parent().parent().parent().parent().parent().remove();
+		// file.docFile = {};
+		//console.log(filesEdit.currentSelected);
+		$(selector + ' .contract-file-upload').show();
+		$(selector2).hide();
+	},
+	reIndex: function() {
+		console.log("reindex");
+		// refixe les numéros des tableaux
+		var that = this;
+		$.each(that.currentSelected, function(i, elem) {
+			// var sel = '#uploader_files_' + i;
+			var sel = '.files-list:eq( '+i+' )'; 
+			console.log(sel);
+			$(sel + ' .file-count').html(parseInt(i+1));
+			$(sel).attr('id', '#uploader_files_' + i);
+			// désaffiche la titre et la date de signature pour le 1er fichier de catégorie "contrat" à upload		
+			if ( that.subFolder == '3' && i == 0 && that.forSubcontract == false ) {
+				$(sel + ' form[name="import_file_infos_form"]').hide();
+			}
+		});
+	},
+	renderFiles: function(file, selector) {
+		console.log('renderFiles');
+		console.log(file, selector);
+		var that = this;
+		// restaure le fichier PDF
+		if ( typeof(file.pdfFile) !== 'undefined' ) {
+			this.renderFile(file.pdfFile, 'pdf', selector + ' form[name="import_pdf_form"]', selector + ' form[name="already_imported_pdf_form"]');
+		}
+
+		// restaure le fichier DOC/DOCX
+		if (typeof(file.docFile) !== 'undefined') {
+			this.renderFile(file.docFile, 'doc', selector + ' form[name="import_doc_form"]', selector + ' form[name="already_imported_doc_form"]');
+		}
+
+		// restaure la date
+		if (( typeof(file.effective_date) !== 'undefined' ) && (file.effective_date != '')) {
+			$(selector + ' form[name="import_file_infos_form"] input[name="import_file_infos_date"]').val(file.effective_date);
+			// var date_range_start = moment(file.effectiveDate, dateRangePickerLanguage.format).format(translate.getText.date_format_moment);
+			// var date_range_start = file.effective_date;
+			// $(selector + ' form[name="import_file_infos_form"] input[name="import_file_infos_date"]').data('daterangepicker').setStartDate(date_range_start);
+		}
+		
+		// restaure le titre
+		if ( typeof(file.title) !== 'undefined' ) {
+			$(selector + ' form[name="import_file_infos_form"] input[name="import_file_infos_title"]').val(file.title);
+		}
+		
+		if ( (typeof(file.novation) !== 'undefined') && (file.novation != null) ) {
+			console.log(file.novation.third_party_id);
+			$(selector + ' form[name="import_file_infos_form"] select[name="third_party_out"]').val(file.novation.third_party_id).trigger("chosen:updated");
+		}
+
+		$(selector + ' form[name="import_file_infos_form"] input').change(function() {
+			index = $(this).data('index');
+			that.addFileInfo(index);
+		});
+
+		$(selector + ' form[name="import_file_infos_form"] select').change(function() {
+			index = $(this).data('index');
+			that.addFileInfo(index);
+		});
+
+	},
+	renderFile: function(file, type, selector, selector2) {
+		// console.log('renderFile');
+		// console.log(file, selector, selector2);
+		var that = this;
+		var path = '/assets/apps/ContractDrive/templates/';
+		if (typeof(file.name) !== 'undefined') {
+			console.log('deja uploadé');
+			$(selector + ' .contract-file-upload').hide();
+			var data = {'file' : file, 'translate' : translate};
+			var content = getTemplate(path + 'files-row.html', data);
+			$(selector2 + ' .imported_files ul.jFiler-items-list').append(content);
+			$(selector2).show();
+		}
+
+		this.initDeleteFile(selector, selector2);
+	},
+	activeJConfirmButtons: function(inOut) {
+		if ( inOut ) {
+			this.js_confirm.buttons.close.enable();
+			this.js_confirm.buttons.validate.enable();
+		} else {
+			this.js_confirm.buttons.close.disable();
+			this.js_confirm.buttons.validate.disable();
+		}
+	},
+	updateImportedFilesMessage: function(tot) {
+		if ( tot > 0 ) {
+			$('#no_imported_files').hide();
+		} else {
+			$('#no_imported_files').show();
+		}
+	},
+	returnSelection: function() {
+		this.parent.selected = this.currentSelected;
+		this.parent.toRemove = this.toRemove;
+		if ( this.callback != null ) {
+			console.log(this.callback);
+			eval(this.callback);
+		}
+	}
+
+}
--- a/resources/shop/js/include/form/check_fields.js
+++ b/resources/shop/js/include/form/check_fields.js
@@ -0,0 +1,39 @@
+function checkCollapsedFields(selector)
+{
+	var fields = selector + ' input,' + selector + ' textarea,' + selector + ' select';
+    console.log(fields);
+
+	var nb_fields = $(fields).length;
+    console.log(nb_fields);
+	var nb_required = $(fields).filter('[required]').length;
+	console.log(nb_required);
+    var nb_filled = 0;
+	var nb_necessary = 0; 
+	
+    $(fields).each(function(i, field){
+        if ($(field).val() != '')
+        {
+            nb_filled++;
+        }
+    });
+	
+    $(fields).filter('[required]').each(function(i, required){
+        if ($(required).val() != '')
+        {
+            nb_necessary++;
+        }
+    });
+
+    var result = nb_filled + " / " + nb_fields;
+    result = result + " | " + nb_necessary + " / " + nb_required;
+
+    console.log(result);
+
+    var check = $(selector).parent().find('.check');
+    console.log(check);
+
+    // $(selector).parent().find('.check').html(result);
+    if (nb_necessary < nb_required) {
+        $(selector).collapse('show');
+    }
+}
--- a/resources/shop/js/include/form/checkbox.js
+++ b/resources/shop/js/include/form/checkbox.js
@@ -0,0 +1,42 @@
+function initIcheck(selector)
+{
+    var selector = (typeof(selector) != 'undefined') ? selector : '.iCheck'; 
+    console.log('initIcheck');
+    $(selector).each(function(){
+    // var each element .iCheck
+        var $this = $(this),
+        skin = $this.attr('data-skin'),
+        color = $this.attr('data-color'),
+        checkbox, radio, insert = '';
+
+        if (skin === undefined) {
+            checkbox = 'icheckbox_minimal';
+            radio = 'iradio_minimal';
+        } else {
+            checkbox = 'icheckbox_' + skin;
+            radio = 'iradio_' + skin;
+        }
+
+        if (color !== undefined) {
+            checkbox = checkbox + '-' + color;
+            radio = radio + '-' + color;
+        }
+
+        // handle iCheck skin 'line'
+        if (skin == 'line') {
+            var label = $this.next(),
+            label_text = label.text();
+
+            insert = '<div class="icheck_line-icon"></div>' + label_text;
+            label.remove();
+        }
+
+        // initialize
+        $this.iCheck({
+            checkboxClass: checkbox,
+            radioClass: radio,
+            insert: insert,
+            increaseArea: '30%' // optional
+        });
+    });
+}
--- a/resources/shop/js/include/form/datetime.js
+++ b/resources/shop/js/include/form/datetime.js
@@ -0,0 +1,130 @@
+function initDatepicker() {
+	var lang = getLang(); 
+	loadScript('assets/plugins/datepicker/bootstrap-datepicker.' + lang + '.min.js', function() {
+		$(".datepicker").datepicker({
+			language: lang
+		});
+	});
+}
+
+function initDaterangePicker() {
+	var lang = getLang();
+	loadScript('assets/plugins/daterangepicker/' + lang + '.js');
+}
+
+function initMomentLang() {
+	var lang = getLang();
+	loadScript('assets/plugins/moment/' + lang + '.js');
+}
+
+function getFormatDate() {
+	var lang = getLang();
+	switch (lang) {
+		case 'en':
+			return 'YYYY-MM-DD';
+			break;
+		case 'fr':
+			return 'DD/MM/YYYY';
+			break;
+		default:
+			return 'YYYY-MM-DD';
+			break;
+	}
+}
+
+function getFormatDatetime() {
+	var lang = getLang();
+	switch (lang) {
+		case 'en':
+			return 'YYYY-MM-DD HH:mm:ss';
+			break;
+		case 'fr':
+			return 'DD/MM/YYYY HH:mm:ss';
+			break;
+		default:
+			return 'YYYY-MM-DD HH:mm:ss';
+			break;
+	}	
+}
+
+function convertToDateRange(str)
+{
+	return str.replace('-','/');
+}
+
+function getDaterangePicker(selector, startDate, parentEl, endDate) {
+	// console.log('getDaterangePicker');
+	// console.log("StartDate : ", startDate);
+	if (typeof(parentEL) == 'undefined') {
+		parentEl = 'file_effect_date_selection';
+	} else {
+		$(selector).parent().parent().parent().parent().parent().parent().parent().parent().parent().addClass(parentEl);
+	}
+	if (typeof(startDate) == 'undefined') {
+		// startDate = moment().format(dateRangePickerLanguage.format);
+		startDate = moment();
+	} else {
+		// console.log("ici");
+		startDate = moment(startDate, getFormatDate());
+	}
+	// console.log("selector : ", selector);
+	// console.log("StartDate : ", startDate);
+	// console.log("format", dateRangePickerLanguage.format);
+	var options = {
+		alwaysShowCalendars: true,
+		autoUpdateInput: false,
+		format: dateRangePickerLanguage.format,
+		opens: 'left',
+		showDropdowns: true,
+		showWeekNumbers: true,
+		startDate: startDate,
+		separator: dateRangePickerLanguage.separator,
+		locale: dateRangePickerLanguage.locale,
+		buttonClasses: 'btn light uppercase weight-900',
+		parentEl: '.' +parentEl
+	};
+
+	if (typeof(endDate) != 'undefined') {
+		options.cancelClass = "btn-danger";
+		options.endDate = endDate;
+		options.ranges = dateRangePickerLanguage.ranges;
+		options.template =
+            '<div class="daterangepicker">' +
+                '<div class="ranges"></div>' +
+                '<div class="drp-calendar left">' +
+                    '<div class="calendar-table"></div>' +
+                    '<div class="calendar-time"></div>' +
+                '</div>' +
+                '<div class="drp-calendar right">' +
+                    '<div class="calendar-table"></div>' +
+                    '<div class="calendar-time"></div>' +
+                '</div>' +
+                '<div class="drp-buttons">' +
+                    '<span class="drp-selected"></span>' +
+                    '<button class="cancelBtn" type="button"></button>' +
+                    '<button class="applyBtn" disabled="disabled" type="button"></button> ' +
+                '</div>' +
+            '</div>';
+	} else {
+		options.autoApply = true;
+		options.singleDatePicker = true;
+	};
+
+	$('#files_selection').parent().parent().parent().parent().parent().parent().parent().parent().parent().removeClass(parentEl).addClass(parentEl);
+	var picker = $(selector).daterangepicker(options, function(start, end, label) {
+		//console.log("New date range selected: ' + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD') + ' (predefined range: ' + label + ')");
+	});
+	
+	$(selector + ' .daterangepicker').removeClass('light').addClass('light');
+
+	$(selector).next('span.add-on').off('click').on('click', function() {
+		$(selector).trigger('click');
+	});
+
+	$(selector).on('apply.daterangepicker', function(ev, picker) {
+		$(this).val(picker.startDate.format(dateRangePickerLanguage.format));
+		$(selector).trigger('change');
+	});
+
+	return picker;
+}
--- a/resources/shop/js/include/form/multi-select.js
+++ b/resources/shop/js/include/form/multi-select.js
@@ -0,0 +1,154 @@
+function initMultiselect(model, item, route, availables, associated, event)
+{
+    console.log('initMultiselect');
+    console.log(route);
+    var toggle_button = "#toggle_button_" + model;
+    var assoc_form = model + "_assoc_form";
+    var assoc_submit = '#' + model + '_assoc_submit';
+    var assoc_selection = '#' + model + '_search_selection';
+    var assoc_selectable = '#' + model + '_search_selectable';
+    var list = '#' + model + '_list';
+
+    $(assoc_submit).off('click').on('click', function(event) {
+        event.preventDefault();
+        $('form[name="' + assoc_form + '"]').submit();
+    });
+
+    $(toggle_button).off('click').on('click', function(event) {
+        if (!$(assoc_submit).is(':hover')) {
+            event.preventDefault();
+            $(toggle_button + " .header-wrapper .glyph-icon:first-child").toggleClass("icon-caret-right icon-caret-down");
+            $(assoc_submit).toggleClass('hidden');
+            $(this).parents(".content-box:first").find(".content-box-wrapper").slideToggle(100, function() {
+                admin_content.orderSelect($(list));
+                renderMultiselect(list, model, item, availables, associated);
+                modobox.resize();
+            });
+        }
+    });
+
+    $('form[name="'+assoc_form+'"]').off('submit').on('submit', function() {
+        var error = 0;
+        var datas = $(this).serializeJSON();
+
+        if (error == 0) {
+            datas["language"] = getLang();
+            $.ajax({
+                type: "POST",
+                dataType: "json",
+                url: laroute.route(route),
+                data: datas,
+                success: function(response) {
+                    if (response.error == -1) {
+                        header.logout();
+                    } else if (response.error == -6) {
+                        admin_content.alertNotFound();
+                    } else {
+                        admin_content.showSuccessMsg('.information_messages_manage', 'informations_has_been_saved');
+                        if (response.nb > 0) {
+                            $(toggle_button + " .bs-badge").removeClass("opacity-3");
+                        } else {
+                            $(toggle_button + " .bs-badge").addClass("opacity-3");
+                        }
+                        $(toggle_button + " .bs-badge").html(response.nb);
+                        setTimeout(function(){
+                            $(toggle_button).click();
+                        }, 1000);
+                    }
+                },
+                error: function() {
+                    admin_content.showCustomErrorMsg('.information_messages_manage', translate.getText.an_error_occured);
+                }
+            });
+        } else {
+            admin_content.showCustomErrorMsg('.information_messages_manage', translate.getText.an_error_occured);
+        }
+    });
+
+    $(assoc_submit).off('click').on('click', function(event) {
+        event.preventDefault();
+        $('form[name="'+assoc_form+'"]').submit();
+    });
+
+    $(".ms-container").append('<i class="glyph-icon center-icon icon-exchange text-white"></i>');
+}
+
+function renderMultiselect(selector, model, item, availables, associated, parent)
+{
+    console.log('renderMultiselect');
+    var assoc_submit = "#" + model + "_assoc_submit";
+    var assoc_form = model + "_assoc_form";
+    var assoc_toggle = "#toggle_button_" + model;
+    var assoc_list = "#" + model + "_list"; 
+    var assoc_selectable = '#' + model + '_search_selectable';
+    var assoc_selection = '#' + model + '_search_selection';
+    var assoc_selected = '#ms-' + model + '_list';
+    var select_all = 'select-all-' + item;
+    var deselect_all = 'deselect-all-' + item;
+
+    var selectableHeader = (typeof(availables) != 'undefined') ? "<div class='col-md-12 text-center'><label class='light'>"+availables+"</label></div>" : '';
+    var selectionHeader = (typeof(associated) != 'undefined') ? "<div class='col-md-12 text-center'><label class='green'>"+associated+"</label></div>" : '';
+
+    $(selector).multiSelect({
+        selectableHeader: selectableHeader + "<input type='text' id='"+assoc_selectable+"' class='mb-2 form-control quicksearch selectable-search styled' autocomplete='off' placeholder='"+translate.getText.search+"...'>",
+        selectionHeader: selectionHeader + "<input type='text' id='"+assoc_selection+"' class='mb-2 form-control quicksearch selectable-search styled' autocomplete='off' placeholder='"+translate.getText.search+"...'>",
+        selectableFooter: "<button id='"+select_all+"' class='btn btn-alt btn-success btn-block mt-2 noradius pr-3'><span>"+translate.getText.select_all+"</span><i class='glyph-icon icon-arrow-right pull-right'></i></button>",
+        selectionFooter: "<button id='"+deselect_all+"' class='btn btn-alt btn-danger btn-block mt-2 noradius pl-3'><i class='glyph-icon icon-arrow-left pull-left'></i><span>"+translate.getText.deselect_all+"</span></button>",
+        afterInit: function(ms) {
+            var that = this,
+            $selectableSearch = that.$selectableUl.prev(),
+            $selectionSearch = that.$selectionUl.prev(),
+            selectableSearchString = '#'+that.$container.attr('id')+' .ms-elem-selectable:not(.ms-selected)',
+            selectionSearchString = '#'+that.$container.attr('id')+' .ms-elem-selection.ms-selected';
+
+            that.qs1 = $selectableSearch.quicksearch(selectableSearchString).on('keydown', function(e){
+                if (e.which === 40) {
+                    that.$selectableUl.focus();
+                    return false;
+                }
+            });
+
+            that.qs2 = $selectionSearch.quicksearch(selectionSearchString).on('keydown', function(e){
+                if (e.which == 40) {
+                    that.$selectionUl.focus();
+                    return false;
+                }
+            });
+
+            $(select_all).off('click').on('click', function() {
+                console.log('select_all');
+                console.log('#ms-' + model + '_list');
+                if ($(assoc_selectable).val() == "") {
+                    $(list).multiSelect('select_all');
+                } else {
+                    $('#ms-' + model + '_list .ms-elem-selectable').each(function() {
+                        if(!$(this).is(':hidden')) { $(this).click(); }
+                    });
+                }
+                return false;
+            });
+
+            $(deselect_all).off('click').on('click', function() {
+                if ($(assoc_selection).val() == "") {
+                    $(list).multiSelect('deselect_all');
+                } else {
+                    $('#ms-' + model + '_list .ms-elem-selection').each(function() {
+                        if(!$(this).is(':hidden')) { $(this).click(); }
+                    });
+                }
+                return false;
+            });
+
+        },
+        afterSelect: function(){
+            this.qs1.cache();
+            this.qs2.cache();
+        },
+        afterDeselect: function(){
+            this.qs1.cache();
+            this.qs2.cache();
+        }
+    });
+
+
+}
--- a/resources/shop/js/include/form/radio.js
+++ b/resources/shop/js/include/form/radio.js
@@ -0,0 +1,5 @@
+function initRadio()
+{
+	$('input[type="radio"].custom-radio').uniform();
+	$('.radio span').append('<i class="glyph-icon icon-circle"></i>');
+}
--- a/resources/shop/js/include/form/select.js
+++ b/resources/shop/js/include/form/select.js
@@ -0,0 +1,24 @@
+function initSelect2()
+{
+	$(".select2").select2({
+		placeholder: "Select a value",
+		allowClear: true
+	});
+}
+
+
+function initChosen()
+{
+    $(".chosen-select").chosen({ no_results_text: translate.getText.no_result });
+    $(".chosen-search").append('<i class="glyph-icon icon-search"></i>');
+    $(".chosen-single div").html('<i class="glyph-icon icon-caret-down"></i>');
+	$(".chosen-container-single").addClass('styled');
+}
+
+function resetChosen()
+{
+	$('.chosen-select').each(function() {
+		$(this).val("").trigger("chosen:updated");
+	});
+}
+
--- a/resources/shop/js/include/form/set_options.js
+++ b/resources/shop/js/include/form/set_options.js
@@ -0,0 +1,18 @@
+function setOptions(selector,data,selected,all) {
+	// console.log(data);
+	var $el = $(selector);
+	$el.empty(); // remove old options
+	if (all) {
+		$el.append($("<option></option>").attr("value",'').text('Tous'));
+	}
+	$.each(data, function(key, name) {
+		console.log(name);
+		if (key != null) {
+			if (key == selected) {
+				$el.append($("<option selected='selected'></option>").attr("value", key).text(name));
+			} else {
+				$el.append($("<option></option>").attr("value", key).text(name));
+			}
+		}
+	});	
+}
--- a/resources/shop/js/include/form/upload.js
+++ b/resources/shop/js/include/form/upload.js
@@ -0,0 +1,21 @@
+function initFileInputImage(images, uploadRoute)
+{
+	$(".file").fileinput({
+		uploadUrl: "/file-upload-batch/2",
+		allowedFileExtensions: ['jpg', 'png', 'gif'],
+		overwriteInitial: true,
+		showRemove: true,
+		frameClass: '',
+		initialPreviewAsData: false,
+		maxFileSize: 10000,
+		removeFromPreviewOnError: true,
+		initialPreview: images,
+		layoutTemplates: {
+			footer: ''
+		},
+		previewTemplates: {
+			image: '<img src="{data}" class="kv-preview-data file-preview-image img-fluid" title="{caption}" alt="{caption}" {style}>\n',
+		}
+	});
+
+}
--- a/resources/shop/js/include/form/validator.js
+++ b/resources/shop/js/include/form/validator.js
@@ -0,0 +1,74 @@
+function initValidator() {
+	$( document ).ready(function() {
+		console.log('initValidator');
+		// $(window).on('load', function() {
+		// window.addEventListener('load', function() {
+
+			// console.log('initValidator load');
+			var forms = $('.needs-validation');
+
+			$(forms).each(function(i, form) {
+				form.addEventListener('submit', function(event) {
+					checkValidatorFields(form);
+				}, false);
+			});
+
+		// }, false);
+	});
+}
+
+function checkValidatorFields(form) {
+	console.log('checkValidatorFields');
+	if (form.checkValidity() === false) {
+		console.log('non validé');
+		event.preventDefault();
+		event.stopPropagation();
+	} else {
+		console.log("validé");
+		form.classList.add('valid');
+	}
+	form.classList.add('was-validated');
+			
+	form.addEventListener('invalid', function(e) {
+		console.log(e);
+	}, true);
+
+}
+
+function initValidatorHtml() {
+	window.addEventListener('load', function() {
+		// Fetch all the forms we want to apply custom Bootstrap validation styles to
+		var forms = document.getElementsByClassName('needs-validation');
+		// Loop over them and prevent submission
+		var validation = Array.prototype.filter.call(forms, function(form) {
+		  	form.addEventListener('submit', function(event) {
+				if (form.checkValidity() === false) {
+					event.preventDefault();
+					event.stopPropagation();
+				}
+				form.classList.add('was-validated');
+		  	}, false);
+		});
+	}, false);	
+}
+
+function initValidator2() {
+	$('.needs-validation').bootstrapValidator().on('submit', function(e) {
+		if (e.isDefaultPrevented()) {
+			console.log('bad');
+		} else {
+			console.log('good');
+		}
+
+		e.preventDefault();
+		e.stopPropagation();
+		// Active the panel element containing the first invalid element
+		var $form         = $(e.target),
+			validator     = $form.data('bootstrapValidator'),
+			$invalidField = validator.getInvalidFields().eq(0),
+			$collapse     = $invalidField.parents('.collapse');
+
+		$collapse.collapse('show');
+	});
+
+}
--- a/resources/shop/js/include/geo_autocomplete.js
+++ b/resources/shop/js/include/geo_autocomplete.js
@@ -0,0 +1,27 @@
+function initializeAutocomplete(id) {
+  var element = document.getElementById(id);
+  if (element) {
+    var autocomplete = new google.maps.places.Autocomplete(element, { types: ['geocode'] });
+    google.maps.event.addListener(autocomplete, 'place_changed', onPlaceChanged);
+  }
+}
+
+function onPlaceChanged() {
+  var place = this.getPlace();
+
+  // console.log(place);  // Uncomment this line to view the full object returned by Google API.
+
+  for (var i in place.address_components) {
+    var component = place.address_components[i];
+    for (var j in component.types) {  // Some types are ["country", "political"]
+      var type_element = document.getElementById(component.types[j]);
+      if (type_element) {
+        type_element.value = component.long_name;
+      }
+    }
+  }
+}
+
+google.maps.event.addDomListener(window, 'load', function() {
+  initializeAutocomplete('adresse');
+});
--- a/resources/shop/js/include/handlebars.js
+++ b/resources/shop/js/include/handlebars.js
@@ -0,0 +1,67 @@
+function renderContractDriveTPL(filename, data, selector) {
+	data.translate = translate;
+	var path = '/assets/apps/ContractDrive/templates/';
+	var content = getTemplate(path + filename, data);
+	if (typeof(selector) == 'undefined')
+	{
+		return content;
+	} else {
+		$(selector).html(content);
+	}
+}
+
+function getTemplate(file, data) {
+	var source = getSource(file);
+	var template = Handlebars.compile(source);
+	return template(data);
+}
+
+function getSource(file) {
+	var source = null;
+	$.ajax({
+		async: false,
+		dataType: 'html',
+		type: 'GET',
+		url: file + '?' + Date.now(),
+		success: function(data) {
+			source = data;
+		}
+	});
+	return source;
+}
+
+function view(template_id, data) {
+	// console.log(template_id);
+	// console.log(data);
+	var source = document.getElementById(template_id).innerHTML;
+	var template = Handlebars.compile(source);
+	return template(data);
+}
+
+function helperSelect(name, items, selected, options) {
+
+	// If the selected value is an array, then convert the
+	// select to a multiple select
+	if (selected instanceof Array) {
+		options.hash.multiple = 'multiple';
+	}
+
+	// Generate the list of options
+	var optionsHtml = '';
+	for (var i = 0, j = items.length; i < j; i++) {
+
+		// <option> attributes
+		var attr = {
+			value: items[i].value
+		};
+
+		// We can specify which options are selected by using either:
+		// * an array of selected values or
+		// * a single selected value
+		if ((selected instanceof Array && indexOf(selected, items[i].value) !== -1) || (selected === items[i].value)) {
+			attr.selected = 'selected';
+		}
+
+		optionsHtml += createElement('option', true, attr, items[i].text);
+	}
+}
--- a/resources/shop/js/include/layout/animate.js
+++ b/resources/shop/js/include/layout/animate.js
@@ -0,0 +1,15 @@
+function initAnimate()
+{
+/*
+	var wew = new Wew({
+		target: '.wow',
+		keyword: 'wow',
+	});
+
+	wew.init();
+*/
+	wow = new WOW({animateClass: 'animated', live: true});
+	wow.init();
+
+}
+
--- a/resources/shop/js/include/layout/message.js
+++ b/resources/shop/js/include/layout/message.js
@@ -0,0 +1,9 @@
+function errorMessage(message)
+{
+
+	var message = (typeof(message) != 'undefined') ? message : translate.getText.please_contact_the_administrator;
+	if ( typeof(screenErrors) != 'undefined' ) { 
+		screenErrors.execute('error', translate.getText.an_error_occured+'.<br>'+message+'.'); 
+	}
+}
+
--- a/resources/shop/js/include/layout/modal.js
+++ b/resources/shop/js/include/layout/modal.js
@@ -0,0 +1,37 @@
+function openModal(title, route, params)
+{
+	var params = (typeof(params) == 'undefined') ? [] : params;
+	var message = (typeof(params['preload']) == 'undefined') ? '<p><i class="fa fa-spin fa-spinner"></i> Loading...</p>' : params['preload'];
+	var callback_apply = (typeof(params['onApply']) == 'undefined') ? false : params['onApply'];
+	var callback_open = (typeof(params['onOpen']) == 'undefined') ? false : params['onOpen'];
+
+	var dialog = bootbox.dialog({
+		title: title,
+		message: message,
+		buttons: getModalButtons(callback_apply),
+		callback: function() {
+			if (callback_open) {
+				callback_open();
+			} 
+		}
+	});
+						
+	dialog.init(function(){
+		dialog.find('.bootbox-body').load(route);
+	});
+
+}
+
+function getModalButtons(callback) {
+	return {
+		ok: {
+			label: "Apply",
+			className: 'btn-info',
+			callback: function() {
+				if (typeof(callback) !== 'undefined') {
+					callback();
+				}
+			}
+		}
+	}
+}
--- a/resources/shop/js/include/layout/scroll.js
+++ b/resources/shop/js/include/layout/scroll.js
@@ -0,0 +1,24 @@
+function initScroll(selector)
+{
+	if (typeof(selector) == 'undefined')
+	{
+		selector = ('.nicescrollable');
+	}
+
+	$(selector).niceScroll({
+		horizrailenabled: false,
+		cursorborder: "0",
+		cursorwidth: "8px",
+		cursorcolor: "#fff",
+		zindex: "5555",
+		autohidemode: true,
+		bouncescroll: true,
+		mousescrollstep: 40,
+		scrollspeed: 100,
+		background: "#cdcdcd",
+		cursoropacitymin: 0.3,
+		cursoropacitymax: 0.7,
+		cursorborderradius: 0,
+		railpadding: {top:0,right:1,left:0,bottom:0}
+	});
+}
--- a/resources/shop/js/include/layout/tooltip.js
+++ b/resources/shop/js/include/layout/tooltip.js
@@ -0,0 +1,7 @@
+function initTooltip()
+{
+	$('[data-toggle="tooltip"]').tooltip({
+		trigger : 'hover',
+		delay: { "show": 500, "hide": 100 }
+	});  
+}
--- a/resources/shop/js/include/modal.js
+++ b/resources/shop/js/include/modal.js
@@ -0,0 +1,167 @@
+var modal_confirm_delete_options = {
+	title: "Etes-vous sur ?",
+	text: "Cet enregistrement sera effacé.",
+	type: "warning",
+	showCancelButton: true,
+	confirmButtonClass: "btn-danger",
+	confirmButtonText: "Oui !",
+	cancelButtonText: "Annuler"
+};
+
+
+function modal_confirm_delete(id,module,route,callback) {
+	// console.log(id);
+	var $loader = $('#loader');
+	Swal.fire(modal_confirm_delete_options).then(function(result) {
+		if (result.value) {
+			$.ajaxSetup({
+  				headers: {
+    				'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
+  				}
+			});
+			// console.log('/' + route +'/'+ id);
+			$.ajax({
+				url    : '/' + route +'/'+ id,
+				method : 'DELETE',
+				success : function(resp){
+					if (resp.success) {
+						Swal.fire("Supprimé !", "L'enregistrement a été supprimé.", "success");
+						$('#'+module+'-modal').modal('hide');
+						callback();
+					} else {
+						Swal.fire("Erreur!", "L'enregistrement n'a pu être supprimé pour les raisons suivantes : "+resp.message, "danger");
+						if(resp.code == 401){
+							location.reload();
+						}
+					}
+					$loader.hide();
+				}
+			});
+		} else if (result.dismiss === Swal.DismissReason.cancel) {
+
+		}
+	})
+}
+
+function modal_save(id,route,module,callback,$button) {
+	var $loader = $('#loader');
+	var $data = $('#'+module+'-form-data').serialize();
+	var $method = $button.attr('data-method');
+	var $url = ($method == 'POST') ? '/' + route : '/' + route +'/'+ id;
+
+	$button.prop('disabled', true);
+	$button.html('en cours...');
+	$loader.show();
+
+	$.ajax({
+		url: $url,
+		data: $data,
+		method : $method,
+		success: function(resp){
+
+			$button.prop('disabled', false);
+			$button.html('Enregistrer');
+			$loader.hide();
+
+			if (resp.success) {
+				$('#'+module+'-form-data').each(function(){
+					this.reset();
+				});
+				$('#btn-'+module+'-delete').hide();
+				$('#'+module+'-modal').modal('hide');
+				callback();
+			} else {
+				swal(resp.message);
+				if (resp.code == 401) {
+					location.reload();
+				}
+			}
+		}
+	});
+}
+
+function modal_add(module, callback) {
+	/*
+	$('#'+module+'-form-data').each(function(){
+		this.reset();
+	});
+	*/
+	$('#btn-'+module+'-save').attr('data-method', 'POST');
+	$('#btn-'+module+'-delete').hide();
+	$('#'+module+'-modal').modal('show');
+	callback();
+}
+
+function modal_edit(id,route,module,callback) {
+	var $loader = $('#loader');
+	$loader.show();
+	$('#btn-'+module+'-delete').show();
+
+	$.get('/'+route+'/'+id, function(resp){
+		if (resp.success) {
+			/*
+			$('#'+module+'-form-data').each(function(){
+				this.reset();
+			});
+			*/
+			callback(resp.data);
+
+			$('#btn-'+module+'-save').attr('data-method', 'PUT');
+			$('#btn-'+module+'-delete').show();
+			$('#'+module+'-modal').modal('show');
+		} else {
+			if (resp.code == 401) {
+				location.reload();
+			}
+		}
+		$loader.hide();
+	});
+}
+
+function initModalAdmin(route,module,callback,populate,Table) {
+	
+	var selector = getDatatablesSelector(model); 
+/*
+	$( selector + ' tbody').on( 'click', 'tr', function (e) {
+		e.preventDefault();
+		// $(this).toggleClass('selected');
+		id = Table.row(this).id();
+		modal_edit(id,route,module,populate);
+    } );
+*/
+/*
+	$('#btn-'+module+'-add').click(function(e){
+		e.preventDefault();
+		modal_add(module, populate);
+	});
+*/
+/*
+	$('#'+module+'-table').on('click', '.btn-'+module+'-edit', function(e){
+		e.preventDefault();
+		var id = $(this).attr('data-id');
+		modal_edit(id,route,module,populate);
+	});
+*/
+/*	
+	$('#'+module+'-table').on('click', '.btn-'+module+'-delete', function(e){
+		e.preventDefault();
+		var id = $(this).attr('data-id');   
+		modal_confirm_delete(id,route,callback);
+	});
+*/
+
+	$('#btn-'+module+'-delete').click(function(e){
+		e.preventDefault();
+		var id = $('#id').val();
+		modal_confirm_delete(id,module,route,callback);
+	});
+
+/*
+	$('#btn-'+module+'-save').click(function(e){
+		e.preventDefault();
+		var id = $('#id').val();
+		modal_save(id,route,module,callback,$(this));
+	});
+*/
+}
+
--- a/resources/shop/js/include/plugins/datatables_lang/de.json
+++ b/resources/shop/js/include/plugins/datatables_lang/de.json
@@ -0,0 +1,41 @@
+{
+	"sEmptyTable":   	"Keine Daten in der Tabelle vorhanden",
+	"sInfo":         	"_START_ bis _END_ von _TOTAL_ Einträgen",
+	"sInfoEmpty":    	"Keine Daten vorhanden",
+	"sInfoFiltered": 	"(gefiltert von _MAX_ Einträgen)",
+	"sInfoPostFix":  	"",
+	"sInfoThousands":  	".",
+	"sLengthMenu":   	"_MENU_ Einträge anzeigen",
+	"sLoadingRecords": 	"Wird geladen ..",
+	"sProcessing":   	"Bitte warten ..",
+	"sSearch":       	"Suchen",
+	"sZeroRecords":  	"Keine Einträge vorhanden",
+	"oPaginate": {
+		"sFirst":    	"Erste",
+		"sPrevious": 	"Zurück",
+		"sNext":     	"Nächste",
+		"sLast":     	"Letzte"
+	},
+	"oAria": {
+		"sSortAscending":  ": aktivieren, um Spalte aufsteigend zu sortieren",
+		"sSortDescending": ": aktivieren, um Spalte absteigend zu sortieren"
+	},
+	"select": {
+    	"rows": {
+			"_": "%d Zeilen ausgewählt",
+			"0": "",
+			"1": "1 Zeile ausgewählt"
+	    }
+	},
+	"buttons": {
+		"print":	"Drucken",
+		"colvis":	"Spalten",
+		"copy":		"Kopieren",
+		"copyTitle":	"In Zwischenablage kopieren",
+		"copyKeys":	"Taste <i>ctrl</i> oder <i>\u2318</i> + <i>C</i> um Tabelle<br>in Zwischenspeicher zu kopieren.<br><br>Um abzubrechen die Nachricht anklicken oder Escape drücken.",
+		"copySuccess": {
+			"_": "%d Zeilen kopiert",
+			"1": "1 Zeile kopiert"
+		}
+	}
+}
--- a/resources/shop/js/include/plugins/datatables_lang/en.json
+++ b/resources/shop/js/include/plugins/datatables_lang/en.json
@@ -0,0 +1,23 @@
+{
+	"sEmptyTable":     "No data available in table",
+	"sInfo":           "Showing _START_ to _END_ of _TOTAL_ entries",
+	"sInfoEmpty":      "Showing 0 to 0 of 0 entries",
+	"sInfoFiltered":   "(filtered from _MAX_ total entries)",
+	"sInfoPostFix":    "",
+	"sInfoThousands":  ",",
+	"sLengthMenu":     "Show _MENU_ entries",
+	"sLoadingRecords": "Loading...",
+	"sProcessing":     "Processing...",
+	"sSearch":         "Search:",
+	"sZeroRecords":    "No matching records found",
+	"oPaginate": {
+		"sFirst":    "First",
+		"sLast":     "Last",
+		"sNext":     "Next",
+		"sPrevious": "Previous"
+	},
+	"oAria": {
+		"sSortAscending":  ": activate to sort column ascending",
+		"sSortDescending": ": activate to sort column descending"
+	}
+}
--- a/resources/shop/js/include/plugins/datatables_lang/fr.json
+++ b/resources/shop/js/include/plugins/datatables_lang/fr.json
@@ -0,0 +1,29 @@
+{
+	"sProcessing":     "Traitement en cours...",
+	"sSearch":         "Rechercher&nbsp;:",
+    "sLengthMenu":     "Afficher _MENU_ &eacute;l&eacute;ments",
+	"sInfo":           "Affichage de l'&eacute;l&eacute;ment _START_ &agrave; _END_ sur _TOTAL_ &eacute;l&eacute;ments",
+	"sInfoEmpty":      "Affichage de l'&eacute;l&eacute;ment 0 &agrave; 0 sur 0 &eacute;l&eacute;ment",
+	"sInfoFiltered":   "(filtr&eacute; de _MAX_ &eacute;l&eacute;ments au total)",
+	"sInfoPostFix":    "",
+	"sLoadingRecords": "Chargement en cours...",
+    "sZeroRecords":    "Aucun &eacute;l&eacute;ment &agrave; afficher",
+	"sEmptyTable":     "Aucune donn&eacute;e disponible dans le tableau",
+	"oPaginate": {
+		"sFirst":      "Premier",
+		"sPrevious":   "Pr&eacute;c&eacute;dent",
+		"sNext":       "Suivant",
+		"sLast":       "Dernier"
+	},
+	"oAria": {
+		"sSortAscending":  ": activer pour trier la colonne par ordre croissant",
+		"sSortDescending": ": activer pour trier la colonne par ordre d&eacute;croissant"
+	},
+	"select": {
+        	"rows": {
+         		"_": "%d lignes s&eacute;lectionn&eacute;es",
+         		"0": "Aucune ligne s&eacute;lectionn&eacute;e",
+        		"1": "1 ligne s&eacute;lectionn&eacute;e"
+        	}  
+	}
+}
--- a/resources/shop/js/include/plugins/datatables_lang/it.json
+++ b/resources/shop/js/include/plugins/datatables_lang/it.json
@@ -0,0 +1,23 @@
+{
+	"sEmptyTable":     "Nessun dato presente nella tabella",
+	"sInfo":           "Vista da _START_ a _END_ di _TOTAL_ elementi",
+	"sInfoEmpty":      "Vista da 0 a 0 di 0 elementi",
+	"sInfoFiltered":   "(filtrati da _MAX_ elementi totali)",
+	"sInfoPostFix":    "",
+	"sInfoThousands":  ".",
+	"sLengthMenu":     "Visualizza _MENU_ elementi",
+	"sLoadingRecords": "Caricamento...",
+	"sProcessing":     "Elaborazione...",
+	"sSearch":         "Cerca:",
+	"sZeroRecords":    "La ricerca non ha portato alcun risultato.",
+	"oPaginate": {
+		"sFirst":      "Inizio",
+		"sPrevious":   "Precedente",
+		"sNext":       "Successivo",
+		"sLast":       "Fine"
+	},
+	"oAria": {
+		"sSortAscending":  ": attiva per ordinare la colonna in ordine crescente",
+		"sSortDescending": ": attiva per ordinare la colonna in ordine decrescente"
+	}
+}
--- a/resources/shop/js/include/plugins/datatables_lang/jp.json
+++ b/resources/shop/js/include/plugins/datatables_lang/jp.json
@@ -0,0 +1,23 @@
+{
+  "sEmptyTable":     "テーブルにデータがありません",
+  "sInfo":           " _TOTAL_ 件中 _START_ から _END_ まで表示",
+	"sInfoEmpty":      " 0 件中 0 から 0 まで表示",
+	"sInfoFiltered":   "（全 _MAX_ 件より抽出）",
+  "sInfoPostFix":    "",
+  "sInfoThousands":  ",",
+	"sLengthMenu":     "_MENU_ 件表示",
+  "sLoadingRecords": "読み込み中...",
+	"sProcessing":     "処理中...",
+  "sSearch":         "検索:",
+	"sZeroRecords":    "一致するレコードがありません",
+	"oPaginate": {
+		"sFirst":    "先頭",
+		"sLast":     "最終",
+		"sNext":     "次",
+		"sPrevious": "前"
+	},
+  "oAria": {
+		"sSortAscending":  ": 列を昇順に並べ替えるにはアクティブにする",
+		"sSortDescending": ": 列を降順に並べ替えるにはアクティブにする"
+	}
+}
--- a/resources/shop/js/include/plugins/datatables_lang/sp.json
+++ b/resources/shop/js/include/plugins/datatables_lang/sp.json
@@ -0,0 +1,28 @@
+{
+	"sProcessing":     "Procesando...",
+                "sLengthMenu":     "Mostrar _MENU_ registros",
+                "sZeroRecords":    "No se encontraron resultados",
+                "sEmptyTable":     "Ningún dato disponible en esta tabla =(",
+                "sInfo":           "Mostrando registros del _START_ al _END_ de un total de _TOTAL_ registros",
+                "sInfoEmpty":      "Mostrando registros del 0 al 0 de un total de 0 registros",
+                "sInfoFiltered":   "(filtrado de un total de _MAX_ registros)",
+                "sInfoPostFix":    "",
+                "sSearch":         "Buscar:",
+                "sUrl":            "",
+                "sInfoThousands":  ",",
+                "sLoadingRecords": "Cargando...",
+                "oPaginate": {
+                    "sFirst":    "Primero",
+                    "sLast":     "Último",
+                    "sNext":     "Siguiente",
+                    "sPrevious": "Anterior"
+                },
+                "oAria": {
+                    "sSortAscending":  ": Activar para ordenar la columna de manera ascendente",
+                    "sSortDescending": ": Activar para ordenar la columna de manera descendente"
+                },
+                "buttons": {
+                    "copy": "Copiar",
+                    "colvis": "Visibilidad"
+                }
+}
--- a/resources/shop/js/include/plugins/google-place-autocomplete-gh-pages/README.md
+++ b/resources/shop/js/include/plugins/google-place-autocomplete-gh-pages/README.md
@@ -0,0 +1,37 @@
+# Google Place Autocomplete
+
+This sample code show you how to quickly use the Places Autocomplete javascript
+API from Google.
+
+[See demo right now](http://lewagon.github.io/google-place-autocomplete)
+
+## Code
+
+Look at the [index.html](index.html) file, you'll see a very standard form.
+The input with id `user_input_autocomplete_address` is very important as it
+is bound to an `autocomplete` object in the `autocomplete.js` code.
+
+The code you see is not dependent on jQuery, also the `initializeAutocomplete`
+method has to be called when `google` is ready, not just when the DOM is ready.
+
+## API Key
+
+In order to get a lot of requests for free to the API, you need to create a
+new project under the [Google API Console](https://code.google.com/apis/console).
+For this project, enable the Google Maps Javascript API v3:
+
+![](readme-images/enable-api.png)
+
+Then, for this project, create a new "Browser Key", the one you'll put in the
+`index.html` file when calling the `https://maps.googleapis.com/maps/api/js` script.
+
+![](readme-images/create-new-browser-key.png)
+
+Make sure to specify referers so that **only you** can use this key! Remember,
+you API calls are limited per day.
+
+![](readme-images/key-referers.png)
+
+## Documentation
+
+[Full Reference](https://developers.google.com/maps/documentation/javascript/places-autocomplete)
--- a/resources/shop/js/include/plugins/google-place-autocomplete-gh-pages/autocomplete.js
+++ b/resources/shop/js/include/plugins/google-place-autocomplete-gh-pages/autocomplete.js
@@ -0,0 +1,27 @@
+function initializeAutocomplete(id) {
+  var element = document.getElementById(id);
+  if (element) {
+    var autocomplete = new google.maps.places.Autocomplete(element, { types: ['geocode'] });
+    google.maps.event.addListener(autocomplete, 'place_changed', onPlaceChanged);
+  }
+}
+
+function onPlaceChanged() {
+  var place = this.getPlace();
+
+  // console.log(place);  // Uncomment this line to view the full object returned by Google API.
+
+  for (var i in place.address_components) {
+    var component = place.address_components[i];
+    for (var j in component.types) {  // Some types are ["country", "political"]
+      var type_element = document.getElementById(component.types[j]);
+      if (type_element) {
+        type_element.value = component.long_name;
+      }
+    }
+  }
+}
+
+google.maps.event.addDomListener(window, 'load', function() {
+  initializeAutocomplete('user_input_autocomplete_address');
+});
--- a/resources/shop/js/include/plugins/google-place-autocomplete-gh-pages/index.html
+++ b/resources/shop/js/include/plugins/google-place-autocomplete-gh-pages/index.html
@@ -0,0 +1,83 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+
+    <title>Google Place Autocomplete</title>
+
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
+  </head>
+  <body>
+
+    <div class="container">
+      <div class="row">
+        <div class="col-sm-8 col-sm-offset-2">
+          <h1>Google Place Autocomplete exemple</h1>
+
+          <a href="https://github.com/lewagon/google-place-autocomplete">Source</a>
+          <hr>
+
+          <form role="form" class="form-horizontal">
+            <fieldset>
+               <div class="form-group">
+                <label class="col-sm-4 control-label">Address</label>
+                <div class="col-sm-8">
+                  <input id="user_input_autocomplete_address" name="user_input_autocomplete_address"
+                         class="form-control" placeholder="Start typing your address...">
+                </div>
+              </div>
+            </fieldset>
+
+            <fieldset class="disabled">
+              <div class="form-group">
+                <label class="col-sm-4 control-label"><code>street_number</code></label>
+                <div class="col-sm-8">
+                  <input id="street_number" name="street_number" disabled="true" class="form-control">
+                </div>
+              </div>
+              <div class="form-group">
+                <label class="col-sm-4 control-label"><code>route</code></label>
+                <div class="col-sm-8">
+                  <input id="route" name="route" disabled="true" class="form-control">
+                </div>
+              </div>
+              <div class="form-group">
+                <label class="col-sm-4 control-label"><code>locality</code></label>
+                <div class="col-sm-8">
+                  <input id="locality" name="locality" disabled="true" class="form-control">
+                </div>
+              </div>
+              <div class="form-group">
+                <label class="col-sm-4 control-label"><code>administrative_area_level_1</code></label>
+                <div class="col-sm-8">
+                  <input id="administrative_area_level_1" name="administrative_area_level_1" disabled="true" class="form-control">
+                </div>
+              </div>
+              <div class="form-group">
+                <label class="col-sm-4 control-label"><code>postal_code</code></label>
+                <div class="col-sm-8">
+                  <input id="postal_code" name="postal_code" disabled="true" class="form-control">
+                </div>
+              </div>
+              <div class="form-group">
+                <label class="col-sm-4 control-label"><code>country</code></label>
+                <div class="col-sm-8">
+                  <input id="country" name="country" disabled="true" class="form-control">
+                </div>
+              </div>
+            </fieldset>
+          </form>
+        </div>
+      </div>
+    </div>
+
+    <!-- Include Google Maps JS API -->
+    <script type="text/javascript"
+            src="https://maps.googleapis.com/maps/api/js?libraries=places&amp;key=AIzaSyDANjx3bosEtIyzJaoWs50Wnt6nt_1rmxU "></script>
+
+    <!-- Custom JS code to bind to Autocomplete API -->
+    <script type="text/javascript" src="autocomplete.js"></script>
+  </body>
+</html>
--- a/resources/shop/js/include/plugins/google-place-autocomplete-gh-pages/readme-images/create-new-browser-key.png
+++ b/resources/shop/js/include/plugins/google-place-autocomplete-gh-pages/readme-images/create-new-browser-key.png
--- a/resources/shop/js/include/plugins/google-place-autocomplete-gh-pages/readme-images/enable-api.png
+++ b/resources/shop/js/include/plugins/google-place-autocomplete-gh-pages/readme-images/enable-api.png
--- a/resources/shop/js/include/plugins/google-place-autocomplete-gh-pages/readme-images/key-referers.png
+++ b/resources/shop/js/include/plugins/google-place-autocomplete-gh-pages/readme-images/key-referers.png
--- a/resources/shop/js/include/plugins/jquery.hcaptions.js
+++ b/resources/shop/js/include/plugins/jquery.hcaptions.js
@@ -0,0 +1,241 @@
+(function($){
+
+	var Captions = function(el, opts) {
+		var _this = this,
+		    $this = $(el),
+		    $el = $this.clone(),
+		    href = $this.attr('href'),
+		    $target = $($this.attr('data-target') || (href && href.replace(/.*(?=#[^\s]+$)/, ''))), //strip for ie7
+		    _overlay_css = {};
+
+		if ( ! $target.length )
+		{
+			$target = $this.next(opts.data_selector);
+		}
+		if ($target.length) {
+
+			this.set_from_attr(el, opts);
+
+			$wrap = $('<div class="drop-panel" />',{position: 'relative', 'z-index': 1, display: 'block', overflow: 'hidden'})
+			        .append($el)
+			        .append($target);
+			
+
+
+			$this.replaceWith($wrap);
+			$target.hide();
+
+			$wrap.css({ 'position':'relative', 'overflow':'hidden', display: 'block', padding:'2px' });
+
+			if (opts.find_image && $this.not('img'))
+			{
+				var img = $wrap.find('img'),
+					w = img.width(),
+					h = img.height();
+			}
+			else {
+				var w = $wrap.outerWidth(),
+					h = $wrap.outerHeight();
+			}
+
+			var overlay_w = opts.width || w,
+				overlay_h = opts.height || h;
+
+			$target.css({ 'width':overlay_w, 'height':overlay_h, 'position':'absolute', 'z-index':33, overflow: 'hidden' });
+
+			var _overlay_css = {};
+			
+			if (opts.overlay_bg) { 
+				_overlay_css.background = opts.overlay_bg; 
+			}
+			if (opts.overlay_opacity<1) { 
+				_overlay_css.opacity = opts.overlay_opacity; 
+			}
+
+			// CSS: Overlay X Position
+			_overlay_css.left = (opts.overlay_x == 'left')
+				? 0
+				: (opts.overlay_x == 'right')
+					? w-overlay_w
+					: (w - overlay_w) / 2 + 'px';
+			
+			// CSS: Overlay Y Position
+			_overlay_css.top = (opts.overlay_y == 'top')
+				? 0
+				: (opts.overlay_y == 'bottom')
+					? h-overlay_h
+					: (h - overlay_h) / 2 + 'px';
+			
+			// CSS: Apply rules
+			$target.css(_overlay_css); 
+			
+			// slide effect
+			if (opts.effect=='slide') {
+
+				var slide_css = {};
+				
+				switch (opts.direction) {
+					case 'top':
+						slide_css.top = '-'+overlay_h+'px';
+						break;
+					case 'bottom':
+						slide_css.top = h+'px';
+						break;
+					case 'left':
+						slide_css.left = '-'+overlay_w+'px';
+						break;
+					case 'right':
+					default:
+						slide_css.left = w+'px';
+						break;
+				}
+
+				// Apply Slide rules
+				$target.css('z-index',opts.zindex+1).css(slide_css);
+
+				// Hover events
+				$wrap.hover(function(){
+					$target.show().stop(true, true).animate({ 'top': _overlay_css.top, 'left': _overlay_css.left }, +opts.speed, opts.onshow());
+				}, function(){
+					$target.show().stop(true, true).animate(slide_css, +opts.speed, opts.onhide());
+				});
+				
+			// fade effect
+			} else if (opts.effect=='fade') {
+				$target.css('z-index',opts.zindex+1).hide();
+				$wrap.hover(function () {
+					$target.stop(true, true).fadeIn(+opts.speed, opts.onshow());
+				}, function () {
+					$target.stop(true, true).fadeOut(+opts.speed, opts.onhide());
+				});
+			
+			// just show/hide
+			} else {
+				$target.css('z-index',opts.zindex+1).hide();
+				$wrap.hover(function () {
+					$target.show(0, opts.onshow());
+				}, function () {
+					$target.hide(0, opts.onhide());
+				});
+			}
+		}
+	};
+
+	Captions.prototype = {
+		
+		constructor: Captions,
+
+		set_from_attr: function(el, opt){
+			var cfg={},
+				attrs=el.attributes,
+				l=attrs.length;
+
+			for (var i=0; i<l; i++)
+			{
+				attr = attrs.item(i);
+				if (/cap-/i.test(attr.nodeName))
+				{
+					opt[attr.nodeName.replace('cap-', '')] = attr.nodeValue;
+				}
+			}
+		}
+	};
+	
+	$.fn.hcaptions = function (option) {
+		return this.each(function () {
+			var $this = $(this)
+				, data = $this.data('captions')
+				, options = $.extend({}, $.fn.hcaptions.defaults, $this.data(), typeof option == 'object' && option);
+			if (!data) $this.data('captions', (data = new Captions(this, options)));
+			if (typeof option == 'string') data[option]();
+		});
+	};
+
+	$.fn.hcaptions.defaults = {
+		
+		/**
+		 * Selector for caption content 
+		 * @type {String}
+		 */
+		data_selector: '.cap-overlay',
+
+		/**
+		 * Overlay width
+		 * @default full width
+		 * @type {Number}
+		 */
+		width: 0,
+
+		/**
+		 * Overlay height
+		 * @type {Number}
+		 */
+		height: 0,
+
+		/**
+		 * Horizontal position for the overlay
+		 * @options [center, left, right]
+		 * @type {String}
+		 */
+		overlay_x: 'center',
+
+		/**
+		 * Vertical position for the overlay
+		 * @options [center, top, bottom]
+		 * @type {String}
+		 */
+		overlay_y: 'center',
+
+		/**
+		 * Background css for overlay
+		 * @type {String}
+		 */
+		overlay_bg: '',
+
+		/**
+		 * Opacity of overlay
+		 * @type {Number}
+		 */
+		overlay_opacity: 1,
+
+		/**
+		 * Effect of overlay
+		 * @options [fade, slide, show/hide]
+		 * @type {String}
+		 */
+		effect: 'slide',
+
+		/**
+		 * Animation speed in ms
+		 * @type {Number}
+		 */
+		speed: 400,
+
+		/**
+		 * Direction of overlay
+		 * @options [top, bottom, right, left]
+		 * @type {String}
+		 */
+		direction: 'top',
+
+		/**
+		 * Z-Index Base
+		 * @type {Number}
+		 */
+		zindex: 2,
+
+		find_image: false,
+
+		/**
+		 * On show callback
+		 * @return {[type]} [description]
+		 */
+		onshow: function(){},
+
+		/**
+		 * On hide callback
+		 * @return {[type]} [description]
+		 */
+		onhide: function(){}
+	};
+})(jQuery);  
--- a/resources/shop/js/include/plugins/toolbar/jquery.toolbar.css
+++ b/resources/shop/js/include/plugins/toolbar/jquery.toolbar.css
@@ -0,0 +1,487 @@
+.tool-container, .tool-item, .btn-toolbar {
+    -webkit-box-sizing: content-box;
+    -moz-box-sizing: content-box;
+    box-sizing: content-box;
+}
+
+.btn-toolbar {
+  background: #364347;
+  width: 20px;
+  height: 20px;
+  text-align: center;
+  padding: 10px;
+  border-radius: 6px;
+  display: block;
+  transition: none;
+}
+.btn-toolbar > i {
+  color: #02baf2;
+  font-size: 16px;
+}
+.btn-toolbar:hover {
+  background: #02baf2;
+  cursor: pointer;
+}
+.btn-toolbar:hover > i {
+  color: white;
+}
+.btn-toolbar-primary {
+  background-color: #009dcd;
+}
+.btn-toolbar-primary.pressed {
+  background-color: #02baf2;
+}
+.btn-toolbar-primary:hover {
+  background-color: #02baf2;
+}
+.btn-toolbar-primary > i {
+  color: white;
+}
+.btn-toolbar-danger {
+  background-color: #cc0000;
+}
+.btn-toolbar-danger.pressed {
+  background-color: #f84545;
+}
+.btn-toolbar-danger:hover {
+  background-color: #f84545;
+}
+.btn-toolbar-danger > i {
+  color: white;
+}
+.btn-toolbar-warning {
+  background-color: #f3bc65;
+}
+.btn-toolbar-warning.pressed {
+  background-color: #fad46b;
+}
+.btn-toolbar-warning:hover {
+  background-color: #fad46b;
+}
+.btn-toolbar-warning > i {
+  color: white;
+}
+.btn-toolbar-info {
+  background-color: #e96300;
+}
+.btn-toolbar-info.pressed {
+  background-color: #f58410;
+}
+.btn-toolbar-info:hover {
+  background-color: #f58410;
+}
+.btn-toolbar-info > i {
+  color: white;
+}
+.btn-toolbar-success {
+  background-color: #28948c;
+}
+.btn-toolbar-success.pressed {
+  background-color: #3eb5ac;
+}
+.btn-toolbar-success:hover {
+  background-color: #3eb5ac;
+}
+.btn-toolbar-success > i {
+  color: white;
+}
+.btn-toolbar-info-o {
+  background-color: #9175bd;
+}
+.btn-toolbar-info-o.pressed {
+  background-color: #a88cd5;
+}
+.btn-toolbar-info-o:hover {
+  background-color: #a88cd5;
+}
+.btn-toolbar-info-o > i {
+  color: white;
+}
+.btn-toolbar-light {
+  background-color: #b2c6cd;
+}
+.btn-toolbar-light.pressed {
+  background-color: #d6e1e5;
+}
+.btn-toolbar-light:hover {
+  background-color: #d6e1e5;
+}
+.btn-toolbar-light > i {
+  color: white;
+}
+.btn-toolbar-dark {
+  background-color: #364347;
+}
+.btn-toolbar-dark.pressed {
+  background-color: #5e696d;
+}
+.btn-toolbar-dark:hover {
+  background-color: #5e696d;
+}
+.btn-toolbar-dark > i {
+  color: white;
+}
+.tool-container {
+  background-color: #5e696d;
+  background-size: 100% 100%;
+  border-radius: 6px;
+  position: absolute;
+}
+.tool-container.tool-top,
+.tool-container.tool-bottom {
+  height: 40px;
+  border-bottom: 0px solid #beb8b8;
+}
+.tool-container.tool-top .tool-item,
+.tool-container.tool-bottom .tool-item {
+  float: left;
+  border-right: 0;
+  border-left: 0;
+}
+.tool-item {
+  height: 100%;
+  display: block;
+  width: 20px;
+  height: 20px;
+  text-align: center;
+  padding: 10px;
+  transition: none;
+}
+.tool-item > .fa {
+  color: #b2c6cd;
+}
+.tool-item.selected,
+.tool-item:hover {
+  background: #02baf2;
+}
+.tool-item.selected > .fa,
+.tool-item:hover > .fa {
+  color: white;
+}
+.tool-top .tool-item:first-child:hover,
+.tool-bottom .tool-item:first-child:hover {
+  border-top-left-radius: 6px;
+  border-bottom-left-radius: 6px;
+}
+.tool-top .tool-item:last-child:hover,
+.tool-bottom .tool-item:last-child:hover {
+  border-top-right-radius: 6px;
+  border-bottom-right-radius: 6px;
+}
+.tool-vertical-top .tool-item:first-child:hover,
+.tool-vertical-bottom .tool-item:first-child:hover,
+.tool-right .tool-item:first-child:hover,
+.tool-left .tool-item:first-child:hover {
+  border-top-left-radius: 6px;
+  border-top-right-radius: 6px;
+}
+.tool-vertical-top .tool-item:last-child:hover,
+.tool-vertical-bottom .tool-item:last-child:hover,
+.tool-right .tool-item:last-child:hover,
+.tool-left .tool-item:last-child:hover {
+  border-bottom-left-radius: 6px;
+  border-bottom-right-radius: 6px;
+}
+.tool-container .arrow {
+  width: 0;
+  height: 0;
+  position: absolute;
+  border-width: 7px;
+  border-style: solid;
+}
+.tool-container.tool-top .arrow {
+  border-color: #5e696d transparent transparent;
+  left: 50%;
+  bottom: -14px;
+  margin-left: -7px;
+}
+.tool-container.tool-bottom .arrow {
+  border-color: transparent transparent #5e696d;
+  left: 50%;
+  top: -14px;
+  margin-left: -7px;
+}
+.tool-container.tool-left .arrow {
+  border-color: transparent transparent transparent #5e696d;
+  top: 50%;
+  right: -14px;
+  margin-top: -7px;
+}
+.tool-container.tool-right .arrow {
+  border-color: transparent #5e696d transparent transparent;
+  top: 50%;
+  left: -14px;
+  margin-top: -7px;
+}
+.toolbar-primary {
+  background-color: #02baf2;
+}
+.toolbar-primary.tool-top .arrow {
+  border-color: #02baf2 transparent transparent;
+}
+.toolbar-primary.tool-bottom .arrow {
+  border-color: transparent transparent #02baf2;
+}
+.toolbar-primary.tool-left .arrow {
+  border-color: transparent transparent transparent #02baf2;
+}
+.toolbar-primary.tool-right .arrow {
+  border-color: transparent #02baf2 transparent transparent;
+}
+.toolbar-primary .tool-item > .fa {
+  color: white;
+}
+.toolbar-primary .tool-item.selected,
+.toolbar-primary .tool-item:hover {
+  background: #009dcd;
+  color: white;
+}
+.toolbar-danger {
+  background-color: #f84545;
+}
+.toolbar-danger.tool-top .arrow {
+  border-color: #f84545 transparent transparent;
+}
+.toolbar-danger.tool-bottom .arrow {
+  border-color: transparent transparent #f84545;
+}
+.toolbar-danger.tool-left .arrow {
+  border-color: transparent transparent transparent #f84545;
+}
+.toolbar-danger.tool-right .arrow {
+  border-color: transparent #f84545 transparent transparent;
+}
+.toolbar-danger .tool-item > .fa {
+  color: white;
+}
+.toolbar-danger .tool-item.selected,
+.toolbar-danger .tool-item:hover {
+  background: #cc0000;
+  color: white;
+}
+.toolbar-warning {
+  background-color: #f3bc65;
+}
+.toolbar-warning.tool-top .arrow {
+  border-color: #f3bc65 transparent transparent;
+}
+.toolbar-warning.tool-bottom .arrow {
+  border-color: transparent transparent #f3bc65;
+}
+.toolbar-warning.tool-left .arrow {
+  border-color: transparent transparent transparent #f3bc65;
+}
+.toolbar-warning.tool-right .arrow {
+  border-color: transparent #f3bc65 transparent transparent;
+}
+.toolbar-warning .tool-item > .fa {
+  color: white;
+}
+.toolbar-warning .tool-item.selected,
+.toolbar-warning .tool-item:hover {
+  background: #fad46b;
+  color: white;
+}
+.toolbar-info {
+  background-color: #e96300;
+}
+.toolbar-info.tool-top .arrow {
+  border-color: #e96300 transparent transparent;
+}
+.toolbar-info.tool-bottom .arrow {
+  border-color: transparent transparent #e96300;
+}
+.toolbar-info.tool-left .arrow {
+  border-color: transparent transparent transparent #e96300;
+}
+.toolbar-info.tool-right .arrow {
+  border-color: transparent #e96300 transparent transparent;
+}
+.toolbar-info .tool-item > .fa {
+  color: white;
+}
+.toolbar-info .tool-item.selected,
+.toolbar-info .tool-item:hover {
+  background: #f58410;
+  color: white;
+}
+.toolbar-success {
+  background-color: #28948c;
+}
+.toolbar-success.tool-top .arrow {
+  border-color: #28948c transparent transparent;
+}
+.toolbar-success.tool-bottom .arrow {
+  border-color: transparent transparent #28948c;
+}
+.toolbar-success.tool-left .arrow {
+  border-color: transparent transparent transparent #28948c;
+}
+.toolbar-success.tool-right .arrow {
+  border-color: transparent #28948c transparent transparent;
+}
+.toolbar-success .tool-item > .fa {
+  color: white;
+}
+.toolbar-success .tool-item.selected,
+.toolbar-success .tool-item:hover {
+  background: #3eb5ac;
+  color: white;
+}
+.toolbar-info-o {
+  background-color: #9175bd;
+}
+.toolbar-info-o.tool-top .arrow {
+  border-color: #9175bd transparent transparent;
+}
+.toolbar-info-o.tool-bottom .arrow {
+  border-color: transparent transparent #9175bd;
+}
+.toolbar-info-o.tool-left .arrow {
+  border-color: transparent transparent transparent #9175bd;
+}
+.toolbar-info-o.tool-right .arrow {
+  border-color: transparent #9175bd transparent transparent;
+}
+.toolbar-info-o .tool-item > .fa {
+  color: white;
+}
+.toolbar-info-o .tool-item.selected,
+.toolbar-info-o .tool-item:hover {
+  background: #a88cd5;
+  color: white;
+}
+.toolbar-light {
+  background-color: #b2c6cd;
+}
+.toolbar-light.tool-top .arrow {
+  border-color: #b2c6cd transparent transparent;
+}
+.toolbar-light.tool-bottom .arrow {
+  border-color: transparent transparent #b2c6cd;
+}
+.toolbar-light.tool-left .arrow {
+  border-color: transparent transparent transparent #b2c6cd;
+}
+.toolbar-light.tool-right .arrow {
+  border-color: transparent #b2c6cd transparent transparent;
+}
+.toolbar-light .tool-item > .fa {
+  color: white;
+}
+.toolbar-light .tool-item.selected,
+.toolbar-light .tool-item:hover {
+  background: #d6e1e5;
+  color: white;
+}
+.toolbar-dark {
+  background-color: #364347;
+}
+.toolbar-dark.tool-top .arrow {
+  border-color: #364347 transparent transparent;
+}
+.toolbar-dark.tool-bottom .arrow {
+  border-color: transparent transparent #364347;
+}
+.toolbar-dark.tool-left .arrow {
+  border-color: transparent transparent transparent #364347;
+}
+.toolbar-dark.tool-right .arrow {
+  border-color: transparent #364347 transparent transparent;
+}
+.toolbar-dark .tool-item > .fa {
+  color: white;
+}
+.toolbar-dark .tool-item.selected,
+.toolbar-dark .tool-item:hover {
+  background: #5e696d;
+  color: white;
+}
+.animate-standard {
+  -webkit-animation: standardAnimate 0.3s 1 ease;
+}
+.animate-flyin {
+  -webkit-animation: rotateAnimate 0.5s 1 ease;
+}
+.animate-grow {
+  -webkit-animation: growAnimate 0.4s 1 ease;
+}
+.animate-flip {
+  -webkit-animation: flipAnimate 0.4s 1 ease;
+}
+.animate-bounce {
+  -webkit-animation: bounceAnimate 0.4s 1 ease-out;
+}
+@-webkit-keyframes rotateAnimate {
+  from {
+    transform: rotate(180deg) translate(-120px);
+    opacity: 0;
+  }
+  to {
+    transform: rotate(0deg) translate(0px);
+    opacity: 1;
+  }
+}
+@-webkit-keyframes standardAnimate {
+  from {
+    transform: translateY(20px);
+    opacity: 0;
+  }
+  to {
+    transform: translateY(0px);
+    opacity: 1;
+  }
+}
+@-webkit-keyframes growAnimate {
+  0% {
+    transform: scale(0) translateY(40px);
+    opacity: 0;
+  }
+  70% {
+    transform: scale(1.5) translate(0px);
+  }
+  100% {
+    transform: scale(1) translate(0px);
+    opacity: 1;
+  }
+}
+@-webkit-keyframes rotate2Animate {
+  from {
+    transform: rotate(-90deg);
+    transform-origin: 0% 100%;
+    opacity: 0;
+  }
+  to {
+    transform: rotate(0deg);
+    opacity: 1;
+  }
+}
+@-webkit-keyframes flipAnimate {
+  from {
+    transform: rotate3d(2, 2, 2, 180deg);
+    opacity: 0;
+  }
+  to {
+    transform: rotate3d(0, 0, 0, 0deg);
+    opacity: 1;
+  }
+}
+@-webkit-keyframes bounceAnimate {
+  0% {
+    transform: translateY(40px);
+    opacity: 0;
+  }
+  30% {
+    transform: translateY(-40px);
+  }
+  70% {
+    transform: translateY(20px);
+  }
+  100% {
+    transform: translateY(0px);
+    opacity: 1;
+  }
+}
+.hidden {
+  display: none;
+}
--- a/resources/shop/js/include/plugins/toolbar/jquery.toolbar.js
+++ b/resources/shop/js/include/plugins/toolbar/jquery.toolbar.js
@@ -0,0 +1,307 @@
+/**
+ * Toolbar.js
+ *
+ * @fileoverview  jQuery plugin that creates tooltip style toolbars.
+ * @link          http://paulkinzett.github.com/toolbar/
+ * @author        Paul Kinzett (http://kinzett.co.nz/)
+ * @version       1.1.0
+ * @requires      jQuery 1.7+
+ *
+ * @license jQuery Toolbar Plugin v1.1.0
+ * http://paulkinzett.github.com/toolbar/
+ * Copyright 2013 - 2015 Paul Kinzett (http://kinzett.co.nz/)
+ * Released under the MIT license.
+ * <https://raw.github.com/paulkinzett/toolbar/master/LICENSE.txt>
+ */
+
+if ( typeof Object.create !== 'function' ) {
+    Object.create = function( obj ) {
+        function F() {}
+        F.prototype = obj;
+        return new F();
+    };
+}
+
+(function( $, window, document, undefined ) {
+
+    var ToolBar = {
+        init: function( options, elem ) {
+            var self = this;
+            self.elem = elem;
+            self.$elem = $( elem );
+            self.options = $.extend( {}, $.fn.toolbar.options, options );
+            self.metadata = self.$elem.data();
+            self.overrideOptions();
+            self.toolbar = $('<div class="tool-container" />')
+                .addClass('tool-'+self.options.position)
+                .addClass('toolbar-'+self.options.style)
+                .append('<div class="tool-items" />')
+                .append('<div class="arrow" />')
+                .appendTo('body')
+                .css('opacity', 0)
+                .hide();
+            self.toolbar_arrow = self.toolbar.find('.arrow');
+            self.initializeToolbar();
+        },
+
+        overrideOptions: function() {
+            var self = this;
+            $.each( self.options, function( $option ) {
+                if (typeof(self.$elem.data('toolbar-'+$option)) != "undefined") {
+                    self.options[$option] = self.$elem.data('toolbar-'+$option);
+                }
+            });
+        },
+
+        initializeToolbar: function() {
+            var self = this;
+            self.populateContent();
+            self.setTrigger();
+            self.toolbarWidth = self.toolbar.width();
+        },
+
+        setTrigger: function() {
+            var self = this;
+
+            if (self.options.event != 'click') {
+
+                var moveTime;
+                function decideTimeout () {
+                    if (self.$elem.hasClass('pressed')) {
+                        moveTime = setTimeout(function() {
+                            self.hide();
+                        }, 150);
+                    } else {
+                        clearTimeout(moveTime);
+                    };
+                };
+
+                self.$elem.on({
+                    mouseenter: function(event) {
+                        if (self.$elem.hasClass('pressed')) {
+                            clearTimeout(moveTime);
+                        } else {
+                            self.show();
+                        }
+                    }
+                });
+
+                self.$elem.parent().on({
+                    mouseleave: function(event){ decideTimeout(); }
+                });
+
+                $('.tool-container').on({
+                    mouseenter: function(event){ clearTimeout(moveTime); },
+                    mouseleave: function(event){ decideTimeout(); }
+                });
+            }
+
+            if (self.options.event == 'click') {
+                self.$elem.on('click', function(event) {
+                    event.preventDefault();
+                    if(self.$elem.hasClass('pressed')) {
+                        self.hide();
+                    } else {
+                        self.show();
+                    }
+                });
+
+                if (self.options.hideOnClick) {
+                    $('html').on("click.toolbar", function ( event ) {
+                        if (event.target != self.elem &&
+                            self.$elem.has(event.target).length === 0 &&
+                            self.toolbar.has(event.target).length === 0 &&
+                            self.toolbar.is(":visible")) {
+                            self.hide();
+                        }
+                    });
+                }
+            }
+
+            if (self.options.hover) {
+                var moveTime;
+
+                function decideTimeout () {
+                    if (self.$elem.hasClass('pressed')) {
+                        moveTime = setTimeout(function() {
+                            self.hide();
+                        }, 150);
+                    } else {
+                        clearTimeout(moveTime);
+                    };
+                };
+
+                self.$elem.on({
+                    mouseenter: function(event) {
+                        if (self.$elem.hasClass('pressed')) {
+                            clearTimeout(moveTime);
+                        } else {
+                            self.show();
+                        }
+                    }
+                });
+
+                self.$elem.parent().on({
+                    mouseleave: function(event){ decideTimeout(); }
+                });
+
+                $('.tool-container').on({
+                    mouseenter: function(event){ clearTimeout(moveTime); },
+                    mouseleave: function(event){ decideTimeout(); }
+                });
+            }
+
+            $(window).resize(function( event ) {
+                event.stopPropagation();
+                if ( self.toolbar.is(":visible") ) {
+                    self.toolbarCss = self.getCoordinates(self.options.position, 20);
+                    self.collisionDetection();
+                    self.toolbar.css( self.toolbarCss );
+                    self.toolbar_arrow.css( self.arrowCss );
+                }
+            });
+        },
+
+        populateContent: function() {
+            var self = this;
+            var location = self.toolbar.find('.tool-items');
+            var content = $(self.options.content).clone( true ).find('a').addClass('tool-item');
+            location.html(content);
+            location.find('.tool-item').on('click', function(event) {
+                event.preventDefault();
+                self.$elem.trigger('toolbarItemClick', this);
+            });
+        },
+
+        calculatePosition: function() {
+            var self = this;
+                self.arrowCss = {};
+                self.toolbarCss = self.getCoordinates(self.options.position, self.options.adjustment);
+                self.toolbarCss.position = 'absolute';
+                self.toolbarCss.zIndex = self.options.zIndex;
+                self.collisionDetection();
+                self.toolbar.css(self.toolbarCss);
+                self.toolbar_arrow.css(self.arrowCss);
+        },
+
+        getCoordinates: function( position, adjustment ) {
+            var self = this;
+            self.coordinates = self.$elem.offset();
+
+            if (self.options.adjustment && self.options.adjustment[self.options.position]) {
+                adjustment = self.options.adjustment[self.options.position] + adjustment;
+            }
+
+            switch(self.options.position) {
+                case 'top':
+                    return {
+                        left: self.coordinates.left-(self.toolbar.width()/2)+(self.$elem.outerWidth()/2),
+                        top: self.coordinates.top-self.$elem.outerHeight()-adjustment,
+                        right: 'auto'
+                    };
+                case 'left':
+                    return {
+                        left: self.coordinates.left-(self.toolbar.width()/2)-(self.$elem.outerWidth()/2)-adjustment,
+                        top: self.coordinates.top-(self.toolbar.height()/2)+(self.$elem.outerHeight()/2),
+                        right: 'auto'
+                    };
+                case 'right':
+                    return {
+                        left: self.coordinates.left+(self.toolbar.width()/2)+(self.$elem.outerWidth()/2)+adjustment,
+                        top: self.coordinates.top-(self.toolbar.height()/2)+(self.$elem.outerHeight()/2),
+                        right: 'auto'
+                    };
+                case 'bottom':
+                    return {
+                        left: self.coordinates.left-(self.toolbar.width()/2)+(self.$elem.outerWidth()/2),
+                        top: self.coordinates.top+self.$elem.outerHeight()+adjustment,
+                        right: 'auto'
+                    };
+            }
+        },
+
+        collisionDetection: function() {
+            var self = this;
+            var edgeOffset = 20;
+            if(self.options.position == 'top' || self.options.position == 'bottom') {
+                self.arrowCss = {left: '50%', right: '50%'};
+                if( self.toolbarCss.left < edgeOffset ) {
+                    self.toolbarCss.left = edgeOffset;
+                    self.arrowCss.left = self.$elem.offset().left + self.$elem.width()/2-(edgeOffset);
+                }
+                else if(($(window).width() - (self.toolbarCss.left + self.toolbarWidth)) < edgeOffset) {
+                    self.toolbarCss.right = edgeOffset;
+                    self.toolbarCss.left = 'auto';
+                    self.arrowCss.left = 'auto';
+                    self.arrowCss.right = ($(window).width()-self.$elem.offset().left)-(self.$elem.width()/2)-(edgeOffset)-5;
+                }
+            }
+        },
+
+        show: function() {
+            var self = this;
+            self.$elem.addClass('pressed');
+            self.calculatePosition();
+            self.toolbar.show().css({'opacity': 1}).addClass('animate-'+self.options.animation);
+            self.$elem.trigger('toolbarShown');
+        },
+
+        hide: function() {
+            var self = this;
+            var animation = {'opacity': 0};
+
+            self.$elem.removeClass('pressed');
+
+            switch(self.options.position) {
+                case 'top':
+                    animation.top = '+=20';
+                    break;
+                case 'left':
+                    animation.left = '+=20';
+                    break;
+                case 'right':
+                    animation.left = '-=20';
+                    break;
+                case 'bottom':
+                    animation.top = '-=20';
+                    break;
+            }
+
+            self.toolbar.animate(animation, 200, function() {
+                self.toolbar.hide();
+            });
+
+            self.$elem.trigger('toolbarHidden');
+        },
+
+        getToolbarElement: function () {
+            return this.toolbar.find('.tool-items');
+        }
+    };
+
+    $.fn.toolbar = function( options ) {
+        if ($.isPlainObject( options )) {
+            return this.each(function() {
+                var toolbarObj = Object.create( ToolBar );
+                toolbarObj.init( options, this );
+                $(this).data('toolbarObj', toolbarObj);
+            });
+        } else if ( typeof options === 'string' && options.indexOf('_') !== 0 ) {
+            var toolbarObj = $(this).data('toolbarObj');
+            var method = toolbarObj[options];
+            return method.apply(toolbarObj, $.makeArray(arguments).slice(1));
+        }
+    };
+
+    $.fn.toolbar.options = {
+        content: '#myContent',
+        position: 'top',
+        hideOnClick: false,
+        zIndex: 120,
+        hover: false,
+        style: 'default',
+        animation: 'standard',
+        adjustment: 10
+    };
+
+}) ( jQuery, window, document );
--- a/resources/shop/js/include/uploader.js
+++ b/resources/shop/js/include/uploader.js
@@ -0,0 +1,109 @@
+function renderUploaderFiler(index, the_file, selector, uploadRoute, extensions, chooseText, that) {
+	$(selector + ' input[name="files[]"]').filer({
+		showThumbs: true,
+		addMore: true,
+		allowDuplicates: false,
+		limit: 1,
+		maxSize: null,
+		changeInput: '<div class="jFiler-input-dragDrop nomargin-bottom contract-file-upload required pointer p-2 w-100">\
+						<div class="jFiler-input-inner">\
+							<div class="jFiler-input-icon">\
+								<i class="icon-jfi-folder"></i>\
+							</div>\
+							<div class="jFiler-input-text">\
+								<h3>'+chooseText+'</h3>\
+							</div>\
+						</div>\
+					</div>',
+		extensions: extensions,
+		uploadFile: {
+			url: laroute.route(uploadRoute),
+			data: {
+				action: 'upload',
+				extensions: extensions,
+				sub_folder: that.subFolder
+			},
+			type: 'POST',
+			enctype: 'multipart/form-data',
+			synchron: true,
+			beforeSend: function() {
+				that.activeJConfirmButtons(false);
+				$(selector + ' .contract-file-upload').hide();
+			},
+			success: function(data, itemEl, listEl, boxEl, newInputEl, inputEl, id) {
+				// console.log('upload');
+				// console.log(data);
+				// console.log(id);
+				// var index = getIndexOf(that.currentSelected, the_file.id);
+				// var parent = itemEl.find(".jFiler-jProgressBar").parent();
+				var new_file_name = JSON.parse(data);
+				var filerKit = inputEl.prop("jFiler");
+				filerKit.files_list[id].name = new_file_name;
+				itemEl.find(".jFiler-jProgressBar").fadeOut("slow");
+				that.createFile(itemEl, index, new_file_name);
+			},
+			error: function(el) {
+				el.find(".jFiler-jProgressBar").fadeOut("slow");
+				el.find('.jFiler-item-others').html('\
+					<span><i class="glyph-icon icon-file"></i> <b>'+translate.getText.type+':</b> '+strtoupper(new_file_name.extension)+'</span>\
+					<div class="current-status text-error"><i class="icon-jfi-minus-circle"></i></div>\
+				');
+			},
+			statusCode: null,
+			onProgress: null,
+			onComplete: function() {
+				that.activeJConfirmButtons(true);
+			}
+		},
+		files: null,
+		clipBoardPaste: true,
+		excludeName: null,
+		beforeRender: null,
+		afterRender: null,
+		beforeShow: null,
+		beforeSelect: null,
+		onSelect: null,
+		afterShow: null,
+		onRemove: function(itemEl, file, id, listEl, boxEl, newInputEl, inputEl) {
+			var index = getIndexOf(that.currentSelected, the_file.id);
+			that.currentSelected[index].pdfFile = {};
+			$(selector + ' .contract-file-upload').show();
+		},
+		onEmpty: null,
+		options: null,
+		dialogs: {
+			alert: function(text) {
+				$.dialog({ title: translate.getText.warning, content: text });
+			},
+			confirm: function (text, callback) {
+				$.confirm({
+					title: translate.getText.warning,
+					content: text,
+					buttons: {
+						confirm: {
+							text: translate.getText.confirm,
+							btnClass: 'btn-danger',
+							action: function() {
+								callback()
+							}
+						},
+						cancel: {
+							text: translate.getText.cancel
+						}
+					}
+				});
+			}
+		},
+		captions: {
+			button: translate.getText.choose_files,
+			feedback: "",
+			feedback2: translate.getText.selected_files,
+			removeConfirmation: translate.getText.are_you_sure_you_want_to_remove_this_file,
+			errors: {
+				filesLimit: translate.getText.file_number_authorized+": <b>{{fi-limit}}</b>",
+				filesType: translate.getText.file_extension_authorized+": <b>.{{fi-extensions}}</b>",
+				filesSize: translate.getText.file_max_size_authorized+": <b>{{fi-maxSize}} MB.</b>"
+			}
+		}
+	});
+}
--- a/resources/shop/js/include/url_on_tab.js
+++ b/resources/shop/js/include/url_on_tab.js
@@ -0,0 +1,11 @@
+// Javascript to enable link to tab
+var url = document.location.toString();
+if (url.match('#')) {
+	$('.nav-tabs a[href="#' + url.split('#')[1] + '"]').tab('show');
+} 
+
+// Change hash for page-reload
+$('.nav-tabs a').on('shown.bs.tab', function (e) {
+	window.location.hash = e.target.hash;
+	$(window).scrollTop(0);
+})
--- a/resources/shop/js/plugins/daterangepicker/fr.js
+++ b/resources/shop/js/plugins/daterangepicker/fr.js
@@ -0,0 +1,45 @@
+/* require moment.js */
+var dateRangePickerLanguage = {
+    format: "DD/MM/YYYY",
+    separator: " au ",
+    locale: {
+        applyLabel: "Valider",
+        cancelLabel: "Retour",
+        fromLabel: "Du",
+        toLabel: "Au",
+        customRangeLabel: "Personnalisé",
+        weekLabel: "S",
+        daysOfWeek: [
+            "Dim",
+            "Lun",
+            "Mar",
+            "Mer",
+            "Jeu",
+            "Ven",
+            "Sam"
+        ],
+        monthNames: [
+            "Jan",
+            "Fev",
+            "Mar",
+            "Avr",
+            "Mai",
+            "Juin",
+            "Juil",
+            "Aou",
+            "Sep",
+            "Oct",
+            "Nov",
+            "Déc"
+        ],
+        firstDay: 1
+    },
+    ranges: {
+        'Aujourd\'hui': [moment(), moment()],
+        'Hier': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
+        'La semaine dernière': [moment().subtract(6, 'days'), moment()],
+        '30 derniers jours': [moment().subtract(29, 'days'), moment()],
+        'Ce mois-ci': [moment().startOf('month'), moment().endOf('month')],
+        'Le mois dernier': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
+    }
+};
--- a/resources/shop/js/plugins/smooth_products/css/smoothproducts.css
+++ b/resources/shop/js/plugins/smooth_products/css/smoothproducts.css
@@ -0,0 +1,184 @@
+/* Needed for the lightbox */
+
+html, body {
+	height: 100%;
+	width: 100%;
+}
+
+/* CSS for the loading div */
+
+.sp-loading {
+	text-align: center;
+	max-width: 270px;
+	padding: 15px;
+	border: 5px solid #eee;
+	border-radius: 3px;
+	font-size: 12px;
+	color: #888;
+}
+
+/* Element wrapper */
+
+.sp-wrap {
+	display: none;
+	line-height: 0;
+	font-size: 0;
+	background: #eee;
+	border: 5px solid #eee;
+	border-radius: 3px;
+	position: relative;
+	margin: 0 25px 15px 0;
+	float: left;
+	/**************
+	  Set max-width to your thumbnail width
+	***************/
+	
+	max-width: 480px;
+}
+
+/* Thumbnails */
+
+.sp-thumbs {
+	text-align: left;
+	display: inline-block;
+}
+.sp-thumbs img {
+	min-height: 50px;
+	min-width: 50px;
+	max-width: 50px;
+}
+.sp-thumbs a:link, .sp-thumbs a:visited {
+	width: 50px;
+	height: 50px;
+	overflow: hidden;
+	opacity: .3;
+	display: inline-block;
+	background-size: cover;
+	background-position: center;
+	-webkit-transition: all .2s ease-out;
+	-moz-transition: all .2s ease-out;
+	-ms-transition: all .2s ease-out;
+	-o-transition: all .2s ease-out;
+	transition: all .2s ease-out;
+}
+.sp-thumbs a:hover {
+	opacity: 1;
+}
+
+/* Styles for the currently selected thumbnail */
+
+.sp-thumbs a:active, .sp-current {
+	opacity: 1!important;
+	position: relative;
+}
+
+/* Image currently being viewed */
+
+.sp-large {
+	position: relative;
+	overflow: hidden;
+	top: 0;
+	left: 0;
+}
+.sp-large a img {
+	max-width: 100%;
+	height: auto;
+}
+.sp-large a {
+	display: block;
+}
+
+/* Panning Zoomed Image */
+
+.sp-zoom {
+	position: absolute;
+	left: -50%;
+	top: -50%;
+	cursor: -webkit-zoom-in;
+	cursor: -moz-zoom-in;
+	cursor: zoom-in;
+	display: none;
+}
+/* Lightbox */
+
+.sp-lightbox {
+	position: fixed;
+	top: 0;
+	left: 0;
+	height: 100%;
+	width: 100%;
+	background: rgb(0, 0, 0);
+	background: rgba(0, 0, 0, .9);
+	z-index: 500;
+	display: none;
+	cursor: pointer;
+}
+.sp-lightbox img {
+	position: absolute;
+	margin: auto;
+	top: 0;
+	bottom: 0;
+	left: 0;
+	right: 0;
+	max-width: 90%;
+	max-height: 90%;
+	border: 2px solid #fff;
+}
+#sp-prev, #sp-next {
+	position: absolute;
+	top: 50%;
+	margin-top: -25px;
+	z-index: 501;
+	color: #fff;
+	padding: 14px;
+	text-decoration: none;
+	background: #000;
+	border-radius: 25px;
+	border: 2px solid #fff;
+	width: 50px;
+	height: 50px;
+	box-sizing: border-box;
+	transition: .2s;
+	-webkit-transition: .2s;
+	-moz-transition: .2s;
+	-ms-transition: .2s;
+	-o-transition: .2s;
+}
+#sp-prev {
+	left: 10px;
+}
+#sp-prev:before {
+	content: '';
+	border: 7px solid transparent;
+	border-right: 15px solid #fff;
+	position: absolute;
+	top: 16px;
+	left: 7px;
+}
+#sp-next {
+	right: 10px;
+}
+#sp-next:before {
+	content: '';
+	border: 7px solid transparent;
+	border-left: 15px solid white;
+	position: absolute;
+	top: 16px;
+	left: 18px;
+}
+#sp-prev:hover, #sp-next:hover {
+	background: #444;
+}
+
+/* Tweak styles for small viewports */
+
+@media screen and (max-width: 400px) {
+	.sp-wrap {
+		margin: 0 0 15px 0;
+	}
+	#sp-prev, #sp-next {
+		top: auto;
+		margin-top: 0;
+		bottom: 25px;
+	}
+}
--- a/resources/shop/js/plugins/smooth_products/js/smoothproducts.js
+++ b/resources/shop/js/plugins/smooth_products/js/smoothproducts.js
@@ -0,0 +1,274 @@
+/*
+ * Smoothproducts version 2.0.2
+ * http://kthornbloom.com/smoothproducts.php
+ *
+ * Copyright 2013, Kevin Thornbloom
+ * Free to use and abuse under the MIT license.
+ * http://www.opensource.org/licenses/mit-license.php
+ */
+
+(function($) {
+	$.fn.extend({
+		deleteSmoothProducts: function () {
+			$(document.body).off('click', '.sp-lightbox');
+			$(document.body).off('click', '#sp-prev');
+			$(document.body).off('click', '#sp-next');
+			$(document.body).off('click', '.sp-large a');
+			$(document.body).off('click', '.sp-noff-touch .sp-zoom');
+			$(document.body).off('click', '.sp-tb-active a');
+			$(document.body).off('click', '.sp-thumbs');
+		},
+		smoothproducts: function() {
+
+			// Add some markup & set some CSS
+
+			$('.sp-loading').hide();
+			$('.sp-wrap').each(function() {
+				$(this).addClass('sp-touch');
+				var thumbQty = $('a', this).length;
+
+				// If more than one image
+				if (thumbQty > 1) {
+					var firstLarge,firstThumb,
+						defaultImage = $('a.sp-default', this)[0]?true:false;
+					$(this).append('<div class="sp-large"></div><div class="sp-thumbs sp-tb-active"></div>');
+					$('a', this).each(function(index) {
+						var thumb = $('img', this).attr('src'),
+							large = $(this).attr('href'),
+							classes = '';
+						//set default image
+						if((index === 0 && !defaultImage) || $(this).hasClass('sp-default')){
+							classes = ' class="sp-current"';
+							firstLarge = large;
+							firstThumb = $('img', this)[0].src;
+						}
+						$(this).parents('.sp-wrap').find('.sp-thumbs').append('<a href="' + large + '" style="background-image:url(' + thumb + ')"'+classes+'></a>');
+						$(this).remove();
+					});
+					$('.sp-large', this).append('<a href="' + firstLarge + '" class="sp-current-big"><img src="' + firstThumb + '" alt="" /></a>');
+					$('.sp-wrap').css('display', 'inline-block');
+				// If only one image
+				} else {
+					$(this).append('<div class="sp-large"></div>');
+					$('a', this).appendTo($('.sp-large', this)).addClass('.sp-current-big');
+					$('.sp-wrap').css('display', 'inline-block');
+				}
+			});
+
+
+			// Prevent clicking while things are happening
+			$(document.body).on('click', '.sp-thumbs', function(event) {
+				event.preventDefault();
+			});
+
+
+			// Is this a touch screen or not?
+			$(document.body).on('mouseover', function(event) {
+				$('.sp-wrap').removeClass('sp-touch').addClass('sp-non-touch');
+				event.preventDefault();
+			});
+
+			$(document.body).on('touchstart', function() {
+				$('.sp-wrap').removeClass('sp-non-touch').addClass('sp-touch');
+			});
+
+			// Clicking a thumbnail
+			$(document.body).on('click', '.sp-tb-active a', function(event) {
+
+				event.preventDefault();
+				$(this).parent().find('.sp-current').removeClass();
+				$(this).addClass('sp-current');
+				$(this).parents('.sp-wrap').find('.sp-thumbs').removeClass('sp-tb-active');
+				$(this).parents('.sp-wrap').find('.sp-zoom').remove();
+
+				var currentHeight = $(this).parents('.sp-wrap').find('.sp-large').height(),
+					currentWidth = $(this).parents('.sp-wrap').find('.sp-large').width();
+				$(this).parents('.sp-wrap').find('.sp-large').css({
+					overflow: 'hidden',
+					height: currentHeight + 'px',
+					width: currentWidth + 'px'
+				});
+
+				$(this).addClass('sp-current').parents('.sp-wrap').find('.sp-large a').remove();
+
+				var nextLarge = $(this).parent().find('.sp-current').attr('href'),
+					nextThumb = get_url_from_background($(this).parent().find('.sp-current').css('backgroundImage'));
+
+				$(this).parents('.sp-wrap').find('.sp-large').html('<a href="' + nextLarge + '" class="sp-current-big"><img src="' + nextThumb + '"/></a>');
+				$(this).parents('.sp-wrap').find('.sp-large').hide().fadeIn(250, function() {
+
+					var autoHeight = $(this).parents('.sp-wrap').find('.sp-large img').height();
+
+					$(this).parents('.sp-wrap').find('.sp-large').animate({
+						height: autoHeight
+					}, 'fast', function() {
+						$('.sp-large').css({
+							height: 'auto',
+							width: 'auto'
+						});
+					});
+
+					$(this).parents('.sp-wrap').find('.sp-thumbs').addClass('sp-tb-active');
+				});
+			});
+
+			// Zoom In non-touch
+			$(document.body).on('mouseenter', '.sp-non-touch .sp-large', function(event) {
+				var largeUrl = $('a', this).attr('href');
+				$(this).append('<div class="sp-zoom"><img src="' + largeUrl + '"/></div>');
+				$(this).find('.sp-zoom').fadeIn(250);
+				event.preventDefault();
+			});
+
+			// Zoom Out non-touch
+			$(document.body).on('mouseleave', '.sp-non-touch .sp-large', function(event) {
+				$(this).find('.sp-zoom').fadeOut(250, function() {
+					$(this).remove();
+				});
+				event.preventDefault();
+			});
+
+			// Open in Lightbox non-touch
+			$(document.body).on('click', '.sp-non-touch .sp-zoom', function(event) {
+				var currentImg = $(this).html(),
+					thumbAmt = $(this).parents('.sp-wrap').find('.sp-thumbs a').length,
+					currentThumb = ($(this).parents('.sp-wrap').find('.sp-thumbs .sp-current').index())+1;
+				$(this).parents('.sp-wrap').addClass('sp-selected');
+				$('body').append("<div class='sp-lightbox' data-currenteq='"+currentThumb+"'>" + currentImg + "</div>");
+
+				if(thumbAmt > 1){
+					$('.sp-lightbox').append("<a href='#' id='sp-prev'></a><a href='#' id='sp-next'></a>");
+					if(currentThumb == 1) {
+						$('#sp-prev').css('opacity','.1');
+					} else if (currentThumb == thumbAmt){
+						$('#sp-next').css('opacity','.1');
+					}
+				}
+				$('.sp-lightbox').fadeIn();
+				event.preventDefault();
+			});
+
+			// Open in Lightbox touch
+			$(document.body).on('click', '.sp-large a', function(event) {
+				var currentImg = $(this).attr('href'),
+					thumbAmt = $(this).parents('.sp-wrap').find('.sp-thumbs a').length,
+					currentThumb = ($(this).parents('.sp-wrap').find('.sp-thumbs .sp-current').index())+1;
+
+				$(this).parents('.sp-wrap').addClass('sp-selected');
+				$('body').append('<div class="sp-lightbox" data-currenteq="'+currentThumb+'"><img src="' + currentImg + '"/></div>');
+
+				if(thumbAmt > 1){
+					$('.sp-lightbox').append("<a href='#' id='sp-prev'></a><a href='#' id='sp-next'></a>");
+					if(currentThumb == 1) {
+						$('#sp-prev').css('opacity','.1');
+					} else if (currentThumb == thumbAmt){
+						$('#sp-next').css('opacity','.1');
+					}
+				}
+				$('.sp-lightbox').fadeIn();
+				event.preventDefault();
+			});
+
+			// Pagination Forward
+			$(document.body).on('click', '#sp-next', function(event) {
+				event.stopPropagation();
+				var currentEq = $('.sp-lightbox').data('currenteq'),
+					totalItems = $('.sp-selected .sp-thumbs a').length;
+
+					if(currentEq >= totalItems) {
+					} else {
+						var nextEq = currentEq + 1,
+						newImg = $('.sp-selected .sp-thumbs').find('a:eq('+currentEq+')').attr('href'),
+						newThumb = get_url_from_background($('.sp-selected .sp-thumbs').find('a:eq('+currentEq+')').css('backgroundImage'));
+						if (currentEq == (totalItems - 1)) {
+							$('#sp-next').css('opacity','.1');
+						}
+						$('#sp-prev').css('opacity','1');
+						$('.sp-selected .sp-current').removeClass();
+						$('.sp-selected .sp-thumbs a:eq('+currentEq+')').addClass('sp-current');
+						$('.sp-selected .sp-large').empty().append('<a href='+newImg+'><img src="'+newThumb+'"/></a>');
+						$('.sp-lightbox img').fadeOut(250, function() {
+							$(this).remove();
+							$('.sp-lightbox').data('currenteq',nextEq).append('<img src="'+newImg+'"/>');
+							$('.sp-lightbox img').hide().fadeIn(250);
+						});
+					}
+
+				event.preventDefault();
+			});
+
+		// Pagination Backward
+			$(document.body).on('click', '#sp-prev', function(event) {
+
+				event.stopPropagation();
+				var currentEq = $('.sp-lightbox').data('currenteq'),
+					currentEq = currentEq - 1;
+					if(currentEq <= 0) {
+					} else {
+						if (currentEq == 1) {
+							$('#sp-prev').css('opacity','.1');
+						}
+						var nextEq = currentEq - 1,
+						newImg = $('.sp-selected .sp-thumbs').find('a:eq('+nextEq+')').attr('href'),
+						newThumb = get_url_from_background($('.sp-selected .sp-thumbs').find('a:eq('+nextEq+')').css('backgroundImage'));
+						$('#sp-next').css('opacity','1');
+						$('.sp-selected .sp-current').removeClass();
+						$('.sp-selected .sp-thumbs a:eq('+nextEq+')').addClass('sp-current');
+						$('.sp-selected .sp-large').empty().append('<a href='+newImg+'><img src="'+newThumb+'"/></a>');
+						$('.sp-lightbox img').fadeOut(250, function() {
+							$(this).remove();
+							$('.sp-lightbox').data('currenteq',currentEq).append('<img src="'+newImg+'"/>');
+							$('.sp-lightbox img').hide().fadeIn(250);
+						});
+					}
+				event.preventDefault();
+			});
+
+
+			// Close Lightbox
+			$(document.body).on('click', '.sp-lightbox', function() {
+				closeModal();
+			});
+
+			// Close on Esc
+			$(document).keydown(function(e) {
+				if (e.keyCode == 27) {
+					closeModal();
+					return false;
+				}
+			});
+
+			function closeModal (){
+				$('.sp-selected').removeClass('sp-selected');
+				$('.sp-lightbox').fadeOut(function() {
+						$(this).remove();
+				});
+			}
+
+
+			// Panning zoomed image (non-touch)
+
+			$('.sp-large').mousemove(function(e) {
+				var viewWidth = $(this).width(),
+					viewHeight = $(this).height(),
+					viewOffset = $(this).offset(),
+					largeWidth = $(this).find('.sp-zoom').width(),
+					largeHeight = $(this).find('.sp-zoom').height(),
+					relativeXPosition = (e.pageX - viewOffset.left),
+					relativeYPosition = (e.pageY - viewOffset.top),
+					moveX = Math.floor((relativeXPosition * (viewWidth - largeWidth) / viewWidth)),
+					moveY = Math.floor((relativeYPosition * (viewHeight - largeHeight) / viewHeight));
+
+				$(this).find('.sp-zoom').css({
+					left: moveX,
+					top: moveY
+				});
+
+			});
+
+			function get_url_from_background(bg){
+				return bg.match(/url\([\"\']{0,1}(.+)[\"\']{0,1}\)+/i)[1];
+			}
+		}
+	});
+})(jQuery);
--- a/resources/shop/js/plugins/smooth_products/js/smoothproducts.min.js
+++ b/resources/shop/js/plugins/smooth_products/js/smoothproducts.min.js
--- a/resources/shop/js/site.js
+++ b/resources/shop/js/site.js
@@ -0,0 +1,17 @@
+// Prevent closing from click inside dropdown
+$(document).on('click', '.dropdown-menu', function (e) {
+	e.stopPropagation();
+});
+  
+// make it as accordion for smaller screens
+if ($(window).width() < 992) {
+	$('.dropdown-menu a').click(function(e) {
+		e.preventDefault();
+		if ($(this).next('.submenu').length) {
+			$(this).next('.submenu').toggle();
+		}
+		$('.dropdown').on('hide.bs.dropdown', function () {
+			$(this).find('.submenu').hide();
+		});
+	});
+}
--- a/resources/shop/js/taxonomy-browser.js
+++ b/resources/shop/js/taxonomy-browser.js
@@ -0,0 +1,520 @@
+/*!
+ * Fancytree Taxonomy Browser
+ *
+ * Copyright (c) 2015, Martin Wendt (https://wwWendt.de)
+ *
+ * Released under the MIT license
+ * https://github.com/mar10/fancytree/wiki/LicenseInfo
+ *
+ * @version @VERSION
+ * @date @DATE
+ */
+
+/* global Handlebars */
+/* eslint-disable no-console */
+
+(function($, window, document) {
+	"use strict";
+
+	/*******************************************************************************
+	 * Private functions and variables
+	 */
+
+	var taxonTree,
+		searchResultTree,
+		tmplDetails,
+		tmplInfoPane,
+		tmplMedia,
+		timerMap = {},
+		USER_AGENT = "Fancytree Taxonomy Browser/1.0",
+		GBIF_URL = "//api.gbif.org/v1/",
+		TAXONOMY_KEY = "d7dddbf4-2cf0-4f39-9b2a-bb099caae36c", // GBIF backbone taxonomy
+		SEARCH_PAGE_SIZE = 5,
+		CHILD_NODE_PAGE_SIZE = 200,
+		glyphOpts = {
+			preset: "bootstrap3",
+			map: {
+				expanderClosed: "glyphicon glyphicon-menu-right", // glyphicon-plus-sign
+				expanderLazy: "glyphicon glyphicon-menu-right", // glyphicon-plus-sign
+				expanderOpen: "glyphicon glyphicon-menu-down", // glyphicon-collapse-down
+			},
+		};
+
+	// Load and compile handlebar templates
+
+	$.get("details.tmpl.html", function(data) {
+		tmplDetails = Handlebars.compile(data);
+		Handlebars.registerPartial("tmplDetails", tmplDetails);
+	});
+	$.get("media.tmpl.html", function(data) {
+		tmplMedia = Handlebars.compile(data);
+		Handlebars.registerPartial("tmplMedia", tmplMedia);
+	});
+	$.get("info-pane.tmpl.html", function(data) {
+		tmplInfoPane = Handlebars.compile(data);
+	});
+
+	/** Update UI elements according to current status
+	 */
+	function updateControls() {
+		var query = $.trim($("input[name=query]").val());
+
+		$("#btnPin").attr("disabled", !taxonTree.getActiveNode());
+		$("#btnUnpin")
+			.attr("disabled", !taxonTree.isFilterActive())
+			.toggleClass("btn-success", taxonTree.isFilterActive());
+		$("#btnResetSearch").attr("disabled", query.length === 0);
+		$("#btnSearch").attr("disabled", query.length < 2);
+	}
+
+	/**
+	 * Invoke callback after `ms` milliseconds.
+	 * Any pending action of this type is cancelled before.
+	 */
+	function _delay(tag, ms, callback) {
+		/*jshint -W040:true */
+		var self = this;
+
+		tag = "" + (tag || "default");
+		if (timerMap[tag] != null) {
+			clearTimeout(timerMap[tag]);
+			delete timerMap[tag];
+			// console.log("Cancel timer '" + tag + "'");
+		}
+		if (ms == null || callback == null) {
+			return;
+		}
+		// console.log("Start timer '" + tag + "'");
+		timerMap[tag] = setTimeout(function() {
+			// console.log("Execute timer '" + tag + "'");
+			callback.call(self);
+		}, +ms);
+	}
+
+	/**
+	 */
+	function _callWebservice(cmd, data) {
+		return $.ajax({
+			url: GBIF_URL + cmd,
+			data: $.extend({}, data),
+			cache: true,
+			headers: { "Api-User-Agent": USER_AGENT },
+			dataType: "jsonp",
+		});
+	}
+
+	/**
+	 */
+	function updateItemDetails(key) {
+		$("#tmplDetails").addClass("busy");
+		$.bbq.pushState({ key: key });
+
+		$.when(
+			_callWebservice("species/" + key),
+			_callWebservice("species/" + key + "/speciesProfiles"),
+			_callWebservice("species/" + key + "/synonyms"),
+			_callWebservice("species/" + key + "/descriptions"),
+			_callWebservice("species/" + key + "/media")
+		).done(function(species, profiles, synonyms, descriptions, media) {
+			// Requests are resolved as: [ data, statusText, jqXHR ]
+			species = species[0];
+			profiles = profiles[0];
+			synonyms = synonyms[0];
+			descriptions = descriptions[0];
+			media = media[0];
+
+			var info = $.extend(species, {
+				profileList: profiles.results, // marine, extinct
+				profile:
+					profiles.results.length === 1 ? profiles.results[0] : null, // marine, extinct
+				synonyms: synonyms.results,
+				descriptions: descriptions.results,
+				descriptionsByLang: {},
+				media: media.results,
+				now: new Date().toString(),
+			});
+
+			$.each(info.descriptions, function(i, o) {
+				if (!info.descriptionsByLang[o.language]) {
+					info.descriptionsByLang[o.language] = [];
+				}
+				info.descriptionsByLang[o.language].push(o);
+			});
+
+			console.log("updateItemDetails", info);
+			$("#tmplDetails")
+				// .html(tmplDetails(info))
+				.removeClass("busy");
+			$("#tmplMedia")
+				// .html(tmplMedia(info))
+				.removeClass("busy");
+			$("#tmplInfoPane")
+				.html(tmplInfoPane(info))
+				.removeClass("busy");
+
+			$("[data-toggle='popover']").popover();
+			$(".carousel").carousel();
+			$("#mediaCounter").text("" + (media.results.length || ""));
+			// $("[data-toggle='collapse']").collapse();
+			updateControls();
+		});
+	}
+
+	/**
+	 */
+	function updateBreadcrumb(key, loadTreeNodes) {
+		var $ol = $("ol.breadcrumb").addClass("busy"),
+			activeNode = taxonTree.getActiveNode();
+
+		if (activeNode && activeNode.key !== key) {
+			activeNode.setActive(false); // deactivate, in case the new key is not found
+		}
+		$.when(
+			_callWebservice("species/" + key + "/parents"),
+			_callWebservice("species/" + key)
+		).done(function(parents, node) {
+			// Both requests resolved (result format: [ data, statusText, jqXHR ])
+			var nodeList = parents[0],
+				keyList = [];
+
+			nodeList.push(node[0]);
+
+			// Display as <OL> list (for Bootstrap breadcrumbs)
+			$ol.empty().removeClass("busy");
+			$.each(nodeList, function(i, o) {
+				var name = o.vernacularName || o.canonicalName;
+				keyList.push(o.key);
+				if ("" + o.key === "" + key) {
+					$ol.append(
+						$("<li class='active'>").append(
+							$("<span>", {
+								text: name,
+								title: o.rank,
+							})
+						)
+					);
+				} else {
+					$ol.append(
+						$("<li>").append(
+							$("<a>", {
+								href: "#key=" + o.key,
+								text: name,
+								title: o.rank,
+							})
+						)
+					);
+				}
+			});
+			if (loadTreeNodes) {
+				// console.log("updateBreadcrumb - loadKeyPath", keyList);
+				taxonTree.loadKeyPath("/" + keyList.join("/"), function(
+					n,
+					status
+				) {
+					// console.log("... updateBreadcrumb - loadKeyPath " + n.title + ": " + status);
+					switch (status) {
+						case "loaded":
+							n.makeVisible();
+							break;
+						case "ok":
+							n.setActive();
+							// n.makeVisible();
+							break;
+					}
+				});
+			}
+		});
+	}
+
+	/**
+	 */
+	function search(query) {
+		query = $.trim(query);
+		console.log("searching for '" + query + "'...");
+		// Store the source options for optional paging
+		searchResultTree.lastSourceOpts = {
+			// url: GBIF_URL + "species/match",  // Fuzzy matches scientific names against the GBIF Backbone Taxonomy
+			url: GBIF_URL + "species/search", // Full text search of name usages covering the scientific and vernacular name, the species description, distribution and the entire classification across all name usages of all or some checklists
+			data: {
+				q: query,
+				datasetKey: TAXONOMY_KEY,
+				// name: query,
+				// strict: "true",
+				// hl: true,
+				limit: SEARCH_PAGE_SIZE,
+				offset: 0,
+			},
+			cache: true,
+			// headers: { "Api-User-Agent": USER_AGENT }
+			// dataType: "jsonp"
+		};
+		$("#searchResultTree").addClass("busy");
+		searchResultTree
+			.reload(searchResultTree.lastSourceOpts)
+			.done(function(result) {
+				// console.log("search returned", result);
+				if (result.length < 1) {
+					searchResultTree.getRootNode().setStatus("nodata");
+				}
+				$("#searchResultTree").removeClass("busy");
+
+				// https://github.com/tbasse/jquery-truncate
+				// SLOW!
+				// $("div.truncate").truncate({
+				// 	multiline: true
+				// });
+
+				updateControls();
+			});
+	}
+
+	/*******************************************************************************
+	 * Pageload Handler
+	 */
+
+	$(function() {
+		$("#taxonTree").fancytree({
+			extensions: ["filter", "glyph", "wide"],
+			filter: {
+				mode: "hide",
+			},
+			glyph: glyphOpts,
+			autoCollapse: true,
+			activeVisible: true,
+			autoScroll: true,
+			source: {
+				url: GBIF_URL + "species/root/" + TAXONOMY_KEY,
+				data: {},
+				cache: true,
+				// dataType: "jsonp"
+			},
+			init: function(event, data) {
+				updateControls();
+				$(window).trigger("hashchange"); // trigger on initial page load
+			},
+			lazyLoad: function(event, data) {
+				data.result = {
+					url: GBIF_URL + "species/" + data.node.key + "/children",
+					data: {
+						limit: CHILD_NODE_PAGE_SIZE,
+					},
+					cache: true,
+					// dataType: "jsonp"
+				};
+				// store this request options for later paging
+				data.node.lastSourceOpts = data.result;
+			},
+			postProcess: function(event, data) {
+				var response = data.response;
+
+				data.node.info("taxonTree postProcess", response);
+				data.result = $.map(response.results, function(o) {
+					return (
+						o && {
+							title: o.vernacularName || o.canonicalName,
+							key: o.key,
+							nubKey: o.nubKey,
+							folder: true,
+							lazy: true,
+						}
+					);
+				});
+				if (response.endOfRecords === false) {
+					// Allow paging
+					data.result.push({
+						title: "(more)",
+						statusNodeType: "paging",
+					});
+				} else {
+					// No need to store the extra data
+					delete data.node.lastSourceOpts;
+				}
+			},
+			activate: function(event, data) {
+				$("#tmplDetails").addClass("busy");
+				$("ol.breadcrumb").addClass("busy");
+				updateControls();
+				_delay("showDetails", 500, function() {
+					updateItemDetails(data.node.key);
+					updateBreadcrumb(data.node.key);
+				});
+			},
+			clickPaging: function(event, data) {
+				// Load the next page of results
+				var source = $.extend(
+					true,
+					{},
+					data.node.parent.lastSourceOpts
+				);
+				source.data.offset = data.node.parent.countChildren() - 1;
+				data.node.replaceWith(source);
+			},
+		});
+
+		$("#searchResultTree").fancytree({
+			extensions: ["table", "wide"],
+			source: [{ title: "No Results." }],
+			minExpandLevel: 2,
+			icon: false,
+			table: {
+				nodeColumnIdx: 2,
+			},
+			postProcess: function(event, data) {
+				var response = data.response;
+
+				data.node.info("search postProcess", response);
+				data.result = $.map(response.results, function(o) {
+					var res = $.extend(
+						{
+							title: o.scientificName,
+							key: o.key,
+						},
+						o
+					);
+					return res;
+				});
+				// Append paging link
+				if (
+					response.count != null &&
+					response.offset + response.limit < response.count
+				) {
+					data.result.push({
+						title:
+							"(" +
+							(response.count -
+								response.offset -
+								response.limit) +
+							" more)",
+						statusNodeType: "paging",
+					});
+				}
+				data.node.info("search postProcess 2", data.result);
+			},
+			// loadChildren: function(event, data) {
+			// 	$("#searchResultTree td div.cell").truncate({
+			// 		multiline: true
+			// 	});
+			// },
+			renderColumns: function(event, data) {
+				var i,
+					node = data.node,
+					$tdList = $(node.tr).find(">td"),
+					cnList = node.data.vernacularNames
+						? $.map(node.data.vernacularNames, function(o) {
+								return o.vernacularName;
+						  })
+						: [];
+
+				i = 0;
+				function _setCell($cell, text) {
+					$("<div class='truncate'>")
+						.attr("title", text)
+						.text(text)
+						.appendTo($cell);
+				}
+				$tdList.eq(i++).text(node.key);
+				$tdList.eq(i++).text(node.data.rank);
+				i++; // #1: node.title = scientificName
+				// $tdList.eq(i++).text(cnList.join(", "));
+				_setCell($tdList.eq(i++), cnList.join(", "));
+				$tdList.eq(i++).text(node.data.canonicalName);
+				// $tdList.eq(i++).text(node.data.accordingTo);
+				_setCell($tdList.eq(i++), node.data.accordingTo);
+				$tdList.eq(i++).text(node.data.taxonomicStatus);
+				$tdList.eq(i++).text(node.data.nameType);
+				$tdList.eq(i++).text(node.data.numOccurrences);
+				$tdList.eq(i++).text(node.data.numDescendants);
+				// $tdList.eq(i++).text(node.data.authorship);
+				_setCell($tdList.eq(i++), node.data.authorship);
+				// $tdList.eq(i++).text(node.data.publishedIn);
+				_setCell($tdList.eq(i++), node.data.publishedIn);
+			},
+			activate: function(event, data) {
+				if (data.node.isStatusNode()) {
+					return;
+				}
+				_delay("activateNode", 500, function() {
+					updateItemDetails(data.node.key);
+					updateBreadcrumb(data.node.key);
+				});
+			},
+			clickPaging: function(event, data) {
+				// Load the next page of results
+				var source = $.extend(
+					true,
+					{},
+					searchResultTree.lastSourceOpts
+				);
+				source.data.offset = data.node.parent.countChildren() - 1;
+				data.node.replaceWith(source);
+			},
+		});
+
+		taxonTree = $.ui.fancytree.getTree("#taxonTree");
+		searchResultTree = $.ui.fancytree.getTree("#searchResultTree");
+
+		// Bind a callback that executes when document.location.hash changes.
+		// (This code uses bbq: https://github.com/cowboy/jquery-bbq)
+		$(window).on("hashchange", function(e) {
+			var key = $.bbq.getState("key");
+			console.log("bbq key", key);
+			if (key) {
+				updateBreadcrumb(key, true);
+			}
+		}); // don't trigger now, since we need the the taxonTree root nodes to be loaded first
+
+		$("input[name=query]")
+			.on("keyup", function(e) {
+				var query = $.trim($(this).val()),
+					lastQuery = $(this).data("lastQuery");
+
+				if ((e && e.which === $.ui.keyCode.ESCAPE) || query === "") {
+					$("#btnResetSearch").click();
+					return;
+				}
+				if (e && e.which === $.ui.keyCode.ENTER && query.length >= 2) {
+					$("#btnSearch").click();
+					return;
+				}
+				if (query === lastQuery || query.length < 2) {
+					console.log("Ignored query '" + query + "'");
+					return;
+				}
+				$(this).data("lastQuery", query);
+				_delay("search", 1, function() {
+					$("#btnSearch").click();
+				});
+				$("#btnResetSearch").attr("disabled", query.length === 0);
+				$("#btnSearch").attr("disabled", query.length < 2);
+			})
+			.focus();
+
+		$("#btnResetSearch").click(function(e) {
+			$("#searchResultPane").collapse("hide");
+			$("input[name=query]").val("");
+			searchResultTree.clear();
+			updateControls();
+		});
+
+		$("#btnSearch")
+			.click(function(event) {
+				$("#searchResultPane").collapse("show");
+				search($("input[name=query]").val());
+			})
+			.attr("disabled", true);
+
+		$("#btnPin").click(function(event) {
+			taxonTree.filterBranches(function(n) {
+				return n.isActive();
+			});
+			updateControls();
+		});
+
+		$("#btnUnpin").click(function(event) {
+			taxonTree.clearFilter();
+			updateControls();
+		});
+
+		// -----------------------------------------------------------------------------
+	}); // end of pageload handler
+})(jQuery, window, document);