.

src/OpenMind/Admin/Admin.php

@@ -16,9 +16,10 @@ class Admin extends PluginStrategy
 	{
 		$this->AddRoute('GET @admin: /admin', __NAMESPACE__ . '\Pages->Admin');
 		$this->AddRoute('GET @admin: /admin/eslstatus', __NAMESPACE__ . '\Pages->ESLStatus');
-		$this->AddRoute('GET @admin: /admin/templates/@dt/@clearcache', __NAMESPACE__ . '\Pages->Templates');
 		$this->AddRoute('GET @admin: /admin/apstatus', __NAMESPACE__ . '\Pages->APStatus');
 		$this->AddRoute('GET @admin: /admin/omlsettings', __NAMESPACE__ . '\Pages->OML_Settings');
+		$this->AddRoute('POST @admin: /admin/commands', __NAMESPACE__ . '\Pages->Commands');
+
 		// Admin Load/Save
 		$this->AddRoute('POST @admin: /admin/config', __NAMESPACE__ . '\Pages->Config');
 

src/OpenMind/Admin/Pages.php

@@ -160,14 +160,37 @@ class Pages extends Controller
 		return;
 	}
 
-	public function Templates($f3, $args)
+	/**
+	 * General Commands controller
+	 *
+	 * @param $f3
+	 */
+	public function Commands($f3)
 	{
-		global $frameworkUtils;
+		$bodyPostData = $f3->get('BODY');
+		if (strlen($bodyPostData) == 0) {
+			echo json_encode([
+				"err" => "Empty body command"
+			]);
+			return;
+		}
+
+		$Command = json_decode($bodyPostData);
+		switch ($Command->method) {
+			case 'TemplateSelector':
+				$this->TemplateSelector($f3, $Command);
+				break;
+		}
+	}
+
+	private function TemplateSelector($f3, $Command)
+	{
+		global $f3, $frameworkUtils;
 
 		$fb_template = $this->findBoxCore->CallAPI('/1.0.0/index.php/smartesl.gettemplates/1.0.0/', '[]');
 		$templates = $this->findBoxCore->getLabelsFromResponse($fb_template);
 
-		if ($args['clearcache'] == 1)
+		if ($Command->clearCache == 1)
 			$frameworkUtils->rrmdir("fbtpl");
 
 		$tplFileNames = [];
@@ -175,17 +198,23 @@ class Pages extends Controller
 			foreach($templates as $item) {
 
 				$DTs = explode(',', $item['labeltypes']);
-				if (($args['dt'] != 0) && !in_array($args['dt'], $DTs))
+				if (($Command->dt != 0) && !in_array($Command->dt, $DTs))
 					continue;
 
 				if (!file_exists("fbtpl/{$item['template_id']}.svg"))
 					$this->findBoxCore->GetTemplateImage($item['template_id']);
 
-				$tplFileNames[$item['template_id']] = file_get_contents("fbtpl/{$item['template_id']}.svg");
+				$tplFileNames["[{$item['template_id']}] {$item['name']}"] = file_get_contents("fbtpl/{$item['template_id']}.svg");
 			}
 		}
 
-		$f3->set('TPLPATH', $tplFileNames);
-		echo Template::instance()->render('templates.tpl');
+		$f3->set('TPLOBJ', $tplFileNames);
+		$tpl = Template::instance()->render('templates.tpl');
+
+		echo json_encode([
+			"err" => 0,
+			"value" => $tpl
+		]);
+
 	}
 }

ui/admin/assets/css/admin.scss

@@ -30,4 +30,21 @@ table.dataTable tr.selected td.select-checkbox:after, table.dataTable tr.selecte
 .statusmodal td {
 	margin: 0;
 	padding: 0;
-}
+}
+
+.modal-full {
+	min-width: 100%;
+	margin: 0;
+	top: 58px;
+}
+
+thead {
+	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#4b7799+0,2f373b+100 */
+	background: rgb(75,119,153); /* Old browsers */
+	background: -moz-linear-gradient(top,  rgba(75,119,153,1) 0%, rgba(47,55,59,1) 100%); /* FF3.6-15 */
+	background: -webkit-linear-gradient(top,  rgba(75,119,153,1) 0%,rgba(47,55,59,1) 100%); /* Chrome10-25,Safari5.1-6 */
+	background: linear-gradient(to bottom,  rgba(75,119,153,1) 0%,rgba(47,55,59,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4b7799', endColorstr='#2f373b',GradientType=0 ); /* IE6-9 */
+
+	color: white;
+}

ui/admin/assets/js/ModalEslDetails.js

@@ -7,7 +7,7 @@ export class ModalEslDetails {
 
 		let self = this;
 
-		$(modalClass).on('shown.bs.modal', function () {
+		$(modalClass).on('show.bs.modal', function () {
 			let labelID = $(`${modalClass} #labelID`).html();
 			self.RefreshESLStatus(labelID);
 		});

ui/admin/assets/js/OMGUtils.js

@@ -31,11 +31,3 @@ export function AjaxReq(url, options) {
 				return Promise.reject(resp);
 		});
 }
-
-Array.prototype.countOccurrences = function (column, val) {
-	return this.reduce((a, v) => (v[column] == val ? a + 1 : a), 0);
-}
-
-Array.prototype.uniq = function () {
-	return [...new Set(this)]
-};

ui/admin/assets/js/admin.js

@@ -49,27 +49,44 @@ function ESLMultiOperations(method) {
 	});
 }
 
-function TemplateSelector() {
-	$('.templateselector').on('shown.bs.modal', function () {
-		let selectedLabels = $('#datatable').DataTable().rows({selected: true}).data().toArray();
-		let labels = selectedLabels.map(v => [v[1], v[5]]);
-		let listedTypes = selectedLabels.map(v => [v[5]]);
-		console.log(listedTypes.uniq());
-		//console.log(labels.countOccurrences(1, 31));
-
-		/*
-				OMGUtils.AjaxReq(`${BASEURL}/admin/templates/@dt/@clearcache`, {
-					method: 'POST',
-					body: JSON.stringify({"method": method, "labelid": labelID[1]})
-				})
-					.then(json => {
-						if (json.err == 0)
-							toastr.success(json.value);
-						else
-							toastr.error(json.value);
-					})
-					.catch(err => toastr.error(err.url, `${err.status} (${err.statusText})`));
-		*/
+/**
+ * Load html for template selector
+ *
+ * @param bool clearCache true clear cache
+ */
+function TemplateSelector(clearCache) {
+
+	$('.templateselector').on('hide.bs.modal', function () {
+		$('.templateselector .modal-body').html('');
+	});
+
+	$('.templateselector').on('show.bs.modal', function (e) {
+		let selectedRows = $('#datatable').DataTable().rows({selected: true}).data().toArray();
+		let dt_columns = selectedRows.map(v => v[5]);
+		let jsonData = JSON.stringify(dt_columns);
+
+		console.log(selectedRows.length);
+		if (selectedRows.length == 0) {
+			toastr.warning('Nessuna label selezionata');
+			e.preventDefault();
+			e.stopImmediatePropagation();
+			return true;
+		}
+
+		$('#spinnerloader').removeClass('d-none');
+
+		OMGUtils.AjaxReq(`${BASEURL}/admin/commands`, {
+			method: 'POST',
+			body: JSON.stringify({"method": 'TemplateSelector', "clearCache": clearCache, "dt": jsonData})
+		})
+			.then(json => {
+				if (json.err == 0)
+					$('.templateselector .modal-body').html(json.value);
+				else
+					toastr.error(json.value);
+			})
+			.catch(err => toastr.error(err.url, `${err.status} (${err.statusText})`))
+			.finally(() => $('#spinnerloader').addClass('d-none'));
 	});
 
 	$('.templateselector').modal('show');

ui/admin/labelstatus.tpl

@@ -12,7 +12,7 @@
 				<!-- item-->
 				<a href="javascript:ESLMultiOperations('unbind');" class="dropdown-item">Unbind</a>
 				<!-- item-->
-				<a href="javascript:TemplateSelector();" class="dropdown-item">Change Template</a>
+				<a href="javascript:TemplateSelector(false);" class="dropdown-item">Change Template</a>
 			</div>
 		</div>
 
@@ -129,29 +129,14 @@
 
 {* Modal Template Selector*}
 <div class="modal fade templateselector" tabindex="-1" role="dialog" aria-labelledby="templateselector" aria-hidden="true" style="display: none;">
-	<div class="modal-dialog modal-dialog-centered">
+	<div class="modal-dialog modal-full modal-dialog-centered">
 		<div class="modal-content">
 			<div class="modal-header">
-				<h4 class="modal-title mt-0" id="templateselector">BBB</h4>
+				<h4 class="modal-title mt-0" id="templateselector">Template Selector</h4>
 				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
 			</div>
 
-			<div class="modal-body">
-
-				<div class="row">
-
-					<div class="col-6">
-						<div class="card">
-							<h5 class="card-header">Template</h5>
-							<div class="card-body">
-								CCC
-							</div>
-						</div>
-					</div>
-
-				</div>
-
-			</div>
+			<div class="modal-body"></div>
 		</div>
 	</div>
 </div>

ui/admin/templates.tpl

@@ -1,24 +1,11 @@
 <div class="d-flex flex-wrap">
 
-	<repeat group="{{ @TPLPATH }}" key="{{@TPL_NAME}}" value="{{@TPL}}">
+	<repeat group="{{@TPLOBJ}}" key="{{@TPL_NAME}}" value="{{@TPL}}">
 
-		<div class="card-box">
-			<div class="dropdown pull-right">
-				<a href="#" class="dropdown-toggle arrow-none card-drop" data-toggle="dropdown" aria-expanded="false">
-					<i class="mdi mdi-dots-vertical"></i>
-				</a>
-				<div class="dropdown-menu dropdown-menu-right">
-					<!-- item-->
-					<a href="javascript:void(0);" class="dropdown-item">1</a>
-					<!-- item-->
-					<a href="javascript:void(0);" class="dropdown-item">2</a>
-					<!-- item-->
-					<a href="javascript:void(0);" class="dropdown-item">3</a>
-				</div>
-			</div>
+		<div class="card-box text-white bg-secondary m-1">
 
 			<h4 class="header-title mt-0 m-b-30">{{@TPL_NAME}}</h4>
-			{{@TPL|raw}}
+			<a href="javascript:toastr.success('sdfsadf')">{{@TPL|raw}}</a>
 		</div>
 
 	</repeat>