diginext-utils 0.0.1

package/src/Camera.js

@@ -0,0 +1,412 @@
+import gsap from "gsap";
+
+// check for device orientation support
+var DEVICE_ORIENTATION = {
+	VERTICAL: "vertical",
+	HORIZONTAL: "horizontal",
+};
+var deviceOrientation = DEVICE_ORIENTATION.VERTICAL;
+
+var video;
+
+/**
+ * @type {AppWebcam}
+ */
+var webcam;
+var isWebcamSupport = false;
+
+// var onSetupComplete;
+
+function requestWebcam({ container, onRejected, onReady }) {
+	// options = options || {};
+
+	var video = document.createElement("video");
+	video.style.position = "absolute";
+	video.style.top = 0;
+	video.style.left = 0;
+	video.style.width = "100%";
+	video.style.height = "100%";
+	container.append(video);
+
+	gsap.set(video, { opacity: 1 });
+
+	// $(video).css("z-index", "-2");
+	// $(video).css("position", "absolute");
+	// $(video).css("top", "0px");
+	// $(video).css("left", "0px");
+
+	stopWebcam();
+
+	webcam = new AppWebcam(video);
+	webcam.onReady = function (e) {
+		setupApp();
+
+		isWebcamSupport = true;
+
+		if (onReady) onReady(e);
+	};
+
+	webcam.onRejected = function (e) {
+		setupApp();
+
+		isWebcamSupport = false;
+
+		// if (typeof gaTrackingClick != "undefined") gaTrackingClick('request_permission', 'reject_camera');
+
+		if (onRejected) onRejected(e);
+	};
+
+	return webcam;
+}
+
+function setupApp() {
+	var _isAllow = false;
+
+	if (typeof webcam != "undefined") {
+		if (webcam.isAllowed) {
+			gsap.to(video, { duration: 2, opacity: 1 });
+			_isAllow = true;
+		}
+	}
+}
+
+function stopWebcam() {
+	if (webcam) webcam.remove();
+}
+
+/**
+ * @param  {HTMLVideoElement} videoElement
+ */
+function AppWebcam(videoElement) {
+	// define scope
+	var scope = this;
+
+	// private vars
+	/**
+	 * @type {MediaDeviceInfo[]}
+	 */
+	var inputCameras = [];
+
+	/**
+	 * @type {MediaStreamConstraints}
+	 */
+	var requestedMediaConstraints = {
+		video: {
+			// width: 640,
+			// height: 480,
+			facingMode: { exact: "environment" },
+			// facingMode: 'environment'
+		},
+		audio: false,
+	};
+
+	/**
+	 * @type {MediaStream}
+	 */
+	var stream;
+	var isAllowed = false;
+	/**
+	 * @type {HTMLVideoElement}
+	 */
+	var video;
+	var canvas = document.createElement("canvas");
+	canvas.setAttribute("id", "AppWebcam" + new Date().getTime());
+
+	// var requestWidth = deviceOrientation == DEVICE_ORIENTATION.VERTICAL
+	//   ? 360
+	//   : 640;
+	// var requestHeight = deviceOrientation == DEVICE_ORIENTATION.VERTICAL
+	//   ? 640
+	//   : 360;
+
+	this.currentCamera = null;
+
+	// initialise
+	init();
+
+	// constructor
+	function init() {
+		if (!videoElement) {
+			video = document.createElement("video");
+		} else {
+			video = videoElement;
+		}
+		//alert("!");
+
+		// canvasElement = document.getElementById ('canvas');
+		// canvasElement.width = window.innerWidth - 50;
+		// canvasElement.height = canvasElement.width;
+		// canvas = canvasElement.getContext ('2d');
+		// loadingMessage = document.getElementById ('loadingMessage');
+
+		// Older browsers might not implement mediaDevices at all, so we set an empty object first
+		if (navigator.mediaDevices === undefined) {
+			navigator.mediaDevices = {};
+		}
+
+		// Some browsers partially implement mediaDevices. We can't just assign an object
+		// with getUserMedia as it would overwrite existing properties.
+		// Here, we will just add the getUserMedia property if it's missing.
+		if (navigator.mediaDevices.getUserMedia === undefined) {
+			navigator.mediaDevices.getUserMedia = function (constraints) {
+				// First get ahold of the legacy getUserMedia, if present
+				var getUserMedia = navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
+
+				// Some browsers just don't implement it - return a rejected promise with an error
+				// to keep a consistent interface
+				if (!getUserMedia) {
+					return Promise.reject(new Error("getUserMedia is not implemented in this browser"));
+				}
+
+				// Otherwise, wrap the call to the old navigator.getUserMedia with a Promise
+				return new Promise(function (resolve, reject) {
+					getUserMedia.call(navigator, constraints, resolve, reject);
+				});
+			};
+		}
+
+		// start requesting media permissions:
+
+		console.log("[Camera.js] Requesting:", requestedMediaConstraints);
+
+		if (navigator.mediaDevices.enumerateDevices === undefined) {
+			setTimeout(function () {
+				handleError({ name: "Error", message: "NotSupported" });
+			}, 50);
+		} else {
+			navigator.mediaDevices.enumerateDevices().then(parseDevices).catch(handleError);
+		}
+
+		// navigator.mediaDevices.getUserMedia(requestedMediaConstraints).then(() => {
+		//   if (typeof navigator.mediaDevices.enumerateDevices == "undefined") {
+		//     setTimeout(function () {
+		//       handleError({ name: 'Error', message: 'NotSupported' });
+		//     }, 50);
+		//   } else {
+		//     navigator.mediaDevices
+		//       .enumerateDevices()
+		//       .then(parseDevices)
+		//       .catch(handleError);
+		//   }
+		// }).catch(handleError);
+	}
+
+	/**
+	 * @param  {MediaDeviceInfo[]} devices
+	 */
+	function parseDevices(devices) {
+		inputCameras = [];
+		var backCameras = [];
+
+		devices.forEach(function (device) {
+			if (device.kind == "videoinput" && typeof device.deviceId != "undefined" && device.deviceId != "") {
+				inputCameras.push(device);
+			}
+		});
+		// //alert (JSON.stringify (devices));
+		console.log("[Camera.js] inputCameras:", inputCameras);
+
+		if (inputCameras.length > 0) {
+			var cams = "";
+			var backCamera;
+
+			inputCameras.map((cam, index) => {
+				cams += `[${cam.deviceId}] ${cam.kind} | ${cam.label}\n`;
+				// console.log(cam);
+				var label = cam.label.toLowerCase();
+				if (label.indexOf("back") > -1 || label.indexOf("facetime") > -1) {
+					backCamera = cam;
+					backCameras.push(backCamera);
+				}
+			});
+
+			if (backCameras.length > 1) {
+				backCamera = backCameras[backCameras.length - 1];
+			}
+
+			console.log(`[Camera.js] All input sources:`, cams);
+			console.log(`[Camera.js] This device has ${backCameras.length} back camera${backCameras.length > 1 ? "s" : ""}.`);
+			console.log("[Camera.js] backCameras:", JSON.stringify(backCameras));
+
+			scope.currentCamera = backCamera;
+
+			if (scope.onGotDevices) {
+				scope.onGotDevices(devices);
+			}
+
+			// Lấy stream của camera sau
+			// (Lấy cái cuối cùng trong danh sách trước, thường sẽ là camera chính trên Android)
+			getStreamOfCameraId(backCamera.deviceId)
+				.then(onStreamReceived)
+				.catch((e) => {
+					if (backCameras.length > 1) {
+						// nếu thiết bị có nhiều hơn 1 camera sau -> thử lấy camera khác
+						backCamera = backCameras[backCameras.length - 2];
+						getStreamOfCameraId(backCamera.deviceId).then(onStreamReceived).catch(handleError);
+					} else if (backCameras.length > 2) {
+						// nếu thiết bị có nhiều hơn 2 camera sau -> thử lấy camera khác nữa
+						backCamera = backCameras[backCameras.length - 3];
+						getStreamOfCameraId(backCamera.deviceId).then(onStreamReceived).catch(handleError);
+					} else {
+						// nếu thiết bị đéo có camera sau...
+						handleError(e);
+					}
+				});
+		} else {
+			navigator.mediaDevices.getUserMedia(requestedMediaConstraints).then(onStreamReceived).catch(handleError);
+
+			if (scope.onGotDevicesFailed) scope.onGotDevicesFailed();
+		}
+	}
+
+	function getStreamOfCameraId(id) {
+		var constraints = {
+			video: { deviceId: { exact: id } },
+			audio: false,
+		};
+
+		return new Promise((resolve, reject) => {
+			navigator.mediaDevices.getUserMedia(constraints).then(resolve).catch(reject);
+		});
+	}
+
+	/**
+	 * @param  {MediaStream} stream
+	 */
+	function onStreamReceived(stream) {
+		if (inputCameras.length == 0) {
+			console.log("[Camera.js] Not found any back cameras, request again?");
+			navigator.mediaDevices.enumerateDevices().then(parseDevices).catch(handleError);
+			return;
+		}
+
+		isAllowed = true;
+
+		playWebcamVideo(stream);
+	}
+
+	/**
+	 * @param  {MediaStream} _stream
+	 */
+	function playWebcamVideo(_stream) {
+		stream = _stream;
+
+		if ("srcObject" in video) {
+			// //alert ('GOT STREAM VIDEO OBJECT');
+			video.srcObject = _stream;
+		} else {
+			// //alert ('GOT STREAM VIDEO SOURCE URL');
+			// Avoid using this in new browsers, as it is going away.
+			video.src = window.URL.createObjectURL(_stream);
+		}
+
+		// required to tell iOS safari we don't want fullscreen
+		video.setAttribute("playsinline", true);
+		video.setAttribute("muted", true);
+		video.setAttribute("autoplay", true);
+		video.muted = true;
+		video.autoplay = true;
+		video.style.objectFit = "cover";
+		video.play();
+
+		// auto play
+		video.addEventListener("canplay", function (e) {
+			// //alert ('CAN PLAY');
+		});
+
+		video.addEventListener("canplaythrough", function (e) {
+			// //alert ('CAN PLAY THROUGH');
+		});
+
+		video.addEventListener("error", (e) => console.log("[Camera.js] <video> error:", e));
+
+		video.addEventListener("stalled", function (e) {
+			// //alert ('CANNOT GET METADATA');
+			isAllowed = false;
+			console.log("[Camera.js] <video> stalled:", e);
+			if (scope.onRejected != null) scope.onRejected(e);
+		});
+
+		video.addEventListener("loadedmetadata", function (e) {
+			canvas.width = video.videoWidth;
+			canvas.height = video.videoHeight;
+
+			canvas.style.width = window.outerWidth + "px";
+			canvas.style.height = window.outerHeight + "px";
+
+			if (scope.currentCamera.label.toLowerCase().indexOf("facetime") > -1) {
+				video.style.transform = "scaleX(-1)";
+				video.style.webkitTransform = "scaleX(-1)";
+			}
+
+			video.play();
+
+			if (scope.onReady) scope.onReady(video);
+		});
+	}
+
+	function handleError(err) {
+		console.error(err);
+		var errMsg = "[Camera.js] " + err.name + ": " + err.message;
+		console.error(errMsg);
+
+		isAllowed = false;
+
+		if (scope.onRejected != null) scope.onRejected(err);
+	}
+
+	function drawVideo() {
+		var ctx = canvas.getContext("2d");
+
+		canvas.width = video.videoWidth;
+		canvas.height = video.videoHeight;
+
+		ctx.drawImage(video, 0, 0, video.videoWidth, video.videoHeight);
+	}
+
+	function captureAsBase64(callback) {
+		console.log(`[Camera.js] Base64 captured -> ${video.videoWidth}x${video.videoHeight}`);
+
+		drawVideo();
+
+		TweenMax.delayedCall(0.2, function () {
+			var screenshot = canvas.toDataURL("image/png");
+			if (callback) callback(screenshot);
+		});
+	}
+
+	function captureAsImageData() {
+		drawVideo();
+
+		var ctx = canvas.getContext("2d");
+		return ctx.getImageData(0, 0, video.videoWidth, video.videoHeight);
+	}
+
+	function dispose() {}
+
+	function enable() {}
+
+	function disable() {}
+
+	function remove() {
+		if (stream) stream.getTracks().forEach((track) => track.stop());
+	}
+
+	// exports
+	this.enable = enable;
+	this.disable = disable;
+	this.video = video;
+	this.inputCameras = inputCameras;
+	this.canvas = canvas;
+	this.captureAsBase64 = captureAsBase64;
+	this.captureAsImageData = captureAsImageData;
+	this.onReady = null;
+	this.onRejected = null;
+	this.onGotDevices = null;
+	this.onGotDevicesFailed = null;
+	this.init = init;
+	this.remove = remove;
+	this.stream = stream;
+}
+
+export { video, webcam, isWebcamSupport, requestWebcam, stopWebcam };

package/src/Checker.js

@@ -0,0 +1,24 @@
+const isJSON = (content) => {
+	if (typeof content == "object") {
+		try {
+			content = JSON.stringify(content);
+		} catch (err) {
+			return false;
+		}
+	}
+
+	if (typeof content == "string") {
+		try {
+			content = JSON.parse(content);
+		} catch (err) {
+			return false;
+		}
+	}
+
+	if (typeof content != "object") {
+		return false;
+	}
+	return true;
+};
+
+export { isJSON };

package/src/Color.js

@@ -0,0 +1,81 @@
+class Color {
+	static random = (hex = false) => {
+		return (hex ? "#" : "") + Math.floor(Math.random() * 16777215).toString(16);
+	};
+	// This function (pSBC) will take a HEX or RGB web color.
+	// pSBC can shade it darker or lighter, or blend it with a second color, and can also pass it right thru but convert from Hex to RGB (Hex2RGB) or RGB to Hex (RGB2Hex).
+	// All without you even knowing what color format you are using.
+	// Version 4.0 (pref: https://github.com/PimpTrizkit/PJs/wiki/12.-Shade,-Blend-and-Convert-a-Web-Color-(pSBC.js));
+	static pSBC = (p, c0, c1, l) => {
+		let r,
+			g,
+			b,
+			P,
+			f,
+			t,
+			h,
+			i = parseInt,
+			m = Math.round,
+			a = typeof c1 == "string";
+		if (typeof p != "number" || p < -1 || p > 1 || typeof c0 != "string" || (c0[0] != "r" && c0[0] != "#") || (c1 && !a)) return null;
+		if (!this.pSBCr)
+			this.pSBCr = (d) => {
+				let n = d.length,
+					x = {};
+				if (n > 9) {
+					([r, g, b, a] = d = d.split(",")), (n = d.length);
+					if (n < 3 || n > 4) return null;
+					(x.r = i(r[3] == "a" ? r.slice(5) : r.slice(4))), (x.g = i(g)), (x.b = i(b)), (x.a = a ? parseFloat(a) : -1);
+				} else {
+					if (n == 8 || n == 6 || n < 4) return null;
+					if (n < 6) d = "#" + d[1] + d[1] + d[2] + d[2] + d[3] + d[3] + (n > 4 ? d[4] + d[4] : "");
+					d = i(d.slice(1), 16);
+					if (n == 9 || n == 5)
+						(x.r = (d >> 24) & 255), (x.g = (d >> 16) & 255), (x.b = (d >> 8) & 255), (x.a = m((d & 255) / 0.255) / 1000);
+					else (x.r = d >> 16), (x.g = (d >> 8) & 255), (x.b = d & 255), (x.a = -1);
+				}
+				return x;
+			};
+		(h = c0.length > 9),
+			(h = a ? (c1.length > 9 ? true : c1 == "c" ? !h : false) : h),
+			(f = this.pSBCr(c0)),
+			(P = p < 0),
+			(t = c1 && c1 != "c" ? this.pSBCr(c1) : P ? { r: 0, g: 0, b: 0, a: -1 } : { r: 255, g: 255, b: 255, a: -1 }),
+			(p = P ? p * -1 : p),
+			(P = 1 - p);
+		if (!f || !t) return null;
+		if (l) (r = m(P * f.r + p * t.r)), (g = m(P * f.g + p * t.g)), (b = m(P * f.b + p * t.b));
+		else
+			(r = m((P * f.r ** 2 + p * t.r ** 2) ** 0.5)),
+				(g = m((P * f.g ** 2 + p * t.g ** 2) ** 0.5)),
+				(b = m((P * f.b ** 2 + p * t.b ** 2) ** 0.5));
+		(a = f.a), (t = t.a), (f = a >= 0 || t >= 0), (a = f ? (a < 0 ? t : t < 0 ? a : a * P + t * p) : 0);
+		if (h) return "rgb" + (f ? "a(" : "(") + r + "," + g + "," + b + (f ? "," + m(a * 1000) / 1000 : "") + ")";
+		else return "#" + (4294967296 + r * 16777216 + g * 65536 + b * 256 + (f ? m(a * 255) : 0)).toString(16).slice(1, f ? undefined : -2);
+	};
+
+	static hexToRgb(hex) {
+		var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
+		return result
+			? {
+				r: parseInt(result[1], 16),
+				g: parseInt(result[2], 16),
+				b: parseInt(result[3], 16),
+			}
+			: null;
+	}
+
+	static hexDarken(hex, amount) {
+		return Color.pSBC(-amount, hex);
+	}
+
+	static hexLighten(hex, amount) {
+		return Color.pSBC(amount, hex);
+	}
+
+	static RGBToHex(rgb) {
+		return Color.pSBC(0, rgb, "c", true);
+	}
+}
+
+export default Color;

package/src/Console.js

@@ -0,0 +1,18 @@
+import { cloneDeep } from "lodash";
+var _console = cloneDeep(console);
+
+export default {
+	enable(params) {
+		return _console;
+	},
+
+	disable() {
+		for (var i in console) {
+			console[i] = function () {};
+		}
+	},
+
+	showCredit() {
+		console.log("Developed by Digitop | https://www.wearetopgroup.com/?utm_src=console");
+	},
+};

package/src/Device.js

@@ -0,0 +1,56 @@
+var _requestedDeviceOrientation = false;
+var _isDeviceOrientationSupport = false;
+
+export default {
+	get isPotrait() {
+		if (window && !window.orientation) return window.matchMedia("(orientation: portrait)").matches;
+		return !((window && window.orientation === 90) || (window && window.orientation === -90));
+	},
+
+	get isLandscape() {
+		return !this.isPotrait;
+	},
+
+	get isDeviceOrientationSupport() {
+		// if (!_requestedDeviceOrientation) {
+		//   await this.requestDeviceOrientationData()
+		// }
+		return _isDeviceOrientationSupport;
+	},
+
+	async requestDeviceOrientationData() {
+		if (!window) {
+			// not supported
+			console.warn("`window` not found");
+			_isDeviceOrientationSupport = false;
+			return;
+		}
+
+		// console.log(window)
+		if (window.DeviceOrientationEvent !== undefined && typeof window.DeviceOrientationEvent.requestPermission === "function") {
+			console.log("This browser can be requested for `DeviceOrientationEvent` permission");
+			try {
+				const response = await window.DeviceOrientationEvent.requestPermission();
+				// console.log(response)
+				if (response == "granted") {
+					console.log("`DeviceOrientationEvent` permission -> granted!");
+					_isDeviceOrientationSupport = true;
+				} else {
+					// rejected
+					console.log("`DeviceOrientationEvent` permission ->", response);
+					_isDeviceOrientationSupport = false;
+				}
+			} catch (error) {
+				// not supported
+				console.log(error);
+				_isDeviceOrientationSupport = false;
+			}
+		} else {
+			// not supported
+			console.warn("`window.DeviceOrientationEvent` not found");
+			_isDeviceOrientationSupport = false;
+		}
+
+		return _isDeviceOrientationSupport;
+	},
+};

package/src/EventDispatcher.js

@@ -0,0 +1,58 @@
+export default class EventDispatcher {
+	constructor() {}
+
+	addEventListener(type, listener) {
+		if (this._listeners === undefined) this._listeners = {};
+
+		const listeners = this._listeners;
+
+		if (listeners[type] === undefined) {
+			listeners[type] = [];
+		}
+
+		if (listeners[type].indexOf(listener) === -1) {
+			listeners[type].push(listener);
+		}
+	}
+
+	hasEventListener(type, listener) {
+		if (this._listeners === undefined) return false;
+
+		const listeners = this._listeners;
+
+		return listeners[type] !== undefined && listeners[type].indexOf(listener) !== -1;
+	}
+
+	removeEventListener(type, listener) {
+		if (this._listeners === undefined) return;
+
+		const listeners = this._listeners;
+		const listenerArray = listeners[type];
+
+		if (listenerArray !== undefined) {
+			const index = listenerArray.indexOf(listener);
+
+			if (index !== -1) {
+				listenerArray.splice(index, 1);
+			}
+		}
+	}
+
+	dispatchEvent(event) {
+		if (this._listeners === undefined) return;
+
+		const listeners = this._listeners;
+		const listenerArray = listeners[event.type];
+
+		if (listenerArray !== undefined) {
+			event.target = this;
+
+			// Make a copy, in case listeners are removed while iterating.
+			const array = listenerArray.slice(0);
+
+			for (let i = 0, l = array.length; i < l; i++) {
+				array[i].call(this, event);
+			}
+		}
+	}
+}

package/src/FileUpload.js

@@ -0,0 +1,59 @@
+var logFile = "[FileUpload.js] ";
+
+export default {
+	uploadBlob({ blob, url, params, onComplete, onError }) {
+		var formData = new FormData();
+		formData.append("upload", blob, "img_" + +new Date() + ".jpg");
+
+		if (params) {
+			Object.keys(params).forEach((key) => {
+				var val = obj[key];
+				formData.append(key, val);
+			});
+		}
+
+		var request = new XMLHttpRequest();
+		request.open("POST", url);
+		request.send(formData);
+
+		request.onreadystatechange = function () {
+			if (this.readyState == 4) {
+				// Typical action to be performed when the document is ready:
+				if (this.status == 200) {
+					// var response = JSON.parse(request.response) || "";
+					var response = {};
+					try {
+						response = JSON.parse(request.response) || "";
+					} catch (error) {
+						console.error(logFile, "Can't part JSON of the response");
+					}
+					var statusOfSafety = response.status || 0;
+
+					if (statusOfSafety == 1) {
+						console.log(logFile, "request: ", request);
+						var data = response.data || {};
+						console.log(logFile, data);
+
+						var url = data["url"];
+
+						if (onComplete) onComplete(url);
+					} else {
+						var errMsg = "Ảnh có nội dung không phù hợp.";
+						console.error(logFile, errMsg);
+						if (onError) onError(errMsg);
+					}
+				} else {
+					var errMsg = "Upload ảnh không thành công!";
+					console.error(logFile, errMsg);
+					if (onError) onError(errMsg);
+				}
+			}
+		};
+
+		request.onerror = function (res) {
+			var errMsg = "Upload ảnh không thành công!";
+			console.error(logFile, errMsg, "=>", res);
+			if (onError) onError(errMsg);
+		};
+	},
+};