Changeset 22816
- Timestamp:
- 11/22/2012 09:32:21 AM (12 years ago)
- Location:
- trunk/wp-includes
- Files:
-
- 5 edited
Legend:
- Unmodified
- Added
- Removed
-
trunk/wp-includes/css/media-views.css
r22809 r22816 716 716 .media-progress-bar { 717 717 position: relative; 718 height: 8px;718 height: 10px; 719 719 width: 70%; 720 720 margin: 10px auto; 721 padding: 2px; 722 border: 2px solid #ccc; 723 border-radius: 8px; 724 background: #fff; 721 border-radius: 10px; 722 background: #dfdfdf; 723 background: rgba( 0, 0, 0, 0.1 ); 725 724 } 726 725 727 726 .media-progress-bar div { 728 height: 8px;729 min-width: 8px;727 height: 10px; 728 min-width: 20px; 730 729 width: 0; 731 background: #ccc; 730 background: #aaa; 731 background: rgba( 0, 0, 0, 0.2 ); 732 732 border-radius: 10px; 733 733 -webkit-transition: width 300ms; … … 738 738 } 739 739 740 .media-uploader-status .media-progress-bar { 741 width: 100%; 742 } 743 740 744 .attachment-preview .media-progress-bar { 741 745 position: absolute; … … 743 747 left: 15%; 744 748 width: 70%; 745 margin: -8px 0 0 -4px; 749 margin: -5px 0 0 0; 750 } 751 752 .media-uploader-status { 753 padding-bottom: 10px; 754 border-bottom: 1px solid #dfdfdf; 755 box-shadow: 0 1px 0 #fff; 756 } 757 758 .media-uploader-status .upload-details { 759 font-size: 12px; 760 color: #666; 761 text-shadow: 0 1px 0 #fff; 762 } 763 764 .media-uploader-status .upload-detail-separator { 765 padding: 0 4px; 766 } 767 768 .media-uploader-status .upload-count { 769 color: #464646; 746 770 } 747 771 … … 1060 1084 1061 1085 .uploading .attachment-info .media-progress-bar { 1062 margin-top: 3 2px;1086 margin-top: 35px; 1063 1087 } 1064 1088 -
trunk/wp-includes/js/media-models.js
r22809 r22816 192 192 }; 193 193 } 194 }, 195 196 // Truncates a string by injecting an ellipsis into the middle. 197 // Useful for filenames. 198 truncate: function( string, length, replacement ) { 199 length = length || 30; 200 replacement = replacement || '…'; 201 202 if ( string.length <= length ) 203 return string; 204 205 return string.substr( 0, length / 2 ) + replacement + string.substr( -1 * length / 2 ); 194 206 } 195 207 }); -
trunk/wp-includes/js/media-views.js
r22809 r22816 256 256 sidebar: 'settings', 257 257 searchable: true, 258 filterable: false 258 filterable: false, 259 uploads: true 259 260 }, 260 261 … … 477 478 content: 'upload', 478 479 toolbar: 'empty', 480 uploads: true, 479 481 480 482 // The state to navigate to when files are uploading. … … 1291 1293 sortable: state.get('sortable'), 1292 1294 search: state.get('searchable'), 1293 upload : state.get('upload'),1295 uploads: state.get('uploads'), 1294 1296 filters: state.get('filterable'), 1295 1297 display: state.get('displaySettings'), … … 1828 1830 1829 1831 /** 1832 * wp.media.view.UploaderStatus 1833 */ 1834 media.view.UploaderStatus = media.View.extend({ 1835 className: 'media-uploader-status', 1836 template: media.template('uploader-status'), 1837 1838 initialize: function() { 1839 this.controller = this.options.controller; 1840 1841 this.queue = wp.Uploader.queue; 1842 this.queue.on( 'add remove reset', this.visibility, this ); 1843 this.queue.on( 'add remove reset change:percent', this.progress, this ); 1844 this.queue.on( 'add remove reset change:uploading', this.info, this ); 1845 1846 this.errors = wp.Uploader.errors; 1847 }, 1848 1849 dispose: function() { 1850 wp.Uploader.queue.off( null, null, this ); 1851 media.View.prototype.dispose.apply( this, arguments ); 1852 return this; 1853 }, 1854 1855 visibility: function() { 1856 this.$el.toggleClass( 'uploading', !! this.queue.length ); 1857 this.$el.toggle( !! this.queue.length || !! this.errors.length ); 1858 }, 1859 1860 ready: function() { 1861 _.each({ 1862 '$bar': '.media-progress-bar div', 1863 '$index': '.upload-index', 1864 '$total': '.upload-total', 1865 '$filename': '.upload-filename' 1866 }, function( selector, key ) { 1867 this[ key ] = this.$( selector ); 1868 }, this ); 1869 1870 this.visibility(); 1871 this.progress(); 1872 this.info(); 1873 }, 1874 1875 progress: function() { 1876 var queue = this.queue, 1877 $bar = this.$bar, 1878 memo = 0; 1879 1880 if ( ! $bar || ! queue.length ) 1881 return; 1882 1883 $bar.width( ( queue.reduce( function( memo, attachment ) { 1884 if ( ! attachment.get('uploading') ) 1885 return memo + 100; 1886 1887 var percent = attachment.get('percent'); 1888 return memo + ( _.isNumber( percent ) ? percent : 100 ); 1889 }, 0 ) / queue.length ) + '%' ); 1890 }, 1891 1892 info: function() { 1893 var queue = this.queue, 1894 index = 0, active; 1895 1896 if ( ! queue.length ) 1897 return; 1898 1899 active = this.queue.find( function( attachment, i ) { 1900 index = i; 1901 return attachment.get('uploading'); 1902 }); 1903 1904 this.$index.text( index + 1 ); 1905 this.$total.text( queue.length ); 1906 this.$filename.html( active ? media.truncate( _.escape( active.get('filename') ), 24 ) : '' ); 1907 } 1908 }); 1909 1910 /** 1830 1911 * wp.media.view.Toolbar 1831 1912 */ … … 2861 2942 filters: false, 2862 2943 search: true, 2863 upload :false,2944 uploads: false, 2864 2945 display: false, 2865 2946 … … 2915 2996 }) ); 2916 2997 } 2917 2918 if ( this.options.upload && this.controller.uploader ) {2919 this.toolbar.set( 'upload', new media.view.Button( _.extend({2920 el: this.controller.uploader.$browser.detach()[0],2921 priority: -60,2922 size: 'large',2923 text: l10n.selectFiles2924 }, this.options.upload ) ).render() );2925 }2926 2998 }, 2927 2999 … … 2942 3014 2943 3015 createSidebar: function() { 2944 this.sidebar = new media.view.Sidebar({ 2945 controller: this.controller 2946 }); 2947 2948 this.views.add( this.sidebar ); 2949 2950 this.options.selection.on( 'selection:single', this.createSingle, this ); 2951 this.options.selection.on( 'selection:unsingle', this.disposeSingle, this ); 3016 var options = this.options, 3017 selection = options.selection, 3018 sidebar = this.sidebar = new media.view.Sidebar({ 3019 controller: this.controller 3020 }); 3021 3022 this.views.add( sidebar ); 3023 3024 if ( options.uploads && this.controller.uploader ) { 3025 sidebar.set( 'uploads', new media.view.UploaderStatus({ 3026 controller: this.controller, 3027 priority: 40 3028 }) ); 3029 } 3030 3031 selection.on( 'selection:single', this.createSingle, this ); 3032 selection.on( 'selection:unsingle', this.disposeSingle, this ); 3033 3034 if ( selection.single() ) 3035 this.createSingle(); 2952 3036 }, 2953 3037 -
trunk/wp-includes/js/plupload/wp-plupload.js
r22798 r22816 87 87 if ( file.attachment ) 88 88 file.attachment.destroy(); 89 90 Uploader.errors.unshift({ 91 message: message, 92 data: data, 93 file: file 94 }); 95 89 96 self.error( message, data, file ); 90 97 }; … … 285 292 286 293 Uploader.queue = new wp.media.model.Attachments( [], { query: false }); 294 Uploader.errors = new Backbone.Collection(); 287 295 288 296 exports.Uploader = Uploader; -
trunk/wp-includes/media.php
r22809 r22816 1444 1444 </script> 1445 1445 1446 <script type="text/html" id="tmpl-uploader-status"> 1447 <h3><?php _e( 'Uploading' ); ?></h3> 1448 <div class="media-progress-bar"><div></div></div> 1449 <div class="upload-details"> 1450 <span class="upload-count"> 1451 <span class="upload-index"></span> / <span class="upload-total"></span> 1452 </span> 1453 <span class="upload-detail-separator">–</span> 1454 <span class="upload-filename"></span> 1455 </div> 1456 <div class="upload-errors"> 1457 </div> 1458 </script> 1459 1446 1460 <script type="text/html" id="tmpl-attachment"> 1447 1461 <div class="attachment-preview type-{{ data.type }} subtype-{{ data.subtype }} {{ data.orientation }}">
Note: See TracChangeset
for help on using the changeset viewer.