base_image.phtml

Go to the documentation of this file.

<?php
?>
<div class="row">
    <div class="add-video-button-container">
        <button
            id="add_video_button"
            title="<?= /* @escapeNotVerified */ $addVideoTitle ?>"
            type="button"
            class="action-secondary"
            onclick="jQuery('#new-video').modal('openModal'); jQuery('#new_video_form')[0].reset();"
            data-ui-id="widget-button-1">
            <span><?= /* @escapeNotVerified */ __('Add Video') ?></span>
        </button>
    </div>
</div>
<div id="<?= /* @escapeNotVerified */ $htmlId ?>-container"
     class="images"
     data-mage-init='{"baseImage":{}}'
     data-max-file-size="<?= /* @escapeNotVerified */ $fileMaxSize ?>"
    >
    <div class="image image-placeholder">
        <input type="file" name="image" data-url="<?= /* @escapeNotVerified */ $uploadUrl ?>" multiple="multiple" />
        <img class="spacer" src="<?= /* @escapeNotVerified */ $spacerImage ?>"/>
        <p class="image-placeholder-text"><?= /* @escapeNotVerified */ $imagePlaceholderText ?></p>
    </div>
    <script id="<?= /* @escapeNotVerified */ $htmlId ?>-template"
            data-template="image"
            type="text/x-magento-template">
        <div class="image">
            <img class="spacer" src="<?= /* @escapeNotVerified */ $spacerImage ?>"/>
            <img
                class="product-image"
                src="<%- data.url %>"
                data-position="<%- data.position %>"
                alt="<%- data.label %>" />
            <div class="actions">
                <button
                    type="button"
                    class="action-delete"
                    data-role="delete-button"
                    title="<?= /* @escapeNotVerified */ $deleteImageText ?>">
                    <span><?= /* @escapeNotVerified */ $deleteImageText ?></span>
                </button>
                <button
                    type="button"
                    class="action-make-base"
                    data-role="make-base-button"
                    title="<?= /* @escapeNotVerified */ $makeBaseText ?>">
                    <span><?= /* @escapeNotVerified */ $makeBaseText ?></span>
                </button>
                <div class="draggable-handle"></div>
            </div>
            <div class="image-label"></div>
            <div class="image-fade"><span><?= /* @escapeNotVerified */ $hiddenText ?></span></div>
        </div>
    </script>
</div>
<span class="action-manage-images" data-activate-tab="image-management">
    <span><?= /* @escapeNotVerified */ $imageManagementText ?></span>
</span>
<script>
    require([
        'jquery'
    ],function($){

        'use strict';

        $('[data-activate-tab=image-management]')
            .on('click.toggleImageManagementTab', function() {
                $('#product_info_tabs_image-management').trigger('click');
            });
    });
</script>