{"javascript":"///// Helper to write data into #Log element\nfunction Log(Text)\n{\n    $(\"#Log\").append(Text + \"\\n\")\n}\n\n\n$(document).ready(function() {\n     document.addEventListener('customLog',(e)=>{\n         let detail = e.detail;\n         if(detail.type == 'log'){\n             $('.log').prepend('<p class=\"log_item\" style=\"color:' + detail.color + '\">' + detail.fullMsg + '</p>')\n         }\n     });\n     Api.SetEventHandler(function(EventType, EventData){\n        $(\"body\").fadeIn()\n    });\n\n\n        /////On click #Start button\n    $(\"#msgSend\").click(async function(){\n        Api.RunFunction('msg', {color: $('#msgColor').val(), text: $('#msgText').val()})\n    })\n    Api.AcceptResources(true)\n});\n\n","cssFiles":[],"jsFiles":["https://bablosoft.com/buildinterface/jquery/jquery.min.js?v=3","https://bablosoft.com/buildinterface/bas-api/bas-api.js?v=3"],"css":"#main {\r\n  margin: 0 auto;\r\n  width: 500px;\r\n  height: 100%;\r\n}\r\n\r\n.btn {\r\n  width: 100px;\r\n  height: 25px;\r\n  border-radius: 4px;\r\n  margin-bottom: 10px;\r\n  box-shadow: 2px 2px 2px 2px rgba(255, 255, 255, 1);\r\n}\r\n\r\n.btn:hover {\r\n  box-shadow: inset 2px 2px 2px 2px #999;\r\n}\r\n\r\n.log {\r\n    margin: 0;\r\n    height: 300px;\r\n    padding: 5px;\r\n    text-align: left;\r\n    border: 1px solid gray;\r\n    border-radius: 10px;\r\n    box-shadow: inset 4px 4px 5px rgba(154, 147, 140, 0.5), 4px 4px 5px rgba(255, 255, 255, 1);\r\n}\r\n.log_item {\r\n    margin: 0 5px;\r\n}","html":"<div id=\"main\">\n  <input type= \"text\" id=\"msgColor\" placeholder=\"Color\" value=\"red\">\n  <input type= \"text\" id=\"msgText\" placeholder=\"Msg\" value=\"Hellow world\">\n  <input class=\"btn\" type=\"button\" value=\"Send text\" id=\"msgSend\" />\n  <div class=\"log\"></div>\n  \n</div>\n"}