Make WordPress Core


Ignore:
Timestamp:
01/28/2014 09:16:42 PM (11 years ago)
Author:
azaozz
Message:

Introduce Edit Image (single mode) in the media modal and use it to edit images inserted in the editor. Adds new feature: replace an image in the editor. Props gcorne, see #24409.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-includes/media-template.php

    r26400 r27050  
    501501        </style>
    502502    </script>
     503
     504    <script type="text/html" id="tmpl-image-details">
     505        <?php // reusing .media-embed to pick up the styles for now ?>
     506        <div class="media-embed">
     507            <div class="embed-image-settings">
     508                <div class="thumbnail">
     509                    <img src="{{ data.model.url }}" draggable="false" />
     510                </div>
     511
     512                <div class="setting url">
     513                    <?php // might want to make the url editable if it isn't an attachment ?>
     514                    <input type="text" disabled="disabled" value="{{ data.model.url }}" />
     515                </div>
     516
     517                <?php
     518                /** This filter is documented in wp-admin/includes/media.php */
     519                if ( ! apply_filters( 'disable_captions', '' ) ) : ?>
     520                    <label class="setting caption">
     521                        <span><?php _e('Caption'); ?></span>
     522                        <textarea data-setting="caption">{{ data.model.caption }}</textarea>
     523                    </label>
     524                <?php endif; ?>
     525
     526                <label class="setting alt-text">
     527                    <span><?php _e('Alt Text'); ?></span>
     528                    <input type="text" data-setting="alt" value="{{ data.model.alt }}" />
     529                </label>
     530
     531                <div class="setting align">
     532                    <span><?php _e('Align'); ?></span>
     533                    <div class="button-group button-large" data-setting="align">
     534                        <button class="button" value="left">
     535                            <?php esc_attr_e('Left'); ?>
     536                        </button>
     537                        <button class="button" value="center">
     538                            <?php esc_attr_e('Center'); ?>
     539                        </button>
     540                        <button class="button" value="right">
     541                            <?php esc_attr_e('Right'); ?>
     542                        </button>
     543                        <button class="button active" value="none">
     544                            <?php esc_attr_e('None'); ?>
     545                        </button>
     546                    </div>
     547                </div>
     548                <div class="setting link-to">
     549                <span><?php _e('Link To'); ?></span>
     550
     551                <# if ( data.attachment ) { #>
     552                    <div class="button-group button-large" data-setting="link">
     553                        <button class="button" value="file">
     554                            <?php esc_attr_e('Media File'); ?>
     555                        </button>
     556                        <button class="button" value="post">
     557                            <?php esc_attr_e('Attachment Page'); ?>
     558                        </button>
     559                        <button class="button" value="custom">
     560                            <?php esc_attr_e('Custom URL'); ?>
     561                        </button>
     562                        <button class="button active" value="none">
     563                            <?php esc_attr_e('None'); ?>
     564                        </button>
     565                    </div>
     566                    <input type="text" class="link-to-custom" data-setting="linkUrl" />
     567
     568                <# } else { #>
     569                    <div class="button-group button-large" data-setting="link">
     570                        <button class="button" value="file">
     571                            <?php esc_attr_e('Image URL'); ?>
     572                        </button>
     573                        <button class="button" value="custom">
     574                            <?php esc_attr_e('Custom URL'); ?>
     575                        </button>
     576                        <button class="button active" value="none">
     577                            <?php esc_attr_e('None'); ?>
     578                        </button>
     579                    </div>
     580                    <input type="text" class="link-to-custom" data-setting="linkUrl" />
     581
     582                <# } #>
     583                </div>
     584
     585                <# if ( data.attachment ) { #>
     586                    <div class="setting size">
     587                        <span><?php _e('Size'); ?></span>
     588                        <div class="button-group button-large" data-setting="size">
     589                        <?php
     590                            /** This filter is documented in wp-admin/includes/media.php */
     591                            $sizes = apply_filters( 'image_size_names_choose', array(
     592                                'thumbnail' => __('Thumbnail'),
     593                                'medium'    => __('Medium'),
     594                                'large'     => __('Large'),
     595                                'full'      => __('Full Size'),
     596                            ) );
     597
     598                            foreach ( $sizes as $value => $name ) : ?>
     599                                <#
     600                                var size = data.attachment.sizes['<?php echo esc_js( $value ); ?>'];
     601                                if ( size ) { #>
     602                                    <button class="button" value="<?php echo esc_attr( $value ); ?>">
     603                                        <?php echo esc_html( $name ); ?>
     604                                        </button>
     605                                <# } #>
     606                            <?php endforeach; ?>
     607                        </div>
     608                    </div>
     609                <# } #>
     610                </div>
     611            </div>
     612        </div>
     613    </script>
    503614    <?php
    504615
Note: See TracChangeset for help on using the changeset viewer.