<?php

class Skyhaus_Customizer_Control_Repeater extends Skyhaus_Customizer_Control_Base {
	static function field_template() {
		?>
		<script type="text/html" id="tmpl-field-skyhaus-repeater">
			<?php
			self::before_field();
			?>
			<?php echo self::field_header(); ?>
			<div class="skyhaus-field-settings-inner">
			</div>
			<?php
			self::after_field();
			?>
		</script>
		<script type="text/html" id="tmpl-customize-control-repeater-item">
			<div class="skyhaus--repeater-item">
				<div class="skyhaus--repeater-item-heading">
					<label class="skyhaus--repeater-visible" title="<?php esc_attr_e( 'Toggle item visible', 'skyhaus' ); ?>">
						<input type="checkbox" class="r-visible-input">
						<span class="r-visible-icon"></span>
						<span class="screen-reader-text"><?php _e( 'Show', 'skyhaus' ); ?></label>
					<span class="skyhaus--repeater-live-title"></span>
					<div class="skyhaus-nav-reorder">
						<span class="skyhaus--down" tabindex="-1">
							<span class="screen-reader-text"><?php _e( 'Move Down', 'skyhaus' ); ?></span></span>
						<span class="skyhaus--up" tabindex="0">
							<span class="screen-reader-text"><?php _e( 'Move Up', 'skyhaus' ); ?></span>
						</span>
					</div>
					<a href="#" class="skyhaus--repeater-item-toggle">
						<span class="screen-reader-text"><?php _e( 'Close', 'skyhaus' ); ?></span></a>
				</div>
				<div class="skyhaus--repeater-item-settings">
					<div class="skyhaus--repeater-item-inside">
						<div class="skyhaus--repeater-item-inner"></div>
						<# if ( data.addable ){ #>
						<a href="#" class="skyhaus--remove"><?php _e( 'Remove', 'skyhaus' ); ?></a>
						<# } #>
					</div>
				</div>
			</div>
		</script>
		<script type="text/html" id="tmpl-customize-control-repeater-inner">
			<div class="skyhaus--repeater-inner">
				<div class="skyhaus--settings-fields skyhaus--repeater-items"></div>
				<div class="skyhaus--repeater-actions">
				<a href="#" class="skyhaus--repeater-reorder"
				data-text="<?php esc_attr_e( 'Reorder', 'skyhaus' ); ?>"
				data-done="<?php _e( 'Done', 'skyhaus' ); ?>"><?php _e( 'Reorder', 'skyhaus' ); ?></a>
					<# if ( data.addable ){ #>
					<button type="button"
							class="button skyhaus--repeater-add-new"><?php _e( 'Add an item', 'skyhaus' ); ?></button>
					<# } #>
				</div>
			</div>
		</script>
		<?php
	}
}
