<?php
$translate = $this->plugin('translate');
$escape = $this->plugin('escapeHtml');
$this->headScript()->appendFile($this->assetUrl('js/item-manage-media.js', 'Omeka'));

$primaryMediaId = null;
if ($resource) {
    $primaryMedia = $resource->primaryMedia();
    $primaryMediaId = $primaryMedia ? $primaryMedia->id() : null;
}
?>
<?php foreach ($mediaForms as $type => $form): ?>
<span
    id="media-template-<?php echo $escape($type); ?>"
    data-template="<?php echo $escape($form['form']); ?>"
></span>
<?php endforeach; ?>

<div id="media-list" data-media-count="<?php echo ($resource) ? count($resource->media()) : 0; ?>">
<?php if ($resource && $resource->media()): ?>
    <?php
    $i = 0;
    foreach ($resource->media() as $media):
    $isPrimaryMedia = ($media->id() === $primaryMediaId);
    ?>
    <div class="media value row">
        <span class="sortable-handle"></span>
        <span class='restore-value'><?php echo $translate('Media to be removed'); ?></span>
        <?php echo $this->thumbnail($media, 'square'); ?>
        <span class="resource-name"><?php echo $escape($media->displayTitle()); ?></span>
        <input type="hidden" name="o:media[<?php echo $i; ?>][o:id]" value="<?php echo $escape($media->id()); ?>">
        <label class="primary-media">
            <span class="primary-media-label-text <?php echo ($isPrimaryMedia) ? '' : 'sr-only' ?>"><?php echo $translate('Primary media'); ?></span>
            <span class="primary-media-title sr-only"><?php echo $escape($media->displayTitle()); ?></span> 
            <input type="radio" name="o:primary_media[o:id]" class="primary-media-input" value="<?php echo $escape($media->id()); ?>"<?php echo ($isPrimaryMedia) ? ' checked' : ''; ?>>
        </label>
        <ul class='actions'>
            <li>
            <?php if ($media->isPublic()): ?>
            <?php echo $this->hyperlink('', '#', [
                'class' => 'o-icon-public',
                'title' => $translate('Make private'),
            ]); ?>
            <input type="hidden" name="o:media[<?php echo $i; ?>][o:is_public]" value="1">
            <?php else: ?>
            <?php echo $this->hyperlink('', '#', [
                'class' => 'o-icon-private',
                'title' => $translate('Make public'),
            ]); ?>
            <input type="hidden" name="o:media[<?php echo $i; ?>][o:is_public]" value="0">
            <?php endif; ?>
            </li>
            <li><?php echo $media->link('', 'edit', [
                'class'      => 'o-icon-edit',
                'title'      => $translate('Edit'),
                'target'     => '_blank'
            ]); ?></li>
            <li><?php echo $this->hyperlink('', '#', [
                'class' => 'o-icon-delete remove-value',
                'title' => $translate('Remove value'),
            ]); ?></li>
            <li><?php echo $this->hyperlink('', '#', [
                'class' => 'o-icon-undo restore-value inactive',
                'title' => $translate('Restore value'),
            ]); ?>
            </li>
        </ul>
    </div>
    <?php
    $i++;
    endforeach;
    ?>
<?php else: ?>
    <div class="no-resources">
        <p><?php echo $translate('This resource has no media.<br>Start adding media using the sidebar to the right.'); ?></p>
    </div>
<?php endif; ?>
</div>
<button id="media-selector-button" class="mobile-only"><?php echo $translate('Add media'); ?></button>

<div id="media-selector" class="always-open sidebar">
    <a href="#" class="mobile-only sidebar-close o-icon-close"><span class="screen-reader-text"><?php echo $translate('Close'); ?></span></a>
    <h3><?php echo $translate('Add media'); ?></h3>
    <?php foreach ($mediaForms as $type => $form): ?>
    <button type="button" data-media-type="<?php echo $escape($type); ?>" class="option"><?php echo $escape($translate($form['label'])); ?></button>
    <?php endforeach; ?>
</div>
