344 lines
18 KiB
HTML
344 lines
18 KiB
HTML
{extends file="admin-layout.tpl"}
|
||
|
||
{block name="no-return-functions"}
|
||
{$admin_current_location = 'configuration'}
|
||
{/block}
|
||
|
||
{block name="page-title"}{intl l='Edit a mailing template'}{/block}
|
||
|
||
{block name="check-resource"}admin.configuration.message{/block}
|
||
{block name="check-access"}update{/block}
|
||
|
||
{block name="main-content"}
|
||
<div class="messages edit-message">
|
||
|
||
<div id="wrapper" class="container">
|
||
|
||
{loop name="message_edit" type="message" secured="*" id="$message_id" backend_context="1" lang="$edit_language_id"}
|
||
|
||
<ul class="breadcrumb">
|
||
<li><a href="{url path='/admin/home'}">{intl l="Home"}</a></li>
|
||
<li><a href="{url path='/admin/configuration'}">{intl l="Configuration"}</a></li>
|
||
<li><a href="{url path='/admin/configuration/messages'}">{intl l="Mailing templates"}</a></li>
|
||
<li>{intl l='Editing mailing template "%name"' name={$NAME}}</li>
|
||
</ul>
|
||
|
||
{hook name="message-edit.top" message_id=$message_id}
|
||
|
||
<div class="row">
|
||
<div class="col-md-12 general-block-decorator">
|
||
<div class="row">
|
||
<div class="col-md-12 ">
|
||
<div class="title">
|
||
{intl l='Edit mailing template "%name"' name={$NAME}}
|
||
</div>
|
||
|
||
<ul class="nav nav-tabs" id="tabbed-menu">
|
||
<li class="active"><a href="#data" data-toggle="tab">{intl l="Message data"}</a></li>
|
||
<li><a href="#preview" data-toggle="tab">{intl l="Preview"}</a></li>
|
||
</ul>
|
||
|
||
<div class="tab-content">
|
||
<div class="tab-pane fade in active" id="data">
|
||
|
||
<div class="form-container">
|
||
<div class="col-md-12">
|
||
{form name="thelia.admin.message.modification"}
|
||
<form method="POST" action="{url path='/admin/configuration/messages/save'}" {form_enctype}>
|
||
|
||
{* Be sure to get the message ID, even if the form could not be validated *}
|
||
<input type="hidden" name="message_id" value="{$message_id}" />
|
||
|
||
{include file="includes/inner-form-toolbar.html" close_url="{url path='/admin/configuration/messages'}"}
|
||
|
||
{form_hidden_fields exclude="success_url,locale"}
|
||
|
||
{render_form_field field='success_url' value="{url path='/admin/configuration/messages'}"}
|
||
{render_form_field field='locale' value="{$edit_language_locale}"}
|
||
|
||
{if $form_error}<div class="alert alert-danger">{$form_error_message}</div>{/if}
|
||
|
||
{render_form_field field='name'}
|
||
{render_form_field field='secured'}
|
||
{render_form_field field='title'}
|
||
{render_form_field field='subject'}
|
||
|
||
|
||
<div class="panel panel-default">
|
||
<div class="panel-heading"><h3 class="panel-title">{intl l="HTML version of this message"}</h3></div>
|
||
|
||
<div class="panel-body">
|
||
<div class="row">
|
||
<div class="col-md-6">
|
||
{custom_render_form_field field='html_layout_file_name'}
|
||
<select {form_field_attributes field='html_layout_file_name'}>
|
||
<option value="">{intl l='Use default layout'}</option>
|
||
{foreach $layout_list as $layout}
|
||
<option value="{$layout}" {if $layout == $value}selected="selected"{/if}>{$layout}</option>
|
||
{/foreach}
|
||
</select>
|
||
{/custom_render_form_field}
|
||
</div>
|
||
|
||
<div class="col-md-6">
|
||
{custom_render_form_field field='html_template_file_name'}
|
||
<select data-toggle-textarea="html_message" {form_field_attributes field='html_template_file_name' extra_class="textarea-toggle"}>
|
||
<option value="">{intl l='Use HTML message defined below'}</option>
|
||
{foreach $html_template_list as $template}
|
||
<option value="{$template}" {if $template == $value}selected="selected"{/if}>{$template}</option>
|
||
{/foreach}
|
||
</select>
|
||
{if ! empty($value)}{$disable_html='readonly="true"'}{/if}
|
||
{/custom_render_form_field}
|
||
</div>
|
||
</div>
|
||
|
||
<div class="row">
|
||
<div class="col-md-12">
|
||
{custom_render_form_field field='html_message'}
|
||
<textarea {$disable_html} {form_field_attributes field='html_message' extra_class="fixedfont"}>{$value nofilter}</textarea>
|
||
<div id="{$name}" style="height: 500px;"></div>
|
||
{/custom_render_form_field}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="panel panel-default">
|
||
<div class="panel-heading"><h3 class="panel-title">{intl l="Text version of this message"}</h3></div>
|
||
|
||
<div class="panel-body">
|
||
<div class="row">
|
||
<div class="col-md-6">
|
||
{custom_render_form_field field='text_layout_file_name'}
|
||
<select {form_field_attributes field='text_layout_file_name'}>
|
||
<option value="">{intl l='Use default layout'}</option>
|
||
{foreach $layout_list as $layout}
|
||
<option value="{$layout}" {if $layout == $value}selected="selected"{/if}>{$layout}</option>
|
||
{/foreach}
|
||
</select>
|
||
{/custom_render_form_field}
|
||
</div>
|
||
|
||
<div class="col-md-6">
|
||
{custom_render_form_field field='text_template_file_name'}
|
||
<select data-toggle-textarea="text_message" {form_field_attributes field='text_template_file_name' extra_class='textarea-toggle'}>
|
||
<option value="">{intl l='Use Text message defined below'}</option>
|
||
{foreach $text_template_list as $template}
|
||
<option value="{$template}" {if $template == $value}selected="selected"{/if}>{$template}</option>
|
||
{/foreach}
|
||
</select>
|
||
{if ! empty($value)}{$disable_text='readonly="true"'}{/if}
|
||
{/custom_render_form_field}
|
||
</div>
|
||
</div>
|
||
|
||
<div class="row">
|
||
<div class="col-md-12">
|
||
{custom_render_form_field field='text_message'}
|
||
<textarea {$disable_html} {form_field_attributes field='text_message' extra_class="fixedfont"}>{$value nofilter}</textarea>
|
||
<div id="{$name}" style="height: 500px;"></div>
|
||
</div>
|
||
{/custom_render_form_field}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<p>{intl l='Message created on %date_create. Last modification: %date_change' date_create="{format_date date=$CREATE_DATE}" date_change="{format_date date=$UPDATE_DATE}"}</p>
|
||
</div>
|
||
|
||
</form>
|
||
{/form}
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<div class="tab-pane fade" id="preview">
|
||
|
||
<br/>
|
||
<div class="row">
|
||
<div class="col-md-12">
|
||
<button class="btn btn-default btn-primary preview-button" data-url="{url path='/admin/message/preview/%id' id=$ID}">
|
||
{intl l="Preview HTML"}
|
||
</button>
|
||
|
||
<button class="btn btn-default preview-button" data-url="{url path='/admin/message/preview/text/%id' id=$ID}">
|
||
{intl l="Preview text"}
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="table-responsive">
|
||
<table class="table table-striped" id="url-variable-table">
|
||
<caption class="clearfix">
|
||
{intl l="Variables to inject"}
|
||
|
||
<div class="pull-right">
|
||
<a href="#" class="url-variable-table-add">
|
||
<i class="glyphicon glyphicon-plus"></i>
|
||
</a>
|
||
</div>
|
||
</caption>
|
||
<thead>
|
||
<tr>
|
||
<th>
|
||
{intl l='Name'}
|
||
</th>
|
||
|
||
<th>
|
||
{intl l='Value'}
|
||
</th>
|
||
</tr>
|
||
</thead>
|
||
|
||
<tbody>
|
||
<tr class='url-variable'>
|
||
<td>
|
||
<input type='text' class='url-variable-key form-control' />
|
||
</td>
|
||
|
||
<td>
|
||
<input type='text' class='url-variable-value form-control' />
|
||
</td>
|
||
</tr>
|
||
|
||
<tr class='url-variable'>
|
||
<td>
|
||
<input type='text' class='url-variable-key form-control' />
|
||
</td>
|
||
|
||
<td>
|
||
<input type='text' class='url-variable-value form-control' />
|
||
</td>
|
||
</tr>
|
||
|
||
<tr class='url-variable'>
|
||
<td>
|
||
<input type='text' class='url-variable-key form-control' />
|
||
</td>
|
||
|
||
<td>
|
||
<input type='text' class='url-variable-value form-control' />
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
|
||
</div><!--/tab-content-->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
{hook name="message-edit.bottom" message_id=$message_id}
|
||
|
||
{/loop}
|
||
|
||
{elseloop rel="message_edit"}
|
||
<div class="row">
|
||
<div class="col-md-12">
|
||
<div class="alert alert-error">
|
||
{intl l="Sorry, message ID=%id was not found." id={$message_id}}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
{/elseloop}
|
||
|
||
</div>
|
||
</div>
|
||
|
||
<div id="preview-modal" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
|
||
<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">×</button>
|
||
</div>
|
||
<div class="modal-body"></div>
|
||
<div class="modal-footer">
|
||
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
{/block}
|
||
|
||
{block name="javascript-initialization"}
|
||
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.1.9/ace.js"></script>
|
||
<script>
|
||
(function($) {
|
||
|
||
var editor = {
|
||
"text_message": null,
|
||
"html_message": null
|
||
};
|
||
|
||
$('select.textarea-toggle').change(function(ev) {
|
||
var aceEditor = editor[$(this).data('toggle-textarea')];
|
||
if ($(this).val() != '') {
|
||
aceEditor.setReadOnly(true);
|
||
$(this).parents(".row").next().slideUp()
|
||
} else {
|
||
aceEditor.setReadOnly(false);
|
||
$(this).parents(".row").next().slideDown()
|
||
}
|
||
});
|
||
|
||
var elems = ["html_message", "text_message"];
|
||
$.each(elems, function(index, value){
|
||
editor[value] = ace.edit('thelia_message_modification[' + value + ']');
|
||
var textarea = $('textarea[name="thelia_message_modification[' + value + ']"]').hide();
|
||
|
||
editor[value].setTheme("ace/theme/monokai");
|
||
editor[value].getSession().setMode("ace/mode/smarty");
|
||
editor[value].setValue(textarea.text());
|
||
editor[value].getSelection().clearSelection();
|
||
|
||
editor[value].getSession().on("change", function () {
|
||
textarea.text(editor[value].getSession().getValue());
|
||
});
|
||
});
|
||
|
||
$('select.textarea-toggle').change();
|
||
|
||
$('.preview-button').click(function(){
|
||
var url = $(this).data("url");
|
||
url += "?";
|
||
|
||
$('.url-variable').each(function(){
|
||
var key = $('.url-variable-key', $(this)).val();
|
||
var value = $('.url-variable-value', $(this)).val();
|
||
|
||
if (key != '' && value != '') {
|
||
url += key + '=' + value + '&';
|
||
}
|
||
});
|
||
|
||
|
||
$(".modal-body", "#preview-modal").html(
|
||
$("<iframe frameborder=0 height='"+$(window).innerHeight()+"px' width='100%' src='"+url+"'/>")
|
||
|
||
);
|
||
|
||
$("#preview-modal").modal("show");
|
||
});
|
||
|
||
$('.url-variable-table-add').click(function() {
|
||
var $line = $("<tr class='url-variable'><td><input type='text' class='url-variable-key form-control' /></td>" +
|
||
"<td><input type='text' class='url-variable-value form-control' /></td></tr>");
|
||
|
||
$("tbody", '#url-variable-table').prepend($line);
|
||
});
|
||
|
||
})(jQuery);
|
||
</script>
|
||
{/block}
|
||
|
||
{block name="javascript-last-call"}
|
||
{hook name="message.edit-js" location="message-edit-js" message_id={$message_id} }
|
||
{/block}
|