{"version":1,"customWidget":{"_id":"G9StyDupqzevp96N3","name":"Convert Case","props":[{"name":"Output","type":"string","id":"JGB9KgEnTFWBpFFwB","requireWriteable":true,"description":"Output Variable that holds the input value in the preferred case"},{"name":"Case","type":"string","id":"K3gCgjkDN98obfvPR","requireWriteable":false,"description":"Upper or Lower -- Lower is Default"},{"name":"Font Size","type":"integer","id":"XZjzXbLnDbqsBdWk3","requireWriteable":false},{"name":"Font Color","type":"color","id":"PS5NFNNt7HFqBmnQv","requireWriteable":false},{"name":"Background Color","type":"color","id":"yWgnJFkXSTL2KHZnc","requireWriteable":false},{"name":"Border Color","type":"color","id":"9WKxiXW5TnAD7vWXD","requireWriteable":false},{"name":"Border Width","type":"integer","id":"wi3G9rDxLA63wXKSm","requireWriteable":false},{"name":"Label","type":"string","id":"c9dhG6rg6s2RRGpiM","requireWriteable":false},{"name":"Label Font Size","type":"integer","id":"xJNJsAZqaHNH85JD2","requireWriteable":false},{"name":"Label Font Color","type":"color","id":"F6LmmT5sDXubMadA6","requireWriteable":false,"description":""},{"name":"Trim Output","type":"boolean","id":"nqeQjg47rAGQZ3xHq","requireWriteable":false,"description":"Trim Output (remove white space from start and end of input value)"}],"events":[],"html":"\n","javascript":"// Change Case\n// Version: 1.0 \n// Date: Oct 11th 2022\n// Author: Parth Parmar\n// Author Email: parthmparmar@gmail.com\n\n// Description: change the case (upper or lower) for text entered into the input filed. Lower case is the default and trim whitespace is an option.\n\nfunction changeCase(){\n var inputValue = document.getElementById(\"userInput\").value;\n var outputCase = getValue(\"Case\");\n var trimOutput = getValue(\"Trim Output\")\n \n if (outputCase){\n outputCaseLower = outputCase.toLowerCase();\n if(outputCaseLower.includes(\"u\")) {\n if (trimOutput) {\n setValue('Output', inputValue.toUpperCase().trim());\n }\n else {\n setValue('Output', inputValue.toUpperCase());\n };\n }\n else {\n if (trimOutput) {\n setValue('Output', inputValue.toLowerCase().trim());\n }\n else {\n setValue('Output', inputValue.toLowerCase());\n };\n };\n }\n else{\n if (trimOutput) {\n setValue('Output', inputValue.toLowerCase().trim());\n }\n else {\n setValue('Output', inputValue.toLowerCase());\n };\n };\n};\n\ngetValue('Font Size', (fontSizeProp) => {\n if (fontSizeProp){\n document.getElementById(\"userInput\").style.fontSize = fontSizeProp + 'px';\n };\n});\n\ngetValue('Font Color', (fontColorProp) => {\n if (fontColorProp){\n document.getElementById(\"userInput\").style.color = fontColorProp;\n };\n});\n\ngetValue('Background Color', (backgroundColorProp) => {\n if (backgroundColorProp){\n document.getElementById(\"userInput\").style.backgroundColor = backgroundColorProp;\n };\n});\n\ngetValue('Border Color', (borderColorProp) => {\n if (borderColorProp){\n document.getElementById(\"userInput\").style.borderColor = borderColorProp;\n };\n});\n\ngetValue('Border Width', (borderWidthProp) => {\n if (borderWidthProp){\n document.getElementById(\"userInput\").style.borderWidth = borderWidthProp + 'px';\n };\n});\n\ngetValue('Label', (lableProp) => {\n if (lableProp){\n console.log(lableProp)\n document.getElementById(\"inputLabel\").innerHTML = lableProp;\n };\n});\n\ngetValue('Label Font Size', (lableFontSizeProp) => {\n if (lableFontSizeProp){\n document.getElementById(\"inputLabel\").style.fontSize = lableFontSizeProp + 'px';\n };\n});\n\ngetValue('Label Font Color', (lableFontColorProp) => {\n if (lableFontColorProp){\n document.getElementById(\"inputLabel\").style.color = lableFontColorProp;\n };\n});","css":"body {\n\tbackground-color: transparent;\n\tfont-family: Sans-Serif;\n\tpadding: 10px;\n}\n\nlabel {\n font-size: 40px;\n}\n\nbutton {\n\tbackground-color: #3A89EB;\n\tborder-radius: 4px;\n\tborder-width: 0;\n\tcolor: #fff;\n\tcursor: pointer;\n\tfont-size: 24px;\n\tpadding: 16px;\n}\n\nbutton:active {\n\tbackground-color: rgb(3, 106, 214);\n}\n\ninput {\n\tborder: 1px solid #DFE1E5;\n\tborder-radius: 3px;\n\tcolor: #182339;\n\tfont-size: 40px;\n\tbox-sizing: border-box;\n padding: 8px;\n\twidth: 100%;\n\tmargin-top: 10px;\n}\n\nselect {\n\tappearance: none;\n\tbackground-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='19' viewBox='0 0 24 24' class='sc-fznWqX bsCTUN'%3E%3Cpath d='M7 10l5 5 5-5z'%3E%3C/path%3E%3C/svg%3E\");\n\tbackground-repeat: no-repeat;\n\tbackground-position: right 0.5rem center;\n\tbackground-size: auto 55%;\n\tborder: 1px solid #DFE1E5;\n\tborder-radius: 3px;\n\tcolor: #182339;\n\tfont-size: 40px;\n\tpadding: 15px;\n\tpadding-right: 45px;\n}\n\ntable {\n\tborder-collapse: collapse;\n\tborder-spacing: 0;\n\tfont-size: 24px;\n\ttext-align: left;\n}\n\nth {\n\tcolor: #47556C;\n\tbackground-color: #FAFBFC;\n\tborder: 1px solid #DFE1E5;\n\tfont-weight: 400;\n\tpadding: 4px;\n}\n\ntd {\n\tborder: 1px solid #DFE1E5;\n\tpadding: 12px 4px;\n}","defaultWidth":500,"defaultHeight":200,"createdAt":1665536995661,"createdBy":"bSDQeQJ5qQwQWruqY","updatedAt":1665625036349,"updatedBy":"bSDQeQJ5qQwQWruqY","description":"Input widget that outputs to a variable in the preferred case (lower case by default)"}}