JT-CIM-SDK/packages/Widgets/common/RuntimeEnvironment.js

/**
 * 检测程序运行环境
 * @return
 */
const _checkAppOrWeb = function() {
	if (window.navigator.userAgent.match(
			/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i
		)) {
		return "App";
	} else {
		return "Web";
	}
}

/**
 * 是否是运行于App
 * @ignore
 */
export const isRuntimeApp = function() {
	if (_checkAppOrWeb() === "App") {
		return true;
	}
	return false;
}

/**
 * 是否是运行于App
 * @ignore
 */
export const isRuntimeWeb = function() {
	if (_checkAppOrWeb() === "Web") {
		return true;
	}
	return false;
}

/**
 * @ignore
 * 创建操作的主容器
 */
export function createOperationMainDom() {
	//创建画布
	let buttonDiv = document.createElement('div');
	buttonDiv.id = "drawButtonDiv";
	buttonDiv.style.width = '80px';
	buttonDiv.style.backgroundColor = 'rgba(5, 45, 155, 0.7)';
	buttonDiv.style.borderRadius = '5px';
	buttonDiv.style.display = 'flex';
	buttonDiv.style.flexDirection = 'column';
	buttonDiv.style.padding = '8px';
	buttonDiv.style.justifyContent = 'center';
	buttonDiv.style.position = 'absolute';
	buttonDiv.style.bottom = '150px';
	buttonDiv.style.right = '10px';

	let btnUndo = document.createElement('button');
	btnUndo.id = "btnDrawBackout";
	btnUndo.style.height = '30px';
	btnUndo.style.marginBottom = '8px';
	btnUndo.style.backgroundColor = 'rgba(52, 137, 255, 1.0)';
	btnUndo.style.color = 'rgb(255, 255, 255)';
	btnUndo.style.border = '0px solid red';
	btnUndo.style.borderRadius = '5px';
	btnUndo.innerHTML = '回退';
	btnUndo.style.fontSize = '13px';
	btnUndo.style.cursor = 'pointer';
	buttonDiv.appendChild(btnUndo);

	let btnCompletion = document.createElement('button');
	btnCompletion.id = "btnDrawComplete";
	btnCompletion.style.height = '30px';
	btnCompletion.style.backgroundColor = 'rgba(88, 185, 45, 1.0)';
	btnCompletion.style.color = 'rgb(255, 255, 255)';
	btnCompletion.style.border = '0px solid red';
	btnCompletion.style.borderRadius = '5px';
	btnCompletion.innerHTML = '完成';
	btnCompletion.style.fontSize = '13px';
	btnCompletion.style.cursor = 'pointer';
	buttonDiv.appendChild(btnCompletion);

	/* 加入到页面 */
	document.body.appendChild(buttonDiv);
}

/**
 * 创建顶部弹出提示消息 1秒后自动消失
 * @ignore
 * @param {String} message 消息内容
 */
export function showTooltipMessage(message) {
	let msgMainDom = document.getElementById('messageMainDom');
	if (msgMainDom !== null && msgMainDom !== undefined) {
		document.body.removeChild(msgMainDom);
	}
	msgMainDom = document.createElement('div');
	msgMainDom.style.width = '30%';
	msgMainDom.style.backgroundColor = 'rgba(237, 248, 230, 1.0)';
	msgMainDom.style.height = '45px';
	msgMainDom.style.border = 'solid 2px rgb(219, 241, 208)';
	msgMainDom.style.borderRadius = '8px';
	msgMainDom.style.display = 'flex';
	msgMainDom.style.alignItems = 'center';
	msgMainDom.style.paddingLeft = '10px';
	msgMainDom.style.color = 'rgb(91, 188, 48)';
	msgMainDom.style.fontSize = '14px';
	msgMainDom.style.fontWeight = '600';
	msgMainDom.style.position = 'absolute';
	msgMainDom.style.left = '35%';
	msgMainDom.style.transition = 'transform 1s';
	msgMainDom.style.transform = 'translateY(-90px)';
	msgMainDom.style.top = '0px';
	msgMainDom.style.zIndex = 1000;
	document.body.appendChild(msgMainDom);

	let strHtml = '';
	strHtml += "<div style='"
	strHtml += "background-color: rgb(88, 185, 45);";
	strHtml += "color: rgb(255, 255, 255);";
	strHtml += "height: 24px;";
	strHtml += "width: 24px;";
	strHtml += "border-radius: 20px;";
	strHtml += "display: flex;";
	strHtml += "justify-content: center;";
	strHtml += "align-items: center;";
	strHtml += "font-size: 14px;";
	strHtml += "margin-right: 18px;";
	strHtml += "'>&#10003</div>";
	strHtml += "<div>" + message + "</div>";

	msgMainDom.innerHTML = strHtml;
	msgMainDom.addEventListener('transitionend', function() {
		setTimeout(function() {
			document.body.removeChild(msgMainDom);
		}, 1000);
	}, false);

	setTimeout(function() {
		msgMainDom.style.transform = 'translateY(50px)';
	}, 100)
}