{{ header }}{{ column_left }} 
<div id="content"><div class="container-fluid">
	<div class="page-header">
	    <h1>Blog Related Posts</h1>
	    <ul class="breadcrumb">
		     {% for breadcrumb in breadcrumbs %} 
		      <li><a href="{{ breadcrumb['href'] }}">{{ breadcrumb['text'] }}</a></li>
		      {% endfor %} 
	    </ul>
	  </div>
	  
<link href='https://fonts.googleapis.com/css?family=Poppins:700,600,500,400,300' rel='stylesheet' type='text/css'>
	
	<script type="text/javascript">
	$.fn.tabs = function() {
		var selector = this;
		
		this.each(function() {
			var obj = $(this); 
			
			$(obj.attr('href')).hide();
			
			$(obj).click(function() {
				$(selector).removeClass('selected');
				
				$(selector).each(function(i, element) {
					$($(element).attr('href')).hide();
				});
				
				$(this).addClass('selected');
				
				$($(this).attr('href')).show();
				
				return false;
			});
		});
	
		$(this).show();
		
		$(this).first().click();
	};
	</script>

	{% if (error_warning) %} 
		<div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i> {{ error_warning }} 
		  <button type="button" class="close" data-dismiss="alert">&times;</button>
		</div>
	{% elseif (success) %} 
		<div class="alert alert-success"><i class="fa fa-exclamation-circle"></i> {{ success }} 
			<button type="button" class="close" data-dismiss="alert">&times;</button>
		</div>
	{% endif %} 
	
	<form action="{{ action }}" method="post" enctype="multipart/form-data" id="form">
		<div class="set-size" id="blog_related_post">
			<div class="content">
				<div>
					<div class="tabs clearfix">
						<!-- Tabs module -->
						<div id="tabs" class="htabs main-tabs">
							{% set module_row = 1 %} 
							{% for module in modules %} 
							<a href="#tab-module-{{ module_row }}" id="module-{{ module_row }}">Module {{ module_row }} &nbsp;<img src="view/image/module_template/delete-slider.png"  alt="" onclick="$('.vtabs a:first').trigger('click'); $('#module-{{ module_row }}').remove(); $('#tab-module-{{ module_row }}').remove(); return false;" /></a>
							{% set module_row = module_row + 1 %} 
							{% endfor %} 
							<span id="module-add" onclick="addModule();" ><img src="view/image/module_template/add.png" alt="" />Add<br> Module</span>
						</div>
						
						{% set module_row = 1 %} 
						{% for module in modules %} 
						<div id="tab-module-{{ module_row }}" class="tab-content">
                            <div id="language-{{ module_row }}" class="htabs">
                              {% for language in languages %} 
                              <a href="#tab-language-{{ module_row }}-{{ language['language_id'] }}"><img src="language/{{ language['code'] }}/{{ language['code'] }}.png" title="{{ language['name'] }}" /> {{ language['name'] }}</a>
                              {% endfor %} 
                            </div>
                            {% for language in languages %} 
                            <div id="tab-language-{{ module_row }}-{{ language['language_id'] }}">
                              <div class="block{{ module_row }}">
                                  <table class="form">
                                    <tr>
                                      <td>Block heading:</td>
                                      <td><input type="text" value="{{ module['heading_title'][language['language_id']] is defined ? module['heading_title'][language['language_id']] : '' }}" name="blog_related_post_module[{{ module_row }}][heading_title][{{ language['language_id'] }}]" style="width:250px"></td>
                                    </tr>
                                  </table>	
                              </div>
                            </div>
                            {% endfor %} 
							<table class="form">
							  <tr>
							    <td>Layout:</td>
							    <td><select name="blog_related_post_module[{{ module_row }}][layout_id]">
							    	{% if (99999 == module['layout_id']) %} 
							    	<option value="99999" selected="selected">All pages</option>
							    	{% else %} 
							    	<option value="99999">All pages</option>
							    	{% endif %} 
							        {% for layout in layouts %} 
							        {% if (layout['layout_id'] == module['layout_id']) %} 
							        <option value="{{ layout['layout_id'] }}" selected="selected">{{ layout['name'] }}</option>
							        {% else %} 
							        <option value="{{ layout['layout_id'] }}">{{ layout['name'] }}</option>
							        {% endif %} 
							        {% endfor %} 
							      </select></td>
							  </tr>
							  <tr>
							    <td>Position:</td>
							    <td><select name="blog_related_post_module[{{ module_row }}][position]">
						     	{% if (module['position'] == 'header_notice') %} 
						     	<option value="header_notice" selected="selected">Header notice</option>
						     	{% else %} 
						     	<option value="header_notice">Header notice</option>
						     	{% endif %} 
						     	{% if (module['position'] == 'header_block') %} 
						     	<option value="header_block" selected="selected">Header block</option>
						     	{% else %} 
						     	<option value="header_block">Header block</option>
						     	{% endif %} 
							    	{% if (module['position'] == 'menu') %} 
							    	<option value="menu" selected="selected">Menu</option>
							    	{% else %} 
							    	<option value="menu">Menu</option>
							    	{% endif %} 
							    	{% if (module['position'] == 'slideshow') %} 
							    	<option value="slideshow" selected="selected">Slideshow</option>
							    	{% else %} 
							    	<option value="slideshow">Slideshow</option>
							    	{% endif %} 
							    	{% if (module['position'] == 'preface_left') %} 
							    	<option value="preface_left" selected="selected">Preface left</option>
							    	{% else %} 
							    	<option value="preface_left">Preface left</option>
							    	{% endif %} 
							    	{% if (module['position'] == 'preface_right') %} 
							    	<option value="preface_right" selected="selected">Preface right</option>
							    	{% else %} 
							    	<option value="preface_right">Preface right</option>
							    	{% endif %} 
							    	{% if (module['position'] == 'preface_fullwidth') %} 
							    	<option value="preface_fullwidth" selected="selected">Preface fullwidth</option>
							    	{% else %} 
							    	<option value="preface_fullwidth">Preface fullwidth</option>
							    	{% endif %} 
							    	{% if (module['position'] == 'column_left') %} 
							    	<option value="column_left" selected="selected">Column left</option>
							    	{% else %} 
							    	<option value="column_left">Column left</option>
							    	{% endif %} 
							    	{% if (module['position'] == 'content_big_column') %} 
							    	<option value="content_big_column" selected="selected">Content big column</option>
							    	{% else %} 
							    	<option value="content_big_column">Content big column</option>
							    	{% endif %} 
							    	{% if (module['position'] == 'content_top') %} 
							    	<option value="content_top" selected="selected">Content top</option>
							    	{% else %} 
							    	<option value="content_top">Content top</option>
							    	{% endif %} 
							    	{% if (module['position'] == 'column_right') %} 
							    	<option value="column_right" selected="selected">Column right</option>
							    	{% else %} 
							    	<option value="column_right">Column right</option>
							    	{% endif %} 
							    	{% if (module['position'] == 'content_bottom') %} 
							    	<option value="content_bottom" selected="selected">Content bottom</option>
							    	{% else %} 
							    	<option value="content_bottom">Content bottom</option>
							    	{% endif %} 
							    	{% if (module['position'] == 'blog_center') %} 
							    	<option value="blog_center" selected="selected">Blog center</option>
							    	{% else %} 
							    	<option value="blog_center">Blog center</option>
							    	{% endif %} 
							    	{% if (module['position'] == 'customfooter_top') %} 
							    	<option value="customfooter_top" selected="selected">CustomFooter Top</option>
							    	{% else %} 
							    	<option value="customfooter_top">CustomFooter Top</option>
							    	{% endif %} 
							    	{% if (module['position'] == 'customfooter_bottom') %} 
							    	<option value="customfooter_bottom" selected="selected">CustomFooter Bottom</option>
							    	{% else %} 
							    	<option value="customfooter_bottom">CustomFooter Bottom</option>
							    	{% endif %} 
							    	{% if (module['position'] == 'footer_top') %} 
							    	<option value="footer_top" selected="selected">Footer top</option>
							    	{% else %} 
							    	<option value="footer_top">Footer top</option>
							    	{% endif %} 
							    	{% if (module['position'] == 'footer_left') %} 
							    	<option value="footer_left" selected="selected">Footer left</option>
							    	{% else %} 
							    	<option value="footer_left">Footer left</option>
							    	{% endif %} 
							    	{% if (module['position'] == 'footer_right') %} 
							    	<option value="footer_right" selected="selected">Footer right</option>
							    	{% else %} 
							    	<option value="footer_right">Footer right</option>
							    	{% endif %} 
							    	{% if (module['position'] == 'footer_bottom') %} 
							    	<option value="footer_bottom" selected="selected">Footer bottom</option>
							    	{% else %} 
							    	<option value="footer_bottom">Footer bottom</option>
							    	{% endif %} 
							    	{% if (module['position'] == 'bottom') %} 
							    	<option value="bottom" selected="selected">Bottom</option>
							    	{% else %} 
							    	<option value="bottom">Bottom</option>
							    	{% endif %} 
							      </select></td>
							  </tr>
                              <tr>
                                  
                              <tr>
                                    <td>Template</td>
                                    <td>
                                        <div class="module-layouts">
                                             {% for template in templates %} 
 {% if (article_popular_templates[template] is defined) %}
 {% set i = 0 %}
 {{ '<div class="module-layout-title">' ~ template ~ '</div>' }}
 {% for file_template in article_popular_templates[template] %} 
 
                                                        <div class="module-layout clearfix">
                                                            <input type="radio" name="blog_related_post_module[{{ module_row }}][template]" value="{{ file_template }}" {% if (module['template'] is defined and module['template']|replace({ '.tpl': '.twig' }) == file_template) %} {{ 'checked="checked"' }}{% endif %} class="input-article-popular-template">
                                                            <p>{{ file_template }}</p>
                                                        </div>
                                                         {% set i = i + 1 %}
 {% endfor %}
 {% endif %}
 {% endfor %}
 
                                        </div>
                                    </td>
                              </tr>
							  <tr>
							    <td>Status:</td>
							    <td><select name="blog_related_post_module[{{ module_row }}][status]">
							        {% if (module['status']) %} 
							        <option value="1" selected="selected">Enabled</option>
							        <option value="0">Disabled</option>
							        {% else %} 
							        <option value="1">Enabled</option>
							        <option value="0" selected="selected">Disabled</option>
							        {% endif %} 
							      </select></td>
							  </tr>
                              <tr>
                                    <td>Image dimension (W x H)</td>
                                    <td>
                                        <input type="text" name="blog_related_post_module[{{ module_row }}][thumb_width]" value="{{ module['thumb_width'] }}"  style="width: 60px; display: inline-block; margin-right: 0;"/>
                                        x
                                        <input type="text" name="blog_related_post_module[{{ module_row }}][thumb_height]" value="{{ module['thumb_height'] }}"  style="width: 60px; display: inline-block; margin-right: 0;"/>
                                    </td>
                              </tr>
                              <tr>
							    <td>Articles Limit:</td>
							    <td><input type="text" name="blog_related_post_module[{{ module_row }}][articles_limit]" value="{{ module['articles_limit'] }}" size="3" /></td>
							  </tr>
                              <tr>
							    <td>Sort Order:</td>
							    <td><input type="text" name="blog_related_post_module[{{ module_row }}][sort_order]" value="{{ module['sort_order'] }}" size="3" /></td>
							  </tr>
                              
							</table>
						</div>
						{% set module_row = module_row + 1 %} 
						{% endfor %} 
					</div>
					
					<!-- Buttons -->
					<div class="buttons"><input type="submit" name="button-save" class="button-save" value=""></div>
				</div>
			</div>
		</div>
	</form>
</div>
<script type="text/javascript"><!--
$('.main-tabs a').tabs();
//--></script> 

<script type="text/javascript"><!--
{% set module_row = 1 %} 
{% for module in modules %} 
$('#language-{{ module_row }} a').tabs();
{% set module_row = module_row + 1 %} 
{% endfor %} 
//--></script> 

<script type="text/javascript"><!--
{% set module_row = 1 %} 
{% for module in modules %} 
{% set module_row = module_row + 1 %} 
{% endfor %} 
//--></script> 

<script type="text/javascript"><!--
var module_row = {{ module_row }};

function addModule() {	
	html  = '<div id="tab-module-' + module_row + '" class="tab-content">';
		
		html += '  <div id="language-' + module_row + '" class="htabs">';
	    {% for language in languages %} 
	    html += '    <a href="#tab-language-'+ module_row + '-{{ language['language_id'] }}"><img src="language/{{ language['code'] }}/{{ language['code'] }}.png" title="{{ language['name'] }}" /> {{ language['name'] }}</a>';
	    {% endfor %} 
		html += '  </div>';

		{% for language in languages %} 
		html += '    <div id="tab-language-'+ module_row + '-{{ language['language_id'] }}">';
		
		html += '	 <div class="block' + module_row + '">';
		html += '	   <table class="form">';
		html += '			<tr>';
		html += '				<td>Block heading:</td>';
		html += '				<td><input type="text" value="" name="blog_related_post_module[' + module_row + '][heading_title][{{ language['language_id'] }}]" style="width:250px"></td>';
		html += '			</tr>';
		html += '	   </table>';
		html += '	 </div>';
		
		html += '    </div>';
		{% endfor %}  
        
        
		html += '  <table class="form">';
		html += '    <tr>';
		html += '      <td>Layout:</td>';
		html += '      <td><select name="blog_related_post_module[' + module_row + '][layout_id]">';
		html += '           <option value="99999">All pages</option>';
		{% for layout in layouts %} 
		html += '           <option value="{{ layout['layout_id'] }}">{{ layout['name']|e('html') }}</option>';
		{% endfor %} 
		html += '      </select></td>';
		html += '    </tr>';
		html += '    <tr>';
		html += '      <td>Position:</td>';
		html += '      <td><select name="blog_related_post_module[' + module_row + '][position]">';
		html += '       		<option value="header_notice">Header notice</option>';
		html += '       		<option value="menu">Menu</option>';
		html += '				<option value="slideshow">Slideshow</option>';
		html += '				<option value="preface_left">Preface left</option>';
		html += '				<option value="preface_right">Preface right</option>';
		html += '				<option value="preface_fullwidth">Preface fullwidth</option>';
		html += '				<option value="column_left">Column left</option>';
		html += '				<option value="content_big_column">Content big column</option>';
		html += '				<option value="content_top">Content top</option>';
		html += '				<option value="column_right">Column right</option>';
		html += '				<option value="content_bottom">Content bottom</option>';
		html += '				<option value="blog_center">Blog center</option>';
		html += '				<option value="customfooter_top">CustomFooter Top</option>';
		html += '				<option value="customfooter_bottom">CustomFooter Bottom</option>';
		html += '				<option value="footer_top">Footer top</option>';
		html += '				<option value="footer_left">Footer left</option>';
		html += '				<option value="footer_right">Footer right</option>';
		html += '				<option value="footer_bottom">Footer bottom</option>';
		html += '				<option value="bottom">Bottom</option>';
		html += '      </select></td>';
		html += '    </tr>';
        html += '    <tr>';
        html += '		<td>Template</td>';
        html += '       <td>';
        html += '			<div class="module-layouts">';
                                {% for template in templates %} 
                                        {% if (article_popular_templates[template] is defined) %} 
                                                    {% set i = 0 %} 
        html += '                                   <div class="module-layout-title">{{ template }}</div>';
                                                    {% for file_template in article_popular_templates[template] %} 
        html += '                                   <div class="module-layout clearfix">';
        html += '                                       <input type="radio" name="blog_related_post_module[{{ module_row }}][template]" value="{{ file_template }}"  class="input-article-popular-template">';
        html += '                                       <p>{{ file_template }}</p>';
        html += '                                   </div>';
                                                         {% set i = i + 1 %}
 {% endfor %}
 {% endif %}
 {% endfor %}
 
        html += '                   </div>';
        html += '           </td>';
        html += '     </tr> ';  
		html += '    <tr>';
		html += '      <td>Status:</td>';
		html += '      <td><select name="blog_related_post_module[' + module_row + '][status]">';
		html += '        <option value="1">Enabled</option>';
		html += '        <option value="0">Disabled</option>';
		html += '      </select></td>';
		html += '    </tr>';
        html += '    <tr>';
        html += '       <td>Image dimension (W x H)</td>';
        html += '       <td>';
        html += '          <input type="text" name="blog_related_post_module[{{ module_row }}][thumb_width]" value=""  style="width: 60px; display: inline-block; margin-right: 0;"/>';
        html += '           x';
        html += '           <input type="text" name="blog_related_post_module[{{ module_row }}][thumb_height]" value=""  style="width: 60px; display: inline-block; margin-right: 0;"/>';
        html += '       </td>';
        html += '    </tr>';
		html += '    <tr>';
		html += '      <td>Articles Limit:</td>';
		html += '      <td><input type="text" name="blog_related_post_module[' + module_row + '][articles_limit]" value="" size="3" /></td>';
		html += '    </tr>';
		html += '    <tr>';
		html += '      <td>Sort Order:</td>';
		html += '      <td><input type="text" name="blog_related_post_module[' + module_row + '][sort_order]" value="" size="3" /></td>';
		html += '    </tr>';
		html += '  </table>'; 
	html += '</div>';
	
	$('.tabs').append(html);
	
	$('#language-' + module_row + ' a').tabs();

	$('#module-add').before('<a href="#tab-module-' + module_row + '" id="module-' + module_row + '">Module ' + module_row + ' &nbsp;<img src="view/image/module_template/delete-slider.png" alt="" onclick="$(\'.vtabs a:first\').trigger(\'click\'); $(\'#module-' + module_row + '\').remove(); $(\'#tab-module-' + module_row + '\').remove(); return false;" /></a>');
	
	$('.main-tabs a').tabs();
	
	$('#module-' + module_row).trigger('click');
	
	{% for language in languages %} 
		$('#html-' + module_row + '-{{ language['language_id'] }}, #block-content-{{ module_row }}-{{ language['language_id'] }}').summernote({
			height: 300
		});
	{% endfor %} 
	
	module_row++;
}
//--></script> 
{{ footer }}