HTML: Add dive photos to the detailed view

Dive photos are copied to the photos directory on export. The photos
section appears only if photos exist.

C++ helper functions are added to copy images to the photos directory,
Additionally the photos directory must be passed as a parameter to the
write_one_dive function to save photos to it. Some options structure may
be needed instead of passing many arguments.

Signed-off-by: Gehad elrobey <gehadelrobey@gmail.com>
Signed-off-by: Miika Turkia <miika.turkia@gmail.com>
Signed-off-by: Dirk Hohndel <dirk@hohndel.org>

qt-ui/divelogexportdialog.cpp

@@ -81,13 +81,16 @@ void DiveLogExportDialog::exportHtmlInit(const QString &filename)
 	QFileInfo info(file);
 	QDir mainDir = info.absoluteDir();
 	mainDir.mkdir(file.fileName() + "_files");
-	QString exportFiles = file.fileName() + "_files/";
+	QString exportFiles = file.fileName() + "_files";
 
 	QString json_dive_data = exportFiles + QDir::separator() + "file.json";
 	QString json_settings = exportFiles + QDir::separator() + "settings.json";
+	QString photos_directory = exportFiles + QDir::separator() + "photos" + QDir::separator();
+	mainDir.mkdir(photos_directory);
+	exportFiles += "/";
 
 	exportHTMLsettings(json_settings);
-	export_HTML(json_dive_data.toUtf8().data(), ui->exportSelectedDives->isChecked(), ui->exportListOnly->isChecked());
+	export_HTML(json_dive_data.toUtf8().data(), photos_directory.toUtf8().data(), ui->exportSelectedDives->isChecked(), ui->exportListOnly->isChecked());
 
 	QString searchPath = getSubsurfaceDataPath("theme");
 	if (searchPath.isEmpty())

qthelper.cpp

@@ -4,6 +4,7 @@
 #include "statistics.h"
 #include <exif.h>
 #include "file.h"
+#include <QFile>
 #include <QRegExp>
 #include <QDir>
 #include <QMap>
@@ -283,6 +284,25 @@ picture_load_exit:
 	return;
 }
 
+extern "C" const char* get_file_name(const char *fileName)
+{
+	QFile file(fileName);
+	QFileInfo fileInfo(file.fileName());
+	QString filename(fileInfo.fileName());
+	return filename.toStdString().c_str();
+}
+
+extern "C" void copy_image_and_overwrite(const char *cfileName, const char *cnewName)
+{
+	QString fileName = QString::fromUtf8(cfileName);
+	QString newName = QString::fromUtf8(cnewName);
+	newName += get_file_name(cfileName);
+	QFile file(newName);
+	if (file.exists())
+		file.remove();
+	QFile::copy(fileName, newName);
+}
+
 static bool lessThan(const QPair<QString, int> &a, const QPair<QString, int> &b)
 {
 	return a.second < b.second;

qthelper.h

@@ -16,4 +16,5 @@ bool gpsHasChanged(struct dive *dive, struct dive *master, const QString &gps_te
 QString printGPSCoords(int lat, int lon);
 QList<int> getDivesInTrip(dive_trip_t *trip);
 QString gasToStr(struct gasmix gas);
+
 #endif // QTHELPER_H

save-html.c

@@ -11,6 +11,18 @@ void write_attribute(struct membuffer *b, const char *att_name, const char *valu
 	put_string(b, "\",");
 }
 
+void save_photos(struct membuffer *b, const char *photos_dir, struct dive *dive)
+{
+	struct picture *pic = dive->picture_list;
+	put_string(b, "\"photos\":[");
+	while (pic) {
+		put_format(b, "{\"filename\":\"%s\"},", get_file_name(pic->filename));
+		copy_image_and_overwrite(pic->filename, photos_dir);
+		pic = pic->next;
+	}
+	put_string(b, "],");
+}
+
 void write_dive_status(struct membuffer *b, struct dive *dive)
 {
 	put_format(b, "\"sac\":\"%d\",", dive->sac);
@@ -162,7 +174,7 @@ void put_HTML_tags(struct membuffer *b, struct dive *dive, const char *pre, cons
 }
 
 /* if exporting list_only mode, we neglect exporting the samples, bookmarks and cylinders */
-void write_one_dive(struct membuffer *b, struct dive *dive, int *dive_no, const bool list_only)
+void write_one_dive(struct membuffer *b, struct dive *dive, const char *photos_dir, int *dive_no, const bool list_only)
 {
 	put_string(b, "{");
 	put_format(b, "\"number\":%d,", *dive_no);
@@ -180,6 +192,7 @@ void write_one_dive(struct membuffer *b, struct dive *dive, int *dive_no, const
 	write_attribute(b, "divemaster", dive->divemaster);
 	write_attribute(b, "suit", dive->suit);
 	write_dive_status(b, dive);
+	save_photos(b, photos_dir, dive);
 	put_HTML_tags(b, dive, "\"tags\":", ",");
 	put_HTML_notes(b, dive, "\"notes\":\"", "\",");
 	if (!list_only) {
@@ -191,7 +204,7 @@ void write_one_dive(struct membuffer *b, struct dive *dive, int *dive_no, const
 	(*dive_no)++;
 }
 
-void write_no_trip(struct membuffer *b, int *dive_no, const bool list_only)
+void write_no_trip(struct membuffer *b, int *dive_no, const char *photos_dir, const bool list_only)
 {
 	int i;
 	struct dive *dive;
@@ -202,12 +215,12 @@ void write_no_trip(struct membuffer *b, int *dive_no, const bool list_only)
 
 	for_each_dive (i, dive) {
 		if (!dive->divetrip)
-			write_one_dive(b, dive, dive_no, list_only);
+			write_one_dive(b, dive, photos_dir, dive_no, list_only);
 	}
 	put_format(b, "]},\n\n");
 }
 
-void write_trip(struct membuffer *b, dive_trip_t *trip, int *dive_no, const bool list_only)
+void write_trip(struct membuffer *b, dive_trip_t *trip, int *dive_no, const char *photos_dir, const bool list_only)
 {
 	struct dive *dive;
 
@@ -216,13 +229,13 @@ void write_trip(struct membuffer *b, dive_trip_t *trip, int *dive_no, const bool
 	put_format(b, "\"dives\":[");
 
 	for (dive = trip->dives; dive != NULL; dive = dive->next) {
-		write_one_dive(b, dive, dive_no, list_only);
+		write_one_dive(b, dive, photos_dir, dive_no, list_only);
 	}
 
 	put_format(b, "]},\n\n");
 }
 
-void write_trips(struct membuffer *b, bool selected_only, const bool list_only)
+void write_trips(struct membuffer *b, const char *photos_dir, bool selected_only, const bool list_only)
 {
 	int i, dive_no = 0;
 	struct dive *dive;
@@ -239,7 +252,7 @@ void write_trips(struct membuffer *b, bool selected_only, const bool list_only)
 		for_each_dive (i, dive) {
 			if (!dive->selected)
 				continue;
-			write_one_dive(b, dive, &dive_no, list_only);
+			write_one_dive(b, dive, photos_dir, &dive_no, list_only);
 		}
 		put_format(b, "]},\n\n");
 	} else {
@@ -253,27 +266,27 @@ void write_trips(struct membuffer *b, bool selected_only, const bool list_only)
 
 			/* We haven't seen this trip before - save it and all dives */
 			trip->index = 1;
-			write_trip(b, trip, &dive_no, list_only);
+			write_trip(b, trip, &dive_no, photos_dir, list_only);
 		}
 
 		/*Save all remaining trips into Others*/
-		write_no_trip(b, &dive_no, list_only);
+		write_no_trip(b, &dive_no, photos_dir, list_only);
 	}
 }
 
-void export_list(struct membuffer *b, bool selected_only, const bool list_only)
+void export_list(struct membuffer *b, const char *photos_dir, bool selected_only, const bool list_only)
 {
 	put_string(b, "trips=[");
-	write_trips(b, selected_only, list_only);
+	write_trips(b, photos_dir, selected_only, list_only);
 	put_string(b, "]");
 }
 
-void export_HTML(const char *file_name, const bool selected_only, const bool list_only)
+void export_HTML(const char *file_name, const char *photos_dir, const bool selected_only, const bool list_only)
 {
 	FILE *f;
 
 	struct membuffer buf = { 0 };
-	export_list(&buf, selected_only, list_only);
+	export_list(&buf, photos_dir, selected_only, list_only);
 
 	f = subsurface_fopen(file_name, "w+");
 	if (!f)

save-html.h

@@ -15,8 +15,10 @@ void put_HTML_time(struct membuffer *b, struct dive *dive, const char *pre, cons
 void put_HTML_notes(struct membuffer *b, struct dive *dive, const char *pre, const char *post);
 void put_HTML_quoted(struct membuffer *b, const char *text);
 
-void export_HTML(const char *file_name, const bool selected_only, const bool list_only);
+void export_HTML(const char *file_name, const char *photos_dir, const bool selected_only, const bool list_only);
 
+extern void copy_image_and_overwrite(const char *cfileName, const char *cnewName);
+extern const char* get_file_name(const char *fileName);
 #ifdef __cplusplus
 }
 #endif

theme/dive_export.html

@@ -203,6 +203,15 @@ function changeAdvSearch(e){
 		<div id="divestats">
 		<h2 class="det_hed">Dive stats</h2>
 		</div>
+		<div id="divephotos">
+		<h2 class="det_hed">Dive Photos</h2>
+		<div id="slider_container">
+			<button onclick="prev_photo()" style="width:7%;margin:1%;float:left;">&lt;-</button>
+			<div id="slider">
+			</div>
+			<button onclick="next_photo()" style="width:7%;margin:1%;float:left">-&gt;</button>
+		</div>
+		</div>
 	</div>
 </body>
 </html>

theme/light.css

@@ -210,6 +210,20 @@ ul:hover{
 	box-shadow: 10px 10px 5px #888888;
 }
 
+#slider_container{
+	height:240px;
+	margin-bottom:20px;
+}
+
+#slider{
+	float:left;
+	width:80%;
+	min-width:350px;
+	height:240px;
+	border-style:solid;
+	overflow:hidden;
+}
+
 .Cyl{
 	padding-right:25px;
 }

theme/list_lib.js

@@ -724,7 +724,8 @@ function get_bookmark_HTML(event)
 */
 function get_bookmarks_HTML(dive)
 {
-	if (dive.events <= 0) return "";
+	if (dive.events <= 0)
+		return "";
 	var result = "";
 	result += '<h2 class="det_hed">Events</h2><table><tr><td class="words">Name</td><td class="words">Time</td></tr>';
 	for (var i in dive.events) {
@@ -766,6 +767,43 @@ function get_status_HTML(dive)
 	       '</td></tr></table>';
 };
 
+function get_dive_photos(dive)
+{
+	if (dive.photos.length <= 0) {
+		document.getElementById("divephotos").style.display = 'none';
+		return "";
+	}
+	var slider = "";
+	document.getElementById("divephotos").style.display = 'block';
+	for (var i = 0; i < dive.photos.length; i++) {
+		slider += '<img src="'+location.pathname
+		+'_files/photos/'+dive.photos[i].filename+'" alt="" height="240" width="240">';
+	}
+	return slider;
+}
+
+function prev_photo()
+{
+	var temp = items[dive_id].photos[0];
+	var i;
+	for (i = 0; i < items[dive_id].photos.length - 1; i++) {
+		items[dive_id].photos[i] = items[dive_id].photos[i + 1]
+	}
+	items[dive_id].photos[i] = temp;
+	document.getElementById("slider").innerHTML = get_dive_photos(items[dive_id]);
+}
+
+function next_photo()
+{
+	var temp = items[dive_id].photos[items[dive_id].photos.length - 1];
+	var i;
+	for (i = items[dive_id].photos.length - 1; i > 0; i--) {
+		items[dive_id].photos[i] = items[dive_id].photos[i - 1]
+	}
+	items[dive_id].photos[0] = temp;
+	document.getElementById("slider").innerHTML = get_dive_photos(items[dive_id]);
+}
+
 function mkelvin_to_C(mkelvin)
 {
 	return (mkelvin - ZERO_C_IN_MKELVIN) / 1000.0;
@@ -948,6 +986,7 @@ function showDiveDetails(dive)
 	document.getElementById("dive_equipments").innerHTML = get_cylinders_HTML(items[dive_id]);
 	document.getElementById("bookmarks").innerHTML = get_bookmarks_HTML(items[dive_id]);
 	document.getElementById("divestats").innerHTML = get_status_HTML(items[dive_id]);
+	document.getElementById("slider").innerHTML = get_dive_photos(items[dive_id]);
 	setDiveTitle(items[dive_id]);
 
 	//hide the list of dives and show the canvas.

theme/sand.css

@@ -212,6 +212,20 @@ ul:hover{
 	box-shadow: 7px 7px 5px rgba(215, 107, 27, 0.43);
 }
 
+#slider_container{
+	height:240px;
+	margin-bottom:20px;
+}
+
+#slider{
+	float:left;
+	width:80%;
+	min-width:350px;
+	height:240px;
+	border-style:solid;
+	overflow:hidden;
+}
+
 .det_hed{
 	background-color:#EFC15F;
 	padding:3px;