Slowly working on the edit nav item modal
This commit is contained in:
parent
6b05ee31ab
commit
944552aba2
@ -25,7 +25,7 @@ require_once(HESK_PATH . 'inc/headerAdmin.inc.php');
|
|||||||
/* Print main manage users page */
|
/* Print main manage users page */
|
||||||
require_once(HESK_PATH . 'inc/show_admin_nav.inc.php');
|
require_once(HESK_PATH . 'inc/show_admin_nav.inc.php');
|
||||||
?>
|
?>
|
||||||
<div class="content-wrapper">
|
<div class="content-wrapper">
|
||||||
<section class="content">
|
<section class="content">
|
||||||
<div class="box">
|
<div class="box">
|
||||||
<div class="box-header with-border">
|
<div class="box-header with-border">
|
||||||
@ -64,7 +64,11 @@ require_once(HESK_PATH . 'inc/show_admin_nav.inc.php');
|
|||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody id="table-body">
|
<tbody id="table-body">
|
||||||
|
<tr id="loader">
|
||||||
|
<td colspan="6">
|
||||||
|
<i class="fa fa-spinner fa-spin"></i> Loading Custom Nav Elements…
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
@ -72,7 +76,105 @@ require_once(HESK_PATH . 'inc/show_admin_nav.inc.php');
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
</div>
|
||||||
|
<div class="modal fade" id="nav-element-modal" tabindex="-1" role="dialog" style="overflow: hidden">
|
||||||
|
<div class="modal-dialog modal-lg" role="document">
|
||||||
|
<div class="modal-content">
|
||||||
|
<div class="modal-header" style="cursor: move">
|
||||||
|
<button type="button" class="close cancel-callback" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||||
|
<h4 class="modal-title" id="myModalLabel">
|
||||||
|
<?php echo 'Edit Custom Nav Element'; ?>
|
||||||
|
</h4>
|
||||||
</div>
|
</div>
|
||||||
|
<form id="create-form" class="form-horizontal" data-toggle="validator">
|
||||||
|
<div class="modal-body">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-12">
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="place" class="col-md-4 col-sm-12 control-label">Place[!]</label>
|
||||||
|
<div class="col-md-8 col-sm-12">
|
||||||
|
<select name="place" id="place" class="form-control">
|
||||||
|
<option value="1">Homepage - Block</option>
|
||||||
|
<option value="2">Customer Navbar</option>
|
||||||
|
<option value="3">Staff Navbar</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-6 col-sm-12">
|
||||||
|
<h4>Text[!]</h4>
|
||||||
|
<?php foreach ($hesk_settings['languages'] as $language => $value): ?>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="text[<?php echo $language; ?>]" class="col-md-4 col-sm-12 control-label">
|
||||||
|
<?php echo $language; ?>
|
||||||
|
</label>
|
||||||
|
<div class="col-md-8 col-sm-12">
|
||||||
|
<input type="text" name="text[<?php echo $language; ?>]" class="form-control"
|
||||||
|
data-text-language="<?php echo $language; ?>"
|
||||||
|
id="text[<?php echo $language; ?>" placeholder="<?php echo $language; ?>">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<?php endforeach; ?>
|
||||||
|
<div id="subtext">
|
||||||
|
<h4>Subtext[!]</h4>
|
||||||
|
<?php foreach ($hesk_settings['languages'] as $language => $value): ?>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="subtext[<?php echo $language; ?>]" class="col-md-4 col-sm-12 control-label">
|
||||||
|
<?php echo $language; ?>
|
||||||
|
</label>
|
||||||
|
<div class="col-md-8 col-sm-12">
|
||||||
|
<input type="text" name="subtext[<?php echo $language; ?>]" class="form-control"
|
||||||
|
data-subtext-language="<?php echo $language; ?>"
|
||||||
|
id="subtext[<?php echo $language; ?>" placeholder="<?php echo $language; ?>">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<?php endforeach; ?>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-6 col-sm-12">
|
||||||
|
<h4>Image[!]</h4>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="image-type" class="col-md-4 col-sm-12 control-label">Image Type[!]</label>
|
||||||
|
<div class="col-md-8 col-sm-12">
|
||||||
|
<select name="image-type" id="image-type" class="form-control">
|
||||||
|
<option value="image-url">Image URL</option>
|
||||||
|
<option value="font-icon">Font Icon</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form-group" id="image-url-group">
|
||||||
|
<label for="image-url" class="col-md-4 col-sm-12 control-label">Image URL [!]</label>
|
||||||
|
<div class="col-md-8 col-sm-12">
|
||||||
|
<input type="text" class="form-control" placeholder="Image URL[!]">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form-group" id="font-icon-group">
|
||||||
|
<label for="font-icon" class="col-md-4 col-sm-12 control-label">Font Icon [!]</label>
|
||||||
|
<div class="col-md-8 col-sm-12">
|
||||||
|
<span>Iconpicker</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="modal-footer">
|
||||||
|
<div class="btn-group">
|
||||||
|
<button type="button" class="btn btn-default cancel-callback" data-dismiss="modal">
|
||||||
|
<i class="fa fa-times-circle"></i>
|
||||||
|
<span><?php echo $hesklang['cancel']; ?></span>
|
||||||
|
</button>
|
||||||
|
<button type="button" class="btn btn-success callback-btn">
|
||||||
|
<i class="fa fa-check-circle"></i>
|
||||||
|
<span><?php echo $hesklang['save']; ?></span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<p style="display: none" id="lang_edit"><?php echo $hesklang['edit']; ?></p>
|
<p style="display: none" id="lang_edit"><?php echo $hesklang['edit']; ?></p>
|
||||||
<p style="display: none" id="lang_delete"><?php echo $hesklang['delete']; ?></p>
|
<p style="display: none" id="lang_delete"><?php echo $hesklang['delete']; ?></p>
|
||||||
<script type="text/html" id="nav-element-template">
|
<script type="text/html" id="nav-element-template">
|
||||||
@ -83,6 +185,7 @@ require_once(HESK_PATH . 'inc/show_admin_nav.inc.php');
|
|||||||
</span></td>
|
</span></td>
|
||||||
<td><span data-property="subtext"></span></td>
|
<td><span data-property="subtext"></span></td>
|
||||||
<td><span data-property="image-or-font"></span></td>
|
<td><span data-property="image-or-font"></span></td>
|
||||||
|
<td style="display: none"><span data-property="place-id"></span></td>
|
||||||
<td><span data-property="place"></span></td>
|
<td><span data-property="place"></span></td>
|
||||||
<td>
|
<td>
|
||||||
<a href="#" data-action="edit">
|
<a href="#" data-action="edit">
|
||||||
|
@ -1,10 +1,22 @@
|
|||||||
$(document).ready(function() {
|
$(document).ready(function() {
|
||||||
var heskUrl = $('#heskUrl').text();
|
loadTable();
|
||||||
|
|
||||||
|
$(document).on('click', '[data-action="edit"]', function() {
|
||||||
|
var $tableRow = $(this).parent().parent();
|
||||||
|
var $modal = $('#nav-element-modal');
|
||||||
|
|
||||||
|
$modal.find('select[name="place"]').val($tableRow.find('[data-property="place-id"]').text());
|
||||||
|
|
||||||
|
$modal.modal('show');
|
||||||
|
})
|
||||||
|
});
|
||||||
|
|
||||||
|
function loadTable() {
|
||||||
|
var heskUrl = $('#heskUrl').text();
|
||||||
var places = [];
|
var places = [];
|
||||||
places[1] = 'Homepage - Block';
|
places[1] = 'Homepage - Block';
|
||||||
places[2] = 'Customer Navigation';
|
places[2] = 'Customer Navbar';
|
||||||
places[3] = 'Staff Navigation';
|
places[3] = 'Staff Navbar';
|
||||||
|
|
||||||
$.ajax({
|
$.ajax({
|
||||||
method: 'GET',
|
method: 'GET',
|
||||||
@ -13,8 +25,7 @@ $(document).ready(function() {
|
|||||||
success: function(data) {
|
success: function(data) {
|
||||||
$.each(data, function() {
|
$.each(data, function() {
|
||||||
var $template = $($('#nav-element-template').html());
|
var $template = $($('#nav-element-template').html());
|
||||||
//var $template = $(template);
|
|
||||||
console.log($template);
|
|
||||||
$template.find('span[data-property="id"]').text(this.id);
|
$template.find('span[data-property="id"]').text(this.id);
|
||||||
if (this.imageUrl === null) {
|
if (this.imageUrl === null) {
|
||||||
$template.find('span[data-property="image-or-font"]').html('<i class="' + escape(this.fontIcon) + '"></i>');
|
$template.find('span[data-property="image-or-font"]').html('<i class="' + escape(this.fontIcon) + '"></i>');
|
||||||
@ -23,6 +34,7 @@ $(document).ready(function() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
$template.find('span[data-property="place"]').text(places[this.place]);
|
$template.find('span[data-property="place"]').text(places[this.place]);
|
||||||
|
$template.find('span[data-property="place-id"]').text(this.place);
|
||||||
|
|
||||||
var text = '';
|
var text = '';
|
||||||
$.each(this.text, function(key, value) {
|
$.each(this.text, function(key, value) {
|
||||||
@ -30,21 +42,35 @@ $(document).ready(function() {
|
|||||||
});
|
});
|
||||||
$template.find('ul[data-property="text"]').html(text);
|
$template.find('ul[data-property="text"]').html(text);
|
||||||
|
|
||||||
$.each(this.subtext, function() {
|
var subtext = '-';
|
||||||
console.log(this);
|
if (this.place == 1) {
|
||||||
|
subtext = '';
|
||||||
|
$.each(this.subtext, function(key, value) {
|
||||||
|
subtext += '<li><b>' + escape(key) + ':</b> ' + escape(value) + '</li>';
|
||||||
});
|
});
|
||||||
|
}
|
||||||
|
$template.find('ul[data-property="subtext"]').html(text);
|
||||||
|
|
||||||
$('#table-body').append($template);
|
$('#table-body').append($template);
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
error: function(data) {
|
error: function(data) {
|
||||||
console.error(data);
|
console.error(data);
|
||||||
|
},
|
||||||
|
complete: function() {
|
||||||
|
$('#loader').hide();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
}
|
||||||
|
|
||||||
function escape(str) {
|
function escape(str) {
|
||||||
var div = document.createElement('div');
|
var div = document.createElement('div');
|
||||||
div.appendChild(document.createTextNode(str));
|
div.appendChild(document.createTextNode(str));
|
||||||
return div.innerHTML;
|
return div.innerHTML;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function displayModal(element) {
|
||||||
|
var creatingElement = element === undefined;
|
||||||
|
|
||||||
|
var $form = $('#nav-element-modal').find('form');
|
||||||
|
}
|
Loading…
x
Reference in New Issue
Block a user