12 files changed, 200 insertions, 68 deletions
diff --git a/phpBB/styles/prosilver/template/forum_fn.js b/phpBB/styles/prosilver/template/forum_fn.js
index a45f750a63..495df2871d 100644
--- a/phpBB/styles/prosilver/template/forum_fn.js
+++ b/phpBB/styles/prosilver/template/forum_fn.js
@@ -747,7 +747,7 @@ function parse_document(container)
 	/**
 	* Hide empty responsive tables
 	*/
-	container.find('table.responsive > tbody').each(function() {
+	container.find('table.responsive > tbody').not('.responsive-skip-empty').each(function() {
 		var items = $(this).children('tr');
 		if (items.length == 0)
 		{
diff --git a/phpBB/styles/prosilver/template/mcp_header.html b/phpBB/styles/prosilver/template/mcp_header.html
index e3efe49943..51f496605e 100644
--- a/phpBB/styles/prosilver/template/mcp_header.html
+++ b/phpBB/styles/prosilver/template/mcp_header.html
@@ -39,7 +39,7 @@
 		</div>
 	</div>
 
-	<div id="cp-main" class="mcp-main">
+	<div id="cp-main" class="mcp-main panel-container">
 		<!-- IF MESSAGE -->
 		<div class="content">
 			<h2>{L_MESSAGE}</h2>
diff --git a/phpBB/styles/prosilver/template/overall_footer.html b/phpBB/styles/prosilver/template/overall_footer.html
index f7d0269edb..662008b7fa 100644
--- a/phpBB/styles/prosilver/template/overall_footer.html
+++ b/phpBB/styles/prosilver/template/overall_footer.html
@@ -60,8 +60,8 @@
 
 <!-- EVENT overall_footer_after -->
 
-{$SCRIPTS}
 <!-- IF S_PLUPLOAD --><!-- INCLUDE plupload.html --><!-- ENDIF -->
+{$SCRIPTS}
 
 </body>
 </html>
diff --git a/phpBB/styles/prosilver/template/overall_header.html b/phpBB/styles/prosilver/template/overall_header.html
index 529e6625fe..a89585d899 100644
--- a/phpBB/styles/prosilver/template/overall_header.html
+++ b/phpBB/styles/prosilver/template/overall_header.html
@@ -36,7 +36,6 @@
 <!-- ENDIF -->
 
 <!-- IF S_PLUPLOAD -->
-	<link href="{T_ASSETS_PATH}/plupload/jquery.plupload.queue/css/jquery.plupload.queue.css?assets_version={T_ASSETS_VERSION}" rel="stylesheet" type="text/css" media="screen, projection" />
 	<link href="{T_THEME_PATH}/plupload.css?assets_version={T_ASSETS_VERSION}" rel="stylesheet" type="text/css" media="screen, projection" />
 <!-- ENDIF -->
 
diff --git a/phpBB/styles/prosilver/template/plupload.html b/phpBB/styles/prosilver/template/plupload.html
index 290992ddd6..21acae1c44 100644
--- a/phpBB/styles/prosilver/template/plupload.html
+++ b/phpBB/styles/prosilver/template/plupload.html
@@ -1,5 +1,3 @@
-<script type="text/javascript" src="{T_ASSETS_PATH}/plupload/plupload.full.min.js?assets_version={T_ASSETS_VERSION}"></script>
-<script type="text/javascript" src="{T_ASSETS_PATH}/plupload/jquery.plupload.queue/jquery.plupload.queue.min.js?assets_version={T_ASSETS_VERSION}"></script>
 <script type="text/javascript">
 //<![CDATA[
 phpbb.plupload = {
@@ -37,7 +35,6 @@ phpbb.plupload = {
 		'Status': '{LA_PLUPLOAD_STATUS}',
 		'Stop Upload': '{LA_PLUPLOAD_STOP_UPLOAD}',
 		'Stop current upload': '{LA_PLUPLOAD_STOP_CURRENT_UPLOAD}',
-		'Upload element accepts only %d file(s) at a time. Extra files were stripped.': '{LA_PLUPLOAD_ERR_UPLOAD_LIMIT}',
 		"Upload URL might be wrong or doesn't exist.": '{LA_PLUPLOAD_ERR_UPLOAD_URL}',
 		'Uploaded %d/%d files': '{LA_PLUPLOAD_UPLOADED}',
 		'%d files queued': '{LA_PLUPLOAD_FILES_QUEUED}',
@@ -51,14 +48,22 @@ phpbb.plupload = {
 		unique_names: true,
 		filters: [{FILTERS}],
 		{S_RESIZE}
-		headers: {'X-PHPBB-USING-PLUPLOAD': '1'},
+		headers: {'X-PHPBB-USING-PLUPLOAD': '1', 'X-Requested-With': 'XMLHttpRequest'},
 		file_data_name: 'fileupload',
 		multipart_params: {'add_file': '{LA_ADD_FILE}'},
-		img_path: '{T_ASSETS_PATH}/plupload/jquery.plupload.queue/img',
-		element_hook: '#attach-panel .inner',
-		form_hook: '#postform'
-	}
-};
+		form_hook: '#postform',
+		browse_button: 'add_files',
+		drop_element : 'message',
+	},
+	lang: {
+		ERROR: '{LA_ERROR}',
+		TOO_MANY_ATTACHMENTS: '{LA_TOO_MANY_ATTACHMENTS}',
+	},
+	order: '{ATTACH_ORDER}',
+	maxFiles: {MAX_ATTACHMENTS},
+	data: {S_ATTACH_DATA},
+}
 //]]>
 </script>
-<script type="text/javascript" src="{T_ASSETS_PATH}/javascript/plupload.js"></script>
+<!-- INCLUDEJS {T_ASSETS_PATH}/plupload/plupload.full.min.js -->
+<!-- INCLUDEJS {T_ASSETS_PATH}/javascript/plupload.js -->
diff --git a/phpBB/styles/prosilver/template/posting_attach_body.html b/phpBB/styles/prosilver/template/posting_attach_body.html
index fa9dd19c09..8a2004c29b 100644
--- a/phpBB/styles/prosilver/template/posting_attach_body.html
+++ b/phpBB/styles/prosilver/template/posting_attach_body.html
@@ -1,9 +1,9 @@
-<div class="panel bg3" id="attach-panel">
+<div class="panel bg3 panel-container" id="attach-panel">
 	<div class="inner">
 
-	<p>{L_ADD_ATTACHMENT_EXPLAIN}</p>
+	<p>{L_ADD_ATTACHMENT_EXPLAIN} <span class="hidden" id="drag-n-drop-message">{L_PLUPLOAD_DRAG_TEXTAREA}</span></p>
 	
-	<fieldset class="fields2">
+	<fieldset class="fields2" id="attach-panel-basic">
 	<dl>
 		<dt><label for="fileupload">{L_FILENAME}{L_COLON}</label></dt>
 		<dd>
@@ -17,5 +17,73 @@
 	</dl>
 	</fieldset>
 
+	<div id="attach-panel-multi">
+		<input type="button" class="button2" value="{L_PLUPLOAD_ADD_FILES}" id="add_files" />
+	</div>
+
+	<div class="panel<!-- IF not .attach_row --> hidden<!-- ENDIF -->" id="file-list-container">
+		<div class="inner">
+			<table class="table1 zebra-list">
+				<thead>
+					<tr>
+						<th class="attach-name">{L_PLUPLOAD_FILENAME}</th>
+						<th class="attach-comment">{L_FILE_COMMENT}</th>
+						<th class="attach-filesize">{L_PLUPLOAD_SIZE}</th>
+						<th class="attach-status">{L_PLUPLOAD_STATUS}</th>
+					</tr>
+				</thead>
+				<tbody class="responsive-skip-empty" id="file-list">
+					<tr class="attach-row" id="attach-row-tpl">
+							<td class="attach-name">
+								<dfn style="display: none;">{L_PLUPLOAD_FILENAME}</dfn>
+								<span class="file-name"></span>
+								<span class="attach-controls">
+									<input type="button" value="{L_PLACE_INLINE}" class="button2 hidden file-inline-bbcode" />&nbsp;
+									<input type="button" value="{L_DELETE_FILE}" class="button2 file-delete" />
+								</span>
+								<span class="clear"></span>
+							</td>
+							<td class="attach-comment">
+								<dfn style="display: none;">{L_FILE_COMMENT}</dfn>
+								<textarea rows="1" cols="30" class="inputbox"></textarea>
+							</td>
+							<td class="attach-filesize">
+								<dfn style="display: none;">{L_PLUPLOAD_SIZE}</dfn>
+								<span class="file-size"></span>
+							</td>
+							<td class="attach-status">
+								<dfn style="display: none;">{L_PLUPLOAD_STATUS}</dfn>
+								<span class="file-progress">
+									<span class="file-progress-bar"></span>
+								</span>
+								<span class="file-status"></span>
+							</td>
+					</tr>
+					<!-- BEGIN attach_row -->
+						<tr class="attach-row" data-attach-id="{attach_row.ATTACH_ID}">
+							<td class="attach-name">
+								<span class="file-name"><a href="{attach_row.U_VIEW_ATTACHMENT}">{attach_row.FILENAME}</a></span>
+								<span class="attach-controls">
+									<!-- IF S_INLINE_ATTACHMENT_OPTIONS --><input type="button" value="{L_PLACE_INLINE}" class="button2 file-inline-bbcode" />&nbsp; <!-- ENDIF -->
+									<input type="submit" name="delete_file[{attach_row.ASSOC_INDEX}]" value="{L_DELETE_FILE}" class="button2 file-delete" />
+								</span>
+								<span class="clear"></span>
+							</td>
+							<td class="attach-comment">
+								<textarea name="comment_list[{attach_row.ASSOC_INDEX}]" rows="1" cols="30" class="inputbox">{attach_row.FILE_COMMENT}</textarea>
+								{attach_row.S_HIDDEN}
+							</td>
+							<td class="attach-filesize">
+								<span class="file-size">{attach_row.FILESIZE}</span>
+							</td>
+							<td class="attach-status">
+								<span class="file-status file-uploaded"></span>
+							</td>
+						</tr>
+					<!-- END attach_row -->
+				</tbody>
+			</table>
+		</div>
+	</div>
 	</div>
 </div>
diff --git a/phpBB/styles/prosilver/template/posting_editor.html b/phpBB/styles/prosilver/template/posting_editor.html
index 5677b92fc3..2ae224bc3a 100644
--- a/phpBB/styles/prosilver/template/posting_editor.html
+++ b/phpBB/styles/prosilver/template/posting_editor.html
@@ -149,34 +149,6 @@
 	</div>
 	<!-- ENDIF -->
 
-	<!-- IF S_HAS_ATTACHMENTS -->
-		<div class="panel bg2">
-			<div class="inner">
-			<h3>{L_POSTED_ATTACHMENTS}</h3>
-
-			<fieldset class="fields2">
-
-			<!-- BEGIN attach_row -->
-			<dl>
-
-				<dt><label for="comment_list_{attach_row.ASSOC_INDEX}">{L_FILE_COMMENT}{L_COLON}</label></dt>
-				<dd><textarea name="comment_list[{attach_row.ASSOC_INDEX}]" id="comment_list_{attach_row.ASSOC_INDEX}" rows="1" cols="35" class="inputbox">{attach_row.FILE_COMMENT}</textarea></dd>
-				<dd><a href="{attach_row.U_VIEW_ATTACHMENT}">{attach_row.FILENAME}</a></dd>
-				<dd style="margin-top: 5px;">
-					<!-- IF S_INLINE_ATTACHMENT_OPTIONS --><input type="button" value="{L_PLACE_INLINE}" onclick="attach_inline({attach_row.ASSOC_INDEX}, '{attach_row.A_FILENAME}');" class="button2" />&nbsp; <!-- ENDIF -->
-					<input type="submit" name="delete_file[{attach_row.ASSOC_INDEX}]" value="{L_DELETE_FILE}" class="button2" />
-				</dd>
-			</dl>
-			{attach_row.S_HIDDEN}
-				<!-- IF not attach_row.S_LAST_ROW --><hr class="dashed" /><!-- ENDIF -->
-			<!-- END attach_row -->
-
-			</fieldset>
-
-			</div>
-		</div>
-	<!-- ENDIF -->
-
 	<!-- IF not S_SHOW_DRAFTS and not $SIG_EDIT eq 1 -->
 	<div class="panel bg2">
 		<div class="inner">
@@ -198,7 +170,15 @@
 		<div id="tabs" class="sub-panels" data-show-panel="options-panel">
 			<ul>
 				<li id="options-panel-tab" class="activetab"><a href="#tabs" data-subpanel="options-panel"><span>{L_OPTIONS}</span></a></li>
-				<!-- IF S_SHOW_ATTACH_BOX --><li id="attach-panel-tab"><a href="#tabs" data-subpanel="attach-panel"><span>{L_ADD_ATTACHMENT}</span></a></li><!-- ENDIF -->
+				<!-- IF S_SHOW_ATTACH_BOX -->
+					<li id="attach-panel-tab">
+						<a href="#tabs" data-subpanel="attach-panel">
+							<span>
+								{L_ATTACHMENTS} <strong id="file-total-progress"><strong id="file-total-progress-bar"></strong></strong>
+							</span>
+						</a>
+					</li>				
+				<!-- ENDIF -->
 				<!-- IF S_SHOW_POLL_BOX || S_POLL_DELETE --><li id="poll-panel-tab"><a href="#tabs" data-subpanel="poll-panel"><span>{L_ADD_POLL}</span></a></li><!-- ENDIF -->
 			</ul>
 		</div>
diff --git a/phpBB/styles/prosilver/template/ucp_header.html b/phpBB/styles/prosilver/template/ucp_header.html
index c5d58b8eaa..8ce2c54294 100644
--- a/phpBB/styles/prosilver/template/ucp_header.html
+++ b/phpBB/styles/prosilver/template/ucp_header.html
@@ -98,4 +98,4 @@
 
 	</div>
 
-	<div id="cp-main" class="ucp-main">
+	<div id="cp-main" class="ucp-main panel-container">
diff --git a/phpBB/styles/prosilver/theme/colours.css b/phpBB/styles/prosilver/theme/colours.css
index cad740200d..8c411a9f4d 100644
--- a/phpBB/styles/prosilver/theme/colours.css
+++ b/phpBB/styles/prosilver/theme/colours.css
@@ -76,8 +76,14 @@ hr {
 	color: #000000;
 }
 
-.bg1	{ background-color: #ECF3F7; }
-.bg2	{ background-color: #e1ebf2; }
+table.zebra-list tr:nth-child(odd) td, ul.zebra-list li:nth-child(odd), .bg1 {
+	background-color: #ECF3F7;
+}
+
+table.zebra-list tr:nth-child(even) td, ul.zebra-list li:nth-child(even), .bg2 {
+	background-color: #e1ebf2;
+}
+
 .bg3	{ background-color: #cadceb; }
 
 .ucprowbg {
@@ -803,11 +809,11 @@ Colours and backgrounds for cp.css
 /* Main CP box
 ----------------------------------------*/
 
-#cp-main h3, #cp-main hr, #cp-menu hr {
+.panel-container h3, .panel-container hr, #cp-menu hr {
 	border-color: #A4B3BF;
 }
 
-#cp-main .panel li.row {
+.panel-container .panel li.row {
 	border-bottom-color: #B5C1CB;
 	border-top-color: #F9F9F9;
 }
@@ -816,11 +822,11 @@ ul.cplist {
 	border-top-color: #B5C1CB;
 }
 
-#cp-main .panel li.header dd, #cp-main .panel li.header dt {
+.panel-container .panel li.header dd, .panel-container .panel li.header dt {
 	color: #000000;
 }
 
-#cp-main table.table1 thead th {
+.panel-container table.table1 thead th {
 	color: #333333;
 	border-bottom-color: #333333;
 }
@@ -921,11 +927,11 @@ ul.cplist {
 
 /* Preferences pane layout
 ----------------------------------------*/
-#cp-main h2 {
+.panel-container h2 {
 	color: #333333;
 }
 
-#cp-main .panel {
+.panel-container .panel {
 	background-color: #F9F9F9;
 }
 
diff --git a/phpBB/styles/prosilver/theme/cp.css b/phpBB/styles/prosilver/theme/cp.css
index d2c69e7755..bf235b3fb5 100644
--- a/phpBB/styles/prosilver/theme/cp.css
+++ b/phpBB/styles/prosilver/theme/cp.css
@@ -20,16 +20,16 @@
 	padding: 0;
 }
 
-#cp-main .panel p {
+.panel-container .panel p {
 	font-size: 1.1em;
 }
 
-#cp-main .panel ol {
+.panel-container .panel ol {
 	margin-left: 2em;
 	font-size: 1.1em;
 }
 
-#cp-main .panel li.row {
+.panel-container .panel li.row {
 	border-bottom: 1px solid transparent;
 	border-top: 1px solid transparent;
 }
@@ -39,21 +39,21 @@ ul.cplist {
 	border-top: 1px solid transparent;
 }
 
-#cp-main .panel li.header dd, #cp-main .panel li.header dt {
+.panel-container .panel li.header dd, .panel-container .panel li.header dt {
 	margin-bottom: 2px;
 }
 
-#cp-main table.table1 {
+.panel-container table.table1 {
 	margin-bottom: 1em;
 }
 
-#cp-main table.table1 thead th {
+.panel-container table.table1 thead th {
 	font-weight: bold;
 	border-bottom: 1px solid transparent;
 	padding: 5px;
 }
 
-#cp-main table.table1 tbody th {
+.panel-container table.table1 tbody th {
 	font-style: italic;
 	background-color: transparent !important;
 	border-bottom: none;
diff --git a/phpBB/styles/prosilver/theme/plupload.css b/phpBB/styles/prosilver/theme/plupload.css
index 16c26822b5..8569eca662 100644
--- a/phpBB/styles/prosilver/theme/plupload.css
+++ b/phpBB/styles/prosilver/theme/plupload.css
@@ -1,11 +1,76 @@
-.plupload_filelist li.can_delete:hover {
-	cursor: pointer;
+#attach-panel-multi {
+	display: none;
+	margin-bottom: 1em;
 }
 
-.plupload_filelist li.can_delete:hover a {
-	background: url('../../../assets/plupload/jquery.plupload.queue/img/delete.gif');
+#file-list td {
+	vertical-align: middle;
 }
 
-.plupload_filelist li a.working {
-	background: url('../../../assets/plupload/jquery.plupload.queue/img/throbber.gif');
+.attach-name {
+	width: 50%;
+}
+
+.attach-comment {
+	width: 30%;
+}
+
+.attach-filesize {
+	width: 15%;
+}
+
+.attach-status {
+	width: 5%;
+}
+
+.attach-filesize, .attach-status {
+	text-align: center;
+}
+
+.attach-controls {
+	display: inline-block;
+	float: right;
+}
+
+#attach-row-tpl, .nojs .file-inline-bbcode {
+	display: none;
+}
+
+#file-total-progress {
+	height: 2px;
+	display: block;
+	position: relative;
+	margin: 4px -10px -6px -10px;
+}
+
+.file-progress {
+	background-color: #CCCCCC;
+	display:inline-block;
+	height: 8px;
+	width: 50px;
+}
+
+.file-progress-bar, #file-total-progress-bar {
+	background-color: green;
+	display: block;
+	height: 100%;
+	width: 0;
+}
+
+.file-status.file-working {
+	background: url('../../../assets/plupload/img/throbber.gif');
+}
+
+.file-status.file-uploaded {
+	background: url('../../../assets/plupload/img/done.gif');
+}
+
+.file-status.file-error {
+	background: url('../../../assets/plupload/img/error.gif');
+}
+
+.file-status {
+	display: inline-block;
+	height: 16px;
+	width: 16px;
 }
diff --git a/phpBB/styles/prosilver/theme/responsive.css b/phpBB/styles/prosilver/theme/responsive.css
index 397ff12942..bfa2448296 100644
--- a/phpBB/styles/prosilver/theme/responsive.css
+++ b/phpBB/styles/prosilver/theme/responsive.css
@@ -499,6 +499,10 @@ fieldset.display-actions {
 	margin: 0 25px;
 }
 
+.attach-comment dfn {
+	width: 100%;
+}
+
 @media only screen and (max-width: 500px), only screen and (max-device-width: 500px)
 {
 	p.responsive-center {
@@ -526,4 +530,9 @@ fieldset.display-actions {
 		display: block;
 		margin-bottom: 5px;
 	}
+
+	.attach-controls {
+		margin-top: 5px;
+		width: 100%;
+	}
 }