<?php
/**
 * @version    $Id$
 * @package    IT_Theme_Framework
 * @author     InnoThemes Team <support@innothemes.com>
 * @copyright  Copyright (C) 2012 InnoThemes.com. All Rights Reserved.
 * @license    GNU/GPL v2 or later http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Websites: http://www.innothemes.com
 */

// Validate total span
$total = 0;
$n     = count( $this->value );

foreach ( $this->value as $column => $value ) {
	$total += (int) str_replace( 'col-md-', '', $value );
}

if ( $total > 12 ) {
	$span = 12 / $n;

	foreach ( $this->value as $column => $value ) {
		$this->value[ $column ] = "col-md-{$span}";
	}
}

// Get configured HTML code structure
$configured_html_order = isset( $this->html_order ) ? array_flip( $this->html_order ) : array();
?>
<div class="it-form-field-column-settings">
	<ul id="<?php $this->get( 'id' ); ?>" class="thumbnails it-sortable-list">
<?php
// Prepare columns data
$i = 0;

foreach ( $this->value as $column => $value ) :

// Prepare column name
$delimiter_position = strpos( $column, ':' );

if ( false !== $delimiter_position ) {
	$column = substr( $column, $delimiter_position + 1 );
}

// Get HTML code order
$html_order = isset( $configured_html_order[ $column ] ) ? $configured_html_order[ $column ] . ':' : '';

// Temporary manipulate name/value
$this->attributes['name']  = "{$this->name}[{$html_order}{$column}]";
$this->attributes['value'] = $value;

// Auto-generate class attribute
$class = ( 0 == $i ) ? 'first-column' : ( $i == ( $n - 1 ) ? 'last-column' : '' );

// Increase counter
$i++;
?>
		<li id="<?php $this->get( 'id' ); esc_attr_e( "-{$column}" ); ?>" class="<?php esc_attr_e( $class ); ?>">
			<div class="<?php esc_attr_e( $value ); ?>" data-target="<?php esc_attr_e( $column ); ?>">
				<div class="thumbnail">
					<div class="caption">
						<?php
						if ( $column == 'main-content' ) :
							esc_html_e( $this->choices[ $column ], IT_THEME_TEXTDOMAIN );
						else :
						?>
						<a href="<?php echo esc_url( admin_url( 'widgets.php' ) ); ?>" class="it-sidebar-settings icon-cog has-tips" original-title="<?php esc_attr_e( $this->choices[ $column ], IT_THEME_TEXTDOMAIN ); ?>" target="_blank"></a>
						<?php
						endif;
						?>
					</div>
				</div>
				<input type="hidden" <?php $this->html_attributes( array( 'autocomplete', 'class', 'id', 'placeholder', 'type' ) ); ?> />
			</div>
		</li>
<?php endforeach; ?>
	</ul>
<?php
// Load Javascript assets if not already loaded
if ( ! defined( 'IT_COLUMN_SETTINGS_LOADED' ) ) :

define( 'IT_COLUMN_SETTINGS_LOADED', true );

IT_Init_Assets::load( array( 'it-column-settings-js' ) );

// Generate sidebar settings modal
?>
	<div id="it-sidebar-settings-modal" class="hidden" title="<?php _e( 'Sidebar Settings', IT_THEME_TEXTDOMAIN ); ?>">
		<iframe src="about:blank"></iframe>
	</div>
<?php
endif;

$script = '
		$("#' . $this->get( 'id', null, true ) . '").data(
			"it_column_settings",
			new $.IT_ColumnSettings({
				id: "' . $this->get( 'id', null, true ) . '",
 				base_url: "' . admin_url( 'widgets.php' ) . '",
				columns: ' . json_encode( $this->choices ) . ',
 				html_order: ' . json_encode( $configured_html_order ) . '
			})
		);';

IT_Init_Assets::inline( 'js', $script, true );
?>
</div>
