<?php

if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

?>
<div id="wpps-media-folders-sidebar" class="wpps-media-folders-sidebar <?php echo $visible ? '' : 'wpps-sidebar-hidden'; ?>" data-taxonomy="<?php echo esc_attr( $taxonomy ); ?>">
	<button type="button" class="wpps-sidebar-show-tab" aria-label="<?php esc_attr_e( 'Show folders', 'wppowersuite-lite' ); ?>" title="<?php esc_attr_e( 'Show folders', 'wppowersuite-lite' ); ?>">
		<span class="dashicons dashicons-portfolio"></span>
		<span class="wpps-sidebar-show-tab-label"><?php esc_html_e( 'Folders', 'wppowersuite-lite' ); ?></span>
	</button>
	<div class="wpps-sidebar-inner">
		<div class="wpps-sidebar-header">
			<span class="wpps-sidebar-title"><?php esc_html_e( 'Folders', 'wppowersuite-lite' ); ?></span>
			<?php if ( ! empty( $can_manage_settings ) ) : ?>
			<button type="button" class="wpps-sidebar-settings" aria-label="<?php esc_attr_e( 'Settings', 'wppowersuite-lite' ); ?>" title="<?php esc_attr_e( 'Settings', 'wppowersuite-lite' ); ?>">
				<span class="dashicons dashicons-admin-generic"></span>
			</button>
			<?php endif; ?>
			<button type="button" class="wpps-sidebar-toggle" aria-label="<?php esc_attr_e( 'Toggle sidebar', 'wppowersuite-lite' ); ?>">
				<span class="dashicons dashicons-arrow-left-alt2"></span>
			</button>
		</div>
		<div class="wpps-sidebar-nav">
			<a href="<?php echo esc_url( $base_url ); ?>" class="wpps-nav-item <?php echo $current === '' ? 'wpps-nav-active' : ''; ?>" draggable="false">
				<span class="dashicons dashicons-portfolio"></span>
				<?php esc_html_e( 'All Media', 'wppowersuite-lite' ); ?>
				<span class="wpps-count">(<?php echo (int) $all_count; ?>)</span>
			</a>
			<a href="<?php echo esc_url( add_query_arg( $taxonomy, '-1', $base_url ) ); ?>" class="wpps-nav-item <?php echo $current === '-1' ? 'wpps-nav-active' : ''; ?>" draggable="false">
				<span class="dashicons dashicons-category"></span>
				<?php esc_html_e( 'Unassigned', 'wppowersuite-lite' ); ?>
				<span class="wpps-count">(<?php echo (int) $unassigned; ?>)</span>
			</a>
		</div>
		<div class="wpps-sidebar-folders">
			<div class="wpps-folders-toolbar">
				<input type="text" class="wpps-new-folder-input" placeholder="<?php esc_attr_e( 'New folder name', 'wppowersuite-lite' ); ?>" />
				<button type="button" class="button button-small wpps-add-folder-btn"><?php esc_html_e( 'Add', 'wppowersuite-lite' ); ?></button>
			</div>
			<ul class="wpps-folder-tree" data-parent="0">
				<?php
				foreach ( $folder_tree as $term ) {
					$is_top_level = true;
					require __DIR__ . '/media-sidebar-folder-item.php';
				}
				?>
			</ul>
		</div>
	</div>
	<template id="wpps-add-subfolder-form-tpl">
		<li class="wpps-add-subfolder-form">
			<span class="wpps-add-subfolder-input-wrap">
				<input type="text" class="wpps-add-subfolder-input" placeholder="<?php esc_attr_e( 'Subfolder name', 'wppowersuite-lite' ); ?>" />
				<button type="button" class="button button-small wpps-add-subfolder-save"><?php esc_html_e( 'Add', 'wppowersuite-lite' ); ?></button>
				<button type="button" class="button button-small wpps-add-subfolder-cancel"><?php esc_html_e( 'Cancel', 'wppowersuite-lite' ); ?></button>
			</span>
		</li>
	</template>
	<div class="wpps-sidebar-resize-handle" aria-hidden="true"></div>
</div>

<?php if ( ! empty( $can_manage_settings ) ) : ?>
<div id="wpps-folders-settings-modal" class="wpps-modal" role="dialog" aria-labelledby="wpps-settings-modal-title" style="display: none;">
	<div class="wpps-modal-backdrop"></div>
	<div class="wpps-modal-content">
		<div class="wpps-modal-header">
			<h3 id="wpps-settings-modal-title"><?php esc_html_e( 'Categorize Media – Settings', 'wppowersuite-lite' ); ?></h3>
			<button type="button" class="wpps-modal-close" aria-label="<?php esc_attr_e( 'Close', 'wppowersuite-lite' ); ?>">&times;</button>
		</div>
		<div class="wpps-modal-body">
			<p class="wpps-field">
				<label for="wpps-settings-sidebar-width"><?php esc_html_e( 'Sidebar width (px)', 'wppowersuite-lite' ); ?></label>
				<input type="number" id="wpps-settings-sidebar-width" class="small-text" min="200" max="400" value="<?php echo esc_attr( (string) $width ); ?>" />
			</p>
			<?php if ( ! empty( $can_manage_settings ) ) : ?>
			<p class="wpps-field">
				<label for="wpps-settings-default-folder"><?php esc_html_e( 'Default folder for new uploads', 'wppowersuite-lite' ); ?></label>
				<select id="wpps-settings-default-folder">
					<option value="0" <?php selected( $default_folder, 0 ); ?>><?php esc_html_e( '— None —', 'wppowersuite-lite' ); ?></option>
					<?php foreach ( $all_terms as $t ) : ?>
						<option value="<?php echo esc_attr( (string) $t->term_id ); ?>" <?php selected( $default_folder, $t->term_id ); ?>><?php echo esc_html( $t->name ); ?></option>
					<?php endforeach; ?>
				</select>
			</p>
			<?php endif; ?>
		</div>
		<div class="wpps-modal-footer">
			<button type="button" class="button wpps-modal-cancel"><?php esc_html_e( 'Cancel', 'wppowersuite-lite' ); ?></button>
			<button type="button" class="button button-primary wpps-settings-save"><?php esc_html_e( 'Save', 'wppowersuite-lite' ); ?></button>
		</div>
	</div>
</div>
<?php endif; ?>

<div id="wpps-edit-folder-modal" class="wpps-modal" role="dialog" aria-labelledby="wpps-edit-modal-title" style="display: none;">
	<div class="wpps-modal-backdrop"></div>
	<div class="wpps-modal-content">
		<div class="wpps-modal-header">
			<h3 id="wpps-edit-modal-title"><?php esc_html_e( 'Edit folder', 'wppowersuite-lite' ); ?></h3>
			<button type="button" class="wpps-modal-close" aria-label="<?php esc_attr_e( 'Close', 'wppowersuite-lite' ); ?>">&times;</button>
		</div>
		<div class="wpps-modal-body">
			<input type="hidden" id="wpps-edit-term-id" value="" />
			<p class="wpps-field">
				<label for="wpps-edit-folder-name"><?php esc_html_e( 'Name', 'wppowersuite-lite' ); ?></label>
				<input type="text" id="wpps-edit-folder-name" class="regular-text" />
			</p>
			<p class="wpps-field">
				<label for="wpps-edit-parent-id"><?php esc_html_e( 'Parent folder', 'wppowersuite-lite' ); ?></label>
				<select id="wpps-edit-parent-id" class="regular-text"></select>
			</p>
		</div>
		<div class="wpps-modal-footer">
			<button type="button" class="button wpps-modal-cancel"><?php esc_html_e( 'Cancel', 'wppowersuite-lite' ); ?></button>
			<button type="button" class="button button-primary wpps-edit-save"><?php esc_html_e( 'Save', 'wppowersuite-lite' ); ?></button>
		</div>
	</div>
</div>
