{include file='include/colorbox.inc.tpl'}

{combine_script id='jquery.ajaxmanager' load='footer' path='themes/default/js/plugins/jquery.ajaxmanager.js'}
{combine_script id='jquery.tokeninput' load='async' require='jquery' path='themes/default/js/plugins/jquery.tokeninput.js'}
{combine_script id='piwecard' load="footer" path='plugins/Piwecard/js/piwecard.js'}
{combine_script id='colorpicker' load="footer" path='plugins/Piwecard/js/colorpicker/js/colorpicker.js'}
{combine_css path="plugins/Piwecard/js/colorpicker/css/colorpicker.css"}
{combine_css path='themes/default/js/plugins/jquery.tokeninput.css'}

{footer_script require="piwecard"}
{literal}
var queuedManager = $.manageAjax.create('queued', { 
	queue: true,  
	cacheResponse: false,
	maxRequests: 3
});

function previewEmail(format_message, message) {
	queuedManager.add({
		type: 'GET', 
		url: 'ws.php', 
		data: {method: 'pwg.piwecard.previewEmail', format: 'json', format_message: format_message, message: message},
		dataType: 'json',
		success: (function(data) {
			if (data.stat =='ok') {
				$("#previewEmail").html(data.result.message);
				$.colorbox({
					inline:true,
					href:"#previewEmail",
					onComplete: function(){
						$("#cboxLoadedContent").css('text-align', 'left');
					}
				});
			}
		})
	});
};

$(document).ready(function(){
	if ($("#ecard_email_format_text").prop('checked') == true) {
		$("#ecard_form_line_default_text").css("display","inline");
	} else {
		$("#ecard_form_line_default_text").css("display","none");
	}
	if ($("#ecard_email_format_html").prop('checked') == true) {
		$("#ecard_form_line_default_html").css("display","inline");
	} else {
		$("#ecard_form_line_default_html").css("display","none");
	}

	$("#ECardAdminConfiguration").click(function(){
		if ($("#ecard_email_format_text").prop('checked') == true) {
			$("#ecard_form_line_default_text").css("display","inline");
		} else {
			$("#ecard_form_line_default_text").css("display","none");
			$("#ecard_email_format_default_html").prop('checked', true);
		}
		if ($("#ecard_email_format_html").prop('checked') == true) {
			$("#ecard_form_line_default_html").css("display","inline");
		} else {
			$("#ecard_form_line_default_html").css("display","none");
			$("#ecard_email_format_default_text").prop('checked', true);
		}
	});
	
	if ($("#ecard_image_border").prop('checked') == true) {
		$("#ecard_image_border_options").css("display","block");
	} else {
		$("#ecard_image_border_options").css("display","none");
	}

	$("#ecard_image_border").change(function(){
		if ($("#ecard_image_border").prop('checked') == true) {
			$("#ecard_image_border_options").show("fast");
		} else {
			$("#ecard_image_border_options").hide("fast");
		}
	});
	
	$('#ecard_image_border_color').ColorPicker({
		onSubmit: function(hsb, hex, rgb, element) {
			$(element).val(hex);
			$(element).ColorPickerHide();
		},
		onBeforeShow: function () {
			$(this).ColorPickerSetColor(this.value);
		},
		onChange: function (hsb, hex, rgb) {
			$('#ecard_image_border_color').val(hex);
		}
	})
	.bind('keyup', function(){
		$(this).ColorPickerSetColor(this.value);
	});
	
	$("#showPreviewImageBorder").colorbox({
		inline:true,
		href:"#previewImageBorder",
		onOpen:function(){
			if ($("#ecard_image_border").prop('checked') == true) {
				$("#previewImageBorderImg").css("border-style", $("#ecard_image_border_style").val());
				$("#previewImageBorderImg").css("border-width", $("#ecard_image_border_width").val());
				$("#previewImageBorderImg").css("border-color", "#"+$("#ecard_image_border_color").val());
			}
		}
	});
	
	$('#showPreviewTextMessage').click(function () {
		var format_message = 'text';
		var message = $('#ecard_email_message_text').val();
		
		previewEmail(format_message, message);
	});
	$('#showPreviewHTMLMessage').click(function () {
		var format_message = 'html';
		var message = $('#ecard_email_message_html').val();

		previewEmail(format_message, message);
	});
});

function piwecard_checkForm(form) {
	var nbMaxRecipientsOK = piwecard_checkField(form.ecard_nb_max_recipients, 2, 'inline');
	var guestEmailOK = piwecard_checkField(form.ecard_default_guest_email, 1, 'block', true);
	var subjectOK = piwecard_checkField(form.ecard_email_subject, 0, 'block');
	var messageTextOK = piwecard_checkField(form.ecard_email_message_text, 0, 'block');
	var messageHTMLOK = piwecard_checkField(form.ecard_email_message_html, 0, 'block');
	
	if(nbMaxRecipientsOK && guestEmailOK && subjectOK && messageTextOK && messageHTMLOK)
		return true;
	else
		return false;
}
{/literal}
{/footer_script}
{footer_script require='jquery.tokeninput'}
jQuery(document).ready(function() {ldelim}
	jQuery('select[name="ecard_validity_list"]').tokenInput(
		[{foreach from=$validity item=validity_item name=validity}{ldelim}"{$validity_item|@escape:'javascript'}"{rdelim}{if !$smarty.foreach.validity.last},{/if}{/foreach}],
    {ldelim}
		searchDelay: 0,
		minChars: 1,
		hintText: '',
		noResultsText: '',
		searchingText: '',
		newText: '',
		animateDropdown: false,
		preventDuplicates: true,
		allowFreeTagging: true,
		onAdd:function(item){ldelim}$("<option value=\""+item.name+"\">"+((item.name == '0') ? "{'piwecard_nolimit'|@translate}" : item.name+" {'piwecard_days'|@translate}")+"</option>").appendTo("#ecard_validity_default");{rdelim},
		onDelete:function(item){ldelim}$("#ecard_validity_default option[value="+item.name+"]").remove();{rdelim},
    }
  );
});
{/footer_script}

<div class="titrePage">
  <h2>{'piwecard_plugin'|@translate}</h2>
</div>
<div id="ECardAdminConfiguration">
	<form method="post" action="" onsubmit="return piwecard_checkForm(this);">
		<fieldset>
			<legend>{'piwecard_configuration'|@translate}</legend>
			<div class="ecard_form_line">
				<label for="ecard_nb_max_recipients">{'piwecard_nb_max_recipients'|@translate} </label>
				<input type="text" maxlength="3" size="3" name="ecard_nb_max_recipients" id="ecard_nb_max_recipients" value="{$ecard_nb_max_recipients}" />
				<span class="ecard_error" id="ecard_nb_max_recipients_error">{'piwecard_error'|@translate} {'piwecard_error_integer'|@translate}</span>
			</div>
			<div class="ecard_form_line">
				{'piwecard_validity_list'|@translate}
				<span class="ecard_error" id="ecard_validity_list_error" style="{$ecard_errors.validity.style_error_text}">{'piwecard_error'|@translate} {'piwecard_error_validity_list'|@translate}</span>
				<select id="ecard_validity_list" name="ecard_validity_list">
					{foreach from=$ecard_validity_list item=ecard_validity_item}
						<option value="{$ecard_validity_item}">{$ecard_validity_item}</option>
					{/foreach}
				</select>
			</div>
			<div class="ecard_form_line">
				{'piwecard_validity_default'|@translate}
				<select id="ecard_validity_default" name="ecard_validity_default">
					{foreach from=$ecard_validity item=ecard_validity_item}
						<option value="{$ecard_validity_item.id}" {$ecard_validity_item.selected}>{$ecard_validity_item.name}</option>
					{/foreach}
				</select>
			</div>
			<div class="ecard_form_line">
				<input type="checkbox" name="ecard_validity_choice" id="ecard_validity_choice" {$ecard_validity_choice} value="1" />
				<label for="ecard_validity_choice"> {'piwecard_validity_choice'|@translate}</label>
			</div>
			<div class="ecard_form_line">
				<input type="checkbox" name="ecard_show_image_infos" id="ecard_show_image_infos" {$ecard_show_image_infos} value="1" />
				<label for="ecard_show_image_infos"> {'piwecard_show_image_infos'|@translate}</label>
			</div>
			<div class="ecard_form_line">
				<div>
					{'piwecard_ecard_derivative'|@translate}
				</div>
				{foreach from=$generate_derivatives_types key=type item=item}
					<label><input type="radio" name="ecard_image_size" value="{$type}" {$item.selected}/> {$item.name}</label>
				{/foreach}
			</div>
			<div class="ecard_form_line">
				<div>
					<input type="checkbox" name="ecard_image_border" id="ecard_image_border" {$ecard_image_border} value="1" />
					<label for="ecard_image_border"> {'piwecard_image_border'|@translate}</label>
					(<a href="javascript:void(0);" id="showPreviewImageBorder" title="{'piwecard_preview'|@translate}">{'piwecard_preview'|@translate}</a>)
				</div>
				<div id="ecard_image_border_options">
					<span>
						<label for="ecard_image_border_style">{'piwecard_image_border_style'|@translate}</label>
						<select name="ecard_image_border_style" id="ecard_image_border_style">
							<option value="solid" {$ecard_image_border_style.solid}>{'piwecard_image_border_solid'|@translate}</option>
							<option value="dashed" {$ecard_image_border_style.dashed}>{'piwecard_image_border_dashed'|@translate}</option>
							<option value="dotted" {$ecard_image_border_style.dotted}>{'piwecard_image_border_dotted'|@translate}</option>
							<option value="double"{$ecard_image_border_style.double}>{'piwecard_image_border_double'|@translate}</option>
						</select>
					</span>
					<span>
						<label for="ecard_image_border_width">{'piwecard_image_border_width'|@translate}</label>
						<input type="text" size="6" maxlength="20" name="ecard_image_border_width" id="ecard_image_border_width" value="{$ecard_image_border_width}" />
					</span>
					<span>
						<label for="ecard_image_border_color">{'piwecard_image_border_color'|@translate}</label>
						<input type="text" maxlength="6" size="6" name="ecard_image_border_color" id="ecard_image_border_color" value="{$ecard_image_border_color}" />
					</span>
				</div>
			</div>
		</fieldset>
		<fieldset>
			<legend>{'piwecard_email_configuration'|@translate}</legend>
			<div class="ecard_form_line">
				<input type="checkbox" name="ecard_sender_copy" id="ecard_sender_copy" {$ecard_sender_copy}/><label for="ecard_sender_copy"> {'piwecard_sender_copy'|@translate}</label>
			</div>
			<div class="ecard_form_line">
				<input type="checkbox" name="ecard_sender_email_change" id="ecard_sender_email_change" {$ecard_sender_email_change}/><label for="ecard_sender_email_change"> {'piwecard_sender_email_change'|@translate}</label>
			</div>
			<div class="ecard_form_line">
				<div>
					{'piwecard_email_format'|@translate}
				</div>
				<div>
					{foreach from=$ecard_email_format item=ecard_email_format_item}
						<span><input type="checkbox" name="ecard_email_format[{$ecard_email_format_item.id}]" id="ecard_email_format_{$ecard_email_format_item.id}" value="{$ecard_email_format_item.id}" {$ecard_email_format_item.selected}/><label for="ecard_email_format_{$ecard_email_format_item.id}"> {$ecard_email_format_item.language_string|@translate}</label></span>
					{/foreach}
				</div>
				<div>
					{'piwecard_email_format_default'|@translate}
				</div>
				<div>
					{foreach from=$ecard_email_format_default item=ecard_email_format_default_item}
						<span id="ecard_form_line_default_{$ecard_email_format_default_item.id}"><input type="radio" name="ecard_email_format_default" id="ecard_email_format_default_{$ecard_email_format_default_item.id}" value="{$ecard_email_format_default_item.id}" {$ecard_email_format_default_item.selected_default}/><label for="ecard_email_format_default_{$ecard_email_format_default_item.id}"> {$ecard_email_format_default_item.language_string|@translate}</label></span>
					{/foreach}
					<span class="ecard_error" id="ecard_email_format_default_error" style="{$piwecard_errors.email_format_default.style_error_text}">{'piwecard_error'|@translate} {'piwecard_email_format_default_error'|@translate}</span>
				</div>
			</div>
			<div class="ecard_form_line ecard_email_config">
				<label for="ecard_default_guest_email">{'piwecard_default_guest_email'|@translate}</label><span class="ecard_error" id="ecard_default_guest_email_error" style="{$ecard_errors.default_guest_email.style_error_text}"> {'piwecard_error'|@translate} {'piwecard_error_email'|@translate}</span>
				<input type="text" maxlength="50" name="ecard_default_guest_email" id="ecard_default_guest_email" {$ecard_errors.default_guest_email.style_error_input} value="{$ecard_default_guest_email}" onblur="piwecard_checkField(this, 1, true);" />
			</div>
			<div class="ecard_form_line ecard_email_config">
				<label for="ecard_email_subject">{'piwecard_email_subject'|@translate}*</label><span class="ecard_error" id="ecard_email_subject_error" style="{$ecard_errors.email_subject.style_error_text}"> {'piwecard_error'|@translate} {'piwecard_error_text'|@translate}</span>
				<input type="text" maxlength="255" name="ecard_email_subject" id="ecard_email_subject" {$ecard_errors.email_subject.style_error_input} value="{$ecard_email_subject}" />
			</div>
			<div class="ecard_form_line ecard_email_config">
				<label for="ecard_email_message_text">{'piwecard_email_message_text'|@translate}*</label><span class="ecard_error" id="ecard_email_message_text_error" style="{$ecard_errors.email_message.text.style_error_text}"> {'piwecard_error'|@translate} {'piwecard_error_text'|@translate}</span>
				(<a href="javascript:void(0);" id="showPreviewTextMessage" title="{'piwecard_preview'|@translate}">{'piwecard_preview'|@translate}</a>)
				<textarea name="ecard_email_message_text" id="ecard_email_message_text" {$ecard_errors.email_message.text.style_error_input}>{$ecard_email_message_text}</textarea>
			</div>
			<div class="ecard_form_line ecard_email_config">
				<label for="ecard_email_message_html">{'piwecard_email_message_html'|@translate}*</label><span class="ecard_error" id="ecard_email_message_html_error" style="{$ecard_errors.email_message.html.style_error_text}"> {'piwecard_error'|@translate} {'piwecard_error_text'|@translate}</span>
				(<a href="javascript:void(0);" id="showPreviewHTMLMessage" title="{'piwecard_preview'|@translate}">{'piwecard_preview'|@translate}</a>)
				<textarea name="ecard_email_message_html" id="ecard_email_message_html" {$ecard_errors.email_message.html.style_error_input}>{$ecard_email_message_html}</textarea>
			</div>
			<div id="ecard_form_line ecard_parameters_description">
				<div id="ecard_form_line">
					<span class="ecard_parameters_description_parameter">{'Parameters'|@translate}</span>
				</div>
				<div id="ecard_form_line">
					<span class="ecard_parameters_description_parameter">%yourname% : </span><span class="ecard_parameters_description_text">{'piwecard_sender_name'|@translate}</span><br />
					<span class="ecard_parameters_description_parameter">%youremail% : </span><span class="ecard_parameters_description_text">{'piwecard_sender_email'|@translate}</span><br />
					<span class="ecard_parameters_description_parameter">%recipientname% : </span><span class="ecard_parameters_description_text">{'piwecard_recipient_name'|@translate}</span><br />
					<span class="ecard_parameters_description_parameter">%recipientemail% : </span><span class="ecard_parameters_description_text">{'piwecard_recipient_email'|@translate}</span><br />
					<span class="ecard_parameters_description_parameter">%website% : </span><span class="ecard_parameters_description_text">{'Gallery title'|@translate}</span><br />
					<span class="ecard_parameters_description_parameter">%websiteurl% : </span><span class="ecard_parameters_description_text">{'piwecard_website_url'|@translate}</span><br />
					<span class="ecard_parameters_description_parameter">%ecardurl% : </span><span class="ecard_parameters_description_text">{'piwecard_ecard_url'|@translate}</span><br />
					<span class="ecard_parameters_description_parameter">%ecardsubject% : </span><span class="ecard_parameters_description_text">{'piwecard_ecard_subject'|@translate}</span><br />
					<span class="ecard_parameters_description_parameter">%ecardmessage% : </span><span class="ecard_parameters_description_text">{'piwecard_ecard_message'|@translate}</span><br />
					<span class="ecard_parameters_description_parameter">%pictureurl% : </span><span class="ecard_parameters_description_text">{'piwecard_ecard_image_url'|@translate}</span><br />
					<span class="ecard_parameters_description_parameter">%pictureinfos% : </span><span class="ecard_parameters_description_text">{'piwecard_ecard_image_infos'|@translate}</span>
				</div>
			</div>
		</fieldset>
		<div id="ecard_submit">
			<input type="submit" class="submit" name="submit" value="{'Submit'|@translate}" />
			<input type="submit" class="submit" name="reset" value="{'piwicard_email_reset'|@translate}" />
		</div>
	</form>
</div>
<div style="display:none">
	<div id="previewImageBorder">
		<img alt="{'piwecard_preview_image_border'|@translate}" id="previewImageBorderImg" src="{$preview_image}"/>
	</div>
</div>
<div style="display:none">
	<div id="previewEmail">
	</div>
</div>