Globalping: web tools UI changes; infinite mode

src/assets/js/_.js

@@ -384,7 +384,7 @@ module.exports = {
 			url,
 			headers,
 			responseHeadersToGet = null,
-			onFailReturnStatus = false,
+			// onFailReturnStatus = false,
 		} = obj;
 
 		return new Promise((resolve, reject) => {
@@ -426,11 +426,11 @@ module.exports = {
 						resolve(response);
 					}
 				} else {
-					if (onFailReturnStatus) {
-						reject(new Error(xhr.status));
-					} else {
-						reject(response);
-					}
+					// eslint-disable-next-line prefer-promise-reject-errors
+					reject({
+						...response,
+						responseStatusCode: xhr.status,
+					});
 				}
 			};
 
@@ -1216,10 +1216,23 @@ module.exports = {
 		return `${text.substr(0, length - 3)}...`;
 	},
 
+	getGpProbeLastTiming (testType, result) {
+		let lastTiming;
+		let { timings = [] } = result;
+
+		if (testType === 'ping') {
+			lastTiming = timings[timings.length - 1] ? timings[timings.length - 1].rtt : PROBE_NO_TIMING_VALUE;
+		}
+
+		return lastTiming;
+	},
+
 	calcGpTestResTiming (testType, testResData, dnsTraceEnabled = false, units = ' ms') {
 		let resTiming;
+		let lastTiming;
 		let extraValues = {};
 		let lowCaseTestName = testType.toLowerCase();
+		lastTiming = this.getGpProbeLastTiming(testType, testResData.result);
 
 		if (testResData.result?.status === PROBE_STATUS_FAILED) {
 			return {
@@ -1233,7 +1246,7 @@ module.exports = {
 				value: PROBE_STATUS_OFFLINE,
 				extraValues,
 				fullText: PROBE_STATUS_OFFLINE,
-				isFailed: true,
+				isFailed: false,
 			};
 		}
 
@@ -1348,14 +1361,16 @@ module.exports = {
 				units,
 				note,
 				fullText: note ? `${Math.round(resTiming)}${units} ${note}` : `${Math.round(resTiming)}${units}`,
+				lastTiming,
 			};
 		}
 
 		return {
 			value: PROBE_NO_TIMING_VALUE,
 			extraValues,
 			fullText: PROBE_NO_TIMING_VALUE,
-			isFailed: true,
+			isFailed: testResData.result?.status === PROBE_STATUS_FAILED,
+			lastTiming: PROBE_NO_TIMING_VALUE,
 		};
 	},
 
@@ -1396,4 +1411,59 @@ module.exports = {
 			left: box.left + window.scrollX - docElem.clientLeft,
 		};
 	},
+
+	removeDuplicatedTargets (arr) {
+		return arr.reduce((uniquesArr, item) => {
+			if (uniquesArr.indexOf(item) < 0) {
+				uniquesArr.push(item);
+			}
+
+			return uniquesArr;
+		}, []);
+	},
+
+	parseGpRawOutputForTimings (raw) {
+		let packetsRtt = [];
+		let packetsDrop = 0;
+		let timeMatch;
+		let timeRegex = /time=(\d+(\.\d+)?)/;
+		let lines = raw.split('\n').filter(l => l);
+		let currPacketRtt;
+
+		for (let i = 0; i < lines.length; i++) {
+			if (i === 0) { continue; }
+
+			if (lines[i].includes('---')) { break; }
+
+			timeMatch = timeRegex.exec(lines[i]);
+
+			if (timeMatch === null) {
+				packetsDrop++;
+				currPacketRtt = PROBE_NO_TIMING_VALUE;
+			} else {
+				currPacketRtt = parseFloat(timeMatch[1]);
+			}
+
+			packetsRtt.push(currPacketRtt);
+		}
+
+		return {
+			packetsRtt,
+			packetsDrop,
+			packetsTotal: packetsRtt.length,
+		};
+	},
+	memoize (func) {
+		let cache = new Map();
+
+		return function (...args) {
+			let key = JSON.stringify(args);
+
+			if (!cache.has(key)) {
+				cache.set(key, func.apply(this, args));
+			}
+
+			return cache.get(key);
+		};
+	},
 };

src/assets/js/decorators/tooltip.js

@@ -2,6 +2,7 @@ let tooltipDecorator = (
 	node,
 	content,
 	position = 'top',
+	rawHtml = false,
 	elementName = 'div',
 	className,
 	offsetX,
@@ -69,7 +70,16 @@ let tooltipDecorator = (
 			if (document.querySelector('#ractive-tooltip-instance') === null) {
 				tooltip = document.createElement(elementName);
 				tooltip.className = `ractive-tooltip ${getPositionClass(position)}${className ? ` ${className}` : ''}`;
-				tooltip.textContent = content;
+
+				if (rawHtml) {
+					let preTag = document.createElement('pre');
+
+					preTag.textContent = content;
+					tooltip.appendChild(preTag);
+				} else {
+					tooltip.textContent = content;
+				}
+
 				tooltip.id = 'ractive-tooltip-instance';
 				document.body.appendChild(tooltip);
 			}

src/assets/js/utils/http.js

@@ -263,7 +263,7 @@ module.exports.postGlobalpingMeasurement = (opts) => {
 };
 
 module.exports.getGlobalpingMeasurement = (id) => {
-	return _.makeHTTPRequest({ url: `${GLOBALPING_HOST}/v1/measurements/${id}`, onFailReturnStatus: true });
+	return _.makeHTTPRequest({ url: `${GLOBALPING_HOST}/v1/measurements/${id}` });
 };
 
 

src/assets/less/app-globalping.less

@@ -3,10 +3,15 @@
 @import "common-globalping.less";
 
 @import "components/controlled-input.less";
-@import "components/gp-test-results.less";
 @import "components/gp-top-navigation.less";
 @import "components/gp-jumbotron.less";
 @import "components/gp-test-depiction.less";
+@import "components/tags-input.less";
+@import "components/gp-results-controls.less";
+@import "components/gp-results-raw-output.less";
+@import "components/gp-results-table-output.less";
+@import "components/gp-results-share.less";
+@import "components/gp-credits-message.less";
 
 @import "pages/globalping.less";
 @import "pages/globalping/cli.less";