From 66d9af42b69a0a48791a303aea6229b5a8ee5632 Mon Sep 17 00:00:00 2001
From: mmcwilliams <hi@mmcwilliams.com>
Date: Wed, 31 Jan 2018 21:45:19 -0500
Subject: [PATCH] Define spinner with a cfg object only once, then hide and
 show as needed. Add a 'msg' parameter to the spinner function which adds a
 message to the spinner on show and a spinnerMsg() function which allows it to
 be changed while the spinner is showing.

---
 app/lib/ui/index.js | 62 ++++++++++++++++++++++++++-------------------
 1 file changed, 36 insertions(+), 26 deletions(-)

diff --git a/app/lib/ui/index.js b/app/lib/ui/index.js
index c4128fc..fb66cca 100644
--- a/app/lib/ui/index.js
+++ b/app/lib/ui/index.js
@@ -105,35 +105,45 @@ gui.updateState = function () {
 	$('#seq_cam_count_2').val(cpos).change();
 	$('#seq_proj_count_2').val(ppos).change();
 };
-gui.spinner = function (state) {
-	var cfg = {
-		lines: 11, // The number of lines to draw
-		length: 15, // The length of each line
-		width: 7, // The line thickness
-		radius: 20, // The radius of the inner circle
-		corners: 1, // Corner roundness (0..1)
-		rotate: 0, // The rotation offset
-		direction: 1, // 1: clockwise, -1: counterclockwise
-		color: '#F2F2F1', // #rgb or #rrggbb or array of colors
-		speed: 1, // Rounds per second
-		trail: 60, // Afterglow percentage
-		shadow: true, // Whether to render a shadow
-		hwaccel: true, // Whether to use hardware acceleration
-		className: 'spinner', // The CSS class to assign to the spinner
-		zIndex: 2e9, // The z-index (defaults to 2000000000)
-		top: '50%', // Top position relative to parent
-		left: '50%' // Left position relative to parent
-	},
-	target,
+gui.spinnerCfg =  {
+	lines: 11, // The number of lines to draw
+	length: 15, // The length of each line
+	width: 7, // The line thickness
+	radius: 20, // The radius of the inner circle
+	corners: 1, // Corner roundness (0..1)
+	rotate: 0, // The rotation offset
+	direction: 1, // 1: clockwise, -1: counterclockwise
+	color: '#F2F2F1', // #rgb or #rrggbb or array of colors
+	speed: 1, // Rounds per second
+	trail: 60, // Afterglow percentage
+	shadow: true, // Whether to render a shadow
+	hwaccel: true, // Whether to use hardware acceleration
+	className: 'spinner', // The CSS class to assign to the spinner
+	zIndex: 2e9, // The z-index (defaults to 2000000000)
+	top: '50%', // Top position relative to parent
+	left: '50%' // Left position relative to parent
+}
+gui.spinner = function (state, msg = '') {
+	var target,
 	spinner;
-	if (state) {
-		target = document.getElementById('spinner');
-		spinner = new Spinner(cfg).spin(target);
-	} else {
-		$('#spinner').hide();
-		$('#psinner').empty();
+	if (msg !== '') {
+		gui.spinnerMsg(msg)
 	}
+	if (state && !$('#spinner').hasClass('created')) {
+		target = document.getElementById('spinner');
+		spinner = new Spinner(gui.spinnerCfg).spin(target);
+		$('#spinner').addClass('created');
+	} else if (state) {
+		$('#spinner').show();
+	} else if (!state) {
+		$('#spinner').hide();
+		gui.spinnerMsg('')
+	}
+
 };
+gui.spinnerMsg = function (msg) {
+	$('#spinnerMsg').text(msg)
+}
 gui.overlay = function (state) {
 	if (state) {
 		$('#overlay').show();