WordPress.org
Get WordPress

Make WordPress Core

Changeset 12543


Ignore:
Timestamp:
12/25/2009 11:04:48 PM (16 years ago)
Author:
matt
Message:

More cleanup of the edit media screen:

  • Simplified table to not need rowspan, and other markup where possible.
  • Put more elements in a paragraph tag for better spacing.
  • Brought edit image buton under the image.
  • Everything is now in line with WordPress Coding Standards, particularly with regards to spacing and attribute quotes.
  • Minor styling for better alignment.

TODO: We show the file URL here, but for images we should show the URL to each size, with its dimensions.

Location:
trunk/wp-admin
Files:
2 edited

Legend:

Unmodified
Added
Removed

  • trunk/wp-admin/includes/media.php

    r12542 r12543  
    10191019
    10201020    $edit_post = sanitize_post($post, 'edit');
     1021
     1022   
    10211023
    10221024    $form_fields = array(
    … …  
    11321134    global $redir_tab;
    11331135
    1134     if ( ( $attachment_id = intval($attachment_id) ) && $thumb_url = get_attachment_icon_src( $attachment_id ) )
     1136    if ( ( $attachment_id = intval( $attachment_id ) ) && $thumb_url = get_attachment_icon_src( $attachment_id ) )
    11351137        $thumb_url = $thumb_url[0];
    11361138    else
    … …  
    11411143    extract( $args, EXTR_SKIP );
    11421144
    1143     $toggle_on = __('Show');
    1144     $toggle_off = __('Hide');
    1145 
    1146     $post = get_post($attachment_id);
    1147 
    1148     $filename = basename($post->guid);
    1149     $title = esc_attr($post->post_title);
    1150 
    1151     if ( $_tags = get_the_tags($attachment_id) ) {
     1145    $toggle_on  = __( 'Show' );
     1146    $toggle_off = __( 'Hide' );
     1147
     1148    $post = get_post( $attachment_id );
     1149
     1150    $filename = basename( $post->guid );
     1151    $title = esc_attr( $post->post_title );
     1152
     1153    if ( $_tags = get_the_tags( $attachment_id ) ) {
    11521154        foreach ( $_tags as $tag )
    11531155            $tags[] = $tag->name;
    1154         $tags = esc_attr(join(', ', $tags));
     1156        $tags = esc_attr( join( ', ', $tags ) );
    11551157    }
    11561158
    11571159    $post_mime_types = get_post_mime_types();
    1158     $keys = array_keys(wp_match_mime_types(array_keys($post_mime_types), $post->post_mime_type));
    1159     $type = array_shift($keys);
     1160    $keys = array_keys( wp_match_mime_types( array_keys( $post_mime_types ), $post->post_mime_type ) );
     1161    $type = array_shift( $keys );
    11601162    $type_html = "<input type='hidden' id='type-of-$attachment_id' value='" . esc_attr( $type ) . "' />";
    11611163
    1162     $form_fields = get_attachment_fields_to_edit($post, $errors);
     1164    $form_fields = get_attachment_fields_to_edit( $post, $errors );
    11631165
    11641166    if ( $toggle ) {
    1165         $class = empty($errors) ? 'startclosed' : 'startopen';
     1167        $class = empty( $errors ) ? 'startclosed' : 'startopen';
    11661168        $toggle_links = "
    11671169    <a class='toggle describe-toggle-on' href='#'>$toggle_on</a>
    … …  
    11731175
    11741176    $display_title = ( !empty( $title ) ) ? $title : $filename; // $title shouldn't ever be empty, but just in case
    1175     $display_title = $show_title ? "<div class='filename new'><span class='title'>" . wp_html_excerpt($display_title, 60) . "</span></div>" : '';
    1176 
    1177     $gallery = ( (isset($_REQUEST['tab']) && 'gallery' == $_REQUEST['tab']) || (isset($redir_tab) && 'gallery' == $redir_tab) ) ? true : false;
     1177    $display_title = $show_title ? "<div class='filename new'><span class='title'>" . wp_html_excerpt( $display_title, 60 ) . "</span></div>" : '';
     1178
     1179    $gallery = ( ( isset( $_REQUEST['tab'] ) && 'gallery' == $_REQUEST['tab'] ) || ( isset( $redir_tab ) && 'gallery' == $redir_tab ) ) ? true : false;
    11781180    $order = '';
    11791181
    … …  
    11811183        if ( 'menu_order' == $key ) {
    11821184            if ( $gallery )
    1183                 $order = '<div class="menu_order"> <input class="menu_order_input" type="text" id="attachments['.$attachment_id.'][menu_order]" name="attachments['.$attachment_id.'][menu_order]" value="'.$val['value'].'" /></div>';
     1185                $order = "<div class='menu_order'> <input class='menu_order_input' type='text' id='attachments[$attachment_id][menu_order]' name='attachments[$attachment_id][menu_order]' value='" . esc_attr( $val['value'] ). "' /></div>";
    11841186            else
    1185                 $order = '<input type="hidden" name="attachments['.$attachment_id.'][menu_order]" value="'.$val['value'].'" />';
    1186 
    1187             unset($form_fields['menu_order']);
     1187                $order = "<input type='hidden' name='attachments[$attachment_id][menu_order]' value='" . esc_attr( $val['value'] ) . "' />";
     1188
     1189            unset( $form_fields['menu_order'] );
    11881190            break;
    11891191        }
    … …  
    11911193
    11921194    $media_dims = '';
    1193     $meta = wp_get_attachment_metadata($post->ID);
    1194     if ( is_array($meta) && array_key_exists('width', $meta) && array_key_exists('height', $meta) )
    1195         $media_dims .= "<span id='media-dims-{$post->ID}'>{$meta['width']}&nbsp;&times;&nbsp;{$meta['height']}</span> ";
    1196     $media_dims = apply_filters('media_meta', $media_dims, $post);
     1195    $meta = wp_get_attachment_metadata( $post->ID );
     1196    if ( is_array( $meta ) && array_key_exists( 'width', $meta ) && array_key_exists( 'height', $meta ) )
     1197        $media_dims .= "<span id='media-dims-$post->ID'>{$meta['width']}&nbsp;&times;&nbsp;{$meta['height']}</span> ";
     1198    $media_dims = apply_filters( 'media_meta', $media_dims, $post );
    11971199
    11981200    $image_edit_button = '';
    1199     if ( gd_edit_image_support($post->post_mime_type) ) {
    1200         $nonce = wp_create_nonce("image_editor-$post->ID");
    1201         $image_edit_button = "<input type='button' id='imgedit-open-btn-{$post->ID}' onclick='imageEdit.open($post->ID, \"$nonce\")' class='button' value='" . esc_attr__( 'Edit image' ) . "' /> <img src='images/wpspin_light.gif' class='imgedit-wait-spin' alt='' />";
     1201    if ( gd_edit_image_support( $post->post_mime_type ) ) {
     1202        $nonce = wp_create_nonce( "image_editor-$post->ID" );
     1203        $image_edit_button = "<input type='button' id='imgedit-open-btn-$post->ID' onclick='imageEdit.open( $post->ID, \"$nonce\" )' class='button' value='" . esc_attr__( 'Edit image' ) . "' /> <img src='images/wpspin_light.gif' class='imgedit-wait-spin' alt='' />";
    12021204    }
    12031205
    … …  
    12111213    <table class='slidetoggle describe $class'>
    12121214        <thead class='media-item-info' id='media-head-$post->ID'>
    1213         <tr>
    1214             <td class='A1B1' id='thumbnail-head-$post->ID' rowspan='5'>
    1215             <a href='$attachment_url' target='_blank'><img class='thumbnail' src='$thumb_url' alt='' /></a>
     1215        <tr valign='top'>
     1216            <td class='A1B1' id='thumbnail-head-$post->ID'>
     1217            <p><a href='$attachment_url' target='_blank'><img class='thumbnail' src='$thumb_url' alt='' style='margin-top: 3px' /></a></p>
     1218            <p>$image_edit_button</p>
    12161219            </td>
    1217             <td><strong>" . __('File name:') . "</strong> $filename</td>
    1218         </tr>
    1219         <tr><td><strong>" . __('File type:') . "</strong> $post->post_mime_type</td></tr>
    1220         <tr><td><strong>" . __('Upload date:') . "</strong> " . mysql2date( get_option('date_format'), $post->post_date ) . "</td></tr>\n";
    1221 
    1222     if ( !empty($media_dims) )
    1223         $item .= "<tr><td><strong>" . __('Dimensions:') . "</strong> $media_dims</td></tr>\n";
     1220            <td>
     1221            <p><strong>" . __('File name:') . "</strong> $filename</p>
     1222            <p><strong>" . __('File type:') . "</strong> $post->post_mime_type</p>
     1223            <p><strong>" . __('Upload date:') . "</strong> " . mysql2date( get_option('date_format'), $post->post_date ). '</p>';
     1224            if ( !empty( $media_dims ) )
     1225                $item .= "<p><strong>" . __('Dimensions:') . "</strong> $media_dims</p>\n";
     1226           
     1227            echo "</td></tr>\n";
     1228
     1229   
    12241230
    12251231    $item .= "
    1226         <tr><td class='A1B1'>$image_edit_button</td></tr>
    12271232        </thead>
    12281233        <tbody>
    … …  
    12391244    if ( $send )
    12401245        $send = "<input type='submit' class='button' name='send[$attachment_id]' value='" . esc_attr__( 'Insert into Post' ) . "' />";
    1241     if ( $delete && current_user_can('delete_post', $attachment_id) ) {
     1246    if ( $delete && current_user_can( 'delete_post', $attachment_id ) ) {
    12421247        if ( !EMPTY_TRASH_DAYS ) {
    1243             $delete = "<a href=\"" . wp_nonce_url("post.php?action=delete&amp;post=$attachment_id", 'delete-post_' . $attachment_id) . "\" id=\"del[$attachment_id]\" class=\"delete\">" . __('Delete Permanently') . "</a>";
     1248            $delete = "<a href='" . wp_nonce_url( "post.php?action=delete&amp;post=$attachment_id", 'delete-post_' . $attachment_id ) . "' id='del[$attachment_id]' class='delete'>" . __( 'Delete Permanently' ) . '</a>';
    12441249        } elseif ( !MEDIA_TRASH ) {
    1245             $delete = "<a href=\"#\" class=\"del-link\" onclick=\"document.getElementById('del_attachment_$attachment_id').style.display='block';return false;\">" . __('Delete') . "</a> <div id=\"del_attachment_$attachment_id\" class=\"del-attachment\" style=\"display:none;\">" . sprintf(__("You are about to delete <strong>%s</strong>."), $filename) . " <a href=\"" . wp_nonce_url("post.php?action=delete&amp;post=$attachment_id", 'delete-post_' . $attachment_id) . "\" id=\"del[$attachment_id]\" class=\"button\">" . __('Continue') . "</a> <a href=\"#\" class=\"button\" onclick=\"this.parentNode.style.display='none';return false;\">" . __('Cancel') . "</a></div>";
     1250            $delete = "<a href='#' class='del-link' onclick=\"document.getElementById('del_attachment_$attachment_id').style.display='block';return false;\">" . __( 'Delete' ) . "</a>
     1251             <div id='del_attachment_$attachment_id' class='del-attachment' style='display:none;'>" . sprintf( __( 'You are about to delete <strong>%s</strong>.' ), $filename ) . "
     1252             <a href='" . wp_nonce_url( "post.php?action=delete&amp;post=$attachment_id", 'delete-post_' . $attachment_id ) . "' id='del[$attachment_id]' class='button'>" . __( 'Continue' ) . "</a>
     1253             <a href='#' class='button' onclick=\"this.parentNode.style.display='none';return false;\">" . __( 'Cancel' ) . "</a>
     1254             </div>";
    12461255        } else {
    1247             $delete = "<a href=\"" . wp_nonce_url("post.php?action=trash&amp;post=$attachment_id", 'trash-post_' . $attachment_id) . "\" id=\"del[$attachment_id]\" class=\"delete\">" . __('Move to Trash') . "</a> <a href=\"" . wp_nonce_url("post.php?action=untrash&amp;post=$attachment_id", 'untrash-post_' . $attachment_id) . "\" id=\"undo[$attachment_id]\" class=\"undo hidden\">" . __('Undo') . "</a>";
     1256            $delete = "<a href='" . wp_nonce_url( "post.php?action=trash&amp;post=$attachment_id", 'trash-post_' . $attachment_id ) . "' id='del[$attachment_id]' class='delete'>" . __( 'Move to Trash' ) . "</a>
     1257            <a href='" . wp_nonce_url( "post.php?action=untrash&amp;post=$attachment_id", 'untrash-post_' . $attachment_id ) . "' id='undo[$attachment_id]' class='undo hidden'>" . __( 'Undo' ) . "</a>";
    12481258        }
    12491259    } else {
    … …  
    12601270        $thumbnail = "<a class='wp-post-thumbnail' id='wp-post-thumbnail-" . $attachment_id . "' href='#' onclick='WPSetAsThumbnail(\"$attachment_id\");return false;'>" . esc_html__( "Use as thumbnail" ) . "</a>";
    12611271
    1262     if ( ( $send || $thumbnail || $delete ) && !isset($form_fields['buttons']) )
    1263         $form_fields['buttons'] = array('tr' => "\t\t<tr class='submit'><td></td><td class='savesend'>$send $thumbnail $delete</td></tr>\n");
     1272    if ( ( $send || $thumbnail || $delete ) && !isset( $form_fields['buttons'] ) )
     1273        $form_fields['buttons'] = array( 'tr' => "\t\t<tr class='submit'><td></td><td class='savesend'>$send $thumbnail $delete</td></tr>\n" );
    12641274
    12651275    $hidden_fields = array();
    … …  
    12691279            continue;
    12701280
    1271         if ( !empty($field['tr']) ) {
     1281        if ( !empty( $field['tr'] ) ) {
    12721282            $item .= $field['tr'];
    12731283            continue;
    12741284        }
    12751285
    1276         $field = array_merge($defaults, $field);
     1286        $field = array_merge( $defaults, $field );
    12771287        $name = "attachments[$attachment_id][$id]";
    12781288
    … …  
    12821292        }
    12831293
    1284         $required = $field['required'] ? '<abbr title="required" class="required">*</abbr>' : '';
     1294        $required      = $field['required'] ? '<abbr title="required" class="required">*</abbr>' : '';
    12851295        $aria_required = $field['required'] ? " aria-required='true' " : '';
    12861296        $class  = $id;
    … …  
    12881298
    12891299        $item .= "\t\t<tr class='$class'>\n\t\t\t<th valign='top' scope='row' class='label'><label for='$name'><span class='alignleft'>{$field['label']}</span><span class='alignright'>$required</span><br class='clear' /></label></th>\n\t\t\t<td class='field'>";
    1290         if ( !empty($field[$field['input']]) )
    1291             $item .= $field[$field['input']];
     1300        if ( !empty( $field[ $field['input'] ] ) )
     1301            $item .= $field[ $field['input'] ];
    12921302        elseif ( $field['input'] == 'textarea' ) {
    1293             $item .= "<textarea type='text' id='$name' name='$name'" . $aria_required . ">" . esc_html( $field['value'] ) . "</textarea>";
     1303            $item .= "<textarea type='text' id='$name' name='$name' $aria_required>" . esc_html( $field['value'] ) . '</textarea>';
    12941304        } else {
    1295             $item .= "<input type='text' class='text' id='$name' name='$name' value='" . esc_attr( $field['value'] ) . "'" . $aria_required . "/>";
     1305            $item .= "<input type='text' class='text' id='$name' name='$name' value='" . esc_attr( $field['value'] ) . "' $aria_required />";
    12961306        }
    1297         if ( !empty($field['helps']) )
    1298             $item .= "<p class='help'>" . join( "</p>\n<p class='help'>", array_unique((array) $field['helps']) ) . '</p>';
     1307        if ( !empty( $field['helps'] ) )
     1308            $item .= "<p class='help'>" . join( "</p>\n<p class='help'>", array_unique( (array) $field['helps'] ) ) . '</p>';
    12991309        $item .= "</td>\n\t\t</tr>\n";
    13001310
    13011311        $extra_rows = array();
    13021312
    1303         if ( !empty($field['errors']) )
    1304             foreach ( array_unique((array) $field['errors']) as $error )
     1313        if ( !empty( $field['errors'] ) )
     1314            foreach ( array_unique( (array) $field['errors'] ) as $error )
    13051315                $extra_rows['error'][] = $error;
    13061316
    1307         if ( !empty($field['extra_rows']) )
     1317        if ( !empty( $field['extra_rows'] ) )
    13081318            foreach ( $field['extra_rows'] as $class => $rows )
    13091319                foreach ( (array) $rows as $html )
    … …  
    13151325    }
    13161326
    1317     if ( !empty($form_fields['_final']) )
     1327    if ( !empty( $form_fields['_final'] ) )
    13181328        $item .= "\t\t<tr class='final'><td colspan='2'>{$form_fields['_final']}</td></tr>\n";
    13191329    $item .= "\t</tbody>\n";
    … …  
    13231333        $item .= "\t<input type='hidden' name='$name' id='$name' value='" . esc_attr( $value ) . "' />\n";
    13241334
    1325     if ( $post->post_parent < 1 && isset($_REQUEST['post_id']) ) {
     1335    if ( $post->post_parent < 1 && isset( $_REQUEST['post_id'] ) ) {
    13261336        $parent = (int) $_REQUEST['post_id'];
    13271337        $parent_name = "attachments[$attachment_id][post_parent]";
    1328 
    1329         $item .= "\t<input type='hidden' name='$parent_name' id='$parent_name' value='" . $parent . "' />\n";
     1338        $item .= "\t<input type='hidden' name='$parent_name' id='$parent_name' value='$parent' />\n";
    13301339    }
    13311340

  • trunk/wp-admin/media.php

    r12542 r12543  
    9191
    9292<form method="post" action="<?php echo esc_url( remove_query_arg( 'message' ) ); ?>" class="media-upload-form" id="media-single-form">
    93 <p class="submit">
     93<p class="submit" style="padding-bottom: 0;">
    9494<input type="submit" class="button-primary" name="save" value="<?php esc_attr_e('Update Media'); ?>" />
    9595</p>
Note: See TracChangeset for help on using the changeset viewer.