WordPress.org
Get WordPress

Make WordPress Core


Ignore:
Timestamp:
11/07/2012 08:41:17 AM (12 years ago)
Author:
koopersmith
Message:

Use Mustache-insipired template tags.

Underscore's default ERB-style templates are incompatible with PHP when asp_tags is enabled. As a result, we've settled on an alternative syntax that should be familiar to devs: Mustache-inspired for interpolating and escaping content, and ERB-inspired for execution.

{{{a}}} - interpolating
{{ a }} - escaping
<# a #> - execution

props rmccue. fixes #22344, see #21390.

File:
1 edited

Legend:

Unmodified
Added
Removed

  • trunk/wp-includes/media.php

    r22409 r22415  
    12971297    <script type="text/html" id="tmpl-media-modal">
    12981298        <div class="media-modal">
    1299             <h3 class="media-modal-title"><%- title %></h3>
     1299            <h3 class="media-modal-title">{{ title }}</h3>
    13001300            <a class="media-modal-close" href="" title="<?php esc_attr_e('Close'); ?>">&times;</a>
    13011301        </div>
    … …  
    13201320
    13211321    <script type="text/html" id="tmpl-attachment">
    1322         <div class="attachment-preview type-<%- type %> subtype-<%- subtype %> <%- orientation %>">
    1323             <% if ( uploading ) { %>
     1322        <div class="attachment-preview type-{{ type }} subtype-{{ subtype }} {{ orientation }}">
     1323            <# if ( uploading ) { #>
    13241324                <div class="media-progress-bar"><div></div></div>
    1325             <% } else if ( 'image' === type ) { %>
     1325            <# } else if ( 'image' === type ) { #>
    13261326                <div class="thumbnail">
    13271327                    <div class="centered">
    1328                         <img src="<%- url %>" draggable="false" />
     1328                        <img src="{{ url }}" draggable="false" />
    13291329                    </div>
    13301330                </div>
    1331             <% } else { %>
    1332                 <img src="<%- icon %>" class="icon" draggable="false" />
    1333                 <div class="filename"><%- filename %></div>
    1334             <% } %>
    1335 
    1336             <% if ( buttons.close ) { %>
     1331            <# } else { #>
     1332                <img src="{{ icon }}" class="icon" draggable="false" />
     1333                <div class="filename">{{ filename }}</div>
     1334            <# } #>
     1335
     1336            <# if ( buttons.close ) { #>
    13371337                <a class="close button" href="#">&times;</a>
    1338             <% } %>
     1338            <# } #>
    13391339        </div>
    1340         <% if ( describe ) { %>
    1341             <% if ( 'image' === type ) { %>
     1340        <# if ( describe ) { #>
     1341            <# if ( 'image' === type ) { #>
    13421342                <textarea class="describe"
    13431343                    placeholder="<?php esc_attr_e('Describe this image&hellip;'); ?>"
    1344                     ><%- caption %></textarea>
    1345             <% } else { %>
     1344                    >{{ caption }}</textarea>
     1345            <# } else { #>
    13461346                <textarea class="describe"
    1347                     <% if ( 'video' === type ) { %>
     1347                    <# if ( 'video' === type ) { #>
    13481348                        placeholder="<?php esc_attr_e('Describe this video&hellip;'); ?>"
    1349                     <% } else if ( 'audio' === type ) { %>
     1349                    <# } else if ( 'audio' === type ) { #>
    13501350                        placeholder="<?php esc_attr_e('Describe this audio file&hellip;'); ?>"
    1351                     <% } else { %>
     1351                    <# } else { #>
    13521352                        placeholder="<?php esc_attr_e('Describe this media file&hellip;'); ?>"
    1353                     <% } %>
    1354                     ><%- title %></textarea>
    1355             <% } %>
    1356         <% } %>
     1353                    <# } #>
     1354                    >{{ title }}</textarea>
     1355            <# } #>
     1356        <# } #>
    13571357    </script>
    13581358
    13591359    <script type="text/html" id="tmpl-attachment-details">
    13601360        <h3><?php _e('Edit Attachment Details'); ?></h3>
    1361         <div class="attachment-preview attachment-details-preview type-<%- type %> subtype-<%- subtype %> <%- orientation %>">
    1362             <% if ( uploading ) { %>
     1361        <div class="attachment-preview attachment-details-preview type-{{ type }} subtype-{{ subtype }} {{ orientation }}">
     1362            <# if ( uploading ) { #>
    13631363                <div class="media-progress-bar"><div></div></div>
    1364             <% } else if ( 'image' === type ) { %>
     1364            <# } else if ( 'image' === type ) { #>
    13651365                <div class="thumbnail">
    1366                     <img src="<%- url %>" draggable="false" />
     1366                    <img src="{{ url }}" draggable="false" />
    13671367                </div>
    1368             <% } else { %>
     1368            <# } else { #>
    13691369                <div class="icon-thumbnail">
    1370                     <img src="<%- icon %>" class="icon" draggable="false" />
    1371                     <div class="filename"><%- filename %></div>
     1370                    <img src="{{ icon }}" class="icon" draggable="false" />
     1371                    <div class="filename">{{ filename }}</div>
    13721372                </div>
    1373             <% } %>
     1373            <# } #>
    13741374        </div>
    13751375
    1376         <% if ( 'image' === type ) { %>
     1376        <# if ( 'image' === type ) { #>
    13771377            <textarea class="describe"
    13781378                placeholder="<?php esc_attr_e('Describe this image&hellip;'); ?>"
    1379                 ><%- caption %></textarea>
    1380         <% } else { %>
     1379                >{{ caption }}</textarea>
     1380        <# } else { #>
    13811381            <textarea class="describe"
    1382                 <% if ( 'video' === type ) { %>
     1382                <# if ( 'video' === type ) { #>
    13831383                    placeholder="<?php esc_attr_e('Describe this video&hellip;'); ?>"
    1384                 <% } else if ( 'audio' === type ) { %>
     1384                <# } else if ( 'audio' === type ) { #>
    13851385                    placeholder="<?php esc_attr_e('Describe this audio file&hellip;'); ?>"
    1386                 <% } else { %>
     1386                <# } else { #>
    13871387                    placeholder="<?php esc_attr_e('Describe this media file&hellip;'); ?>"
    1388                 <% } %>
    1389                 ><%- title %></textarea>
    1390         <% } %>
     1388                <# } #>
     1389                >{{ title }}</textarea>
     1390        <# } #>
    13911391    </script>
    13921392
    … …  
    13941394        <div class="selection-info">
    13951395            <span class="count"></span>
    1396             <% if ( clearable ) { %>
     1396            <# if ( clearable ) { #>
    13971397                <a class="clear-selection" href="#"><?php _e('Clear'); ?></a>
    1398             <% } %>
     1398            <# } #>
    13991399        </div>
    14001400        <div class="selection-view"></div>
    … …  
    14021402
    14031403    <script type="text/html" id="tmpl-media-selection-preview">
    1404         <div class="selected-img selected-count-<%- count %>">
    1405             <% if ( thumbnail ) { %>
    1406                 <img src="<%- thumbnail %>" draggable="false" />
    1407             <% } %>
    1408 
    1409             <span class="count"><%- count %></span>
     1404        <div class="selected-img selected-count-{{ count }}">
     1405            <# if ( thumbnail ) { #>
     1406                <img src="{{ thumbnail }}" draggable="false" />
     1407            <# } #>
     1408
     1409            <span class="count">{{ count }}</span>
    14101410        </div>
    1411         <% if ( clearable ) { %>
     1411        <# if ( clearable ) { #>
    14121412            <a class="clear-selection" href="#"><?php _e('Clear selection'); ?></a>
    1413         <% } %>
     1413        <# } #>
    14141414    </script>
    14151415
    … …  
    14591459
    14601460        <select class="columns" name="columns" data-setting="columns">
    1461             <% _.times( 9, function( i ) { %>
    1462                 <option value="<%- i %>"><%- i %></option>
    1463             <% }); %>
     1461            <?php for( $i = 1; $i <= 9; $i++ ) : ?>
     1462                <option value="<?php echo esc_attr( $i ); ?>">
     1463                    <?php echo esc_html( $i ); ?>
     1464                </option>
     1465            <?php endfor; ?>
    14641466        </select>
    14651467    </script>
    … …  
    14671469    <script type="text/html" id="tmpl-editor-attachment">
    14681470        <div class="editor-attachment-preview">
    1469             <% if ( url ) { %>
    1470                 <img src="<%- url %>" width="<%- width %>" height="<%- height %>" draggable="false" />
    1471             <% } %>
    1472 
    1473             <% if ( uploading ) { %>
     1471            <# if ( url ) { #>
     1472                <img src="{{ url }}" width="{{ width }}" height="{{ height }}" draggable="false" />
     1473            <# } #>
     1474
     1475            <# if ( uploading ) { #>
    14741476                <div class="media-progress-bar"><div></div></div>
    1475             <% } %>
     1477            <# } #>
    14761478            <div class="overlay">
    14771479                <div class="button close">&times;</div>
    … …  
    14821484
    14831485    <script type="text/html" id="tmpl-editor-gallery">
    1484         <% if ( url ) { %>
    1485             <img src="<%- url %>" draggable="false" />
    1486         <% } %>
     1486        <# if ( url ) { #>
     1487            <img src="{{ url }}" draggable="false" />
     1488        <# } #>
    14871489
    14881490        <div class="overlay">
    … …  
    14931495
    14941496    <script type="text/html" id="tmpl-attachments-css">
    1495         <style type="text/css" id="<%- id %>-css">
    1496             #<%- id %> {
    1497                 padding: 0 <%- gutter %>px;
     1497        <style type="text/css" id="{{ id }}-css">
     1498            #{{ id }} {
     1499                padding: 0 {{ gutter }}px;
    14981500            }
    14991501
    1500             #<%- id %> .attachment {
    1501                 margin: <%- gutter %>px;
    1502                 width: <%- edge %>px;
     1502            #{{ id }} .attachment {
     1503                margin: {{ gutter }}px;
     1504                width: {{ edge }}px;
    15031505            }
    15041506
    1505             #<%- id %> .attachment-preview,
    1506             #<%- id %> .attachment-preview .thumbnail {
    1507                 width: <%- edge %>px;
    1508                 height: <%- edge %>px;
     1507            #{{ id }} .attachment-preview,
     1508            #{{ id }} .attachment-preview .thumbnail {
     1509                width: {{ edge }}px;
     1510                height: {{ edge }}px;
    15091511            }
    15101512
    1511             #<%- id %> .portrait .thumbnail img {
    1512                 width: <%- edge %>px;
     1513            #{{ id }} .portrait .thumbnail img {
     1514                width: {{ edge }}px;
    15131515                height: auto;
    15141516            }
    15151517
    1516             #<%- id %> .landscape .thumbnail img {
     1518            #{{ id }} .landscape .thumbnail img {
    15171519                width: auto;
    1518                 height: <%- edge %>px;
     1520                height: {{ edge }}px;
    15191521            }
    15201522        </style>
Note: See TracChangeset for help on using the changeset viewer.