{% extends 'base.html.twig' %}
{% block body_id 'configuratore-generazione-layer' %}
	
{% block loghi_testata %}
	{% include 'configuratore/blocchi/testata.html.twig' %}
{% endblock %}

{% block logo_cliente %}
{% set urlpath = 'configurator_cover' %}
{% include 'block/logocliente.html.twig' with {'url': urlpath} %}		

{% endblock %}

{% block body_class %}bg-{{ tipocodice}} no-zoom{% endblock %}
{% block title %}{{ 'Configurator'|trans }}{% endblock %}


{% block modal %}
{% include 'modal/modale3d.html.twig' %}
{% include 'modal/contenitori.html.twig' %}
{% include 'modal/message.html.twig' %}
{% include 'modal/attendere.html.twig' %}
{% include 'modal/configengine.html.twig' %}
<div class="md-overlay"></div>
<!-- the overlay element -->
{%  endblock %}
	

{% block quick_action %}{% endblock %}	
{% block  c4rg0_menuleft %}{% endblock %}

{% block primoblocco %}
<!-- Import maps polyfill -->
<!-- Remove this when import maps will be widely supported -->
<script async src="{{ asset('static/cloud.js/es-module-shims.js') }}"></script>

	<script type="importmap">
		{
			"imports": {
				"three": "{{ asset('static/cloud.js/lib/three.js/three.module.js') }}",
				"three/addons/": "{{ asset('static/cloud.js/lib/jsm/') }}"
			}
		}
	</script>    
	<div id="svgtooltip" display="none" style="position: absolute; display: none;"></div>
	{{ parent() }}
{% endblock %}
{% block stylesheets %}
    {{ parent() }}
{% endblock %}
{% block stylesheets_last %}
    {{ parent() }}
    <link rel="stylesheet" type="text/css" href="{{ asset('static/configuratore/css/configuratore.css?v=202309211822') }}" />
    <link rel="stylesheet" type="text/css" href="{{ asset('static/configuratore/css/svg.css?d=20220712') }}" />
    <link rel="stylesheet" type="text/css" href="{{ asset('static/configuratore/css/deepnest.css?d=20220712') }}" />
    <link rel="stylesheet" type="text/css" href="{{ asset('static/configuratore/css/style.css?d=20220712') }}" />

	<script src="{{ asset('static/svgpanzoom/svg-pan-zoom-rotate.js') }}"></script>

    <style>
        

#configbutton, #zoominbutton, #zoomoutbutton, #exitbutton {
    display: none;


    #configbutton, #zoominbutton, #zoomoutbutton, #exitbutton {
        display: none;
    }

    #svgnest .button {
        background-color: #22beef !important;        border-color: #22beef !important;        color: black !important;
    }
#info_time {
    min-height: 40px;
}

#svgtooltip {
  background: cornsilk;
  border: 1px solid black;
  border-radius: 5px;
  padding: 5px;
z-index: 100000;
background-color: black;
padding: 20px;
border-radius: 8px;
}

        </style>






{% endblock %}
{% block body %}

    <div id="content" class="col-md-12">
            <div class="row">


				{#	{% include 'block/headbar.html.twig' %} #}

					<div class="blocco-dati">        
						<div class="col-md-2">
							<section class="tile transparent">



								<section id="search-result" class="tile transparent">

									<div class="{{ msgclass|raw }}">
										{{ msg|raw }}
									</div>

								</section>
											
								<section class="tile transparent" id="selected-items-list">
									<div class="tile-header color transparent-black rounded-corners">
										{% if tipocodice == 'SO' %}
											{%set aliasurl = 'configuratore_so' %}
										{% elseif tipocodice == 'DO' %}
											{%set aliasurl = 'configuratore_do' %}
										{% else %}
											{%set aliasurl = 'configuratore_mo' %}
										{% endif %}
										<div class="codice-ordine tipo-alert"></div><a href="{{ path(aliasurl, {'op':'emo','code':b64codice,'salvato':origine}) }}"><div class="codice-ordine tipo-{{ tipocodice }}">{{ tipocodice }} - {{ codice }}</div></a>		  
										<div class="controls">
											<a href="#" class="minimize"><i class="fa fa-chevron-down fa-2x"></i></a>
											<a href="#" class="refresh"><i class="fa fa-refresh fa-2x"></i></a>
										</div>
									</div>
									<div class="tile-body color transparent-black rounded-corners">
										<div class="table-responsive">
										<div class="tile-body color transparent-black rounded-corners">
											<div class="tab-obj table-responsive">
												<div id="id-error-msg" class="error-red"></div>
												<div class="main-loading hidden-element" style="height: 100px">

														<div class="loading-wrap">
														  <div class="loading-bg">
															<div class="loading-loading">
															  <span class="title">loading</span>
															  <span class="text">c4rgo shape</span>
															  <span class="text2">metadata</span>
															</div>
														  </div>
														</div>
												</div>
												<div class="block-menu-filter menu-start menu-selezione-tipo-oggetti">
												<div>
													<div id="id-box-vol">
														<div class="friend-list col-md-12">
															<div class="box-vol box-vol-1 box-vol-inbound col-md-6" data-id="1">
																<div class="media esegui col-md-12" data-id="1" >
																	<div>
																		<button data-id="1" type="button" class="btn btn-hotpink btn-execute">
																			<img class="media-object " src="{{ asset('/static/c4rg0_themes/assets/images/icons/INBOUND_icoBNC_G.png') }}" alt="" width="30px">
																			<div>{{ 'IN BOUND'|trans }}</div>
																		</button>
																		<button data-id="1" type="button" class="btn btn-hotpink btn-config">
																			<i class="fas fa-gear"></i>
																		</button>
																	</div>
																</div>

															</div>
															<div class="box-vol box-vol-4 box-vol-v-shape col-md-6" data-id="4">
																<div class="media esegui col-md-12" data-id="4">
																	<div>
																		<button data-id="4" type="button" class="btn btn-greensea btn-execute">
																			<img class="media-object " src="{{ asset('/static/c4rg0_themes/assets/images/icons/REALE_icoBNC_G.png') }}" alt="" width="30px">
																			<div>{{ 'V-SHAPE'|trans }}</div>
																		</button>
																		<button data-id="4" type="button" class="btn btn-greensea btn-config">
																			<i class="fas fa-gear"></i>																		
																		</button>
																	</div>
																</div>
															</div>
														</div>
													</div>
													<div id="box-solution-settings" class="hidden-element" data-id="0">
														<div class="media open-settings col-md-12">
															<div class="col-md-12 open-settings-info">
																<div class="col-md-7 label">
																	{{ 'Spazio tra Oggetti'|trans }}
																</div>
																<div class="col-md-4 Spacing value">
																	&nbsp;
																</div>
																<div class="col-md-7 label">
																	{{ 'Distanza di Rispetto Bordo '|trans }}
																</div>
																<div class="col-md-4 SheetSpacing value">
																	&nbsp;
																</div>
																<div class="col-md-7 label">
																	{{ 'Rotazioni Oggetto '|trans }}
																</div>
																<div class="col-md-4 Rotations value">
																	&nbsp;
																</div>
																<div class="col-md-7 label">
																	{{ 'Tipo Ottimizzazione'|trans }}
																</div>
																<div class="col-md-4 PlacementTypeText value">
																	&nbsp;
																</div>
															</div>
															<div class="media open-settings-btn col-md-4">																	
															<!--	<a class="on-close-btn" href="{{ path('page_configc4rgo2dauto', {'tipocodice':'SO','b64codice':b64codice, 'default':'N', 'tipo':tipo}) }}"> -->
																	<button id="config-engine" data-id="4" type="button" class="btn">
																	<i class="fas fa-gear"></i>
																	<div>{{ 'Settings'|trans }}</div>
																	</button>
															<!--	</a>-->
													
															</div>
														</div>														
													</div>

												</div>
					
											</div>





											</div>
										</div>
										</div>
									</div>
								</section>  
								
								<section class="tile transparent" id="selected-items-list">
									<div class="tile-header color transparent-black rounded-corners">
										<div class="controls">
											<a href="#" class="minimize"><i class="fa fa-chevron-down fa-2x"></i></a>
											<a href="#" class="refresh"><i class="fa fa-refresh fa-2x"></i></a>
										</div>
									</div>
									<div class="tile-body color transparent-black rounded-corners">
									
												<!-- Contenedor -->
												<div class="accordion-space">
													<ul id="accordion" class="accordion">
	
													</ul>
												</div>								
									
									</div>
								</section>								


							</section>
						</div>
						<div class="col-md-10">
							<section class="tile transparent">
								<section id="msg-result" class="tile transparent">
									<div class="{{ msgclass|raw }}">
										{{ msg|raw }}
									</div>
								</section>								
								<section class="tile transparent hidden-element" id="selected-selection-box">
									<div class="tile-body color transparent-black rounded-corners">

									<ul class="nav nav-tabs tabdrop tab-container">		
										<li class="active master"><a href="#master-tab" data-toggle="tab">MASTER</a></li>
									</ul>
									</div>
								</section>
								<section class="tile transparent" id="gruppo-blocco-totali">
									<div class="tile-header color transparent-black rounded-corners">
										<div class="controls">
											<a href="#" class="minimize"><i class="fa fa-chevron-down fa-2x"></i></a>
											<a href="#" class="refresh"><i class="fa fa-refresh fa-2x"></i></a>
										</div>
									</div>
									<div class="tile-body color transparent-black rounded-corners">
										<div class="risultato-finale col-md-12 hidden-element">
											</div>

											<div class="col-md-4">
										{% include 'block/contenitore.html.twig'  with {'block_name':'blocco-trasporto','showpc':1,'showpcbar':0,'tipocodice':tipocodice,'codice':codice} %}	
									</div>
									<div class="col-md-8">

										{% include 'block/tot_and_counter.html.twig'  with {'block_name':'blocco-totali','showpc':1,'tipocodice':tipocodice,'b64codice':b64codice,'ap':'1'} %}	
										</div>
									</div>
								</section>

								<section class="tile transparent minimized iteml-list-graphics-elab " id="selected-svg">

									<div class="tile-header color transparent-black rounded-corners">
										<div class="controls-left">
											<span class="data-table-title">{{ 'Graphics Elaboration'|trans }}</span>
										</div>
										<div class="controls">

											<a href="#" class="minimize"><i class="fa fa-chevron-down fa-2x"></i></a>
											<a href="#" class="refresh"><i class="fa fa-refresh fa-2x"></i></a>
										</div>
									</div>
									<div class="tile-body color transparent-black rounded-corners">
											<div class="svg-responsive">
											<div class="tile-body color transparent-black rounded-corners">
												<div class="tab-obj svg-responsive">
													<div id="id-error-msg" class="error-red"></div>
													<div id="tooltip" display="none" style="position: absolute; display: none;"></div>


													<div class="perspective">

													<label class="tab" for="tab-top">2D</label>
													<label class="tab" for="tab-front">#</label>
													<label class="tab" for="tab-bottom">3D</label>
													<input type="radio" name="tabs" checked="checked" id="tab-top">
													<input type="radio" name="tabs" id="tab-front">
													<input type="radio" name="tabs" id="tab-bottom"> 
												  
													<div class="cube">
													  <div class="tab-content">
														<div id="svg-riassuntivo"></div>
														</div>
													   <div class="tab-content">
														<h1>2D/3D SCOPE</h1>
														<p>THIS IS 2D/3D SCOPE</p>
													  </div>
													  <div class="tab-content">

													  <div class="tile-body color transparent-black rounded-corners container-box-3D">


													  <ul class="tile-navbar bg-transparent-black-3 select-3d">
														  {% if is_granted('ROLE_3DOBJ_TYPE') %}
															  <li class="select-3d obj-type">
																  <a id="id-point" class="btn btn-blue choose-obj" href="#">{{ "SHOW POINT"|trans }}</a>
															  </li>
				  
															  <li class="select-3d obj-type">
																  <a id="id-inbound" class="btn btn-hotpink choose-obj" href="#">{{ "IN BOUND"|trans }}</a>
															  </li>
															  <li class="select-3d obj-type">
																  <a id="id-package" class="btn btn-dutch choose-obj" href="#">{{ "PACKAGE"|trans }}</a>
															  </li>
															  <li class="select-3d obj-type">
																  <a id="id-surface" class="btn btn-blue choose-obj" href="#">{{ "SURFACE"|trans }}</a>
															  </li>
															  <li class="select-3d obj-type">
																  <a id="id-v-shape" class="btn btn-greensea choose-obj" href="#">{{ "V - SHAPE"|trans }}</a>
															  </li>
														  {% endif %}
				  
				  
														  <li class="select-3d">
															  <a id="id-view-top" href="#" class="page-menu-btn no-select choose-display" style=""></a>
														  </li>
														  <li class="select-3d">
															  <a id="id-view-front" href="#" class="page-menu-btn no-select choose-display" style=""></a>
														  </li>
														  <li class="select-3d">
															  <a id="id-view-back" href="#" class="page-menu-btn no-select choose-display" style=""></a>
														  </li>
														  <li class="select-3d">
															  <a id="id-view-left" href="#" class="page-menu-btn no-select choose-display" style=""></a>
														  </li>
														  <li class="select-3d">
															  <a id="id-view-right" href="#" class="page-menu-btn no-select choose-display" style=""></a>
														  </li>
														  <li class="select-3d">
															  <a id="id-cube" href="#" class="page-menu-btn no-select choose-display" style="">
																  <i class="fa fa-cube" title="Isometric"></i>
															  </a>
														  </li>
														  <li class="select-3d">
															  <a id="id-camera1" href="#" class="page-menu-btn no-select choose-display" style="">
																  <i class="fa fa-camera" title="Isometric"></i>
															  </a>
														  </li>
														  <li class="select-3d">
															  <a id="id-camera2" href="#" class="page-menu-btn no-select choose-display" style="">
																  <i class="fa fa-camera-retro" title="Isometric"></i>
															  </a>
														  </li>
													  </ul>
				  
				  
													  <div id="box-3D" class="box-3D" data-content="">
														  <i class="material-icons refresh3D">&#xe84d;</i>
													  </div>
												  </div>

													  </div>
													</div>
												  </div>



												</div>
											</div>
										</div>
									</div>
								</section>
							</section>
														<section class="tile transparent">



								<section id="search-result" class="tile transparent">

									<div class="{{ msgclass|raw }}">
										{{ msg|raw }}
									</div>

								</section>
											
                                  
						
								</section>
							{% include 'configuratore/blocchi/tab.riassuntivo.carico.html.twig'  with {'nome': 'riassuntivo'} %}	
							{% include 'configuratore/blocchi/tab.riassuntivo.carico.singolo.html.twig'  with {'nome': 'riassuntivosingolo'} %}	


								<section class="tile transparent minimized iteml-list-table" id="selected-packing-list">
									<div class="tile-header color transparent-black rounded-corners">
										<div class="controls-left">
											<span class="data-table-title">{{ 'Packing List'|trans }}</span>
										</div>
										<div class="controls">
											<a href="#" class="minimize"><i class="fa fa-chevron-down fa-2x"></i></a>
											<a href="#" class="refresh"><i class="fa fa-refresh fa-2x"></i></a>
										</div>
									</div>
									<div class="tile-body color transparent-black rounded-corners">
										<div class="table-responsive">
										<div class="tile-body color transparent-black rounded-corners">
											<div class="tab-obj table-responsive">
												<div id="id-error-msg" class="error-red"></div>
												<table id="items-result" class="tab-order-items display search-result table-datatable master" style="width:100%">
													<thead>
														<tr data-src="0">
															<th width="80" class="sort-numeric" style="min-width: 10%; text-align: center;">
																<h3 style="vertical-align: bottom;">{{ 'ID'|trans }}</h3>
															</th>
															<th width="80" class="sort-alpha" style="min-width: 10%; text-align: center;">
																<h3>{{ 'Code'|trans }}</h3>
															</th>
															<th width="80" class="sort-numeric" style="min-width: 10%; text-align: center;">
																<h3>{{ 'Qty'|trans }}  {{ um('mm', 'm', '[', ']')|raw }}</h3>
															</th>
															<th width="80" class="sort-numeric" style="min-width: 10%; text-align: center;">
																<h3>{{ 'Weight'|trans }}  {{ um('g', 'kg', '[', ']')|raw }}</h3>
															</th>
															<th width="80" class="sort-numeric" style="min-width: 10%; text-align: center;">
																<h3>{{ 'Volume'|trans }} {{ um('mm3', 'm3', '[', ']')|raw }}</h3>
															</th>
															<th width="80" class="sort-alpha" style="min-width: 10%; text-align: center;">
																<h3>{{ 'Surface'|trans }} {{ um('mm2', 'm2', '[', ']')|raw }}</h3>
															</th>
														</tr>
													</thead>
												</table>
											</div>
										</div>
										</div>
									</div>
								</section>  								
									<br />
								<br />
								<br />
								<br />
								<br />
								<br />
							

						</div>						
					</div>
				</div>


			



    </div>
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />




{% endblock %}

{% block javascripts %}
    {{ parent() }}

<script type="text/javascript" src="{{ asset('static/js/base64.js') }}"></script>
	
	<script type="text/javascript" src="{{ asset('static/c4rg0_themes/assets/js/vendor/justgage/justgage.js') }}"></script>
	<script type="text/javascript" src="{{ asset('static/c4rg0_themes/assets/js/vendor/parsley/parsley.min.js') }}"></script>
	<script type="text/javascript" src="{{ asset('static/DataTables-1.11/datatables.min.js') }}"></script>
	<script type="text/javascript" src="{{ asset('static/DataTables/dataTables.fixedHeader.min.js') }}"></script>
	<script type="text/javascript" src="{{ asset('static/js/moment/moment.min.js') }}"></script>
	<script type="text/javascript" src="{{ asset('static/js/datetime.js') }}"></script>
	<script type="text/javascript" src="{{ asset('bundles/pugxautocompleter/js/autocompleter-jqueryui.js') }}"></script>
	<script type="text/javascript" src="{{ asset('/static/js/jquery.dataTables.rowReordering.js') }}"></script>



    <script type="text/javascript" src="{{ asset('static/js/fabric.min.js') }}"></script>

	<script type="text/javascript" src="{{ asset('static/js/number_format.js') }}"></script>
	<script src="{{ asset('static/svgpanzoom/svg-pan-zoom.min.js') }}"></script>
	<script type="text/javascript">
		const module = {};
	</script>	
	<script type="module">
		import {
			start,
			switchView,
			loadPCD,
			changeView,
			changeObj3D
		} from "{{ asset('static/cloud.js/viewer_3d_conf.js') }}";	
		let container = document.getElementById("box-3D");
		let maxL = 1.0;
		let numDiv = 5;
		let info = new Array();
		function myLog(s) {
			console.log(s);
		}
		function switchViewToModal(acontainer) {
			switchView(acontainer, true);
		}
		$(function() {
			let itemsCount = 0;
			let totQty = 0;

			module.init3D = function(_v) {
				start(container, _v, maxL, numDiv, null, null, null, myLog);
			}

			initModal3d(switchViewToModal);
			$('.modale-3d').on('click', function(v) {
				showModal3d('3D');
			});
			$('ul.select-3d').on('click', '.choose-display', function(v) {
				changeView(this.id);
			});
			$('ul.select-3d').on('click', '.choose-obj', function(v) {
				changeView(this.id);
			});


		});
	</script>

    <script>

		let go = false;
		let table2 = null;
		// UI-specific stuff, button clicks go here
		function ready(fn) {
			if (document.readyState != 'loading') {
				fn();
			} else {
				document.addEventListener('DOMContentLoaded', fn, {once: true});
			}
		}
		
		var Accordion = function(el, multiple) {
			this.el = el || {};
			this.multiple = multiple || false;
		
			// Variables privadas
			var links = this.el.find('.link');
			// Evento
			links.on('click', {
				el: this.el,
				multiple: this.multiple
			}, this.dropdown)
		}
		
		Accordion.prototype.dropdown = function(e) {
			var $el = e.data.el;
			$this = $(this),
				$next = $this.next();
		
			$next.slideToggle();
			$this.parent().toggleClass('open');
		
			if (!e.data.multiple) {
				$el.find('.submenu').not($next).slideUp().parent().removeClass('open');
			};
		}
		
		function showTooltip(evt, text, id, riga, s) {
			let tooltip = document.getElementById("svgtooltip");
			let codice = riga.attr('data-codice');
			let sweight = s.parent().attr('data-c4rgo-weight');
			let iweight = parseInt(sweight);
			if (!isNaN(iweight)) {
					sweight = (iweight * 1.0) / 1000.0;
			}
			tooltip.innerHTML = text + "<br />{{ 'id'|trans }}: " + id  + "<br />{{ 'codice'|trans }}: " + codice  + "<br />{{ 'weight'|trans }}: " + sweight + " Kg";
			tooltip.style.display = "block";
			tooltip.style.left = evt.pageX + 10 + 'px';
			tooltip.style.top = evt.pageY + 10 + 'px';
		}
		
		function hideTooltip() {
			var tooltip = document.getElementById("svgtooltip");
			tooltip.style.display = "none";
		}

		
		function caricaSol() {
			var jqxhr = $.ajax("{{ path('api_loadsol', {'tipocodice': tipocodice, 'b64codice': b64codice}) }}")
				.done(function(json) {
					var data = json.data;
					$('#accordion').html('');
					let _boxIcon = ['fa-box', 'fa-box',  'fa-truck', 'fa-box', 'fa-pallet', 'fa-box', 'fa-box'];
					for (var c = 0; c < data.length; ++c) {
						let obj = data[c];
						var info = Base64.decode(obj.box);
						var oinfo = JSON.parse(info);
						var image_code = oinfo.box.nome.replace(' ', '_').replace('(', '').replace(')', '').replace(',', '');
						let _icon = 'fa-box';
						if (typeof _boxIcon[obj.box_tipologia] !== 'undefined') {
							_icon = _boxIcon[obj.box_tipologia];
						}
						var info_truck = ""
						+ "{{ 'Scope'|trans }}: " + (oinfo.box.portata / 1000).toLocaleString('it-IT', {minimumFractionDigits: 1, maximumFractionDigits: 2}) + " Kg"
						+ "<br />{{ 'Load Surface'|trans }}: " + (oinfo.box.a / 10000).toLocaleString('it-IT', {minimumFractionDigits: 1, maximumFractionDigits: 2}) + " Mq"
						+ "<br />{{ 'Volume'|trans }}: " + (oinfo.box.int_volume / 1000000).toLocaleString('it-IT', {minimumFractionDigits: 1, maximumFractionDigits: 2}) + " Mc";
						var newel = $('<li id="' + obj.uuid.replace('.', '-') + '" name="' + obj.uuid.replace('.', '-') + '" data-uid="' + obj.uuid + '" class=\"hidden-element\"><div class="link"><i class="fas ' + _icon + '"></i>' +
							oinfo.nome + ' - ' + oinfo.tipo + ' ' + 
							'<span class="dati-box"></span><i class="fa fa-chevron-down"></i></div><ul class="submenu"><li class="box-info"><div>' + info_truck + '</div></li></ul></li>');
						$('#accordion').append(newel);
					}
					_listaSoluzioni = new Array();
					aggiornaLista(1);
				})
				.fail(function(ex) {
				})
				.always(function() {
				});
		}
		let _listaSoluzioni = new Array();
		function setTestata(a_container) {
			let fullVol = 0.80;
			let fullWeight = 0.80;
			let fullSurface = 0.80;
			let c1;
			let v1;
			let _totVol = 0;
			let _totWeight = 0;
			let _totSurface = 0;

			let _containerVol = 0;
			let _containerScope = 0;
			let _containerSurface = 0;


			let _totVolPC = 0;
			let _totWeightPC = 0;
			let _totSurfacePC = 0;

			let _totVolPC1;
			let _totWeightPC1;
			let _totSurfacePC1;
			let _totVolPC2;
			let _totWeightPC2;
			let _totSurfacePC2;

			let _last = null;
			let _N = 0;
			let _I = 0;

			if (typeof globalVol !== 'undefined' && globalVol !== false) {
				v1 = "<span class=\"tot-volume\"><span class=\"t-value-data-load-order\">" + globalVol + "</span></span>"; //$('.tot-volume .value-data-load-order').html();
			}
			else {
				v1 = "<span class=\"tot-volume\"><span class=\"t-value-data-load-order\"></span></span>"; //$('.tot-volume .value-data-load-order').html();
			}
			let _boxTipologia = 0;
			let _box_id = null;
			let _box_tipologia = null;
			let _casse_multiple = false;
			let _container = null;
			a_container.forEach(function(t) { 
				let _tmp;
				_totVol = _totVol + t.totVolume;
				_totWeight = _totWeight + t.totWeight;
				_totSurface = _totSurface + t.hullBound;

				_containerVol = _containerVol + t.volume;
				_containerScope = _containerScope + t.scope;
				_containerSurface = _containerSurface + t.surface;

				_tmp = t.totVolume / t.volume;
				if (_tmp > fullVol) {
					_tmp = 1.0;
				}
				_totVolPC = _totVol / _containerVol; //_totVolPC + _tmp;
				_totVolPC100 = _totVolPC * 100.0;
				_totVolPC10 = _totVolPC * 100.0;

				_tmp = t.totWeight / t.scope;
				if (_tmp > fullWeight) {
					_tmp = 1.0;
				}
				_totWeightPC = _totWeight / _containerScope;//_totWeightPC + _tmp;
				_totWeightPC100 = _totWeightPC * 100.0;
				_totWeightPC10 = _totWeightPC * 100.0;

				_tmp = t.hullBound / t.surface;
				if (_tmp > fullSurface) {
					_tmp = 1.0;
				}
				_totSurfacePC = _totSurface / _containerSurface; //_totSurfacePC + _tmp;
				_totSurfacePC100 = _totSurfacePC * 100.0;
				_totSurfacePC10 = _totSurfacePC * 100.0;

				_last = t;
				_N++;
				_I = _I + t.Dati.N;
				_boxTipologia = t.Dati.box_tipologia;
				if (_box_id !== t.box_id && _casse_multiple === false) {
					if (_box_id === null) {
						_box_id = t.box_id;
						_box_tipologia = t.box_tipologia;
					}
					else {
						_box_id = 0;
						_box_tipologia = t.box_tipologia;
						_casse_multiple = true;
					}
				}
				_container = JSON.parse(Base64.decode(t.info));
			});
			//_totVol = _totVol / (1000.0 * 1000.0 * 1000.0);
			//_totWeight = _totWeight / 1000.0;
			//_totSurface = _totSurface / (1000.0 * 1000.0);

			let _boxTipo = ["{{ 'Container'|trans }}", "{{ 'Wooden Crates'|trans }}", "{{ 'Truck'|trans }}", "{{ 'Cardboard Boxes'|trans }}", "{{ 'Pallet'|trans }}", "{{ 'Container'|trans }}", "{{ 'Container'|trans }}"];
			if (_casse_multiple === true || typeof _container !== 'object') {
				c1 = "Sono necessari N° " + (((_N - 1) * 1.0) + (_last.hullBound / _last.surface)).toLocaleString('it-IT', {minimumFractionDigits: 1, maximumFractionDigits: 3}) + " " + _boxTipo[_boxTipologia] + " - per un totale di " + v1 + " Mc";
			}
			else {
				c1 = "Sono necessari N° " + (((_N - 1) * 1.0) + (_last.hullBound / _last.surface)).toLocaleString('it-IT', {minimumFractionDigits: 1, maximumFractionDigits: 3}) + " " + _boxTipo[_boxTipologia] + " - tipo " + _container.nome +  " per un totale di " + v1 + " Mc";
			}

			$('.risultato-finale').html(c1);
			$('.risultato-finale').removeClass('hidden-element');
			$('.risultato-finale .tot-volume .value-data-load-order').html((_totVol / (1000.0 * 1000.0 * 1000.0)).toLocaleString('it-IT', {minimumFractionDigits: 0, maximumFractionDigits: 3}) );
/*
			$('#blocco-totali .tot-item .value-data-load-order .valid-value').html(_I);
			$('#blocco-totali .tot-item .value-data-load-order .invalid-value').html('');

			$('#blocco-totali .tot-volume .value-data-load-order').html(_totVol.toLocaleString('it-IT', {minimumFractionDigits: 0, maximumFractionDigits: 3}) );
			$('#blocco-totali .tot-volume .qty-data-load-order').html('');
			$('#blocco-totali .tot-weight .value-data-load-order').html(_totWeight.toLocaleString('it-IT', {minimumFractionDigits: 0, maximumFractionDigits: 3}) );
			$('#blocco-totali .tot-weight .qty-data-load-order').html('');
			$('#blocco-totali .tot-area .value-data-load-order').html(_totSurface.toLocaleString('it-IT', {minimumFractionDigits: 0, maximumFractionDigits: 3}) );
			$('#blocco-totali .tot-area .qty-data-load-order').html('');
*/
			let vol10 = parseInt(_totVolPC10);
			let surface10 = parseInt(_totSurfacePC10);
			let weight10 = parseInt(_totWeightPC10);
			vol10 = (vol10 > 100) ? 'E' : '' + vol10;
			surface10 = (surface10 > 100) ? 'E' : '' + surface10;
			weight10 = (weight10 > 100) ? 'E' : '' + weight10;
			dati = {
				  'totVolume':_totVol
				, 'totSurface':_totSurface
				, 'totWeight':_totWeight
				, 'containerVolume':_containerVol
				, 'containerSurface':_containerSurface
				, 'containerWeight':_containerScope
				, 'box_id':_box_id
				, 'box_tipologia': _box_tipologia
				, 'Dati': {
					  'N': _I
					  , 'SaturationVolume100Format': _totVolPC100.toLocaleString('it-IT', {minimumFractionDigits: 0, maximumFractionDigits: 2})
					  , 'SaturationVolume10': vol10
					  , 'SaturationSurface100Format': _totSurfacePC100.toLocaleString('it-IT', {minimumFractionDigits: 0, maximumFractionDigits: 2}) 
					  , 'SaturationSurface10': surface10
					  , 'SaturationWeight100Format': _totWeightPC100.toLocaleString('it-IT', {minimumFractionDigits: 0, maximumFractionDigits: 2}) 
					  , 'SaturationWeight10': weight10
					  }
			};

			if (typeof updateContenitore === 'function' && typeof _box_id !== 'undefined') {
				if (_box_id > 0) {
					updateContenitore(_box_id);	

				}
				else {
					updateContenitore();	

				}
			}
			if (typeof updateLocal === 'function') {
				updateLocal(dati);	
			}

		}
		function aggiornaLista(t) {
			
			$('#accordion > li:not(.full-update):not(.busy)').each(
				function(v) {						
					let id = $(this).data('uid');
					$(this).addClass('busy');
					let el = this;
					let url;
					if (t === 1) {
						url = "{{ path('api_c4rgo2dautoopen', {'tipocodice':tipocodice,'b64codice':b64codice,'id': ':::ID','tipo':'I','saved':1}) }}".replace(':::ID', id);
					}
					else {
						url = "{{ path('api_c4rgo2dautoopen', {'tipocodice':tipocodice,'b64codice':b64codice,'id': ':::ID','tipo':'I','saved':0}) }}".replace(':::ID', id);
					}
					var jqxhr = $.ajax(url)
						.done(function(json) {
							let submenu = $(el).find('.submenu');
							let selectedN = parseInt($('#accordion .submenu li.selected').data('n'));
							let lockN = parseInt($('#accordion .submenu li td span.solution-lock').closest('li').data('n'));
							submenu.find('li:not(.box-info)').remove();
							for (var k1 = 0; k1 < json.data.length; ++k1) {0
								let contenitore = json.data[k1];
								let _saturation;								
								if (contenitore.SheetName !== '--free--') {

									let iter = contenitore;
									let maxPC = -10000.0;								
									let emptyMenu = '';
									_listaSoluzioni[iter.Iterations + "-" + iter.Uuid] = iter;
									if (iter.PlacedPartsCount < iter.TotalPartsCount) {
										emptyMenu = " hidden-element ";
									}
									_saturation = ((iter.LastC4rgo.hullBound) * 100.0) / iter.LastC4rgo.Surface;
									maxPC = (iter.MaterialUtilization > maxPC) ? iter.MaterialUtilization : maxPC;
								//	for (var ii = 0; ii < )

									let lock = 'N';
									let lockClass = 'solution-unlock';
									let selectedClass = '';
									let classId = id.replace('.', '-') + '-' + iter.Iterations;
									if ((typeof iter.saved !== 'undefined' && iter.saved == 1) || iter.Iterations === lockN) {
										lock = 'S';
										lockClass = 'solution-lock';	
									}
									if (iter.Iterations === selectedN) {
										selectedClass = 'selected';	
									}
									submenu.append($('<li data-n="' + iter.Iterations + '" data-uid="' + id + '" data-id="' + iter.FileName + '" class="iteration ' + classId + ' ' + lockClass + ' ' + emptyMenu + ' ' + selectedClass +  '"><table><tr data-n="' + iter.Iterations + '" data-uid="' + id + 
									    '"><td class="solution-command"><span data-lock="N" data-busy="' + lock + '" class="fa solution-status ' + lockClass + ' ' + id.replace('.', '-') + '-' + iter.Iterations + ' "></span></td><td><a data-filename="' + iter.FileName + '" href="#">' +
										"{{ 'ID Solution:'|trans }} " + iter.Iterations + "<br />" +
										//"{{ 'N°:'|trans }} " + (iter.UsedSheetsCount - 1) + ' + ' + (_saturation).toLocaleString('it-IT', {minimumFractionDigits: 1, maximumFractionDigits: 2}) + "%<br />" +
										"{{ 'N°:'|trans }} " + iter.UsedSheetsCount + "<br />" +
										"{{ 'Total surface:'|trans }} " + ((iter.totHullBound) / (1000.0 * 1000.0)).toLocaleString('it-IT', {minimumFractionDigits: 1, maximumFractionDigits: 2})  + " Mq<br />" +
										"{{ 'Residual space:'|trans }} " + ((iter.LastC4rgo.surface - iter.LastC4rgo.hullBound) / (1000.0 * 1000.0)).toLocaleString('it-IT', {minimumFractionDigits: 1, maximumFractionDigits: 2})  + " Mq<br />" +
										//"{{ 'Residual space:'|trans }} " + (((iter.LastC4rgo.Surface - iter.LastC4rgo.hullBound) * 100.0) / iter.LastC4rgo.Surface).toLocaleString('it-IT', {minimumFractionDigits: 1, maximumFractionDigits: 2})  + "%<br />" +
										"{{ 'Processing time:'|trans }} " + (iter.IterationsElapsedMilliseconds / 1000.0) + "' /" + (iter.ElapsedMilliseconds) + "'<br />" +
										'</a></td><td class="solution-command"><span class="fa solution-qrcode disabled"></span></td></tr></table></li>'));
									
									if (k1 === 0) {
	//												$(el).find('.dati-box').html("{{ 'N°:'|trans }} " + (iter.UsedSheetsCount - 1) + ' + ' + (_saturation).toLocaleString('it-IT', {minimumFractionDigits: 1, maximumFractionDigits: 2}) + "%" );
										$(el).find('.dati-box').html("{{ 'N°:'|trans }} " + iter.UsedSheetsCount);
										if (json.data.length === 1 && $('#accordion > li').length === 1) {
											setTestata(iter.SheetC4rgo);
										}

									}
									//break; // Questo break serve se si vuole solo una soluzione

								}
							}
							if (submenu.find('.iteration').length === submenu.find('.iteration.hidden-element').length) {
								submenu.parent().addClass('hidden-element');
							} else {
								submenu.parent().removeClass('hidden-element');
							}
							if (json.fine === 1) {
								$('#accordion li[name="' + id.replace('.', '-') + '"]').addClass('full-update');
								cambiaVisibilita(($('.blocco-dati  ul#accordion > li.full-update').length < $('.blocco-dati  ul#accordion > li').length));
							}
							else {
								aggiornaListaRic(t);
							}
							if (json.data.length === 1) {
								if (!$('#accordion > li:first-child').parent().hasClass('open')) {
									let id = $('#accordion .submenu > li:not(.box-info) td > a').data('filename');
									let _uuid = $('#accordion .submenu > li:not(.box-info) td > a').parent().parent().data('uid');
									let _n = $('#accordion .submenu > li:not(.box-info) td > a').parent().parent().data('n');
									LoadingSol(id, _uuid, _n);
									$('#accordion > li').removeClass('open');
									$('#accordion > li ul.submenu').slideUp();
									$('#accordion > li:first-child').parent().addClass('open');
									$('#accordion > li:first-child .link').next().slideToggle();	
								}
								if ($('.iteml-list-graphics-elab .minimize').parent().parent().parent().hasClass('minimized')) {
									$('.iteml-list-graphics-elab .minimize').parent().parent().parent().removeClass('minimized');	
								}
							}
						})
						.fail(function(ex) {})
						.always(function() {
							$(el).removeClass('busy');
						});												
				}
			);
		}

		function aggiornaListaRic(t) {
			setTimeout(function(v) {

				aggiornaLista(t);

			}, 1000);
		}

		function calcolare(v) {
		
			var jqxhr = $.ajax("{{ path('api_c4rgo2dautobox', {'tipocodice': tipocodice, 'b64codice': b64codice}) }}")
				.done(function(json) {
					var data = json.data;
					$('#accordion').html('');
					let _boxIcon = ['fa-box', 'fa-box',  'fa-truck', 'fa-box', 'fa-pallet', 'fa-box', 'fa-box'];
					for (var c = 0; c < data.length; ++c) {
						let obj = data[c];
						if (obj.box === '') {
							continue;
						}
						var info = Base64.decode(obj.box);
						var oinfo = JSON.parse(info);
						var image_code = oinfo.box.nome.replace(' ', '_').replace('(', '').replace(')', '').replace(',', '');
						let _icon = 'fa-box';
						if (typeof _boxIcon[obj.box_tipologia] !== 'undefined') {
							_icon = _boxIcon[obj.box_tipologia];
						}
						var info_truck = ""
						+ "{{ 'Scope'|trans }}: " + (oinfo.box.portata / 1000).toLocaleString('it-IT', {minimumFractionDigits: 1, maximumFractionDigits: 2}) + " Kg"
						+ "<br />{{ 'Load Surface'|trans }}: " + (oinfo.box.a / 10000).toLocaleString('it-IT', {minimumFractionDigits: 1, maximumFractionDigits: 2}) + " Mq"
						+ "<br />{{ 'Volume'|trans }}: " + (oinfo.box.int_volume / 1000000).toLocaleString('it-IT', {minimumFractionDigits: 1, maximumFractionDigits: 2}) + " Mc";
						var newel = $('<li id="' + obj.uuid.replace('.', '-') + '" name="' + obj.uuid.replace('.', '-') + '" data-uid="' + obj.uuid + '" class=\"hidden-element\"><div class="link"><i class="fas ' + _icon + '"></i>' +
							oinfo.nome + ' - ' + oinfo.tipo + ' ' + 
							'<span class="dati-box"></span><i class="fa fa-chevron-down"></i></div><ul class="submenu"><li class="box-info"><div>' + info_truck + '</div></li></ul></li>');
						$('#accordion').append(newel);
					}
					_listaSoluzioni = new Array();
					aggiornaLista(0);
				})
				.fail(function(ex) {
					//  alert( "error" );
				})
				.always(function() {
					//   alert( "complete" );
					// var calcolaTimeout = setTimeout(calcolare(0), 2000);		
				});
		}
		
		function cambiaVisibilita(v, id) {
			let color = 'color-default';
			if (typeof id !== 'undefined') {
				switch(id) {
					case 1:
						color = 'color-inbound';
					break;
					case 4:
						color = 'color-vshape';
					break;
				}
			}
			$('.main-loading').removeClass('color-inbound');
			$('.main-loading').removeClass('color-vshape');
			$('.main-loading').removeClass('color-default');
			if (v) {
				$('.main-loading').show();
				$('.main-loading').removeClass('hidden-element');
				$('.main-loading').addClass(color);
				$('.block-menu-filter.menu-selezione-tipo-oggetti').hide();		
			} else {
				$('.main-loading').hide();
				$('.main-loading').addClass('hidden-element');
				$('.block-menu-filter.menu-selezione-tipo-oggetti').show();
		
			}
		
		}

		function LoadingSol(id, _uuid, _n) {
			let _tabDati = (typeof _listaSoluzioni[_n + '-' + _uuid] !== 'undefined') ? _listaSoluzioni[_n + '-' + _uuid] : null;
			module.hide_riassuntivosingolo();
			if (_tabDati !== null && typeof module.start_riassuntivo === 'function') {
				module.start_riassuntivo(_tabDati);
			}
			$('#svg-riassuntivo').html('<svg id="svg-2" class="spinner" viewBox="0 0 50 50"><circle class="path" cx="25" cy="25" r="20" fill="none" stroke-width="1"></circle></svg>');
			
			var jqxhr1 = $.ajax("{{ path('api_c4rgo2dautosvg', {'id': ':::ID'}) }}".replace(':::ID', id))
				.done(function(json) {
					if (json.err === 0) {

						let info = json.info;
						let _ViewPortW = json.ViewPortW;
						let _ViewPortH = json.ViewPortH;
						//<ul class="nav nav-tabs tabdrop tab-container">	
					//	<li class="active master"><a href="#master-tab" data-toggle="tab">MASTER</a></li>

						$('.tab-container > li.dettaglio').remove();							
						for(c = 0; c < info.length; ++c) {
							let _progressivo = c + 1;
							let _c = JSON.parse(Base64.decode(info[c].Value.Contenitore.info));
							if (typeof _c !== 'undefined' && typeof _c.nome !== 'undefined') {
								$('.tab-container').append('<li class="dettaglio truck-' + info[c] .Key + '" data-id="' + id + '" data-detid="' + info[c].Key + '"><a href="#truck-tab" data-toggle="tab">' + _c.nome + ' (' + _progressivo + ')</a></li>');
							}
							else {
								$('.tab-container').append('<li class="dettaglio truck-' + info[c] .Key + '" data-id="' + id + '" data-detid="' + info[c].Key + '"><a href="#truck-tab" data-toggle="tab">' + "{{ 'Container'|trans }}" + ' ' + _progressivo + '</a></li>');
							}
							info[c].progressivo = _progressivo;
						}
						$('.tab-container').parent().parent().removeClass('hidden-element');
						$('.tab-container .master').addClass('active');

						$('.tab-container .master').data('filename', id);
						$('.tab-container .master').parent().parent().data('uid', _uuid);
						$('.tab-container .master').parent().parent().data('n', _n);
		


						$('#svg-riassuntivo').html(json.data);

						window.zoomSvg = svgPanZoomRotate.init('#svg-2', {
								zoomEnabled: true,
								  controlIconsEnabled: true,
								preventMouseEventsDefault: true,
								  fit: true,
								  center: true,
							});
						if (_ViewPortW < _ViewPortH) { //if (info.length < 4) {
							window.zoomSvg.rotateRelative(90);
							window.zoomSvg.fit()
							window.zoomSvg.center()	
						}
						let contenitori = new Array();
						info.forEach(function(_v) {
							_v.Value.Contenitore.Oggetti = _v.Value.Oggetti;
							_v.Value.Contenitore.Dati = {"N":_v.Value.Oggetti.length,"box_id":_v.Value.Contenitore.box_id,"box_tipologia":_v.Value.Contenitore.box_tipologia};
							let _c = JSON.parse(Base64.decode(_v.Value.Contenitore.info));
							contenitori.push(_v.Value.Contenitore);
						});
						setTestata(contenitori);

					}
				})
				.fail(function(ex) {
				})
				.always(function() {
					$('#tab-top').prop('checked', true);
				});
		}


		ready(function() {
	
			if (table2 !== null) {
				return;
			}
			table2 = $('#items-result').DataTable({
				"ajax": {
					"type": "GET",
					"url": "{{ path('api_configuratore', {'tipocodice': tipocodice,'codice': codice,'tipo': tipo}) }}",
					"dataSrc": function(json) {
						$('#search #search-result .error-red').html('');
						$('#search #search-result .error-red').hide();
						if (json.err === 0) {	
							if (json.container.length > 0) {	
			//					$('#svg-riassuntivo').html(json.container[0].svg_completo_ch)
							}
							return json.data;
						} else {
							$('#search #search-result .error-red').html(json.errmsg);
							$('#search #search-result .error-red').show();
							return [];
						}
					}
				},
				"paging": false,
				"searching": false, 
				"dom": '<"toolbar">frtip',
				"language": {
					"search": "{{ 'Filter records'|trans }}:"
				},
				"fixedHeader": false,
				"lengthMenu": [
					25,
					50,
					100,
					200,
					500
				],
				"language": {"infoEmpty": "{{ 'No records available'|trans }}","info": "{{ 'Showing _TOTAL_ entries'|trans }}"},
				"deferRender": true,
				"columns": [
					{"data": 'cid'},
					{"data": "cobj_code"},
					{"data": 'quantity', className: "text-center"},
					{"data": 'NetWeight', className: "text-center"},
					{"data": 'Volume', className: "text-center"},
					{"data": null, className: "text-center"}
				],
				"order": [
						[0, "asc"]
				],			
				"columnDefs": [
					{
						"visible": false,
						"targets":0
					},		
					{
						"visible": true,
						"targets": 3
					},
					{
						"visible": true,
						"targets": 4
					},
					{
						"render": function(data, type, row) {
							return (row.LPackage * row.WPackage).toLocaleString('it-IT', {minimumFractionDigits: 1, maximumFractionDigits: 3});
						},
						"className": 'text-center',
						"targets": 5
					}

				],
				"drawCallback": function () {
				}, 
				"draw": function() {
				},
				"createdRow": function(row, data, index) {
					$(row).attr('id', 'item-id-' +  data.box_id + '-' + data.cid);
					$(row).attr('data-itemid', data.ID);
 					$(row).attr('data-codice', data.cobj_code);
 					$(row).attr('data-cid', data.cid);
				}
		});


	
/*
			window.addEventListener('beforeunload', function (e) {
				alert('ok');
				e.preventDefault();
				e.returnValue = '';				
			});
*/


		// 				if (go && $('#accordion > li:not(.full-update)').length > 0) {

			$('#accordion').on('click', '.link', function(v) {
				if ($(this).parent().hasClass('open')) {
					$(this).parent().removeClass('open');
				} else {
					$('#accordion li').removeClass('open');
					$('#accordion li ul.submenu').slideUp();
					$(this).parent().addClass('open');
				}
				$(this).next().slideToggle();
			});
			$('#accordion').on('click', '.submenu > li:not(.box-info) td > a', function(v) {
				let id = $(this).data('filename');
				let _uuid = $(this).parent().parent().data('uid');
				let _n = $(this).parent().parent().data('n');
				$('.iteration').removeClass('selected');
				$(this).closest( ".iteration" ).addClass('selected');
				LoadingSol(id, _uuid, _n);
			});

			$('.tab-container').on('click', '.master', function(v) {
				let id = $(this).data('filename');
				let _uuid = $(this).parent().parent().data('uid');
				let _n = $(this).parent().parent().data('n');
				LoadingSol(id, _uuid, _n);
			});

			function LoadingSolSingle(id, detId) {
				let _url = "{{ path('api_c4rgo2dautosvg', {'id': ':::ID', 'detid': ':::DETID'}) }}".replace(':::ID', id).replace(':::DETID', detId);
				module.hide_riassuntivo();
				module.hide_riassuntivosingolo();
				$('#svg-riassuntivo').html('<svg id="svg-2" class="spinner" viewBox="0 0 50 50"><circle class="path" cx="25" cy="25" r="20" fill="none" stroke-width="1"></circle></svg>');
				var jqxhr1 = $.ajax(_url)
					.done(function(json) {
						if (json.err === 0) {
							let info = json.info;
							let obj3d = json.obj3d;
							$('#svg-riassuntivo').html(json.data);
							window.zoomSvg = svgPanZoomRotate.init('#svg-2', {
						        	zoomEnabled: true,
          							controlIconsEnabled: true,
									preventMouseEventsDefault: true,
          							fit: true,
          							center: true,
        						});
							window.zoomSvg.rotateRelative(90);
							window.zoomSvg.fit()
							window.zoomSvg.center()	
							if (info.length > 0) {
								module.start_riassuntivosingolo(info);
							}
							module.init3D(obj3d);
						}
					})
					.fail(function(ex) {
					})
					.always(function() {
					});
			}
			$('#selected-selection-box').on('click', '.tab-container > li.dettaglio a', function(v) {
				let _id = $(this).parent().data('id');
				let _detId = $(this).parent().data('detid');
				let _aDati = module.getData_riassuntivo();
				let dati = null;
				_aDati.each(function(_v) {
					if (_v.id === _detId) {
						dati = _v; 
					}
				});
				if (typeof startUpdate === 'function') {
					startUpdate();
				}
				
				let _boxTipologia = 0;
				if (dati !== null) {
					
					if (typeof updateContenitore === 'function' && typeof dati.Dati.box_id !== 'undefined') {
						if (dati.Dati.box_id > 0) {
							updateContenitore(dati.Dati.box_id);	

						}
						else {
							updateContenitore();	

						}
					}
					if (typeof updateLocal === 'function') {
						updateLocal(dati);	
					}
					if (typeof dati.Dati.box_tipologia !== "undefined") {
						_boxTipologia = dati.Dati.box_tipologia;
					}

//					let _boxTipo = ["{{ 'Container'|trans }}", "{{ 'Container'|trans }}", "{{ 'Truck'|trans }}", "{{ 'Container'|trans }}", "{{ 'Pallet'|trans }}", "{{ 'Container'|trans }}", "{{ 'Container'|trans }}"];
					let _boxTipo = ["{{ 'Container'|trans }}", "{{ 'Wooden Crates'|trans }}", "{{ 'Truck'|trans }}", "{{ 'Cardboard Boxes'|trans }}", "{{ 'Pallet'|trans }}", "{{ 'Container'|trans }}", "{{ 'Container'|trans }}"];

					c1 = _boxTipo[_boxTipologia] + " " + (_detId + 1) + " - tipo " + dati.Dati.info.nome + " - " + dati.Dati.LoadStatus;
					$('.risultato-finale').html(c1);
		
				}
				LoadingSolSingle(_id, _detId);
			});
			$('#blocco-items-riassuntivo').on('click', '.valore-codice', function(v) {
				let _id = $(this).data('id');
				let _detId = $(this).data('detid');
				let dati = module.getData_riassuntivo(this);
				if (typeof startUpdate === 'function') {
					startUpdate();
				}

				$('#selected-selection-box .tab-container li').removeClass('active');
				$('#selected-selection-box .tab-container li.truck-' + _detId).addClass('active');
				if (typeof updateContenitore === 'function' && typeof dati.Dati.box_id !== 'undefined') {
					if (dati.Dati.box_id > 0) {
						updateContenitore(dati.Dati.box_id);	

					}
					else {
						updateContenitore();	

					}
				}

				if (typeof updateLocal === 'function') {
					updateLocal(dati);	
				}

				LoadingSolSingle(_id, _detId);
			});








                        $('#svg-riassuntivo').on('click', '.svg-path path', function(e) {
                                var name = $(this).attr('name');
                                var vname = name.split('-');
                                if (vname.length > 5) {
									let riga = $('#items-result tr[data-itemid="' + vname[5] + '"]')
									let cid = riga.attr('data-cid');
									let box = vname[1];
									let title = '{{ codice }}';
							//         showItemInfo(title, box, cid, null);
                                }
                        });
			$('#svg-riassuntivo').on('mousemove', 'path', function(e) {
				var name = $(this).attr('name');
				if (typeof name !== 'undefined' && name !== '') {
					var vname = name.split('-');
					if (vname.length > 5) {
						let riga = $('#items-result tr[data-itemid="' + vname[5] + '"]')
						showTooltip(e, vname[4], vname[5], riga, $(this));
					}	
				}
			});
		
			$('#svg-riassuntivo').on('mouseout', 'path', function(e) {
				hideTooltip();
			});

			function loadConfigEngine(tipo) {
				let cururl = "{{ path('api_getconfigengine', {'tipocodice':tipocodice,'b64codice':b64codice, 'tipo':':::T'}) }}".replace(':::T', tipo);
                $.ajax({
                    type: 'get',
                    url: cururl
                }).done(
                    function(data)
                    {
                        if (data.err === 0) {
							for (const [key, value] of Object.entries(data.config)) {
								$('.open-settings-info .value.' + key).html(value);
							};
                        }
                        else {

                        }
                    }
                ).fail(function(ex) {
                })
				.always(function() {
				});                
			}
			$('#config-engine').on('click', function(e) {
				let id = $(this).data('id');
				let tipo;
				switch (id) {
					case 1:
					tipo = 'I';
					break;
					case 4:
					tipo = 'R';
					break;
				}

				showConfigEngine("", "", "{{ tipocodice }}", "{{ b64codice }}", "N", tipo, '--', loadConfigEngine);
				$('#box-solution-settings').addClass('hidden-element');
			});
		
			$('#selected-items-list').on('click', '.media .btn-config', function(v) {
				let id = $(this).parent().parent().data('id');
				{#switch (id) {
					case 1:
						location.href = "{{ path('page_configc4rgo2dauto', {'tipocodice':tipocodice,'codice':codice, 'default':'N', 'tipo':'I'}) }}";
						break;
					case 4:
						location.href = "{{ path('page_configc4rgo2dauto', {'tipocodice':tipocodice,'codice':codice, 'default':'N', 'tipo':'R'}) }}";
						break;
				}#}
				
				let sid = $('#box-solution-settings').data('id');
				if ($('#box-solution-settings').hasClass('hidden-element') || id != sid) {
					$('#box-solution-settings').data('id', id);
					$('#box-solution-settings #config-engine').data('id', id);
					$('#box-solution-settings button').removeClass('btn-hotpink');
					$('#box-solution-settings button').removeClass('btn-greensea');
					$('#box-solution-settings .media.open-settings').removeClass('inbound');
					$('#box-solution-settings .media.open-settings').removeClass('vshape');
					switch (id) {
						case 1:
							$('#box-solution-settings button').addClass('btn-hotpink');
							$('#box-solution-settings .media.open-settings').addClass('inbound');
							loadConfigEngine('I');

						break;
						case 4:
							$('#box-solution-settings button').addClass('btn-greensea');
							$('#box-solution-settings .media.open-settings').addClass('vshape');
							loadConfigEngine('R');
							break;
					}
					$('#box-solution-settings').removeClass('hidden-element');
				}
				else {
					$('#box-solution-settings').addClass('hidden-element');
				} 
				
			});

			$('#selected-items-list').on('click', '.box-vol .media .btn-execute', function(v) {
				let id = $(this).parent().parent().data('id');
				let locurl = '';
				let tipo = '';
				let NomeTipo = '';
				cambiaVisibilita(true, id);
				module.hide_riassuntivo();

				$('#accordion').removeClass('tipo-inbound');
				$('#accordion').removeClass('tipo-real');
				$('#svg-riassuntivo').html('');
				$('#accordion').html('');
				switch (id) {
					case 1:
						locurl = "{{ path('api_c4rgo2dauto', {'tipocodice':tipocodice,'b64codice':b64codice,'tipologia':tipologia,'tipo':'I'}) }}";
						NomeTipo = "{{ 'INBOUND'|trans }}";
						$('#accordion').addClass('tipo-inbound');
						tipo = 'I';
						break;
					case 4:
						locurl = "{{ path('api_c4rgo2dauto', {'tipocodice':tipocodice,'b64codice':b64codice,'tipologia':tipologia,'tipo':'R'}) }}";
						NomeTipo = "{{ 'REAL'|trans }}";
						$('#accordion').addClass('tipo-real');
						tipo = 'R';
						break;
					default:
						locurl = "{{ path('api_c4rgo2dauto', {'tipocodice':tipocodice,'b64codice':b64codice,'tipologia':tipologia,'tipo':'I'}) }}";
						NomeTipo = "{{ 'INBOUND'|trans }}";
						$('#accordion').addClass('tipo-inbound');
						tipo = 'I';;
				}
		
				$('.loading-wrap .loading-loading .text2').html(NomeTipo);
				$.ajax({
					type: "GET",
					url: locurl,
					data: {},
					success: function(data) {
						{# 	location.href="{{ path('page_c4rgo2dauto', {'tipocodice':tipocodice,'codice':codice,'tipo':':::TIPO'}) }}".replace(':::TIPO', tipo);#}
						calcolare(0);
					},
					error: function(data) {
						var aa = data;
					}
				});
			});		
		});

		if (typeof updateTotCounter === "function") {
			//	$(document).ready(updateTotCounter);
			$(window).on('load', 
				
				function(v) {
					updateTotCounter(
						function(v) {
							initConfigEngine();
							caricaSol();				
						}
					);
				}
			);
		}
		else {
			initConfigEngine();
			caricaSol();	
		}
		
		if (typeof updateContenitore === "function") {
			//$(document).ready(updateContenitore);
			$(window).on('load', updateContenitore);
		}
			
		//calcolare(1);
		$('#accordion').removeClass('tipo-inbound');
		$('#accordion').removeClass('tipo-real');
		$('#accordion').addClass('tipo-inbound');
		$('#svg-riassuntivo').hover(function() {
		//	$("#content").attr("id","content-noscroll");
		}, function() {
		// $("#content-noscroll").attr("id","content");
		});
		$('#selected-svg .refresh').on('click', function(v) {
			if (typeof window.zoomSvg === 'object') {
				window.zoomSvg.resize();
				window.zoomSvg.fit()
				window.zoomSvg.center()	
			}
		})

		$('#selected-svg .rotate-left').on('click', function(v) {
			if (typeof window.zoomSvg === 'object') {
				window.zoomSvg.rotateRelative(-90);
				window.zoomSvg.fit()
				window.zoomSvg.center()	
			}
		})
		$('#selected-svg .rotate-right').on('click', function(v) {
			if (typeof window.zoomSvg === 'object') {
				window.zoomSvg.rotateRelative(90);
				window.zoomSvg.fit()
				window.zoomSvg.center()	
			}
		})
		$('#selected-svg .rotate-right').on('click', function(v) {
			if (typeof window.zoomSvg === 'object') {
				window.zoomSvg.rotateRelative(90);
				window.zoomSvg.fit()
				window.zoomSvg.center()	
			}
		})
		function saveSolutions(force, uid, n) {
			let _url = "{{ path('api_savesolution', {'tipocodice': tipocodice, 'b64codice': b64codice, 'uid':':::UID', 'n':':::N', 'force':'n'}) }}";
			if (force === 1) {
				_url = "{{ path('api_savesolution', {'tipocodice': tipocodice, 'b64codice': b64codice, 'uid':':::UID', 'n':':::N', 'force':'y'}) }}";
			}
			if (force === 99) {
				_url = "{{ path('api_savesolution', {'tipocodice': tipocodice, 'b64codice': b64codice, 'uid':':::UID', 'n':':::N', 'force':'d'}) }}";
			}
			_url = _url.replace(':::UID', uid).replace(':::N', n);
			$("#" + uid.replace('.', '-') + ' li.iteration.' + uid.replace('.', '-') + '-' + n).removeClass('solution-lock solution-unlock');
			$("#" + uid.replace('.', '-') + ' li .solution-status.' + uid.replace('.', '-') + '-' + n).removeClass('solution-lock solution-unlock');
			$("#" + uid.replace('.', '-') + ' li .solution-status.' + uid.replace('.', '-') + '-' + n).addClass('fa-circle-o-notch fa-spin');
			var jqxhr = $.ajax(				
				{
                    type: 'PUT',
                    url: _url
                })
				.done(function(json) {
					$("#" + uid.replace('.', '-') + ' li .solution-status.' + uid.replace('.', '-') + '-' + n).data('busy', 'N');
					if (json.err === 0) {
						$("#" + uid.replace('.', '-') + ' li .solution-status').data('lock', 'N');
						if (json.unlock === 0) {
							$("#" + uid.replace('.', '-') + ' li .solution-status.' + uid.replace('.', '-') + '-' + n).data('lock', 'S');
						}
						if (force === 99) {
							alert("{{ 'Solutions deleted.'|trans }}");
						}
						else {
							alert("{{ 'Solutions saved.'|trans }}");
						}
						location.reload();
					}
					else {
						if (json.err === -1) {
							if (confirm("{{ 'Solutions already exists, overwrite?'|trans }}")) {
								$("#" + uid.replace('.', '-') + ' li .solution-status.' + uid.replace('.', '-') + '-' + n).data('busy', 'S');
								saveSolutions(1, uid, n);
							}
						}
						else {
							alert('err: ' + json.msg);
						}
					}
				})
				.fail(function(ex) {
					$("#" + uid.replace('.', '-') + ' li .solution-status.' + uid.replace('.', '-') + '-' + n).data('busy', 'N');
					//  alert( "error" );
				})
				.always(function() {
					let lock = $("#" + uid.replace('.', '-') + ' li .solution-status.' + uid.replace('.', '-') + '-' + n).data('lock');
					let busy = $("#" + uid.replace('.', '-') + ' li .solution-status.' + uid.replace('.', '-') + '-' + n).data('busy');
					if (busy !== 'S') {
						$("#" + uid.replace('.', '-') + ' li.iteration').removeClass('solution-lock');
						$("#" + uid.replace('.', '-') + ' li .solution-status').removeClass('fa-circle-o-notch fa-spin solution-lock');
						$("#" + uid.replace('.', '-') + ' li .solution-status').addClass('solution-unlock');
						if (lock === 'S') {
							$("#" + uid.replace('.', '-') + ' li.iteration.' + uid.replace('.', '-') + '-' + n).removeClass('solution-unlock');
							$("#" + uid.replace('.', '-') + ' li .solution-status.' + uid.replace('.', '-') + '-' + n).removeClass('solution-unlock');
							$("#" + uid.replace('.', '-') + ' li.iteration.' + uid.replace('.', '-') + '-' + n).addClass('solution-lock');
							$("#" + uid.replace('.', '-') + ' li .solution-status.' + uid.replace('.', '-') + '-' + n).addClass('solution-lock');
						}
					}
					let id = $("#" + uid.replace('.', '-') + ' li .solution-status.' + uid.replace('.', '-') + '-' + n).closest('.iteration').data('id');
					$('.iteration').removeClass('selected');
					$("#" + uid.replace('.', '-') + ' li .solution-status.' + uid.replace('.', '-') + '-' + n).closest( ".iteration" ).addClass('selected');
					LoadingSol(id, uid, n);
				});
		}
		$('.accordion-space').on('click', 'li.iteration td:first-child', function(v) {
			if ($(this).find('span.solution-lock').length === 0) {
				let uid = $(this).parent().data('uid');
				let n = $(this).parent().data('n');
				saveSolutions(0, uid, n);	
			}
			else {
				if ($(this).find('span.solution-unlock').length === 0) {
					let uid = $(this).parent().data('uid');
					let n = $(this).parent().data('n');
					saveSolutions(99, uid, n);	
				}	
			}
		});

		
		
	</script>    

{% endblock %}