From: Marcin Haba <marcin.haba@bacula.pl>
Date: Sun, 21 Jul 2019 18:36:17 +0000 (+0200)
Subject: baculum: Miscellaneous improvements to use restore file browsers on different screen... 
X-Git-Tag: Release-9.6.0~185
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=891bca2de2df752698e66430ef35552cc40f6ab4;p=thirdparty%2Fbacula.git

baculum: Miscellaneous improvements to use restore file browsers on different screen sizes and mobile devices

Also small corrections to English texts in restore wizard
---

diff --git a/gui/baculum/protected/Web/Lang/en/messages.mo b/gui/baculum/protected/Web/Lang/en/messages.mo
index ef6051fe74..d01ba02ad0 100644
Binary files a/gui/baculum/protected/Web/Lang/en/messages.mo and b/gui/baculum/protected/Web/Lang/en/messages.mo differ
diff --git a/gui/baculum/protected/Web/Lang/en/messages.po b/gui/baculum/protected/Web/Lang/en/messages.po
index e4e63ada48..4d54659c5c 100644
--- a/gui/baculum/protected/Web/Lang/en/messages.po
+++ b/gui/baculum/protected/Web/Lang/en/messages.po
@@ -461,11 +461,11 @@ msgstr "Step 3 - select files to restore"
 msgid "Files"
 msgstr "Files"
 
-msgid "For see a file versions please click file on the left files browser."
-msgstr "For see a file versions please click file on the left files browser."
+msgid "To see file versions please click a file on the left files browser."
+msgstr "To see file versions please click a file on the left files browser."
 
-msgid "For add a file to restore please click 'Add' link or drag a file from frame on left or from above frame and drop it here"
-msgstr "For add a file to restore please click 'Add' link or drag a file from frame on left or from above frame and drop it here"
+msgid "To add a file to restore please click 'Add' link or please drag here the file from the top frame or from the frame on the left."
+msgstr "To add a file to restore please click 'Add' link or please drag here the file from the top frame or from the frame on the left."
 
 msgid "It seems that there is no files for choosing or file records in database for this job has been purged (file retention period expired)"
 msgstr "It seems that there is no files for choosing or file records in database for this job has been purged (file retention period expired)"
diff --git a/gui/baculum/protected/Web/Lang/ja/messages.mo b/gui/baculum/protected/Web/Lang/ja/messages.mo
index 778cbace03..9f6e69899a 100644
Binary files a/gui/baculum/protected/Web/Lang/ja/messages.mo and b/gui/baculum/protected/Web/Lang/ja/messages.mo differ
diff --git a/gui/baculum/protected/Web/Lang/ja/messages.po b/gui/baculum/protected/Web/Lang/ja/messages.po
index 2e698858e6..4b766c989e 100644
--- a/gui/baculum/protected/Web/Lang/ja/messages.po
+++ b/gui/baculum/protected/Web/Lang/ja/messages.po
@@ -576,12 +576,8 @@ msgstr "Finished jobs:"
 msgid "First written"
 msgstr "First written"
 
-msgid ""
-"For add a file to restore please click 'Add' link or drag a file from frame "
-"on left or from above frame and drop it here"
-msgstr ""
-"左のフレームから追加をクリックするか「ここ」にファイルをドラック＆ "
-"ドロップしてリストア対象のファイルを追加してください"
+msgid "To add a file to restore please click 'Add' link or please drag here the file from the top frame or from the frame on the left."
+msgstr "左のフレームから追加をクリックするか「ここ」にファイルをドラック＆ ドロップしてリストア対象のファイルを追加してください"
 
 msgid ""
 "For need defining more Baculum users with custom access or restricted "
@@ -592,7 +588,7 @@ msgstr ""
 "console access (Bconsole ACLs) here is possible to determine custom bconsole "
 "configuration file format for each user."
 
-msgid "For see a file versions please click file on the left files browser."
+msgid "To see file versions please click a file on the left files browser."
 msgstr "ファイルのバージョンチェックをするには左のフレームのファイルをクリックしてください"
 
 msgid "From day"
diff --git a/gui/baculum/protected/Web/Lang/pl/messages.mo b/gui/baculum/protected/Web/Lang/pl/messages.mo
index 2cd2482629..20e800cdc7 100644
Binary files a/gui/baculum/protected/Web/Lang/pl/messages.mo and b/gui/baculum/protected/Web/Lang/pl/messages.mo differ
diff --git a/gui/baculum/protected/Web/Lang/pl/messages.po b/gui/baculum/protected/Web/Lang/pl/messages.po
index d7b1b50884..dea64a55b9 100644
--- a/gui/baculum/protected/Web/Lang/pl/messages.po
+++ b/gui/baculum/protected/Web/Lang/pl/messages.po
@@ -410,10 +410,10 @@ msgstr "Uruchom"
 msgid "It seems that there is no files for choosing or file records in database for this job has been purged (file retention period expired)"
 msgstr "Wygląda na to, że nie ma żadnych plików do przywrócenia lub rekordy plików w bazie danych dla tego wybranego backupu zostały wyczyszczone (miała zastosowanie retencja plików)"
 
-msgid "For see a file versions please click file on the left files browser."
+msgid "To see file versions please click a file on the left files browser."
 msgstr "Aby zobaczyć wersje pliku proszę klinąć plik z przeglądarki plików po lewej stronie."
 
-msgid "For add a file to restore please click 'Add' link or drag a file from frame on left or from above frame and drop it here"
+msgid "To add a file to restore please click 'Add' link or please drag here the file from the top frame or from the frame on the left."
 msgstr "Aby dodać plik do przywrócenia proszę kliknąć link 'Dodaj' lub złapać plik z panelu po lewej lub z panelu powyżej, przeciągnąć go tutaj i upuścić go"
 
 msgid "Source parameters"
diff --git a/gui/baculum/protected/Web/Lang/pt/messages.mo b/gui/baculum/protected/Web/Lang/pt/messages.mo
index 330728d826..e26873292c 100644
Binary files a/gui/baculum/protected/Web/Lang/pt/messages.mo and b/gui/baculum/protected/Web/Lang/pt/messages.mo differ
diff --git a/gui/baculum/protected/Web/Lang/pt/messages.po b/gui/baculum/protected/Web/Lang/pt/messages.po
index 54f30f0af5..de8cd8bc19 100644
--- a/gui/baculum/protected/Web/Lang/pt/messages.po
+++ b/gui/baculum/protected/Web/Lang/pt/messages.po
@@ -465,10 +465,10 @@ msgstr "Etapa 3 - Selecione os arquivos para restaurar"
 msgid "Files"
 msgstr "Arquivos"
 
-msgid "For see a file versions please click file on the left files browser."
+msgid "To see file versions please click a file on the left files browser."
 msgstr "Para verificar as versões disponíveis dos arquivos, clique no menu à esquerda no arquivo desejado."
 
-msgid "For add a file to restore please click 'Add' link or drag a file from frame on left or from above frame and drop it here"
+msgid "To add a file to restore please click 'Add' link or please drag here the file from the top frame or from the frame on the left."
 msgstr "Para adicionar um arquivo para restauração clique no link 'Adicionar' ou arraste e solte o arquivo do menu à esquerda neste quadro"
 
 msgid "It seems that there is no files for choosing or file records in database for this job has been purged (file retention period expired)"
diff --git a/gui/baculum/protected/Web/Pages/RestoreWizard.page b/gui/baculum/protected/Web/Pages/RestoreWizard.page
index 63b3a55f4c..ca2f27d963 100644
--- a/gui/baculum/protected/Web/Pages/RestoreWizard.page
+++ b/gui/baculum/protected/Web/Pages/RestoreWizard.page
@@ -335,6 +335,7 @@ oJobsToRestoreList.init();
 						</prop:ClientSide.OnLoading>
 						<prop:ClientSide.OnComplete>
 							document.getElementById('restore-browser-files-loading').style.display = 'none';
+							make_draggable('<%=$this->getPage()->DataGridFiles->ClientID%>');
 						</prop:ClientSide.OnComplete>
 						<i class="fa fa-check"></i> &nbsp;<%[ OK ]%>
 					</com:TActiveLinkButton>
@@ -342,7 +343,7 @@ oJobsToRestoreList.init();
 			</div>
 			<table id="restore-browser">
 				<tr>
-					<td rowspan="2">
+					<td rowspan="2" style="height: 100%">
 						<div id="restore-browser-files-loading" style="display: none"></div>
 						<div id="restore-browser-files" class="w3-border">
 						<com:TActiveDataGrid
@@ -355,7 +356,7 @@ oJobsToRestoreList.init();
 							DataKeyField="fileid"
 							>
 								<prop:EmptyTemplate>
-									<div class="file-browser-watermark" style="padding: 200px 10px">
+									<div class="file-browser-watermark">
 										<%[ It seems that there is no files for choosing or file records in database for this job has been purged (file retention period expired) ]%>
 									</div>
 								</prop:EmptyTemplate>
@@ -414,7 +415,7 @@ oJobsToRestoreList.init();
 						</com:TCallback>
 						</div>
 					</td>
-					<td>
+					<td style="height: 50%">
 						<div id="restore-browser-versions" class="w3-border" style="position: relative">
 							<com:TActiveDataGrid
 								ID="VersionsDataGrid"
@@ -427,7 +428,7 @@ oJobsToRestoreList.init();
 							>
 								<prop:EmptyTemplate>
 									<div class="file-browser-watermark">
-										<%[ For see a file versions please click file on the left files browser. ]%>
+										<%[ To see file versions please click a file on the left files browser. ]%>
 									</div>
 								</prop:EmptyTemplate>
 								<com:TActiveTemplateColumn>
@@ -472,7 +473,7 @@ oJobsToRestoreList.init();
 					</td>
 				</tr>
 				<tr>
-					<td style="vertical-align: bottom;">
+					<td style="height: 50%; vertical-align: bottom;">
 						<div id="restore-browser-selected" class="w3-border">
 							<com:TCallback
 								ID="RemoveSelectedItem"
@@ -501,8 +502,8 @@ oJobsToRestoreList.init();
 										DataKeyField="fileid"
 									>
 									<prop:EmptyTemplate>
-										<div class="file-browser-watermark" style="padding: 50px 10px">
-											<%[ For add a file to restore please click 'Add' link or drag a file from frame on left or from above frame and drop it here ]%>
+										<div class="file-browser-watermark">
+											<%[ To add a file to restore please click 'Add' link or please drag here the file from the top frame or from the frame on the left. ]%>
 										</div>
 									</prop:EmptyTemplate>
 									<com:TActiveTemplateColumn>
@@ -542,9 +543,25 @@ oJobsToRestoreList.init();
 				</div>
 			</div>
 			<script type="text/javascript">
-				var browser = document.getElementById('restore-browser-files');
-				document.getElementById('restore-browser-files-loading').style.width = browser.offsetWidth + 'px';
-				document.getElementById('restore-browser-files-loading').style.height = browser.offsetHeight + 'px';
+				function set_browser_sizes() {
+					var win_height = $(window).height();
+					// 70 - bottom bar, 234 - top bar, 40 - path field
+					var h = win_height - 70 - 234 - 40;
+					if (h < 220) {
+						h = 220; // minimal fs browser height
+					}
+					var comp_rb_height = h.toString() + 'px';
+					var rb = document.getElementById('restore-browser');
+					rb.style.height = comp_rb_height;
+
+					// workaround for setting proper browser height on Firefox
+					$(rb).find('tbody')[0].style.height = comp_rb_height;
+
+					var rb_files = document.getElementById('restore-browser-files');
+					var rb_load = document.getElementById('restore-browser-files-loading');
+					rb_load.style.width = rb_files.offsetWidth + 'px';
+					rb_load.style.height = rb_files.offsetHeight + 'px';
+				}
 				function show_invalid_path_to_restore() {
 					document.getElementById('invalid_path_to_restore_modal').style.display = 'block';
 				}
@@ -556,6 +573,10 @@ oJobsToRestoreList.init();
 						'containment':"window"
 					});
 				}
+				$(window).resize(function() {
+					set_browser_sizes();
+				});
+				set_browser_sizes();
 				make_draggable('<%=$this->getPage()->DataGridFiles->ClientID%>');
 				Formatters.set_formatters();
 			</script>
diff --git a/gui/baculum/themes/Baculum-v2/css/restore-wizard.css b/gui/baculum/themes/Baculum-v2/css/restore-wizard.css
index e40d33d759..f4d55f5734 100644
--- a/gui/baculum/themes/Baculum-v2/css/restore-wizard.css
+++ b/gui/baculum/themes/Baculum-v2/css/restore-wizard.css
@@ -1,39 +1,24 @@
 #restore-browser {
 	width: 100%;
-	height: 100%;
 }
 
 #restore-browser td {
 	width: 45%;
 }
 
-#restore-browser-files {
-	height: 364px;
-}
-
 #restore-browser-files, #restore-browser-versions, #restore-browser-selected {
 	overflow: auto;
 	width: 100%;
+	height: 100% !important;
 	background-color: white;
 	padding: 0 4px;
-	-moz-user-select: -moz-none;
-	-webkit-user-select: none;
-	-ms-user-select: none;
-}
-
-#restore-browser-versions {
-	height: 180px;
-}
-
-#restore-browser-selected {
-	height: 180px;
 }
 
 #restore-browser-files-loading {
 	position: absolute;
 	z-index: 10;
 	height: 100%;
-	background: rgba(182,182,182,0.4) url('progress.gif') no-repeat center center;
+	background: rgba(182,182,182,0.4) url('/themes/Baculum-v2/loader-small.gif') no-repeat center center;
 }
 
 .file-browser-detail {
@@ -76,3 +61,10 @@ tr.file-browser-element:hover {
 .bold {
 	font-weight: bold;
 }
+
+/* Overwrite jQuery-UI draggable class to solve problem with
+ * scrolling file list on mobile devices
+ */
+.ui-draggable-handle {
+    touch-action: auto !important;
+}
diff --git a/gui/baculum/themes/Baculum-v2/loader-small.gif b/gui/baculum/themes/Baculum-v2/loader-small.gif
new file mode 100644
index 0000000000..c69e937232
Binary files /dev/null and b/gui/baculum/themes/Baculum-v2/loader-small.gif differ