export class LTHelperExample {
constructor() {
lt.RasterSupport.setLicenseUri("https://demo.leadtools.com/licenses/js/LEADTOOLSEVAL.txt", "EVAL", null);
}
public run = (buttonId: string, outputId: string) => {
const button = document.getElementById(buttonId);
button.onclick = () => {
const lines: string[] = this.getInfo();
// Log
console.log(lines);
// Create a table from the info
const table = document.getElementById(outputId);
lines.forEach((line) => {
const row = document.createElement("tr");
// [0] is name
const name = document.createElement("th");
name.innerHTML = line[0];
// [1] is content
const content = document.createElement("td");
content.innerHTML = line[1];
row.appendChild(name);
row.appendChild(content);
//output.appendChild(row);
table.appendChild(row);
});
}
}
public getInfo = (): string[] => {
// This will hold tuples like ["OS", "Windows"]
let lines = [];
// Show the Operating System
const osMap = {};
osMap[lt.LTOS.unknown] = "Unknown";
osMap[lt.LTOS.windows] = "Windows";
osMap[lt.LTOS.mac] = "Mac OS";
osMap[lt.LTOS.iOS] = "iOS";
osMap[lt.LTOS.android] = "Android";
osMap[lt.LTOS.linux] = "Linux";
osMap[lt.LTOS.blackberry] = "Blackberry";
osMap[lt.LTOS.webOS] = "Web OS";
osMap[lt.LTOS.windows7] = "Windows 7";
osMap[lt.LTOS.windows8] = "Windows 8";
osMap[lt.LTOS.windows10] = "Windows 10";
const os = osMap[lt.LTHelper.OS];
lines.push(["OS", os]);
// Show the Device
const deviceMap = {};
deviceMap[lt.LTDevice.unknown] = "Unknown";
deviceMap[lt.LTDevice.desktop] = "Desktop";
deviceMap[lt.LTDevice.mobile] = "Mobile";
deviceMap[lt.LTDevice.tablet] = "Tablet";
const device = deviceMap[lt.LTHelper.device];
lines.push(["Device", device]);
// Show the Browser
const browserMap = {};
browserMap[lt.LTBrowser.unknown] = "Unknown";
browserMap[lt.LTBrowser.internetExplorer] = "Internet Explorer";
browserMap[lt.LTBrowser.firefox] = "Firefox";
browserMap[lt.LTBrowser.chrome] = "Chrome";
browserMap[lt.LTBrowser.safari] = "Safari";
browserMap[lt.LTBrowser.opera] = "Opera";
browserMap[lt.LTBrowser.android] = "Android Browser";
browserMap[lt.LTBrowser.edge] = "Edge";
const browser = browserMap[lt.LTHelper.browser];
lines.push(["Browser", browser]);
// Show version and vendor
lines.push(["Browser Version", lt.LTHelper.version]);
lines.push(["Browser Vendor", lt.LTHelper.vendor]);
// Show the "Supports" capabilities by getting keys
// and looking at properties that start with "supports"
// (Can also directly access as shown above with version and vendor)
const keys: string[] = Object.keys(lt.LTHelper);
const supportsKeyword: string = "supports";
keys.forEach((key) => {
const supportsIndex = key.indexOf(supportsKeyword);
if (supportsIndex === 0) {
// Starts with "supports", get the value
const name: string = key.substr(supportsKeyword.length);
const isSupported: boolean = lt.LTHelper[key];
lines.push(["Supports " + name, isSupported]);
}
});
return lines;
}
}
export class LTHelperExample {
constructor() {
lt.RasterSupport.setLicenseUri("https://demo.leadtools.com/licenses/js/LEADTOOLSEVAL.txt", "EVAL", null);
}
run = (buttonId, outputId) => {
const button = document.getElementById(buttonId);
button.onclick = () => {
const lines = this.getInfo();
// Log
console.log(lines);
// Create a table from the info
const table = document.getElementById(outputId);
lines.forEach((line) => {
const row = document.createElement("tr");
// [0] is name
const name = document.createElement("th");
name.innerHTML = line[0];
// [1] is content
const content = document.createElement("td");
content.innerHTML = line[1];
row.appendChild(name);
row.appendChild(content);
//output.appendChild(row);
table.appendChild(row);
});
}
}
getInfo = () => {
// This will hold tuples like ["OS", "Windows"]
let lines = [];
// Show the Operating System
const osMap = {};
osMap[lt.LTOS.unknown] = "Unknown";
osMap[lt.LTOS.windows] = "Windows";
osMap[lt.LTOS.mac] = "Mac OS";
osMap[lt.LTOS.iOS] = "iOS";
osMap[lt.LTOS.android] = "Android";
osMap[lt.LTOS.linux] = "Linux";
osMap[lt.LTOS.blackberry] = "Blackberry";
osMap[lt.LTOS.webOS] = "Web OS";
osMap[lt.LTOS.windows7] = "Windows 7";
osMap[lt.LTOS.windows8] = "Windows 8";
osMap[lt.LTOS.windows10] = "Windows 10";
const os = osMap[lt.LTHelper.OS];
lines.push(["OS", os]);
// Show the Device
const deviceMap = {};
deviceMap[lt.LTDevice.unknown] = "Unknown";
deviceMap[lt.LTDevice.desktop] = "Desktop";
deviceMap[lt.LTDevice.mobile] = "Mobile";
deviceMap[lt.LTDevice.tablet] = "Tablet";
const device = deviceMap[lt.LTHelper.device];
lines.push(["Device", device]);
// Show the Browser
const browserMap = {};
browserMap[lt.LTBrowser.unknown] = "Unknown";
browserMap[lt.LTBrowser.internetExplorer] = "Internet Explorer";
browserMap[lt.LTBrowser.firefox] = "Firefox";
browserMap[lt.LTBrowser.chrome] = "Chrome";
browserMap[lt.LTBrowser.safari] = "Safari";
browserMap[lt.LTBrowser.opera] = "Opera";
browserMap[lt.LTBrowser.android] = "Android Browser";
browserMap[lt.LTBrowser.edge] = "Edge";
const browser = browserMap[lt.LTHelper.browser];
lines.push(["Browser", browser]);
// Show version and vendor
lines.push(["Browser Version", lt.LTHelper.version]);
lines.push(["Browser Vendor", lt.LTHelper.vendor]);
// Show the "Supports" capabilities by getting keys
// and looking at properties that start with "supports"
// (Can also directly access as shown above with version and vendor)
const keys = Object.keys(lt.LTHelper);
const supportsKeyword = "supports";
keys.forEach((key) => {
const supportsIndex = key.indexOf(supportsKeyword);
if (supportsIndex === 0) {
// Starts with "supports", get the value
const name = key.substr(supportsKeyword.length);
const isSupported = lt.LTHelper[key];
lines.push(["Supports " + name, isSupported]);
}
});
return lines;
}
}
<!doctype html>
<html lang="en">
<title>Leadtools Example | LTHelper</title>
<head>
<script src="https://code.jquery.com/jquery-2.2.4.min.js"
integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
<script src="../../LT/Leadtools.js"></script>
<style>
td,
th {
text-align: left;
padding: 0 5px;
font-family: monospace;
}
</style>
<!-- All demo files are bundled and appended to the window -->
<script src="../../bundle.js" type="text/javascript"></script>
</head>
<body>
<button type="button" id="run">LTHelper Example</button>
<div>
<table>
<tbody id="output"></tbody>
</table>
</div>
</body>
<script>
window.onload = () => new window.examples.LTHelper().run('run', 'output');
</script>
</html>
