File: //home/retile.ru/public_html/admin/view/template/extension/module/d_seo_module/target_keyword.twig
{{ header }}{{ column_left }}
<div id="content">
<div class="page-header">
<div class="container-fluid">
<div class="form-inline pull-right">
{% if (stores|length > 1) %}
<select class="form-control" onChange="location='{{ store_url }}&store_id='+$(this).val()">
{% for store in stores %}
{% if (store['store_id'] == store_id) %}
<option value="{{ store['store_id'] }}" selected="selected">{{ store['name'] }}</option>
{% else %}
<option value="{{ store['store_id'] }}">{{ store['name'] }}</option>
{% endif %}
{% endfor %}
</select>
{% endif %}
{% if (sheet_code == 'custom_page') %}
<button id="button_create_default_target_elements" data-toggle="tooltip" title="{{ button_create_default_target_keywords }}" class="btn btn-success"><i class="fa fa-cogs"></i></button>
{% endif %}
<button id="button_add" type="button" data-toggle="tooltip" title="{{ button_add_target_keyword }}" class="btn btn-primary"><i class="fa fa-plus"></i></button>
<button id="button_delete" type="button" data-toggle="tooltip" title="{{ button_delete_target_keywords }}" class="btn btn-danger"><i class="fa fa-trash-o"></i></button>
<a href="{{ cancel }}" data-toggle="tooltip" title="{{ button_cancel }}" class="btn btn-default"><i class="fa fa-reply"></i></a>
</div>
<h1>{{ heading_title }} {{ version }}</h1>
<ul class="breadcrumb">
{% for breadcrumb in breadcrumbs %}
<li><a href="{{ breadcrumb['href'] }}">{{ breadcrumb['text'] }}</a></li>
{% endfor %}
</ul>
</div>
</div>
<div class="container-fluid">
{% if error['warning'] %}
<div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i><button type="button" class="close" data-dismiss="alert">×</button> {{ error['warning'] }}</div>
{% endif %}
{% if success %}
<div class="alert alert-success"><i class="fa fa-exclamation-circle"></i><button type="button" class="close" data-dismiss="alert">×</button> {{ success }}</div>
{% endif %}
<div class="panel panel-default panel-resizable">
<div class="panel-heading">
<h3 class="panel-title"><i class="fa fa-pencil"></i> {{ text_edit }}</h3>
</div>
<div class="panel-body">
<ul class="nav nav-tabs">
<li>
<a href="{{ href_dashboard }}"><span class="fa fa-home"></span> {{ text_dashboard }}</a>
</li>
<li>
<a href="{{ href_setting }}"><span class="fa fa-cog"></span> {{ text_settings }}</a>
</li>
<li>
<a href="{{ href_multi_store_field }}"><span class="fa fa-list-alt"></span> {{ text_multi_store_fields }}</a>
</li>
<li class="active">
<a href="{{ href_target_keyword }}"><span class="fa fa-key"></span> {{ text_target_keywords }}</a>
</li>
<li>
<a href="{{ href_export_import }}"><span class="fa fa-exchange"></span> {{ text_export_import }}</a>
</li>
<li>
<a href="{{ href_instruction }}"><span class="fa fa-graduation-cap"></span> {{ text_instructions }}</a>
</li>
</ul>
<div class="page-header">
<h3><strong>{{ text_target_keywords }}</strong> <span class="info-window-item" data-href="https://opencartseomodule.com/target-keyword-planner"><i class="fa fa-question"></i></span></h3>
</div>
<ul class="nav nav-pills">
{% for sheet in sheets %}
<li {% if (sheet['code'] == sheet_code) %} class="active" {% endif %}>
<a href="{{ sheet['url'] }}"><span class="fa {{ sheet['icon'] }}"></span> {{ sheet['name'] }}</a>
</li>
{% endfor %}
</ul>
<div class="page-header">
<a id="button_filter" class="btn btn-primary pull-right"><i class="fa fa-search"></i> {{ button_filter }}</a>
{% if filter %}
<a id="button_clear_filter" class="btn btn-danger pull-right m-r-sm"><i class="fa fa-remove"></i> {{ button_clear_filter }}</a>
{% endif %}
<br class="clear"/>
</div>
<form method="post" enctype="multipart/form-data" id="form" class="form-horizontal">
<input type="hidden" name="clear_filter" value="" id="clear_filter"/>
<div class="table-responsive">
<table class="table table-bordered table-hover">
<thead>
<tr>
<td style="width: 1px;" class="text-center"><input type="checkbox" onclick="$('input[name*=\'selected\']').prop('checked', this.checked).trigger('change');" /></td>
<td class="text-center">{{ column_route }}</td>
{% for language in languages %}
<td class="text-center">{{ column_target_keyword }}({{ language['code'] }})</td>
{% endfor %}
<tr>
</thead>
<tbody>
<tr>
<td></td>
<td class="text-center"><input type="text" name="filter[route]" value="{{ filter['route'] }}" class="form-control"/></td>
{% for language in languages %}
<td class="text-center"><input type="text" name="filter[target_keyword][{{ language['language_id'] }}]" value="{{ filter['target_keyword'][language['language_id']] }}" class="form-control"/></td>
{% endfor %}
</tr>
{% if target_elements %}
{% set target_element_row = 0 %}
{% for target_element in target_elements %}
<tr>
<td class="target-element-cell text-left">
{% if (target_element['route'] in selected) %}
<input type="checkbox" name="selected[]" value="{{ target_element['route'] }}" checked="checked" />
{% else %}
<input type="checkbox" name="selected[]" value="{{ target_element['route']}}" />
{% endif %}
</td>
<td class="target-element-cell text-left">
<div class="target-field">
{% if target_element['link'] %}
<a href="{{ target_element['link'] }}" target="_blank"><span class="text-field">{{ target_element['route'] }}</span></a>
{% else %}
<span class="text-field">{{ target_element['route'] }}</span>
{% endif %}
</div>
</td>
{% for language in languages %}
<td class="target-element-cell text-left">
<div id="target_element_{{ target_element_row }}_target_keyword_{{ language['language_id'] }}" class="target-element-field" route="{{ target_element['route'] }}" language_id="{{ language['language_id'] }}">
<span class="text-field">{% for sort_order, keyword in target_element['target_keyword'][language['language_id']] %}{% if target_element['target_keyword_duplicate'][language['language_id']][sort_order] %}<span class="text-danger">[{{ keyword }}]</span>{% else %}<span>[{{ keyword }}]</span>{% endif %}{% endfor %}</span>
<textarea class="input-field form-control hide">{% for sort_order, keyword in target_element['target_keyword'][language['language_id']] %}[{{ keyword }}]{% endfor %}</textarea>
</div>
</td>
{% endfor %}
</tr>
{% set target_element_row = target_element_row + 1 %}
{% endfor %}
{% else %}
<tr>
<td class="text-center" colspan="{{ languages|length + 2 }}">{{ text_no_results }}</td>
</tr>
{% endif %}
</tbody>
</table>
</div>
<div class="row m-t-lg m-b-lg">
<div class="col-sm-6 text-left">{{ pagination }}</div>
<div class="col-sm-6 text-right">{{ results }}</div>
</div>
</form>
<div class="p-lg text-center">{{ text_powered_by }}</div>
</div>
</div>
<div class="info-window">
<div class="info-window-wrap">
<div class="info-window-block">
<div class="info-window-close"><i class="fa fa-close"></i></div>
<div class="info-window-description"></div>
</div>
</div>
</div>
<br class="clear"/>
</div>
</div>
<script type="text/javascript">
var info_window = {
'item' : new Array(),
'current_url' : ''
}
$.each($('.info-window-item'), function(key, value) {
var url = $(this).attr('data-href');
if (url) {
$.getJSON(url + '?format=json&callback=?', function(data) {
info_window.item[url] = data['description'];
});
}
});
$('.info-window-item').on('click', function() {
var url = $(this).attr('data-href');
if (url == info_window.current_url) {
info_window.current_url = '';
$('.info-window').removeClass('resized');
$('.panel-resizable').removeClass('resized');
} else {
info_window.current_url = url;
$('.info-window .info-window-description').html(info_window.item[url]);
$('.panel-resizable').addClass('resized');
$('.info-window').addClass('resized');
}
});
$('.info-window .info-window-close').on('click', function() {
info_window.current_url = '';
$('.info-window').removeClass('resized');
$('.panel-resizable').removeClass('resized');
});
update();
function update() {
$('[name^=\'selected\']').on('change', function() {
$('#button_delete').prop('disabled', true);
var selected = $('[name^=\'selected\']:checked');
if (selected.length) {
$('#button_delete').prop('disabled', false);
}
});
$('[name^=\'selected\']:first').trigger('change');
}
function refresh() {
var url = 'index.php?route={{ route }}/target_keyword&{{ url_token }}&store_id={{ store_id }}';
var sheet_code = '{{ sheet_code }}';
if (sheet_code) {
url += '&sheet_code=' + encodeURIComponent(sheet_code);
}
var page = '{{ page }}';
if (page) {
url += '&page=' + encodeURIComponent(page);
}
$("#form").load(url + ' #form >', function() {
update();
});
}
function showAlert(json) {
$('.alert').remove();
$('.form-group').removeClass('has-error');
if (json['error']) {
if (json['error']['warning']) {
if ($('#modal-dialog').length > 0) {
$('#modal-dialog .modal-body').prepend('<div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i><button type="button" class="close" data-dismiss="alert">×</button> ' + json['error']['warning'] + '</div>');
} else {
$('#content > .container-fluid').prepend('<div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i><button type="button" class="close" data-dismiss="alert">×</button> ' + json['error']['warning'] + '</div>');
}
}
for (i in json['error']) {
var element = $('#input_' + i);
if (element.parent().hasClass('input-group')) {
$(element).parent().after('<div class="text-danger">' + json['error'][i] + '</div>');
} else {
$(element).after('<div class="text-danger">' + json['error'][i] + '</div>');
}
}
$('.text-danger').parents('.form-group').addClass('has-error');
}
if (json['success']) {
$('#content > .container-fluid').prepend('<div class="alert alert-success"><i class="fa fa-check-circle"></i><button type="button" class="close" data-dismiss="alert">×</button> ' + json['success'] + '</div>');
}
}
</script>
<script type="text/javascript">
$('body').on('click', '#button_filter', function() {
$('#form').submit();
});
$('body').on('click', '#button_clear_filter', function() {
$('#clear_filter').val('1');
$('#form').submit();
});
$('body').on('click', '.target-element-cell', function() {
var target_element = $(this).children('.target-element-field');
if ($(target_element).children('.input-field').hasClass('hide') && ($(target_element).children('.input-field').attr('type') != 'hidden')) {
$('.popover').popover('hide', function() {
$('.popover').remove();
});
$('.text-field').removeClass('hide');
$('.input-field').addClass('hide');
$(target_element).popover({
html: true,
placement: 'top',
trigger: 'manual',
content: function() {
return '<button type="button" id="button_save" class="btn btn-primary" target_element_field_id="' + target_element.attr('id') + '"><i class="fa fa-save"></i></button> <button type="button" id="button_cancel" class="btn btn-danger" target_element_field_id="' + target_element.attr('id') + '"><i class="fa fa-remove"></i></button>';
}
});
$(target_element).popover('show');
$(target_element).children('.text-field').addClass('hide');
$(target_element).children('.input-field').removeClass('hide');
}
});
$('body').on('click', '#button_save', function() {
var target_element = $('#' + $(this).attr('target_element_field_id'));
var route = $(target_element).attr('route');
var language_id = $(target_element).attr('language_id');
var target_keyword = $(target_element).children('.input-field').val();
$.ajax({
url: 'index.php?route={{ route }}/editTargetElement&{{ url_token }}&store_id={{ store_id }}',
type: 'post',
data: 'route=' + route + '&language_id=' + language_id + '&target_keyword=' + encodeURIComponent(target_keyword),
dataType: 'json',
success: function(json) {
showAlert(json);
$(target_element).popover('hide', function() {
$('.popover').remove();
});
setTimeout(function() {
if (json['error'].length == 0) {
$(target_element).children('.text-field').text($(target_element).children('.input-field').val());
refresh();
} else {
$(target_element).children('.input-field').val($(target_element).children('.text-field').text().replace(/<.*?>/g, ''));
}
$(target_element).children('.text-field').removeClass('hide');
$(target_element).children('.input-field').addClass('hide');
}, 200);
},
error: function(xhr, ajaxOptions, thrownError) {
console.log(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
});
$('body').on('click', '#button_cancel', function() {
var target_element = $('#' + $(this).attr('target_element_field_id'));
$(target_element).popover('hide', function() {
$('.popover').remove();
});
setTimeout(function() {
$(target_element).children('.input-field').val($(target_element).children('.text-field').text().replace(/<.*?>/g, ''));
$(target_element).children('.text-field').removeClass('hide');
$(target_element).children('.input-field').addClass('hide');
}, 200);
});
$('body').on('click', '#button_create_default_target_elements', function() {
if (confirm("{{ text_create_default_target_keywords_confirm }}")) {
$.ajax({
url: 'index.php?route={{ route }}/createDefaultTargetElements&{{ url_token }}&store_id={{ store_id }}',
type: 'post',
data: '',
dataType: 'json',
success: function(json) {
showAlert(json);
if (json['success']) {
$('#modal-dialog').modal('hide');
refresh();
}
},
error: function(xhr, ajaxOptions, thrownError) {
console.log(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
}
});
$('body').on('click', '#button_add', function() {
modal_html = '<div id="modal-dialog" class="modal"><div class="modal-dialog modal-lg"><div class="modal-content"><div class="modal-header"><button type="button" class="close" data-dismiss="modal" aria-hidden="true">X</button><h4 class="modal-title">{{ text_add_target_keyword }}</h4></div>';
modal_html += '<div class="modal-body"><div class="form-horizontal">';
modal_html += '<div class="row"><label class="col-sm-3 control-label" for="input-custom-page-route">{{ entry_route }}</label><div class="col-sm-9"><input type="text" name="target_element[route]" value="" id="input_target_element_route" class="form-control"/></div></div><br/>';
modal_html += '<div class="row"><label class="col-sm-3 control-label" for="input-custom-page-seo-keyword">{{ entry_target_keyword }}</label><div class="col-sm-9">';
{% for language in languages %}
modal_html += '<div class="input-group"><span class="input-group-addon"><img src="{{ language['flag'] }}" title="{{ language['name'] }}"></span><textarea name="target_element[target_keyword][{{ language['language_id'] }}]" id="input_target_element_target_keyword_{{ language['language_id'] }}" class="form-control"></textarea></div>';
{% endfor %}
modal_html += '</div></div>';
modal_html += '</div></div>';
modal_html += '<div class="modal-footer"><button type="button" data-toggle="tooltip" title="{{ button_add_target_keyword }}" id="button_add_target_element" class="btn btn-primary">{{ button_add_target_keyword }}</button></div>';
modal_html += '</div></div></div>';
$('#modal-dialog').remove();
$('body').append(modal_html);
$('#modal-dialog').modal('show');
});
$('body').on('click', '#button_add_target_element', function() {
$.ajax({
type: 'post',
url: 'index.php?route={{ route }}/addTargetElement&{{ url_token }}&store_id={{ store_id }}',
data: $('[name^="target_element"]'),
dataType: 'json',
success: function(json) {
showAlert(json);
if (json['success']) {
$('#modal-dialog').modal('hide');
refresh();
}
},
error: function(xhr, ajaxOptions, thrownError) {
console.log(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
});
$('body').on('click', '#button_delete', function() {
if (confirm('{{ text_delete_target_keywords_confirm }}')) {
$.ajax({
type: 'post',
url: 'index.php?route={{ route }}/deleteTargetElements&{{ url_token }}&store_id={{ store_id }}',
data: $('#form').serialize(),
dataType: 'json',
success: function(json) {
showAlert(json);
if (json['success']) {
refresh();
}
},
error: function(xhr, ajaxOptions, thrownError) {
console.log(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
}
});
</script>
{{ footer }}