Best JavaScript code snippet using wpt
app.js
Source:app.js
1let newNotes = '';2let theme = '';3let showCalc = localStorage.getItem('showCalc');4const calcEl = document.getElementById("calculator");5const calcDisplayEl = document.getElementById("calc-display");6const operators = ['-', '+', '*', '/'];7let calcValue = '';8var quill = new Quill('#editor', {9 theme: 'snow',10 modules: {11 toolbar: '#toolbar'12 }13});14// Restore data from previous15const restoreNotes = ()=> {16 if (localStorage.getItem('notes')) {17 newNotes = JSON.parse(localStorage.getItem('notes'));18 quill.setContents(newNotes);19 }20}21// Store data for later use22quill.on('text-change', function () {23 newNotes = quill.getContents();24 localStorage.setItem('notes', JSON.stringify(newNotes));25});26// Theme27document.querySelector('.dropdown-toggle').addEventListener('click', () => {28 document.querySelector('.dropdown-toggle').classList.toggle('open');29});30// Theme Dropdown 31document.querySelectorAll('.dropdown-menu li').forEach(list => {32 list.addEventListener('click', (e) => {33 document.querySelector('.dropdown-menu li.active').classList.remove('active');34 e.target.classList.add('active');35 theme = e.target.dataset.value;36 localStorage.setItem('theme', theme);37 document.body.setAttribute('class', theme);38 })39})40restoreTheme = () => {41 theme = localStorage.getItem('theme');42 if (theme) {43 document.body.setAttribute('class', theme);44 document.querySelectorAll('.dropdown-menu li').forEach(list => {45 if (list.dataset.value == theme) {46 list.classList.add('active');47 } else {48 list.classList.remove('active');49 }50 })51 }52}53// Drag 54function dragElement(dragEL) {55 var pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0;56 if (document.getElementById("calc-header")) {57 // if present, the header is where you move the DIV from:58 document.getElementById("calc-header").onmousedown = dragMouseDown;59 } else {60 // otherwise, move the DIV from anywhere inside the DIV:61 dragEL.onmousedown = dragMouseDown;62 }63 function dragMouseDown(e) {64 e = e || window.event;65 e.preventDefault();66 // get the mouse cursor position at startup:67 pos3 = e.clientX;68 pos4 = e.clientY;69 document.onmouseup = closeDragElement;70 // call a function whenever the cursor moves:71 document.onmousemove = elementDrag;72 }73 function elementDrag(e) {74 e = e || window.event;75 e.preventDefault();76 // calculate the new cursor position:77 pos1 = pos3 - e.clientX;78 pos2 = pos4 - e.clientY;79 pos3 = e.clientX;80 pos4 = e.clientY;81 // set the element's new position:82 let x = (dragEL.offsetLeft - pos1) 83 let y = (dragEL.offsetTop - pos2); 84 // Prevent move outer window85 if (x > 0 && x <= (window.innerWidth - dragEL.clientWidth)){86 dragEL.style.left = x + "px";87 localStorage.setItem("calcX", x + "px")88 }89 if ( y > 0 && y <= (window.innerHeight - dragEL.clientHeight)){90 dragEL.style.top = y + "px";91 localStorage.setItem("calcY", y + "px")92 }93 }94 function closeDragElement() {95 // stop moving when mouse button is released:96 document.onmouseup = null;97 document.onmousemove = null;98 }99}100// Toggle calculator101document.querySelector('.btn-calculator').addEventListener('click', () => {102 calcEl.classList.toggle('show');103 calcDisplayEl.focus();104 localStorage.setItem('showCalc', 'true');105});106document.querySelector('.btn-close').addEventListener('click', () => {107 calcEl.classList.remove('show');108 localStorage.setItem('showCalc', 'false');109});110// Print Numbers111document.querySelectorAll('.btn-calc').forEach(calcBtn => {112 // calcDisplayEl113 calcBtn.addEventListener('click', (e) => {114 let val = calcBtn.dataset.eval;115 116 if(val){117 calcValue = calcValue === 0? val : calcValue + val;118 calcValue = operatorsDupeCheck(calcValue);119 }120 // Answer121 if (calcBtn.getAttribute('id') === 'enter'){122 calculateValue()123 }124 // Clear calculate value125 if (calcBtn.getAttribute('id') === 'clear'){126 calcValue = 0;127 }128 calcDisplayEl.value = calcValue;129 localStorage.setItem('calcValue', calcValue);130 });131})132const calculateValue = () => {133 let lastVal = calcValue[calcValue.length - 1];134 if (calcValue == 0 || operators.includes(lastVal) || lastVal == '.'){135 return136 }137 let numbers = calcValue.split(/\+|\-|\*|\//g);138 let calcOperators = calcValue.replace(/[0-9]|\./g, "").split("");139 let nextVal = 0;140 let currentVal = 0;141 calcOperators.forEach((op, i) => {142 currentVal = i === 0 ? parseFloat(numbers[i]) : currentVal;143 nextVal = parseFloat(numbers[1 + i]);144 switch (op) {145 case '+':146 currentVal = currentVal + nextVal;147 break;148 case '-':149 currentVal = currentVal - nextVal;150 break;151 case '*':152 currentVal = currentVal * nextVal;153 break;154 case '/':155 currentVal = currentVal / nextVal;156 break;157 }158 })159 calcValue = currentVal;160 calcDisplayEl.value = calcValue;161 localStorage.setItem('calcValue', calcValue);162}163calcDisplayEl.addEventListener('keydown', e => {164 // console.log(e.key)165 let allowedKeys = [...operators, '0', '1', '2', '3', '4', '5', '6', '7', '8', '9', '.', 'Backspace', 'ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown']; 166 // Get Answer if pressed Ender or equal167 if (e.key == "Enter" || e.keyCode == 13 || e.key == "=") {168 calculateValue();169 e.preventDefault()170 return 171 } 172 if(!allowedKeys.includes(e.key)){173 e.preventDefault()174 return175 }176})177calcDisplayEl.addEventListener('input', e => {178 calcValue = calcDisplayEl.value = operatorsDupeCheck(calcDisplayEl.value);179 localStorage.setItem('calcValue', calcValue);180});181// Avoid using duplicate operators 182const operatorsDupeCheck = (str)=>{183 if (operators.includes(str[0])) {184 str = str.substring(1, str.length);185 } else {186 for (let i = 0; i < str.length; i++) {187 str = operators.includes(str[i]) && operators.includes(str[i - 1]) ? str.substring(0, i - 1) + str.substring(i, str.length) : str;188 str = str[i] == '.' && str[i - 1] == '.' ? str.substring(0, i - 1) + str.substring(i, str.length) : str;189 }190 }191 return str;192}193// Restore data from previous194restoreNotes();195// Theme restore196restoreTheme()197// Make calculator movable198dragElement(calcEl);199// Open Calculator200if (showCalc === 'true') {201 // Calculator position202 calcEl.style.left = localStorage.getItem("calcX") ? localStorage.getItem("calcX") : "0px";203 calcEl.style.top = localStorage.getItem("calcY") ? localStorage.getItem("calcY") : "0px";204 calcEl.classList.add('show');205 calcDisplayEl.value = calcValue = localStorage.getItem("calcValue");206 calcDisplayEl.focus();207}208// Window resize209window.addEventListener('resize', (e) => {210 let vw = window.innerWidth;211 let vh = window.innerHeight;212 if (calcEl.offsetLeft > (vw - calcEl.clientWidth)) {213 let x = (vw - calcEl.clientWidth);214 calcEl.style.left = x > 0 ? x + 'px' : '0px';215 localStorage.setItem("calcX", calcEl.style.left);216 }217 if (calcEl.offsetTop > (vh - calcEl.clientHeight)) {218 let y = (vh - calcEl.clientHeight);219 calcEl.style.top = y > 0 ? y + 'px' : '0px';220 localStorage.setItem("calcY", calcEl.style.top);221 }222})223// Check tabs are sync with Notes224window.addEventListener("storage", (event) => {225 if (event.storageArea != localStorage) return;226 if (event.key === 'notes') {227 restoreNotes();228 }229 if (event.key === 'theme') {230 restoreTheme();231 }232 233 if (event.key === 'showCalc') {234 if(localStorage.getItem('showCalc') === true){235 calcEl.classList.add('show');236 } else{237 calcEl.classList.remove('show');238 }239 }240 if (event.key === 'calcValue') {241 calcDisplayEl.value = calcValue = localStorage.getItem("calcValue");242 }243 if (event.key === 'calcX') {244 calcEl.style.left = localStorage.getItem("calcX") ? localStorage.getItem("calcX") : "0px";245 }246 if (event.key === 'calcY') {247 calcEl.style.top = localStorage.getItem("calcY") ? localStorage.getItem("calcY") : "0px";248 }...
script.js
Source:script.js
1const inputs = [2 "CE",3 "C",4 "%",5 "/",6 "7",7 "8",8 "9",9 "*",10 "4",11 "5",12 "6",13 "-",14 "1",15 "2",16 "3",17 "+",18 "+/-",19 "0",20 ".",21 "=",22];23const calc = document.getElementById("calc");24const display = document.getElementById("display");25let arr = [];26let calcValue = "";27let operation = "";28let operands = [];29let calcTrigger = 0;30let buttons;31function renderCalc() {32 calcValue = "";33 inputs.forEach(function (input) {34 const cbutton = document.createElement("button");35 cbutton.textContent = input;36 cbutton.classList.add("cbutton");37 calc.appendChild(cbutton);38 });39 buttons = document.querySelectorAll(".cbutton");40}41renderCalc();42buttons.forEach((button) =>43 button.addEventListener("click", (e) => {44 processAction(e.target.textContent);45 display.value = calcValue;46 })47);48function caclulate(numarr, operation) {49 let answer = 0;50 let num1 = parseInt(numarr[0]);51 let num2 = parseInt(numarr[1]);52 switch (operation) {53 case "+":54 answer = num1 + num2;55 break;56 case "-":57 answer = num1 - num2;58 break;59 case "*":60 answer = num1 * num2;61 break;62 case "/":63 answer = num1 / num2;64 break;65 case "%":66 answer = num1 % num2;67 break;68 }69 return answer;70}71function processAction(action) {72 switch (action) {73 case "CE":74 {75 calcValue = "";76 calcTrigger = 0;77 operation = "";78 }79 break;80 case "C":81 calcValue = calcValue.slice(0, calcValue.length - 1);82 break;83 case "+":84 case "-":85 case "/":86 case "*":87 case "%":88 case "=":89 if (90 calcValue[calcValue.length - 1] !== "+" &&91 calcValue[calcValue.length - 1] !== "-" &&92 calcValue[calcValue.length - 1] !== "*" &&93 calcValue[calcValue.length - 1] !== "/" &&94 calcValue[calcValue.length - 1] !== "%"95 ) {96 calcValue += action;97 calcTrigger++;98 if (calcTrigger == 1) operation = action;99 if (calcTrigger == 2 && action === "=") {100 const numarr = calcValue101 .slice(0, calcValue.length - 1)102 .split(operation);103 calcValue = caclulate(numarr, operation).toString();104 calcTrigger = 0;105 }106 if (calcTrigger == 2) {107 const lastop = calcValue[calcValue.length - 1];108 const numarr = calcValue109 .slice(0, calcValue.length - 1)110 .split(operation);111 calcValue = caclulate(numarr, operation).toString() + lastop;112 calcTrigger = 1;113 }114 }115 break;116 default:117 calcValue += action;118 break;119 }...
variables.js
Source:variables.js
...15/*16 * * Spacers * *17 */18export const spacers = {19 xxLarge: `${calcValue(6.4)}${BASE_UNIT}`,20 xLarge: `${calcValue(4.8)}${BASE_UNIT}`,21 large: `${calcValue(3.6)}${BASE_UNIT}`,22 medium: `${calcValue(2.4)}${BASE_UNIT}`,23 base: `${calcValue(2)}${BASE_UNIT}`,24 small: `${calcValue(1.6)}${BASE_UNIT}`,25 xSmall: `${calcValue(0.8)}${BASE_UNIT}`,26 xxSmall: `${calcValue(0.4)}${BASE_UNIT}`,27 xxxSmall: `${calcValue(0.2)}${BASE_UNIT}`,28 circle: `${calcValue(99)}${BASE_UNIT}`,29 small_border: `${calcValue(0.5)}${BASE_UNIT}`,30};31/*32 * * Typography * *33 */34export const typography = {35 primaryFont: "Dosis",36 secondaryFont: "sans-serif",37 lineHeight: "1.5",38 letter_spacing: "1.5px",39 size: {40 xxLarge: `${calcValue(7)}${BASE_UNIT}`,41 xLarge: `${calcValue(4.8)}${BASE_UNIT}`,42 large: `${calcValue(3.2)}${BASE_UNIT}`,43 medium: `${calcValue(2.4)}${BASE_UNIT}`,44 base: `${calcValue(2)}${BASE_UNIT}`,45 small: `${calcValue(1.6)}${BASE_UNIT}`,46 xSmall: `${calcValue(1.4)}${BASE_UNIT}`,47 xxSmall: `${calcValue(1)}${BASE_UNIT}`,48 },49};50/*51 * * Animations * *52 */53export const animations = {54 speed: "0.3s",55};56/*57 * * Centering * *58 */59export const displayCenter = {60 allCenter: `61 display: flex;...
Using AI Code Generation
1var wpt = require('./wpt');2console.log(wpt.calcValue(100, 1.07, 10));3console.log(wpt.calcValue(100, 1.07, 20));4console.log(wpt.calcValue(100, 1.07, 30));5console.log(wpt.calcValue(100, 1.07, 40));6console.log(wpt.calcValue(100, 1.07, 50));7console.log(wpt.calcValue(100, 1.07, 60));8console.log(wpt.calcValue(100, 1.07, 70));9console.log(wpt.calcValue(100, 1.07, 80));10console.log(wpt.calcValue(100, 1.07, 90));11console.log(wpt.calcValue(100, 1.07, 100));
Using AI Code Generation
1var calculator = require('./wptcalculator');2console.log(calculator.calcValue(1, 2, 3, 4, 5, 6, 7, 8, 9, 10));3console.log(calculator.calcValue(10, 20, 30, 40, 50, 60, 70, 80, 90, 100));4console.log(calculator.calcValue(100, 200, 300, 400, 500, 600, 700, 800, 900, 1000));5console.log(calculator.calcValue(1000, 2000, 3000, 4000, 5000, 6000, 7000, 8000, 9000, 10000));6console.log(calculator.calcValue(10000, 20000, 30000, 40000, 50000, 60000, 70000, 80000, 90000, 100000));7console.log(calculator.calcValue(100000, 200000, 300000, 400000, 500000, 600000, 700000, 800000, 900000, 1000000));8console.log(calculator.calcValue(1000000, 2000000, 3000000, 4000000, 5000000, 6000000, 7000000, 8000000, 9000000, 10000000));9console.log(calculator.calcValue(10000000, 20000000, 30000000, 40000000, 50000000, 60000000, 70000000, 80000000, 90000000, 100000000));10console.log(calculator.calcValue(100000000, 200000000, 300000000, 400000000, 500000000, 600000000, 700000000, 800000000, 900000000, 1000000000));11console.log(calculator.calcValue(1000000000, 2000000000, 3000000000, 4000000000, 5000000000, 6000000000, 7000000000, 8000000000, 9000000000, 10000000000));12console.log(calculator.calc
Using AI Code Generation
1var wpt = require('./wpt');2var calc = wpt.calcValue;3var wpt = require('./wpt');4var obj = new wpt(5,5);5var wpt = require('./wpt');6var wpt = require('./wpt');7var obj = new wpt();8console.log(obj.calcValue(5,5,5,5,5,5));
Using AI Code Generation
1var wptools = require('wikidata-sdk');2var id = 'Q211';3var lang = 'en';4var url = wptools.getEntitiesFromSitelinks({5})6console.log(url);
Using AI Code Generation
1var wpt = require('wpt');2wpt.calcValue(100, 50, 20, 10, function(result) {3});4var wpt = require('wpt');5wpt.calcValue(100, 50, 20, 10, function(result) {6});7var wpt = require('wpt');8var wpt = require('wpt');9wpt.calcValue(100, 50, 20, 10, function(result) {10});11var wpt = require('wpt');12wpt.calcValue(100, 50, 20, 10, function(result) {13});14MIT © [Subash Poudel](
Learn to execute automation testing from scratch with LambdaTest Learning Hub. Right from setting up the prerequisites to run your first automation test, to following best practices and diving deeper into advanced test scenarios. LambdaTest Learning Hubs compile a list of step-by-step guides to help you be proficient with different test automation frameworks i.e. Selenium, Cypress, TestNG etc.
You could also refer to video tutorials over LambdaTest YouTube channel to get step by step demonstration from industry experts.
Get 100 minutes of automation test minutes FREE!!