{"id":476592,"date":"2026-04-20T00:17:20","date_gmt":"2026-04-20T00:17:20","guid":{"rendered":"https:\/\/savepearlharbor.com\/?p=476592"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-29T21:00:00","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=476592","title":{"rendered":"LOTIS: \u041d\u043e\u0432\u0430\u044f \u043f\u0430\u0440\u0430\u0434\u0438\u0433\u043c\u0430 WEB-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0434\u043b\u044f \u0431\u0438\u0437\u043d\u0435\u0441-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439"},"content":{"rendered":"<div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n<p>\u041f\u043e\u0441\u043b\u0435 \u0442\u043e\u0433\u043e \u043a\u0430\u043a \u043c\u043e\u044f <a href=\"https:\/\/habr.com\/ru\/articles\/1024496\/\" rel=\"noopener noreferrer nofollow\">\u0441\u0442\u0430\u0442\u044c\u044f \u043e \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0435 LOTIS<\/a> \u0432\u044b\u0437\u0432\u0430\u043b\u0430 \u0438\u043d\u0442\u0435\u0440\u0435\u0441, \u044f \u0440\u0435\u0448\u0438\u043b \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435 \u0440\u0430\u0441\u043a\u0440\u044b\u0442\u044c \u0435\u0433\u043e \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0443 \u0438 \u043f\u0440\u0438\u0432\u0435\u0441\u0442\u0438 \u043f\u0440\u0438\u043c\u0435\u0440\u044b \u043a\u043e\u0434\u0430. <\/p>\n<p>\u041d\u0430\u043f\u043e\u043c\u0438\u043d\u0430\u044e \u0441\u0441\u044b\u043b\u043a\u0443 \u043d\u0430 \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0439 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0430: <a href=\"https:\/\/github.com\/O-Planet\/LOTIS\" rel=\"noopener noreferrer nofollow\">https:\/\/github.com\/O-Planet\/LOTIS<\/a><\/p>\n<p>LOTIS \u0440\u0435\u0448\u0430\u0435\u0442 \u043e\u0434\u043d\u0443 \u0444\u0443\u043d\u0434\u0430\u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u0443\u044e \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0443: \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u043b\u043e\u0433\u0438\u043a\u0438 \u043d\u0430 \u043a\u043b\u0438\u0435\u043d\u0442 \u0438 \u0441\u0435\u0440\u0432\u0435\u0440 \u043c\u0435\u0448\u0430\u0435\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0435 \u0431\u0438\u0437\u043d\u0435\u0441-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439. \u0412\u043c\u0435\u0441\u0442\u043e \u0442\u043e\u0433\u043e \u0447\u0442\u043e\u0431\u044b \u0434\u0443\u043c\u0430\u0442\u044c \u043e \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0435, \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 \u0442\u0440\u0430\u0442\u044f\u0442 \u0432\u0440\u0435\u043c\u044f \u043d\u0430:<\/p>\n<ul>\n<li>\n<p>\u0421\u0438\u043d\u0445\u0440\u043e\u043d\u0438\u0437\u0430\u0446\u0438\u044e \u0434\u0430\u043d\u043d\u044b\u0445 \u043c\u0435\u0436\u0434\u0443 \u043a\u043b\u0438\u0435\u043d\u0442\u043e\u043c \u0438 \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u043c <\/p>\n<\/li>\n<li>\n<p>\u0423\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435\u043c <\/p>\n<\/li>\n<li>\n<p>\u041d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u0438\u0434\u0435\u043d\u0442\u0438\u0447\u043d\u043e\u0439 \u043b\u043e\u0433\u0438\u043a\u0438 \u043d\u0430 \u0434\u0432\u0443\u0445 \u044f\u0437\u044b\u043a\u0430\u0445 <\/p>\n<\/li>\n<li>\n<p>\u041e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0443 AJAX-\u0437\u0430\u043f\u0440\u043e\u0441\u043e\u0432<\/p>\n<\/li>\n<\/ul>\n<p>LOTIS \u0443\u0441\u0442\u0440\u0430\u043d\u044f\u0435\u0442 \u044d\u0442\u0443 \u0440\u0430\u0437\u0434\u0432\u043e\u0435\u043d\u043d\u043e\u0441\u0442\u044c, \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044f \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043a\u0430\u043a \u0435\u0434\u0438\u043d\u043e\u0435 \u0446\u0435\u043b\u043e\u0435. \u0420\u0430\u0437\u0431\u0435\u0440\u0443 \u0435\u0433\u043e \u0440\u0430\u0431\u043e\u0442\u0443 \u043d\u0430 \u043f\u0440\u0438\u043c\u0435\u0440\u0430\u0445. \u041d\u043e \u0441\u043f\u0435\u0440\u0432\u0430 \u2013 \u043f\u0440\u043e \u0438\u0441\u0442\u043e\u0440\u0438\u044e \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f, \u0438 \u0447\u0435\u043c \u0431\u044b\u043b\u0430 \u0432\u044b\u0437\u0432\u0430\u043d\u0430 \u044d\u0442\u0430 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u044c.<\/p>\n<h2>\ud83d\udcdc \u0418\u0441\u0442\u043e\u0440\u0438\u044f \u043f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u044f: \u0434\u043b\u044f \u0447\u0435\u0433\u043e<\/h2>\n<p>\u042f \u044f\u0432\u043b\u044f\u044e\u0441\u044c \u0444\u0440\u0438\u043b\u0430\u043d\u0441\u0435\u0440\u043e\u043c, \u043d\u0435 \u0441\u043e\u0432\u043c\u0435\u0441\u0442\u0438\u0442\u0435\u043b\u0435\u043c \u043f\u043e \u0432\u0435\u0447\u0435\u0440\u0430\u043c, \u0430 \u0438\u043c\u0435\u043d\u043d\u043e \u0444\u0440\u0438\u043b\u0430\u043d\u0441\u0435\u0440\u043e\u043c. \u0423 \u043c\u0435\u043d\u044f \u043d\u0435\u0442 \u00ab\u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0433\u043e\u00bb \u043c\u0435\u0441\u0442\u0430 \u0440\u0430\u0431\u043e\u0442\u044b, \u043d\u0435\u0442 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0430. \u042f \u0441\u0430\u043c \u0438\u0449\u0443 \u0437\u0430\u043a\u0430\u0437\u0447\u0438\u043a\u043e\u0432, \u0432\u0435\u0434\u0443 \u043f\u0435\u0440\u0435\u0433\u043e\u0432\u043e\u0440\u044b, \u0437\u0430\u043a\u043b\u044e\u0447\u0430\u044e \u0434\u043e\u0433\u043e\u0432\u043e\u0440\u0430, \u0441\u0430\u043c \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u044e \u043f\u0440\u043e\u0435\u043a\u0442\u044b, \u0432\u043d\u0435\u0434\u0440\u044f\u044e, \u043e\u0431\u0443\u0447\u0430\u044e.\u00a0 \u0417\u0430\u043d\u0438\u043c\u0430\u044e\u0441\u044c \u044d\u0442\u0438\u043c \u0443\u0436\u0435 \u0431\u043e\u043b\u0435\u0435 20-\u0438 \u043b\u0435\u0442. \u041e\u0442\u0441\u044e\u0434\u0430 \u0438 \u0432\u043e\u0437\u043d\u0438\u043a\u043b\u0430 \u043f\u043e\u0442\u0440\u0435\u0431\u043d\u043e\u0441\u0442\u044c \u0432 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0435 \u00ab\u0432\u0441\u0435 \u2013 \u0432 \u043e\u0434\u043d\u043e\u043c\u00bb \u0434\u043b\u044f \u0431\u044b\u0441\u0442\u0440\u043e\u0439 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 WEB-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439, \u0432\u0435\u0434\u044c \u0431\u043e\u043b\u044c\u0448\u0438\u043d\u0441\u0442\u0432\u0443 \u0437\u0430\u043a\u0430\u0437\u0447\u0438\u043a\u043e\u0432 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u043d\u0443\u0436\u0435\u043d \u00ab\u0435\u0449\u0435 \u0432\u0447\u0435\u0440\u0430\u00bb. \u041f\u043e\u044d\u0442\u043e\u043c\u0443, \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u2013 \u043f\u0435\u0440\u0432\u044b\u0439 \u043a\u0440\u0438\u0442\u0435\u0440\u0438\u0439 \u0434\u043b\u044f \u043c\u043e\u0435\u0439 \u0443\u0441\u043f\u0435\u0448\u043d\u043e\u0439 \u0440\u0430\u0431\u043e\u0442\u044b. <\/p>\n<p>\u041a\u0440\u043e\u043c\u0435 \u0442\u043e\u0433\u043e, \u0431\u044e\u0434\u0436\u0435\u0442\u0430 \u0434\u043b\u044f \u043f\u0440\u0438\u0432\u043b\u0435\u0447\u0435\u043d\u0438\u044f \u043d\u0430 \u043f\u0440\u043e\u0435\u043a\u0442 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u0444\u0440\u043e\u043d\u0442\u0430, \u0431\u044d\u043a\u0430, \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u0430, \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0449\u0438\u043a\u0430, \u0432\u043d\u0435\u0434\u0440\u0435\u043d\u0446\u0430 \u0438 \u0440\u0443\u043a\u043e\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044f \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u0443 \u0431\u043e\u043b\u044c\u0448\u0438\u043d\u0441\u0442\u0432\u0430 \u0437\u0430\u043a\u0430\u0437\u0447\u0438\u043a\u043e\u0432 \u043a\u043e\u043d\u0435\u0447\u043d\u043e \u0436\u0435 \u043d\u0435\u0442: \u043e\u043d\u0438 \u0438\u0449\u0443\u0442 \u043a\u043e\u0433\u043e-\u0442\u043e \u043e\u0434\u043d\u043e\u0433\u043e, \u0441\u043e\u0447\u0435\u0442\u0430\u044e\u0449\u0435\u0433\u043e \u0432\u0441\u0435 \u044d\u0442\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438. \u0418 \u043c\u043d\u0435 \u043f\u0440\u043e\u0441\u0442\u043e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442, \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0449\u0438\u0439 \u0432\u0435\u0441\u0442\u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0443 \u0432 \u0435\u0434\u0438\u043d\u043e\u043c \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u0435 \u0431\u0435\u0437 \u043c\u043d\u043e\u0433\u043e\u0441\u043b\u043e\u0439\u043d\u044b\u0445 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0435\u0439. <\/p>\n<p>\u041d\u043e \u0435\u0441\u043b\u0438 \u043a\u0442\u043e-\u0442\u043e \u0434\u0443\u043c\u0430\u0435\u0442, \u0447\u0442\u043e \u0444\u0440\u0438\u043b\u0430\u043d\u0441\u0435\u0440\u0443-\u043e\u0434\u0438\u043d\u043e\u0447\u043a\u0435 \u043e\u0442\u0434\u0430\u044e\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u044b \u0432\u0440\u043e\u0434\u0435 \u043b\u0435\u043d\u0434\u0438\u043d\u0433\u043e\u0432, \u0442\u043e \u0441\u043f\u0435\u0448\u0443 \u0440\u0430\u0437\u043e\u0447\u0430\u0440\u043e\u0432\u0430\u0442\u044c: \u043a \u0443\u0441\u043b\u0443\u0433\u0430\u043c \u0444\u0440\u0438\u043b\u0430\u043d\u0441\u0435\u0440\u043e\u0432 \u043e\u0431\u0440\u0430\u0449\u0430\u044e\u0442\u0441\u044f \u0441\u0435\u0442\u0438 Duty Free, \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0435 \u043a\u043e\u043c\u0431\u0438\u043d\u0430\u0442\u044b, \u043b\u043e\u0433\u0438\u0441\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043a\u043e\u043c\u043f\u0430\u043d\u0438\u0438, \u0441\u0435\u0442\u0438 \u0440\u0435\u0441\u0442\u043e\u0440\u0430\u043d\u043e\u0432, \u0441\u0443\u043f\u0435\u0440\u043c\u0430\u0440\u043a\u0435\u0442\u0430, \u0447\u0430\u0441\u0442\u043d\u044b\u0435 \u043c\u0435\u0434\u0438\u0446\u0438\u043d\u0441\u043a\u0438\u0435 \u043a\u043b\u0438\u043d\u0438\u043a\u0438, \u043f\u0440\u0435\u0434\u043f\u0440\u0438\u044f\u0442\u0438\u044f \u043e\u0431\u043e\u0440\u043e\u043d\u043d\u043e\u0439 \u043f\u0440\u043e\u043c\u044b\u0448\u043b\u0435\u043d\u043d\u043e\u0441\u0442\u0438. \u0418 \u0437\u0430\u0434\u0430\u0447\u0438 \u0443 \u043d\u0438\u0445 \u043e\u0431\u044a\u0435\u043c\u043d\u044b\u0435. \u041f\u043e\u044d\u0442\u043e\u043c\u0443, \u0442\u0440\u0435\u0442\u044c\u0435 \u0442\u0440\u0435\u0431\u043e\u0432\u0430\u043d\u0438\u0435 \u043a \u043c\u043e\u0435\u043c\u0443 \u043f\u043e\u0434\u0440\u0443\u0447\u043d\u043e\u043c\u0443 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u0443 \u2013 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043e\u043f\u0435\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043e\u0431\u044a\u0435\u043a\u0442\u0430\u043c\u0438 \u0438 \u0441\u0443\u0449\u043d\u043e\u0441\u0442\u044f\u043c\u0438 \u043f\u0440\u0435\u0434\u043c\u0435\u0442\u043d\u043e\u0439 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0431\u0438\u0437\u043d\u0435\u0441 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u0432, \u0442\u0430\u043a\u0438\u043c\u0438, \u043a\u0430\u043a \u0441\u043f\u0440\u0430\u0432\u043e\u0447\u043d\u0438\u043a, \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442 \u0441 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u043c\u0438 \u0442\u0430\u0431\u043b\u0438\u0447\u043d\u044b\u043c\u0438 \u0447\u0430\u0441\u0442\u044f\u043c\u0438, \u043e\u0442\u0447\u0435\u0442\u044b, \u0441\u0442\u043e\u043a\u0438 \u0438 \u043a\u043e\u043b\u043b\u0435\u043a\u0442\u043e\u0440\u044b \u0434\u0430\u043d\u043d\u044b\u0445, \u0443\u0441\u0442\u043e\u0439\u0447\u0438\u0432\u044b\u0439 \u043c\u043d\u043e\u0433\u043e\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u0440\u0435\u0436\u0438\u043c, \u043f\u043e\u0434\u043a\u0430\u0447\u043a\u0430 \u0438\u0437 \u0431\u0430\u0437\u044b \u0434\u0430\u043d\u043d\u044b\u0445, \u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u044c\u2026 <\/p>\n<p>\u041d\u0443 \u0438 \u0432 \u0437\u0430\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0438, \u043f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u044f \u044f\u0432\u043b\u044f\u044e\u0441\u044c \u0430\u0434\u0435\u043f\u0442\u043e\u043c \u043e\u0431\u044a\u0435\u043a\u0442\u043d\u043e-\u043e\u0440\u0438\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0433\u043e \u043f\u043e\u0434\u0445\u043e\u0434\u0430 \u0432 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0438, \u0442\u043e \u043e\u0442\u043a\u0430\u0437 \u043e\u0442 \u0442\u0435\u0433\u043e\u0432 \u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u043d\u0430 \u043a\u043b\u0430\u0441\u0441\u0430\u0445 \u043f\u0440\u043e\u0437\u0432\u0443\u0447\u0430\u043b\u0430, \u043a\u0430\u043a \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0439 \u0432\u044b\u0437\u043e\u0432 \u0438 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0432\u0437\u0433\u043b\u044f\u043d\u0443\u0442\u044c \u043d\u0430 WEB-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0443 \u043f\u043e-\u043d\u043e\u0432\u043e\u043c\u0443. <\/p>\n<p>\u0422\u0430\u043a \u0438 \u043f\u043e\u044f\u0432\u0438\u043b\u0430\u0441\u044c \u0438\u0434\u0435\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0430 LOTIS (Low Time Script), \u0435\u0433\u043e \u043f\u0435\u0440\u0432\u044b\u0435, \u043d\u0435\u0443\u0434\u0430\u0447\u043d\u044b\u0435 \u0440\u0435\u043b\u0438\u0437\u044b \u0438 \u0442\u0435\u043a\u0443\u0449\u0430\u044f, \u0441\u0442\u0430\u0431\u0438\u043b\u044c\u043d\u0430\u044f \u0432\u0435\u0440\u0441\u0438\u044f. \u0418\u0441\u0442\u043e\u0440\u0438\u044f \u0434\u043b\u0438\u043d\u043e\u044e \u0432 \u0434\u0435\u0441\u044f\u0442\u044c \u043b\u0435\u0442.<\/p>\n<h2>\u2b50 \u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u043e\u0442\u043b\u0438\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438 LOTIS<\/h2>\n<ul>\n<li>\n<p>\u0424\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u0434\u043b\u044f \u0431\u044b\u0441\u0442\u0440\u043e\u0439 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0441\u043b\u043e\u0436\u043d\u044b\u0445 \u0431\u0438\u0437\u043d\u0435\u0441-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439 \u043e\u0434\u043d\u0438\u043c \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u043c \u0438\u043b\u0438 \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u043e\u0439 \u043a\u043e\u043c\u0430\u043d\u0434\u043e\u0439<\/p>\n<\/li>\n<li>\n<p>\u0415\u0434\u0438\u043d\u043e\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0435 \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e: \u043b\u0438\u043d\u0435\u0439\u043d\u0430\u044f \u043b\u043e\u0433\u0438\u043a\u0430, \u0431\u0435\u0437 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u043d\u0430 \u043a\u043b\u0438\u0435\u043d\u0442\/\u0441\u0435\u0440\u0432\u0435\u0440 <\/p>\n<\/li>\n<li>\n<p>\u0420\u0430\u0431\u043e\u0442\u0430 \u0441 \u043e\u0431\u044a\u0435\u043a\u0442\u0430\u043c\u0438 \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0438, \u0430 \u043d\u0435 \u0441 DOM-\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c\u0438 <\/p>\n<\/li>\n<li>\n<p>\u041e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0438\u0435 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u0438 \u043f\u0438\u0441\u0430\u0442\u044c HTML \u0432\u0440\u0443\u0447\u043d\u0443\u044e: \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0441\u0442\u0440\u043e\u0438\u0442\u0441\u044f \u043d\u0430 \u043a\u043b\u0430\u0441\u0441\u0430\u0445<\/p>\n<\/li>\n<\/ul>\n<h3>LOTIS \u0440\u0435\u0430\u043b\u0438\u0437\u0443\u0435\u0442 \u043c\u043e\u0434\u0435\u043b\u044c CMA (Construct \u2013 Metadata &#8212; Assembly)<\/h3>\n<pre><code>\u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510     \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510     \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510\u2502           \u2502     \u2502           \u2502     \u2502           \u2502\u2502  CONSTRUCT\u2502\u2500\u2500\u2500\u2500&gt;\u2502 METADATA  \u2502\u2500\u2500\u2500\u2500&gt;\u2502 ASSEMBLY  \u2502\u2502           \u2502     \u2502           \u2502     \u2502           \u2502\u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518     \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518     \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518     \u2502                  \u2502                  \u2502     \u2502 \u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435         \u2502 \u0413\u0435\u043d\u0435\u0440\u0430\u0446\u0438\u044f        \u2502 \u041f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u043d\u0438\u0435     \u2502 \u043e\u0431\u044a\u0435\u043a\u0442\u043d\u043e\u0439 \u043c\u043e\u0434\u0435\u043b\u0438 \u2502 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0438\u0440\u043e\u0432\u0430\u043d-  \u2502 \u043c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u0445     \u2502                  \u2502 \u043d\u044b\u0445 \u0434\u0430\u043d\u043d\u044b\u0445       \u2502 \u0432 DOM     \u25bc                  \u25bc                  \u25bc  \u041e\u0431\u044a\u0435\u043a\u0442\u044b          \u041c\u0430\u0441\u0441\u0438\u0432\u044b \u0434\u0430\u043d\u043d\u044b\u0445     \u0413\u043e\u0442\u043e\u0432\u044b\u0439 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441  PHP\/JS           (\u0442\u0438\u043f, id, \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430)  \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435<\/code><div class=\"code-explainer\"><a href=\"https:\/\/sourcecraft.dev\/\" class=\"tm-button code-explainer__link\" style=\"visibility: hidden;\"><img style=\"width:87px;height:14px;object-fit:cover;object-position:left;\"\/><\/a><\/div><\/pre>\n<p>\u0421\u0443\u0442\u044c CMA: \u0412\u044b \u043f\u0438\u0448\u0435\u0442\u0435 \u043e\u0431\u044a\u0435\u043a\u0442\u043d\u043e-\u043e\u0440\u0438\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u043a\u043e\u0434 \u043a\u0430\u043a \u0432 \u0434\u0435\u0441\u043a\u0442\u043e\u043f\u043d\u043e\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438, \u0431\u0435\u0437 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u043d\u0430 \u043a\u043b\u0438\u0435\u043d\u0442 \u0438 \u0441\u0435\u0440\u0432\u0435\u0440, \u0430 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u0443\u0435\u0442 \u0435\u0433\u043e \u0432 \u043c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u0435, \u043f\u043e \u043a\u043e\u0442\u043e\u0440\u044b\u043c \u0438\u043d\u0442\u0435\u0440\u043f\u0440\u0435\u0442\u0430\u0442\u043e\u0440 \u0441\u0442\u0440\u043e\u0438\u0442 \u0432\u0435\u0431-\u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441.<\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"left\"><strong>\u0422\u0440\u0430\u0434\u0438\u0446\u0438\u043e\u043d\u043d\u044b\u0439 \u043f\u043e\u0434\u0445\u043e\u0434  <\/strong>   <\/p>\n<\/td>\n<td>\n<p align=\"left\"><strong>LOTIS (CMA)<\/strong>     <\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u0420\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u043d\u0430 \u043a\u043b\u0438\u0435\u043d\u0442\/\u0441\u0435\u0440\u0432\u0435\u0440     <\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0415\u0434\u0438\u043d\u043e\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0435 \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e     <\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u0420\u0430\u0431\u043e\u0442\u0430 \u0441 DOM-\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c\u0438     <\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0420\u0430\u0431\u043e\u0442\u0430 \u0441 \u043e\u0431\u044a\u0435\u043a\u0442\u0430\u043c\u0438 \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0438     <\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u041d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 HTML \u0432\u0440\u0443\u0447\u043d\u0443\u044e     <\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0410\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0433\u0435\u043d\u0435\u0440\u0430\u0446\u0438\u044f \u0447\u0435\u0440\u0435\u0437 \u043c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u0435     <\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u0421\u043b\u043e\u0436\u043d\u044b\u0435 AJAX-\u0437\u0430\u043f\u0440\u043e\u0441\u044b     <\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u043b\u043e\u0433\u0438\u043a\u0430 \u0431\u0435\u0437 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u0438\u044f     <\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<h2>\ud83d\udce6 \u041e\u0431\u044a\u0435\u043a\u0442\u043d\u0430\u044f \u043c\u043e\u0434\u0435\u043b\u044c LOTIS<\/h2>\n<pre><code>\u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510    \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510    \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510    \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510    \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510\u2502  Ether  \u2502 \u2190\u2500 \u2502 Construct \u2502 \u2190\u2500 \u2502   Quark  \u2502 \u2190\u2500 \u2502  Element  \u2502 \u2190\u2500 \u2502   Space   \u2502\u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518    \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518    \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518    \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518    \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518 \u0418\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441      \u0411\u0430\u0437\u043e\u0432\u044b\u0439 \u0446\u0438\u043a\u043b    \u0423\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435      HTML-\u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430     \u0421\u0431\u043e\u0440\u043a\u0430 DOM \u043a\u043e\u043d\u0442\u0440\u0430\u043a\u0442\u0430      \u0438 \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u044b \u043f\u043e\u0442\u043e\u043c\u043a\u0430\u043c\u0438       \u0438 \u043c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u0435    \u043f\u043e \u043c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u043c<\/code><div class=\"code-explainer\"><a href=\"https:\/\/sourcecraft.dev\/\" class=\"tm-button code-explainer__link\" style=\"visibility: hidden;\"><img style=\"width:14px;height:14px;object-fit:cover;object-position:left;\"\/><\/a><\/div><\/pre>\n<ol>\n<li>\n<p><strong>Ether<\/strong> \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u043c\u0435\u0442\u043e\u0434\u044b \u0436\u0438\u0437\u043d\u0435\u043d\u043d\u043e\u0433\u043e \u0446\u0438\u043a\u043b\u0430 \u043e\u0431\u044a\u0435\u043a\u0442\u0430<\/p>\n<\/li>\n<li>\n<p><strong>Construct<\/strong> \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442 \u0436\u0438\u0437\u043d\u0435\u043d\u043d\u044b\u043c \u0446\u0438\u043a\u043b\u043e\u043c \u043e\u0431\u044a\u0435\u043a\u0442\u0430<\/p>\n<\/li>\n<li>\n<p><strong>Quark<\/strong> \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u0442 \u0441\u0438\u0441\u0442\u0435\u043c\u0443 \u0445\u0440\u0430\u043d\u0435\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u044b\u0445 \u0438 \u0440\u0430\u0431\u043e\u0442\u0443 \u0441 \u043f\u043e\u0442\u043e\u043c\u043a\u0430\u043c\u0438<\/p>\n<\/li>\n<li>\n<p><strong>Element<\/strong> \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u0438\u0437\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u043d\u0430 \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u044b\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u0445<\/p>\n<\/li>\n<li>\n<p><strong>Space <\/strong>\u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442 \u0441\u0431\u043e\u0440 \u043c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u0445 \u0438 \u043f\u043e\u0441\u0442\u0440\u043e\u043a\u0435\u043d\u0438\u0435 DOM <\/p>\n<\/li>\n<\/ol>\n<h3>\u041c\u0435\u0442\u043e\u0434\u044b \u0436\u0438\u0437\u043d\u0435\u043d\u043d\u043e\u0433\u043e \u0446\u0438\u043a\u043b\u0430<\/h3>\n<ul>\n<li>\n<p>compile \u2013 \u043f\u0440\u0435\u0434\u0432\u0430\u0440\u0438\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u0434\u043e \u0433\u0435\u043d\u0435\u0440\u0430\u0446\u0438\u0438 \u043c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u0445<\/p>\n<\/li>\n<li>\n<p>shine \u2013 \u0433\u0435\u043d\u0435\u0440\u0430\u0446\u0438\u044f \u043c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u0445<\/p>\n<\/li>\n<li>\n<p>addinspace \u2013 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u0445 \u0432\u043e \u0432\u0441\u0435\u043b\u0435\u043d\u043d\u0443\u044e<\/p>\n<\/li>\n<li>\n<p>childs \u2013 \u043e\u0431\u0445\u043e\u0434 \u043f\u043e\u0442\u043e\u043c\u043a\u043e\u0432 \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u0438 \u0437\u0430\u043f\u0443\u0441\u043a \u0434\u043b\u044f \u043d\u0438\u0445 create<\/p>\n<\/li>\n<li>\n<p>create \u2013 \u043f\u043e\u043b\u043d\u044b\u0439 \u0436\u0438\u0437\u043d\u0435\u043d\u043d\u044b\u0439 \u0446\u0438\u043a\u043b.<\/p>\n<\/li>\n<\/ul>\n<h3>\u0416\u0438\u0437\u043d\u0435\u043d\u043d\u044b\u0439 \u0446\u0438\u043a\u043b \u043e\u0431\u044a\u0435\u043a\u0442\u0430<\/h3>\n<pre><code>\u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510   \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510   \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510   \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510\u2502   check   \u2502 \u2192 \u2502   before  \u2502 \u2192 \u2502   shine   \u2502 \u2192 \u2502 addinspace\u2502\u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518   \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518   \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518   \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518        \u2502        \u2514\u2500\u2500\u2500\u25b6 [\u043f\u0440\u0435\u043a\u0440\u0430\u0449\u0435\u043d\u0438\u0435 \u043f\u043e\u0441\u0442\u0440\u043e\u0435\u043d\u0438\u044f]\u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510   \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510   \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510   \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510\u2502 checkchilds  \u2502 \u2192 \u2502 beforechilds\u2502 \u2192 \u2502   childs  \u2502 \u2192 \u2502  onchilds \u2502\u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518   \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518   \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518   \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518        \u2502        \u2514\u2500\u2500\u2500\u25b6 [\u043f\u0440\u0435\u043a\u0440\u0430\u0449\u0435\u043d\u0438\u0435 \u043f\u043e\u0441\u0442\u0440\u043e\u0435\u043d\u0438\u044f \u043f\u043e\u0442\u043e\u043c\u043a\u043e\u0432]\u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510\u2502    on     \u2502\u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518<\/code><div class=\"code-explainer\"><a href=\"https:\/\/sourcecraft.dev\/\" class=\"tm-button code-explainer__link\" style=\"visibility: hidden;\"><img style=\"width:14px;height:14px;object-fit:cover;object-position:left;\"\/><\/a><\/div><\/pre>\n<p><strong>\u041c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u0435 <\/strong>\u2013 \u044d\u0442\u043e \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0435 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u0432 \u0432\u0438\u0434\u0435 \u043c\u0430\u0441\u0441\u0438\u0432\u0430:<\/p>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440: <\/p>\n<pre><code class=\"php\">[    'type' =&gt; 'html',    'id' =&gt; 'O5',    'tagname' =&gt; 'div',    'class' =&gt; 'my-class',    'attr\u2019 =&gt; ['data-role' =&gt; 'button', 'disabled' =&gt; true],    'caption' =&gt; '\u041a\u043d\u043e\u043f\u043a\u0430',    'parent' =&gt; 'O4']<\/code><div class=\"code-explainer\"><a href=\"https:\/\/sourcecraft.dev\/\" class=\"tm-button code-explainer__link\" style=\"visibility: hidden;\"><img style=\"width:14px;height:14px;object-fit:cover;object-position:left;\"\/><\/a><\/div><\/pre>\n<h2>\u26a1 \u0423\u043d\u0438\u043a\u0430\u043b\u044c\u043d\u044b\u0435 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438 \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u044b<\/h2>\n<h3>\u0415\u0434\u0438\u043d\u0430\u044f \u0442\u043e\u0447\u043a\u0430 \u0432\u0445\u043e\u0434\u0430<\/h3>\n<p>\u041c\u043d\u0435 \u043d\u0435 \u0445\u043e\u0442\u0435\u043b\u043e\u0441\u044c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c composer \u0438 \u043f\u043e\u0434\u043e\u0431\u043d\u044b\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b. \u042f \u0437\u0430\u0434\u0430\u043b\u0441\u044f \u0446\u0435\u043b\u044c\u044e \u043c\u0438\u043d\u0438\u043c\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043f\u043e\u0440\u043e\u0433 \u0432\u0445\u043e\u0436\u0434\u0435\u043d\u0438\u044f \u0432 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u0438 \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0435\u0433\u043e \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u043e \u043b\u0435\u0433\u043a\u0438\u043c. \u0420\u0435\u0448\u0435\u043d\u0438\u0435\u043c \u0441\u0442\u0430\u043b\u0430 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0444\u0430\u0431\u0440\u0438\u0447\u043d\u043e\u0433\u043e \u0430\u0431\u0441\u0442\u0440\u0430\u043a\u0442\u043d\u043e\u0433\u043e \u043a\u043b\u0430\u0441\u0441\u0430 LTS, \u0441\u0442\u0430\u0432\u0448\u0435\u0433\u043e \u0435\u0434\u0438\u043d\u043e\u0439 \u0442\u043e\u0447\u043a\u043e\u0439 \u0432\u0445\u043e\u0434\u0430.<\/p>\n<p>\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438:<\/p>\n<ol>\n<li>\n<p>\u0410\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u0435\u0442 \u0432\u0441\u0435 \u043a\u043b\u0430\u0441\u0441\u044b \u043f\u043e \u043c\u0435\u0440\u0435 \u0438\u0445 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u043f\u0440\u0438 \u043f\u043e\u043c\u043e\u0449\u0438 spl_autoload_register<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0444\u0430\u0431\u0440\u0438\u0447\u043d\u044b\u0435 \u043c\u0435\u0442\u043e\u0434\u044b \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043e\u0431\u044a\u0435\u043a\u0442\u043e\u0432: LTS::Form, LTS::Grid, LTS::Events \u0438 \u0442.\u0434. \u0432\u0441\u0435\u0433\u043e 41 \u043a\u043b\u0430\u0441\u0441.<\/p>\n<\/li>\n<li>\n<p>\u0414\u043b\u044f \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0430 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u043a \u043f\u0440\u043e\u0435\u043a\u0442\u0443 \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0434\u0438\u043d \u0435\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0439 \u0444\u0430\u0439\u043b: lotis.php:<\/p>\n<\/li>\n<\/ol>\n<pre><code class=\"php\">include_once 'newlotis\/lotis.php';<\/code><div class=\"code-explainer\"><a href=\"https:\/\/sourcecraft.dev\/\" class=\"tm-button code-explainer__link\" style=\"visibility: hidden;\"><img style=\"width:14px;height:14px;object-fit:cover;object-position:left;\"\/><\/a><\/div><\/pre>\n<h3>\u0415\u0434\u0438\u043d\u043e\u0435 \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445<\/h3>\n<p>\u0412 LOTIS \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u043e\u043c\u0435\u0449\u0430\u0442\u044c \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u0438\u0439 \u0438 \u0441\u0435\u0440\u0432\u0435\u0440\u043d\u044b\u0439 \u043a\u043e\u0434 \u0432 \u043e\u0434\u0438\u043d \u0444\u0430\u0439\u043b, \u043d\u043e \u0442\u0430\u043a\u0436\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043e\u0434\u043d\u0438 \u0442\u0435 \u0436\u0435 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 \u0432 PHP \u0438 JavaScript. \u042d\u0442\u043e \u0441\u0435\u0440\u044c\u0435\u0437\u043d\u043e \u043e\u0431\u043b\u0435\u0433\u0447\u0430\u0435\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0443:<\/p>\n<pre><code class=\"php\">$mygrid = LTS::Grid();$mybutton = LTS::Button()-&gt;capt('\u041f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0438\u0442\u044c')    -&gt;click(&lt;&lt;&lt;JS   LTS(mygrid).mode('content'); \/\/ \u0412\u044b\u0437\u043e\u0432 \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u043e\u0433\u043e \u043c\u0435\u0442\u043e\u0434\u0430 mode \u043a\u043b\u0430\u0441\u0441\u0430 Grid  $(mybutton).hide();        \/\/ \u0412\u044b\u0437\u043e\u0432 jQuery-\u043c\u0435\u0442\u043e\u0434\u0430 hideJS);<\/code><div class=\"code-explainer\"><a href=\"https:\/\/sourcecraft.dev\/\" class=\"tm-button code-explainer__link\" style=\"visibility: hidden;\"><img style=\"width:14px;height:14px;object-fit:cover;object-position:left;\"\/><\/a><\/div><\/pre>\n<h3>\u0421\u043e\u0431\u044b\u0442\u0438\u044f \u0431\u0435\u0437 Ajax<\/h3>\n<p>\u041a\u043b\u0430\u0441\u0441 Events \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u043a\u043b\u0438\u0435\u043d\u0442-\u0441\u0435\u0440\u0432\u0435\u0440\u043d\u043e\u0435 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u043a\u0430\u043a \u0435\u0434\u0438\u043d\u044b\u0439 \u043f\u043e\u0442\u043e\u043a:<\/p>\n<pre><code class=\"php\">\/\/ \u041e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u0441\u043e\u0431\u044b\u0442\u0438\u044f$myevents = LTS::Events()-&gt;client('hello(name)', &lt;&lt;&lt;JS alert(result); JS)-&gt;server('hello', function ($args) {$name = $args['name'];return \"Hello, {$name}!\";});\/\/\u0412\u044b\u0437\u043e\u0432 \u0441\u043e\u0431\u044b\u0442\u0438\u044f \u043d\u0430 \u043a\u043b\u0438\u0435\u043d\u0442\u0435:$nameinput = LTS::Input()-&gt;text('myname', '\u0412\u0430\u0448\u0435 \u0438\u043c\u044f');LTS::Button()-&gt;capt('\u0412\u044b\u043f\u043e\u043b\u043d\u0438\u0442\u044c')-&gt;click(&lt;&lt;&lt;JSLTS(myevents).hello($(nameinput).val());JS);<\/code><div class=\"code-explainer\"><a href=\"https:\/\/sourcecraft.dev\/\" class=\"tm-button code-explainer__link\" style=\"visibility: hidden;\"><img style=\"width:14px;height:14px;object-fit:cover;object-position:left;\"\/><\/a><\/div><\/pre>\n<h3>\u0421\u0438\u0433\u043d\u0430\u043b\u044b<\/h3>\n<p>\u0414\u043b\u044f \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u0430\u0446\u0438\u0438 \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u0438\u043c\u0438 \u043e\u0431\u044a\u0435\u043a\u0442\u0430\u043c\u0438 \u043f\u0440\u0435\u0434\u0443\u0441\u043c\u043e\u0442\u0440\u0435\u043d\u044b \u0441\u0438\u0433\u043d\u0430\u043b\u044b \u043e\u043f\u043e\u0432\u0435\u0449\u0435\u043d\u0438\u044f \u0438 \u043f\u043e\u0434\u043f\u0438\u0441\u043a\u0438 \u043d\u0430 \u043d\u0438\u0445:<\/p>\n<pre><code class=\"php\">\/\/ \u041f\u043e\u0434\u043f\u0438\u0441\u043a\u0430:$myelement-&gt;signal('hideAll', &lt;&lt;&lt;JS    $(myelement).hide();JS);\/\/ \u041e\u043f\u043e\u0432\u0435\u0449\u0435\u043d\u0438\u0435:$mybutton-&gt;click(&lt;&lt;&lt;JS LTS.signal('hideAll'); JS);<\/code><div class=\"code-explainer\"><a href=\"https:\/\/sourcecraft.dev\/\" class=\"tm-button code-explainer__link\" style=\"visibility: hidden;\"><img style=\"width:14px;height:14px;object-fit:cover;object-position:left;\"\/><\/a><\/div><\/pre>\n<h3>\u041a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u0438\u0435 \u043c\u0435\u0442\u043e\u0434\u044b<\/h3>\n<p>\u0424\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u043b\u044e\u0431\u043e\u0433\u043e \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0430 \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u0438\u043c\u0438 \u043c\u0435\u0442\u043e\u0434\u0430\u043c\u0438. <\/p>\n<pre><code class=\"php\">$mydiv = LTS::Div()-&gt;method('hello', &lt;&lt;&lt;JS alert('Hello, world!'); JS);<\/code><div class=\"code-explainer\"><a href=\"https:\/\/sourcecraft.dev\/\" class=\"tm-button code-explainer__link\" style=\"visibility: hidden;\"><img style=\"width:14px;height:14px;object-fit:cover;object-position:left;\"\/><\/a><\/div><\/pre>\n<h3>\u0413\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0435 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435<\/h3>\n<p>\u041a\u043b\u0430\u0441\u0441 Vars \u043f\u0440\u0435\u0434\u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d \u0434\u043b\u044f \u0441\u0438\u043d\u0445\u0440\u043e\u043d\u0438\u0437\u0430\u0446\u0438\u0438 \u0434\u0430\u043d\u043d\u044b\u0445 \u043f\u0440\u0438 \u043a\u043b\u0438\u0435\u043d\u0442-\u0441\u0435\u0440\u0432\u0435\u0440\u043d\u043e\u043c \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0438 \u0431\u0435\u0437 \u0443\u0447\u0430\u0441\u0442\u0438\u044f \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u0438\u0441\u0442\u0430.<\/p>\n<pre><code class=\"php\">\/\/ \u041d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440\u0435$vars = LTS::Vars();$value = $vars-&gt;get('counter'); \/\/ \u041d\u0430 \u043a\u043b\u0438\u0435\u043d\u0442\u0435let counter = LTS.vars().get('counter');LTS.vars().set('counter', ++counter).store();<\/code><div class=\"code-explainer\"><a href=\"https:\/\/sourcecraft.dev\/\" class=\"tm-button code-explainer__link\" style=\"visibility: hidden;\"><img style=\"width:14px;height:14px;object-fit:cover;object-position:left;\"\/><\/a><\/div><\/pre>\n<h3>\u041f\u043e\u0441\u0442\u0430\u0432\u043a\u0430 \u0431\u0435\u0437 \u0438\u0441\u0445\u043e\u0434\u043d\u043e\u0433\u043e \u043a\u043e\u0434\u0430<\/h3>\n<p>\u0410\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0430 CMA \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442:<\/p>\n<ul>\n<li>\n<p>\u0421\u043e\u0445\u0440\u0430\u043d\u044f\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u043c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u0435 (\u043d\u0435 \u0438\u0441\u0445\u043e\u0434\u043d\u044b\u0439 \u043a\u043e\u0434) <\/p>\n<\/li>\n<li>\n<p>\u0417\u0430\u0433\u0440\u0443\u0436\u0430\u0442\u044c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0438\u0437 \u0441\u0435\u0440\u0438\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043d\u043d\u043e\u0433\u043e \u043c\u0430\u0441\u0441\u0438\u0432\u0430 <\/p>\n<\/li>\n<li>\n<p>\u0423\u0432\u0435\u043b\u0438\u0447\u0438\u0442\u044c \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 <\/p>\n<\/li>\n<li>\n<p>\u0417\u0430\u0449\u0438\u0442\u0438\u0442\u044c \u0430\u0432\u0442\u043e\u0440\u0441\u043a\u0438\u0435 \u043f\u0440\u0430\u0432\u0430<\/p>\n<\/li>\n<\/ul>\n<h2>\ud83d\udcbb \u041f\u0440\u0438\u043c\u0435\u0440\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u043a\u043b\u0430\u0441\u0441\u043e\u0432 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0430<\/h2>\n<h3>\u041f\u043e\u0441\u0442\u0440\u043e\u0435\u043d\u0438\u0435 \u0438\u0435\u0440\u0430\u0440\u0445\u0438\u0438<\/h3>\n<p>\u0412\u044b \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0435 \u043e\u0431\u044a\u0435\u043a\u0442\u043d\u0443\u044e \u043c\u043e\u0434\u0435\u043b\u044c \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430, \u0430 \u043d\u0435 HTML-\u0440\u0430\u0437\u043c\u0435\u0442\u043a\u0443. \u041d\u0435\u0442 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u0438 \u0434\u0443\u043c\u0430\u0442\u044c \u043e \u0442\u043e\u043c, \u043a\u0430\u043a \u044d\u0442\u043e \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0432 DOM \u2014 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u043f\u043e\u0437\u0430\u0431\u043e\u0442\u0438\u0442\u0441\u044f \u043e\u0431 \u044d\u0442\u043e\u043c.<\/p>\n<pre><code class=\"php\">$content = LTS::Div()-&gt;columnbox();$header = LTS::Div()-&gt;rowbox()-&gt;height('50px');$header-&gt;addmany(LTS::Button()-&gt;capt('Button 1'), LTS::Button()-&gt;capt('Button 2'));$body = LTS::Div()-&gt;flex();$body-&gt;css('background', '#000000')-&gt;css('color', '#ffffff')-&gt;capt('Body content \u2026');$footer = LTS::Div()-&gt;height('50px')-&gt;capt('Footer');$content-&gt;addmany($header, $body, $footer);LTS::Space()-&gt;build($content);<\/code><div class=\"code-explainer\"><a href=\"https:\/\/sourcecraft.dev\/\" class=\"tm-button code-explainer__link\" style=\"visibility: hidden;\"><img style=\"width:14px;height:14px;object-fit:cover;object-position:left;\"\/><\/a><\/div><\/pre>\n<h3>\u0420\u0430\u0431\u043e\u0442\u0430 \u0441 \u0444\u043e\u0440\u043c\u0430\u043c\u0438<\/h3>\n<p>\u041b\u043e\u0433\u0438\u043a\u0430 \u0444\u043e\u0440\u043c\u044b \u0438 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 \u0434\u043b\u044f \u043a\u043d\u043e\u043f\u043e\u043a \u043d\u0430\u0445\u043e\u0434\u044f\u0442\u0441\u044f \u0432 \u043e\u0434\u043d\u043e\u043c \u043c\u0435\u0441\u0442\u0435. <\/p>\n<pre><code class=\"php\">\/\/ \u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0444\u043e\u0440\u043c\u044b$myform = LTS::Form();\/\/ \u0414\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043f\u043e\u043b\u0435\u0439$myform-&gt;text('username', '\u041b\u043e\u0433\u0438\u043d')     -&gt;password('password', '\u041f\u0430\u0440\u043e\u043b\u044c')     -&gt;email('email', 'Email');\/\/ \u0414\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043a\u043d\u043e\u043f\u043e\u043a$myform-&gt;button('close', '\u0417\u0430\u043a\u0440\u044b\u0442\u044c')-&gt;click(&lt;&lt;&lt;JS $(myform).hide() JS);$clickbutton = $myform-&gt;button('clickme', '\u041d\u0430\u0436\u043c\u0438 \u043c\u0435\u043d\u044f');\/\/ \u041f\u0440\u0438\u0432\u044f\u0437\u043a\u0430 \u0441\u043e\u0431\u044b\u0442\u0438\u044f \u043a \u043a\u043d\u043e\u043f\u043a\u0435$myform-&gt;event($clickbutton, &lt;&lt;&lt;JS    alert(result);JS)  -&gt;event($clickbutton, function($args) {    return '\u041f\u0440\u0438\u0432\u0435\u0442, ' . $args['username'];});<\/code><div class=\"code-explainer\"><a href=\"https:\/\/sourcecraft.dev\/\" class=\"tm-button code-explainer__link\" style=\"visibility: hidden;\"><img style=\"width:14px;height:14px;object-fit:cover;object-position:left;\"\/><\/a><\/div><\/pre>\n<h3>\u0422\u0430\u0431\u043b\u0438\u0446\u044b<\/h3>\n<p>\u0412\u044b \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442\u0435 \u0441 \u0442\u0430\u0431\u043b\u0438\u0446\u0430\u043c\u0438, \u043a\u0430\u043a \u0441 \u043e\u0431\u044a\u0435\u043a\u0442\u0430\u043c\u0438, \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044f \u0441\u043e\u0441\u0442\u0430\u0432 \u043a\u043e\u043b\u043e\u043d\u043e\u043a, \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435, \u0441\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u043a\u0443 \u0441\u0442\u0440\u043e\u043a. \u0412\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0434\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u043e\u0434\u043a\u0430\u0447\u0438\u0432\u0430\u0442\u044c, \u043e\u0431\u043d\u043e\u0432\u043b\u044f\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0442\u0430\u0431\u043b\u0438\u0446\u044b \u0431\u0435\u0437 \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u043a\u0438 DOM. <\/p>\n<pre><code class=\"php\">\/\/ \u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0431\u0430\u0437\u043e\u0432\u043e\u0439 \u0442\u0430\u0431\u043b\u0438\u0446\u044b$table = LTS::DataTable()    -&gt;head(['name' =&gt; '\u041d\u0430\u0438\u043c\u0435\u043d\u043e\u0432\u0430\u043d\u0438\u0435', 'date' =&gt; '\u0414\u0430\u0442\u0430'])    -&gt;data([        ['id' =&gt; 1, 'name' =&gt; '\u042d\u043b\u0435\u043c\u0435\u043d\u0442 1', 'date' =&gt; '2023-01-01'],        ['id' =&gt; 2, 'name' =&gt; '\u042d\u043b\u0435\u043c\u0435\u043d\u0442 2', 'date' =&gt; '2023-02-01']    ])    -&gt;hidden(['id']) \/\/ \u0421\u043a\u0440\u044b\u0432\u0430\u0435\u043c \u043f\u043e\u043b\u0435 ID    -&gt;sort('name');  \/\/ \u0421\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u043a\u0430 \u043f\u043e \u043d\u0430\u0438\u043c\u0435\u043d\u043e\u0432\u0430\u043d\u0438\u044e\/\/ \u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u043a\u043b\u0438\u043a\u0430 \u043f\u043e \u0441\u0442\u0440\u043e\u043a\u0435$table-&gt;rowclick($form);\/\/ \u0414\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043d\u043e\u0432\u044b\u0445 \u0441\u0442\u0440\u043e\u043a$table-&gt;append([    ['id' =&gt; 3, 'name' =&gt; '\u042d\u043b\u0435\u043c\u0435\u043d\u0442 3', 'date' =&gt; '2023-03-01']]);<\/code><div class=\"code-explainer\"><a href=\"https:\/\/sourcecraft.dev\/\" class=\"tm-button code-explainer__link\" style=\"visibility: hidden;\"><img style=\"width:14px;height:14px;object-fit:cover;object-position:left;\"\/><\/a><\/div><\/pre>\n<p>\u0412\u0441\u0435 \u0442\u0435 \u0436\u0435 \u043c\u0435\u0442\u043e\u0434\u044b \u0440\u0430\u0431\u043e\u0442\u044b \u0441 \u0442\u0430\u0431\u043b\u0438\u0446\u0430\u043c\u0438 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b \u0438 \u043d\u0430 \u043a\u043b\u0438\u0435\u043d\u0442\u0435. \u041d\u0430 \u043f\u0440\u0438\u043c\u0435\u0440, \u0437\u0430\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u0435 \u043d\u043e\u0432\u043e\u0439 \u0441\u0442\u0440\u043e\u043a\u0438 \u0432 \u0442\u0430\u0431\u043b\u0438\u0446\u0443 \u0434\u0430\u043d\u043d\u044b\u043c\u0438 \u0438\u0437 \u0444\u043e\u0440\u043c\u044b \u0432\u0432\u043e\u0434\u0430:<\/p>\n<pre><code class=\"php\">LTS(table).append(LTS(form).values());<\/code><div class=\"code-explainer\"><a href=\"https:\/\/sourcecraft.dev\/\" class=\"tm-button code-explainer__link\" style=\"visibility: hidden;\"><img style=\"width:14px;height:14px;object-fit:cover;object-position:left;\"\/><\/a><\/div><\/pre>\n<h3>\u0418\u043d\u0442\u0435\u0433\u0440\u0430\u0446\u0438\u044f \u0433\u043e\u0442\u043e\u0432\u043e\u0439 \u0432\u0435\u0440\u0441\u0442\u043a\u0438 \u0432 \u043f\u0440\u043e\u0435\u043a\u0442<\/h3>\n<p>\u0427\u0442\u043e \u0435\u0441\u043b\u0438 \u043a\u043b\u0438\u0435\u043d\u0442 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0433\u043e\u0442\u043e\u0432\u0443\u044e \u0432\u0435\u0440\u0441\u0442\u043a\u0443 \u0441 HTML, CSS \u0438 JavaScript? LOTIS \u0443\u0441\u043a\u043e\u0440\u044f\u0435\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0443 \u0438 \u0432 \u044d\u0442\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435, \u043f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 LOTIS \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0432\u0430\u0435\u0442 \u043f\u043e\u0437\u0434\u043d\u0435\u0435 \u0441\u0432\u044f\u0437\u044b\u0432\u0430\u043d\u0438\u0435 \u0441\u043e\u0431\u044b\u0442\u0438\u0439 \u0438 \u043c\u0435\u0442\u043e\u0434\u043e\u0432 \u0441 \u043e\u0431\u044a\u0435\u043a\u0442\u0430\u043c\u0438 \u043f\u043e \u0438\u0445 ID: <\/p>\n<pre><code class=\"php\">\/\/ \u0418\u043d\u0442\u0435\u0433\u0440\u0438\u0440\u0443\u0435\u043c HTML-\u043a\u043e\u0434 \u0432 \u043f\u0440\u043e\u0435\u043a\u0442$mysite = LTS::Html('mysite.html')\/\/ \u041f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u0435\u043c \u0432\u043d\u0435\u0448\u043d\u0438\u0439 CSS$mysite-&gt;CSS()-&gt;add('styles.css');\/\/ \u041f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u0435\u043c \u0432\u043d\u0435\u0448\u043d\u0438\u0435 \u0441\u043a\u0440\u0438\u043f\u0442\u044b$mysite-&gt;JS()-&gt;add('scripts.js');\/\/ \u041e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u043c \u0441\u043e\u0431\u044b\u0442\u0438\u044f (\u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b back-office)$events = LTS::Events()  -&gt;client('clickbutton1', &lt;&lt;&lt;JS alert(result); JS)  -&gt;server('clickbutton1', function ($args) { return 'Hello, mysite!'; });\/\/ \u041f\u0440\u0438\u0432\u044f\u0437\u044b\u0432\u0430\u0435\u0442 \u0441\u043e\u0431\u044b\u0442\u0438\u0435 \u043a \u043a\u043b\u0438\u043a\u0443 \u043f\u043e \u043a\u043d\u043e\u043f\u043a\u0435 \u0441 id=button1 \u0438\u0437 HTML-\u0448\u0430\u0431\u043b\u043e\u043d\u0430$mysite-&gt;JS()-&gt;add(&lt;&lt;JS        LTS(button1).listen('click', () =&gt; { LTS(events).clickbutton1(); });              JS);\/\/ \u0421\u043e\u0431\u0438\u0440\u0430\u0435\u043c \u043f\u0440\u043e\u0435\u043a\u0442$mysite-&gt;add($events);LTS::Space()-&gt;build($mysite);<\/code><div class=\"code-explainer\"><a href=\"https:\/\/sourcecraft.dev\/\" class=\"tm-button code-explainer__link\" style=\"visibility: hidden;\"><img style=\"width:14px;height:14px;object-fit:cover;object-position:left;\"\/><\/a><\/div><\/pre>\n<h3>\u0410\u0434\u0430\u043f\u0442\u0438\u0432\u043d\u0430\u044f CSS Grid-\u0432\u0451\u0440\u0441\u0442\u043a\u0430<\/h3>\n<p>\u0412\u044b \u043e\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u0442\u0435 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0443 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430 \u043d\u0430 \u0443\u0440\u043e\u0432\u043d\u0435 \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0438, \u0430 \u043d\u0435 \u043d\u0430 \u0443\u0440\u043e\u0432\u043d\u0435 CSS-\u043f\u0440\u0430\u0432\u0438\u043b. \u041f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u0440\u0435\u0436\u0438\u043c\u043e\u0432 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0447\u0435\u0440\u0435\u0437 \u0432\u044b\u0437\u043e\u0432 \u043c\u0435\u0442\u043e\u0434\u043e\u0432, \u0430 \u043d\u0435 \u0447\u0435\u0440\u0435\u0437 \u043c\u0430\u043d\u0438\u043f\u0443\u043b\u044f\u0446\u0438\u0438 \u0441 \u043a\u043b\u0430\u0441\u0441\u0430\u043c\u0438.<\/p>\n<pre><code class=\"php\">\/\/ \u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0441\u0435\u0442\u043a\u0438$grid = LTS::Grid();\/\/ \u041e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u043c \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u043e$grid-&gt;deviceQuery('watch', '() =&gt; window.innerWidth &lt;= 600 &amp;&amp; window.innerHeight &lt;= 600');\/\/ \u041e\u043f\u0440\u0435\u043b\u0435\u043b\u0435\u043d\u0438\u0435 \u0440\u0435\u0436\u0438\u043c\u0430 dashboard$grid-&gt;setMode('dashboard')     -&gt;device('desktop')        -&gt;areas([\"header header\",            \"menu content\",            \"bar bar\"])        -&gt;rows(\"60px 1fr auto\")        -&gt;columns(\"200px 1fr\")     -&gt;device('mobile')        -&gt;areas([\"header\", \"content\", \"bar\"])        -&gt;rows(\"60px 1fr auto\")        -&gt;columns(\"1fr\")     -&gt;device('watch')        -&gt;areas([\"header\", \"content\"])        -&gt;rows(\"50px 1fr\")        -&gt;columns(\"1fr\");\u041f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0430\u0435\u043c \u0441\u0435\u0442\u043a\u0443 \u0432 \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u043e\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u043f\u043e \u043a\u043d\u043e\u043f\u043a\u0435:$btnDashboard = LTS::Button()    -&gt;capt('\ud83d\udcca \u041f\u0430\u043d\u0435\u043b\u044c')    -&gt;click(&lt;&lt;&lt;JS    LTS(grid).mode('dashboard')JS);<\/code><div class=\"code-explainer\"><a href=\"https:\/\/sourcecraft.dev\/\" class=\"tm-button code-explainer__link\" style=\"visibility: hidden;\"><img style=\"width:14px;height:14px;object-fit:cover;object-position:left;\"\/><\/a><\/div><\/pre>\n<h3>\u0412\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u0430\u044f ORM<\/h3>\n<p>LOTIS \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043f\u0430\u0440\u0430\u0434\u0438\u0433\u043c\u0443 \u041e\u041e\u041f \u043f\u0440\u0438 \u0440\u0430\u0431\u043e\u0442\u0435 \u0441 MySql \u0442\u0430\u0431\u043b\u0438\u0446\u0430\u043c\u0438. \u042d\u0442\u043e \u043f\u043e\u0432\u044b\u0448\u0430\u0435\u0442 \u0447\u0438\u0442\u0430\u0435\u043c\u043e\u0441\u0442\u044c \u043a\u043e\u0434\u0430 \u0438 \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0432\u0430\u0435\u0442 \u0433\u0438\u0431\u043a\u043e\u0441\u0442\u044c \u0432 \u0440\u0430\u0431\u043e\u0442\u0435 \u0441 \u0431\u0430\u0437\u043e\u0439 \u0434\u0430\u043d\u043d\u044b\u0445.<\/p>\n<pre><code class=\"php\">\/\/ \u041f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u043a \u0431\u0430\u0437\u0435:$db = LTS::MySql('mydb', 'localhost', 'user', 'pass');\/\/ \u041e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u0442\u0430\u0431\u043b\u0438\u0446\u044b:$users = $db-&gt;table('users');$users-&gt;string('name', 100);$users-&gt;string('email', 255);$users-&gt;enum('status', ['active' =&gt; '\u0410\u043a\u0442\u0438\u0432\u0435\u043d', 'blocked' =&gt; '\u0417\u0430\u0431\u043b\u043e\u043a\u0438\u0440\u043e\u0432\u0430\u043d']);$users-&gt;table('role_id', $roles);  \/\/ \u0432\u043d\u0435\u0448\u043d\u0438\u0439 \u043a\u043b\u044e\u0447$users-&gt;create();  \/\/ \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0432 \u0411\u0414\/\/ \u0412\u0441\u0442\u0430\u0432\u043a\u0430:$users-&gt;value('name', '\u0418\u0432\u0430\u043d')    -&gt;value('email', 'ivan@test.com')    -&gt;insert();\/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435:$users-&gt;value('status', 'blocked')-&gt;set(5);  \/\/ \u043f\u043e ID=5\/\/ \u041c\u0430\u0441\u0441\u043e\u0432\u043e\u0435 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435:$users-&gt;value('status', 'active')-&gt;setall(['role_id' =&gt; 1]);\/\/ \u0412\u044b\u0431\u043e\u0440\u043a\u0430:$list = $users-&gt;all(['status' =&gt; 'active', 'ORDER' =&gt; '-created_at', 'LIMIT' =&gt; 10]);\/\/ \u0421\u043b\u043e\u0436\u043d\u0430\u044f \u0432\u044b\u0431\u043e\u0440\u043a\u0430 \u0447\u0435\u0440\u0435\u0437 QueryBuilder:$result = $users-&gt;query()    -&gt;where('status', 'active')    -&gt;where('name', '$\u0438\u0432\u0430\u043d')  \/\/ LIKE '%\u0438\u0432\u0430\u043d%'    -&gt;leftJoin($roles, 'users.role_id = roles.id', 'roles')    -&gt;orderBy('-created_at')    -&gt;limit(10)    -&gt;all();<\/code><div class=\"code-explainer\"><a href=\"https:\/\/sourcecraft.dev\/\" class=\"tm-button code-explainer__link\" style=\"visibility: hidden;\"><img style=\"width:14px;height:14px;object-fit:cover;object-position:left;\"\/><\/a><\/div><\/pre>\n<h3>DataView \u2013 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442 \u0441 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u043c\u0438 \u0442\u0430\u0431\u043b\u0438\u0447\u043d\u044b\u043c\u0438 \u0447\u0430\u0441\u0442\u044f\u043c\u0438<\/h3>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u044d\u0442\u043e\u0433\u043e \u043a\u043b\u0430\u0441\u0441\u0430 \u0431\u044b\u043b \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u043d \u0432 \u043c\u043e\u0435\u0439 \u043f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0435\u0439 \u0441\u0442\u0430\u0442\u044c\u0435. \u041d\u0435 \u0441\u043a\u0440\u043e\u044e, \u043b\u043e\u0433\u0438\u043a\u0443 \u0440\u0430\u0431\u043e\u0442\u044b \u0441 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u043c\u0438 \u044f \u043f\u043e\u0437\u0430\u0438\u043c\u0441\u0442\u0432\u043e\u0432\u0430\u043b \u0438\u0437 1\u0421: \u0443 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0448\u0430\u043f\u043a\u0430, \u0442\u0430\u0431\u043b\u0438\u0447\u043d\u044b\u0435 \u0447\u0430\u0441\u0442\u0438, \u0444\u043e\u0440\u043c\u0430 \u0440\u0435\u0434\u0430\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f, \u0444\u043e\u0440\u043c\u0430 \u0441\u043f\u0438\u0441\u043a\u0430, \u0444\u043e\u0440\u043c\u0430 \u0434\u043b\u044f \u043f\u043e\u0438\u0441\u043a\u0430 \u0438 \u043e\u0442\u0431\u043e\u0440\u0430, \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u044b, \u043e\u0442\u0432\u0435\u0447\u0430\u044e\u0449\u0438\u0435 \u0437\u0430 \u043f\u0440\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0438 \u0441\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0445 \u0434\u043b\u044f \u043f\u043e\u0441\u0442\u0440\u043e\u0435\u043d\u0438\u044f \u043e\u0442\u0447\u0435\u0442\u043e\u0432. <\/p>\n<p>\u0420\u0430\u0437\u0433\u043e\u0432\u043e\u0440\u044b \u043e \u0442\u043e\u043c, \u0447\u0442\u043e\u0431\u044b \u0432 WEB \u043f\u043e\u044f\u0432\u0438\u043b\u0430\u0441\u044c \u043b\u043e\u0433\u0438\u043a\u0430 \u0440\u0430\u0431\u043e\u0442\u044b \u0441 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u043c\u0438, \u043f\u043e\u0445\u043e\u0436\u0430\u044f \u043d\u0430 1\u0421, \u0432\u0435\u043b\u0438\u0441\u044c \u0435\u0449\u0435 \u0441 \u043d\u0430\u0447\u0430\u043b\u0430 2000-\u0445. \u0412 \u0432\u0435\u0440\u0441\u0438\u0438 1\u0421:\u041f\u0440\u0435\u0434\u043f\u0440\u0438\u044f\u0442\u0438\u0435 8.2, \u0431\u044b\u043b \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043d \u043c\u0435\u0445\u0430\u043d\u0438\u0437\u043c \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u043c\u043e\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u043e\u0442\u0432\u0435\u0447\u0430\u044e\u0449\u0438\u0439 \u043d\u0430 \u044d\u0442\u043e\u0442 \u0437\u0430\u043f\u0440\u043e\u0441. \u041d\u043e \u0434\u043e \u0441\u0438\u0445 \u043f\u043e\u0440 \u0432\u0441\u0435, \u0447\u0442\u043e \u0441\u0432\u044f\u0437\u0430\u043d\u043e \u0441 1\u0421, \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0434\u0430\u043b\u0435\u043a\u043e \u043d\u0435 \u043a\u043b\u0430\u0441\u0441\u0438\u0447\u0435\u0441\u043a\u0438\u043c WEB, \u0442\u0440\u0435\u0431\u0443\u044e\u0449\u0438\u043c \u0431\u043e\u043b\u044c\u0448\u0438\u0445 \u0432\u044b\u0447\u0438\u0441\u043b\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432. \u041f\u043e\u044d\u0442\u043e\u043c\u0443, \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0441\u0443\u0449\u043d\u043e\u0441\u0442\u044c, \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0449\u0443\u044e \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0441 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u043c\u0438 \u0432 \u043b\u043e\u0433\u0438\u043a\u0435 1\u0421, \u0431\u044b\u043b\u043e \u0432\u043f\u043e\u043b\u043d\u0435 \u043b\u043e\u0433\u0438\u0447\u043d\u044b\u043c \u0438 \u043d\u0443\u0436\u043d\u044b\u043c \u0440\u0435\u0448\u0435\u043d\u0438\u0435\u043c. <\/p>\n<h3>\u0414\u0440\u0443\u0433\u0438\u0435 \u043a\u043b\u0430\u0441\u0441\u044b<\/h3>\n<p>\u0412 \u0440\u0430\u0441\u043f\u043e\u0440\u044f\u0436\u0435\u043d\u0438\u0438 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u0438\u0441\u0442\u0430, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0449\u0435\u0433\u043e LOTIS, \u0438\u043c\u0435\u0435\u0442\u0441\u044f <strong>\u043e\u043a\u043e\u043b\u043e \u0441\u043e\u0440\u043e\u043a\u0430 \u043a\u043b\u0430\u0441\u0441\u043e\u0432<\/strong>. \u042d\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0441\u0442\u0440\u043e\u0438\u0442\u044c WEB-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u043e\u0439 \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438. <\/p>\n<pre><code>DataView.php \u2014 \u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0444\u043e\u0440\u043c\u0430: \u0435\u0434\u0438\u043d\u044b\u0439 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 \u0434\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u0441 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u043c\u0438DataTable.php \u2014 \u0422\u0430\u0431\u043b\u0438\u0446\u044b \u0441 \u0441\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u043a\u043e\u0439 \u0438 \u043e\u0442\u0431\u043e\u0440\u043e\u043cFilterForm.php \u2014 \u0424\u043e\u0440\u043c\u0430 \u0444\u0438\u043b\u044c\u0442\u0440\u0430\u0446\u0438\u0438 \u0442\u0430\u0431\u043b\u0438\u0446Stock.php \u2014 \u0426\u0435\u043d\u0442\u0440\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u0443\u0447\u0451\u0442Space.php \u2014 \u0421\u0431\u043e\u0440\u043a\u0430 UIEvents.php \u2014 \u0421\u043e\u0431\u044b\u0442\u0438\u044f \u0447\u0435\u0440\u0435\u0437 AJAXForm.php \u2014 \u0424\u043e\u0440\u043c\u0430 \u0432\u0432\u043e\u0434\u0430: \u0431\u0430\u0437\u043e\u0432\u044b\u0439 \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440 \u0434\u043b\u044f \u043f\u043e\u043b\u0435\u0439Input.php \u2014 \u041f\u043e\u043b\u0435 \u0432\u0432\u043e\u0434\u0430 \u0442\u0435\u043a\u0441\u0442\u0430LookupField.php \u2014 \u041f\u043e\u043b\u0435 \u043f\u043e\u0438\u0441\u043a\u0430 \u0441 \u0432\u044b\u043f\u0430\u0434\u0430\u044e\u0449\u0438\u043c \u0441\u043f\u0438\u0441\u043a\u043e\u043cJS.php \u2014 \u0413\u0435\u043d\u0435\u0440\u0430\u0446\u0438\u044f JavaScript-\u043b\u043e\u0433\u0438\u043a\u0438 \u043d\u0430 \u0441\u0442\u043e\u0440\u043e\u043d\u0435 PHPCSS.php \u2014 \u0412\u0441\u0442\u0430\u0432\u043a\u0430 \u0438 \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 CSS-\u043f\u0440\u0430\u0432\u0438\u043b\u0430\u043c\u0438 \u043d\u0430 \u043b\u0435\u0442\u0443Div.php \u2014 \u0423\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440Vars.php \u2014 \u0421\u0438\u0441\u0442\u0435\u043c\u0430 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0445 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445Grid.php \u2014 \u0421\u0435\u0442\u043e\u0447\u043d\u0430\u044f \u0432\u0451\u0440\u0441\u0442\u043a\u0430Dialog.php \u2014 \u041c\u043e\u0434\u0430\u043b\u044c\u043d\u043e\u0435 \u043e\u043a\u043d\u043eMySql.php \u2014 \u041f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u043a MySQLMySqlField.php \u2014 \u041f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043f\u043e\u043b\u044f \u0442\u0430\u0431\u043b\u0438\u0446\u044bMySqlTable.php \u2014 \u0420\u0430\u0431\u043e\u0442\u0430 \u0441 \u0442\u0430\u0431\u043b\u0438\u0446\u0435\u0439QueryBuilder.php \u2014 \u041f\u043e\u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c SQL-\u0437\u0430\u043f\u0440\u043e\u0441\u043e\u0432MultiTable.php \u2014 \u041f\u0440\u0438\u0432\u044f\u0437\u043a\u0430 \u043f\u043e\u0434\u0447\u0438\u043d\u0435\u043d\u043d\u044b\u0445 \u0442\u0430\u0431\u043b\u0438\u0446 \u043a \u0433\u043b\u0430\u0432\u043d\u043e\u0439Button.php \u2014 \u041a\u043d\u043e\u043f\u043a\u0430 \u0441 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f\u043c\u0438Cells.php \u2014 \u0421\u0435\u0442\u043a\u0430 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432Columns.php \u2014 \u0413\u0438\u0431\u043a\u0430\u044f \u043a\u043e\u043b\u043e\u043d\u043e\u0447\u043d\u0430\u044f \u0432\u0451\u0440\u0441\u0442\u043a\u0430Accordion.php \u2014 \u0420\u0430\u0441\u043a\u0440\u044b\u0432\u0430\u044e\u0449\u0438\u0435\u0441\u044f \u0431\u043b\u043e\u043a\u0438Construct.php \u2014 \u041f\u0435\u0440\u0432\u044b\u0439 \u0431\u0430\u0437\u043e\u0432\u044b\u0439 \u043a\u043b\u0430\u0441\u0441DataSync.php \u2014 \u0421\u0438\u043d\u0445\u0440\u043e\u043d\u0438\u0437\u0430\u0446\u0438\u044f \u0434\u0430\u043d\u043d\u044b\u0445Debug.php \u2014 \u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u043e\u0442\u043b\u0430\u0434\u043a\u0438Element.php \u2014 \u0411\u0430\u0437\u043e\u0432\u044b\u0439 \u043a\u043b\u0430\u0441\u0441 \u0432\u0441\u0435\u0445 UI-\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432Ether.php \u2014 \u0411\u0430\u0437\u043e\u0432\u044b\u0439 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441Html.php \u2014 \u0420\u0430\u0431\u043e\u0442\u0430 \u0441 HTML-\u0442\u0435\u0433\u0430\u043c\u0438Lang.php \u2014 \u041f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0430 \u043c\u0443\u043b\u044c\u0442\u0438\u044f\u0437\u044b\u0447\u043d\u043e\u0441\u0442\u0438LayerSlider.php \u2014 \u041f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u0441\u043b\u043e\u0451\u0432 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430Logger.php \u2014 \u041b\u043e\u0433\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439 \u0438 \u043e\u0448\u0438\u0431\u043e\u043aProgressBar.php \u2014 \u0412\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u044b\u0439 \u043f\u0440\u043e\u0433\u0440\u0435\u0441\u0441Quark.php \u2014 \u041c\u0438\u043d\u0438-\u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043e\u0431\u044a\u0435\u043a\u0442\u043d\u043e\u0439 \u043c\u043e\u0434\u0435\u043b\u0438SimpleChart.php \u2014 \u041f\u0440\u043e\u0441\u0442\u044b\u0435 \u0433\u0440\u0430\u0444\u0438\u043a\u0438Span.php \u2014 Inline-\u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440Tabs.php \u2014 \u0412\u043a\u043b\u0430\u0434\u043a\u0438Video.php \u2014 \u0412\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u043d\u0438\u0435 \u0432\u0438\u0434\u0435\u043e<\/code><div class=\"code-explainer\"><a href=\"https:\/\/sourcecraft.dev\/\" class=\"tm-button code-explainer__link\" style=\"visibility: hidden;\"><img style=\"width:14px;height:14px;object-fit:cover;object-position:left;\"\/><\/a><\/div><\/pre>\n<h2>\ud83d\udd0c \u0420\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u0435 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0430<\/h2>\n<p>\u0410\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0430 LOTIS \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0440\u0430\u0441\u0448\u0438\u0440\u044f\u0442\u044c \u0435\u0433\u043e \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u043c\u0438 \u043a\u043b\u0430\u0441\u0441\u0430\u043c\u0438. \u042d\u0442\u043e \u0434\u0430\u0435\u0442 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0438\u0445 \u0432 \u0441\u0432\u043e\u0438\u0445 \u043f\u0440\u043e\u0435\u043a\u0442\u0430\u0445.<\/p>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440:<\/p>\n<pre><code class=\"php\">class Option extends LTS\\Element{    public function __construct($id = '')    {        parent::__construct($id);        $this-&gt;tag('option');    }    public function inic($val, $caption)    {        $this-&gt;attr('value', $val)            -&gt;capt($caption);        return $this;    }}class Select extends LTS\\Element{    public function __construct($id = '')    {        parent::__construct($id);        $this-&gt;tag('select');    }    public function option($val, $caption = null)    {        $option = new Option();        $option-&gt;inic($val, $caption ?? $val);        $this-&gt;add($val, $option);        return $this;    }}<\/code><div class=\"code-explainer\"><a href=\"https:\/\/sourcecraft.dev\/\" class=\"tm-button code-explainer__link\" style=\"visibility: hidden;\"><img style=\"width:14px;height:14px;object-fit:cover;object-position:left;\"\/><\/a><\/div><\/pre>\n<h3>\u041a\u0441\u0442\u0430\u0442\u0438 \u043e Tailwind&#8230;<\/h3>\n<p>\u041f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u043b\u044e\u0431\u043e\u0439 \u043e\u0431\u044a\u0435\u043a\u0442 LOTIS \u0438\u043c\u0435\u0435\u0442 \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0435 \u043c\u0435\u0442\u043e\u0434\u044b addclass \u0438 removeclass, \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0449\u0438\u0435 \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0442\u044c \u0441\u043f\u0438\u0441\u043e\u043a CSS-\u043a\u043b\u0430\u0441\u0441\u043e\u0432 \u043d\u0435\u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u0434\u043b\u044f \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u0433\u043e \u043e\u0431\u044a\u0435\u043a\u0442\u0430, \u0442\u043e \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0433\u043e \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u0430 Tailwind\u00a0\u0442\u0430\u043a \u0438 \u043f\u0440\u043e\u0441\u0438\u0442\u0441\u044f \u043a \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438. \u0410 \u043f\u043e\u043a\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u043c\u0435\u0442\u043e\u0434\u044b &#171;\u0432 \u043b\u043e\u0431&#187;:\u00a0<\/p>\n<pre><code class=\"php\">$card = LTS::Div()    -&gt;addclass('max-w-sm rounded overflow-hidden shadow-lg bg-white')    -&gt;addclass('transition duration-300 hover:shadow-xl');<\/code><div class=\"code-explainer\"><a href=\"https:\/\/sourcecraft.dev\/\" class=\"tm-button code-explainer__link\" style=\"visibility: hidden;\"><img style=\"width:14px;height:14px;object-fit:cover;object-position:left;\"\/><\/a><\/div><\/pre>\n<h2>\ud83d\uddfa\ufe0f \u0427\u0442\u043e \u0434\u0430\u043b\u044c\u0448\u0435?<\/h2>\n<p>LOTIS \u0430\u043a\u0442\u0438\u0432\u043d\u043e \u0440\u0430\u0437\u0432\u0438\u0432\u0430\u0435\u0442\u0441\u044f, \u0438 \u0432 \u043d\u0430\u0441\u0442\u043e\u044f\u0449\u0435\u0435 \u0432\u0440\u0435\u043c\u044f \u041f\u0438\u0442\u0435\u0440\u0441\u043a\u043e\u0435 \u0438\u0437\u0434\u0430\u0442\u0435\u043b\u044c\u0441\u0442\u0432\u043e &#171;\u041d\u0430\u0443\u043a\u0430&#187; \u0433\u043e\u0442\u043e\u0432\u0438\u0442 \u043a \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u0438 \u043a\u043d\u0438\u0433\u0443 \u043f\u043e \u0435\u0433\u043e \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u044e \u0432 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0435 WEB-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439 \u0434\u043b\u044f \u0431\u0438\u0437\u043d\u0435\u0441\u0430. <\/p>\n<p>\u0421\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u0448\u0430\u0433\u0438:<\/p>\n<ul>\n<li>\n<p>\u041f\u043e\u0440\u0442 \u043d\u0430 Node.js \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f PWA<\/p>\n<\/li>\n<li>\n<p>\u0418\u043d\u0442\u0435\u0433\u0440\u0430\u0446\u0438\u044f \u0441 \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u044b\u043c\u0438 \u0431\u0430\u0437\u0430\u043c\u0438 \u0434\u0430\u043d\u043d\u044b\u0445<\/p>\n<\/li>\n<li>\n<p>\u041f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0430 TypeScript \u0434\u043b\u044f \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0438<\/p>\n<\/li>\n<li>\n<p>\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u0441\u0438\u0441\u0442\u0435\u043c\u044b \u0442\u0435\u0441\u0442\u043e\u0432<\/p>\n<\/li>\n<li>\n<p>\u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0442\u043e\u0440\u0430 \u0434\u043b\u044f \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e\u0439 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438<\/p>\n<\/li>\n<\/ul>\n<p>\u041f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u0443\u044f LOTIS, \u044f \u0445\u043e\u0442\u0435\u043b \u043d\u0435 \u043f\u0440\u043e\u0441\u0442\u043e \u0443\u043f\u0440\u043e\u0441\u0442\u0438\u0442\u044c \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0443 \u043d\u0430 PHP, \u044f \u0438\u0441\u043a\u0430\u043b \u043d\u043e\u0432\u044b\u0439 \u0443\u0440\u043e\u0432\u0435\u043d\u044c \u0430\u0431\u0441\u0442\u0440\u0430\u043a\u0446\u0438\u0438: \u043d\u0435 \u0441\u0442\u0440\u043e\u0438\u0442\u044c HTML, \u0430 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u043e\u0431\u044a\u0435\u043a\u0442\u043d\u0443\u044e \u043c\u043e\u0434\u0435\u043b\u044c \u0431\u0438\u0437\u043d\u0435\u0441-\u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u0432. \u0427\u0442\u043e\u0431\u044b \u044d\u0442\u0430 \u043c\u043e\u0434\u0435\u043b\u044c \u0441\u0442\u0430\u043b\u0430 \u0436\u0438\u0432\u044b\u043c \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u043e\u043c &#8212; \u043e\u0431 \u044d\u0442\u043e\u043c \u0437\u0430\u0431\u043e\u0442\u0438\u0442\u0441\u044f \u043d\u0435 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u0438\u0441\u0442, \u0430 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a.<\/p>\n<p>\u0411\u0443\u0434\u0443 \u0440\u0430\u0434 \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u043e\u0431\u0440\u0430\u0442\u043d\u0443\u044e \u0441\u0432\u044f\u0437\u044c \u043e\u0442 \u043a\u043e\u043b\u043b\u0435\u0433, \u043a\u043e\u043c\u0443 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a LOTIS \u043f\u043e\u043c\u043e\u0433 \u0432 \u0440\u0430\u0431\u043e\u0442\u0435 \u0438 \u043a\u0442\u043e \u0445\u043e\u0442\u0435\u043b \u0431\u044b \u043f\u043e\u0434\u0435\u043b\u0438\u0442\u044c\u0441\u044f \u043f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u043c\u0438 \u0441\u043e\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f\u043c\u0438 \u043f\u043e \u0435\u0433\u043e \u0443\u043b\u0443\u0447\u0448\u0435\u043d\u0438\u044e \u0438\u043b\u0438 \u043f\u043e\u0443\u0447\u0430\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u0432 \u0435\u0433\u043e \u0440\u0430\u0437\u0432\u0438\u0442\u0438\u0438.  <\/p>\n<pre><code class=\"php\">include_once 'newlotis\/lotis.php';$div = LTS::Div()-&gt;capt(\"Hello from LOTIS!\");LTS::Space()-&gt;build($div);<\/code><div class=\"code-explainer\"><a href=\"https:\/\/sourcecraft.dev\/\" class=\"tm-button code-explainer__link\" style=\"visibility: hidden;\"><img style=\"width:14px;height:14px;object-fit:cover;object-position:left;\"\/><\/a><\/div><\/pre>\n<\/div>\n<p>\u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b \u0441\u0442\u0430\u0442\u044c\u0438 <a href=\"https:\/\/habr.com\/ru\/articles\/1025380\/\">https:\/\/habr.com\/ru\/articles\/1025380\/<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u041f\u043e\u0441\u043b\u0435 \u0442\u043e\u0433\u043e \u043a\u0430\u043a \u043c\u043e\u044f \u0441\u0442\u0430\u0442\u044c\u044f \u043e \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0435 LOTIS \u0432\u044b\u0437\u0432\u0430\u043b\u0430 \u0438\u043d\u0442\u0435\u0440\u0435\u0441, \u044f \u0440\u0435\u0448\u0438\u043b \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435 \u0440\u0430\u0441\u043a\u0440\u044b\u0442\u044c \u0435\u0433\u043e \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0443 \u0438 \u043f\u0440\u0438\u0432\u0435\u0441\u0442\u0438 \u043f\u0440\u0438\u043c\u0435\u0440\u044b \u043a\u043e\u0434\u0430. \u041d\u0430\u043f\u043e\u043c\u0438\u043d\u0430\u044e \u0441\u0441\u044b\u043b\u043a\u0443 \u043d\u0430 \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0439 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0430: https:\/\/github.com\/O-Planet\/LOTISLOTIS \u0440\u0435\u0448\u0430\u0435\u0442 \u043e\u0434\u043d\u0443 \u0444\u0443\u043d\u0434\u0430\u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u0443\u044e \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0443: \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u043b\u043e\u0433\u0438\u043a\u0438 \u043d\u0430 \u043a\u043b\u0438\u0435\u043d\u0442 \u0438 \u0441\u0435\u0440\u0432\u0435\u0440 \u043c\u0435\u0448\u0430\u0435\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0435 \u0431\u0438\u0437\u043d\u0435\u0441-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439. \u0412\u043c\u0435\u0441\u0442\u043e \u0442\u043e\u0433\u043e \u0447\u0442\u043e\u0431\u044b \u0434\u0443\u043c\u0430\u0442\u044c \u043e \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0435, \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 \u0442\u0440\u0430\u0442\u044f\u0442 \u0432\u0440\u0435\u043c\u044f \u043d\u0430:\u0421\u0438\u043d\u0445\u0440\u043e\u043d\u0438\u0437\u0430\u0446\u0438\u044e \u0434\u0430\u043d\u043d\u044b\u0445 \u043c\u0435\u0436\u0434\u0443 \u043a\u043b\u0438\u0435\u043d\u0442\u043e\u043c \u0438 \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u043c \u0423\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435\u043c \u041d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u0438\u0434\u0435\u043d\u0442\u0438\u0447\u043d\u043e\u0439 \u043b\u043e\u0433\u0438\u043a\u0438 \u043d\u0430 \u0434\u0432\u0443\u0445 \u044f\u0437\u044b\u043a\u0430\u0445 \u041e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0443 AJAX-\u0437\u0430\u043f\u0440\u043e\u0441\u043e\u0432LOTIS \u0443\u0441\u0442\u0440\u0430\u043d\u044f\u0435\u0442 \u044d\u0442\u0443 \u0440\u0430\u0437\u0434\u0432\u043e\u0435\u043d\u043d\u043e\u0441\u0442\u044c, \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044f \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043a\u0430\u043a \u0435\u0434\u0438\u043d\u043e\u0435 \u0446\u0435\u043b\u043e\u0435. \u0420\u0430\u0437\u0431\u0435\u0440\u0443 \u0435\u0433\u043e \u0440\u0430\u0431\u043e\u0442\u0443 \u043d\u0430 \u043f\u0440\u0438\u043c\u0435\u0440\u0430\u0445. \u041d\u043e \u0441\u043f\u0435\u0440\u0432\u0430 \u2013 \u043f\u0440\u043e \u0438\u0441\u0442\u043e\u0440\u0438\u044e \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f, \u0438 \u0447\u0435\u043c \u0431\u044b\u043b\u0430 \u0432\u044b\u0437\u0432\u0430\u043d\u0430 \u044d\u0442\u0430 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u044c.\ud83d\udcdc \u0418\u0441\u0442\u043e\u0440\u0438\u044f \u043f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u044f: \u0434\u043b\u044f \u0447\u0435\u0433\u043e\u042f \u044f\u0432\u043b\u044f\u044e\u0441\u044c \u0444\u0440\u0438\u043b\u0430\u043d\u0441\u0435\u0440\u043e\u043c, \u043d\u0435 \u0441\u043e\u0432\u043c\u0435\u0441\u0442\u0438\u0442\u0435\u043b\u0435\u043c \u043f\u043e \u0432\u0435\u0447\u0435\u0440\u0430\u043c, \u0430 \u0438\u043c\u0435\u043d\u043d\u043e \u0444\u0440\u0438\u043b\u0430\u043d\u0441\u0435\u0440\u043e\u043c. \u0423 \u043c\u0435\u043d\u044f \u043d\u0435\u0442 \u00ab\u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0433\u043e\u00bb \u043c\u0435\u0441\u0442\u0430 \u0440\u0430\u0431\u043e\u0442\u044b, \u043d\u0435\u0442 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0430. \u042f \u0441\u0430\u043c \u0438\u0449\u0443 \u0437\u0430\u043a\u0430\u0437\u0447\u0438\u043a\u043e\u0432, \u0432\u0435\u0434\u0443 \u043f\u0435\u0440\u0435\u0433\u043e\u0432\u043e\u0440\u044b, \u0437\u0430\u043a\u043b\u044e\u0447\u0430\u044e \u0434\u043e\u0433\u043e\u0432\u043e\u0440\u0430, \u0441\u0430\u043c \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u044e \u043f\u0440\u043e\u0435\u043a\u0442\u044b, \u0432\u043d\u0435\u0434\u0440\u044f\u044e, \u043e\u0431\u0443\u0447\u0430\u044e.\u00a0 \u0417\u0430\u043d\u0438\u043c\u0430\u044e\u0441\u044c \u044d\u0442\u0438\u043c \u0443\u0436\u0435 \u0431\u043e\u043b\u0435\u0435 20-\u0438 \u043b\u0435\u0442. \u041e\u0442\u0441\u044e\u0434\u0430 \u0438 \u0432\u043e\u0437\u043d\u0438\u043a\u043b\u0430 \u043f\u043e\u0442\u0440\u0435\u0431\u043d\u043e\u0441\u0442\u044c \u0432 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0435 \u00ab\u0432\u0441\u0435 \u2013 \u0432 \u043e\u0434\u043d\u043e\u043c\u00bb \u0434\u043b\u044f \u0431\u044b\u0441\u0442\u0440\u043e\u0439 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 WEB-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439, \u0432\u0435\u0434\u044c \u0431\u043e\u043b\u044c\u0448\u0438\u043d\u0441\u0442\u0432\u0443 \u0437\u0430\u043a\u0430\u0437\u0447\u0438\u043a\u043e\u0432 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u043d\u0443\u0436\u0435\u043d \u00ab\u0435\u0449\u0435 \u0432\u0447\u0435\u0440\u0430\u00bb. \u041f\u043e\u044d\u0442\u043e\u043c\u0443, \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u2013 \u043f\u0435\u0440\u0432\u044b\u0439 \u043a\u0440\u0438\u0442\u0435\u0440\u0438\u0439 \u0434\u043b\u044f \u043c\u043e\u0435\u0439 \u0443\u0441\u043f\u0435\u0448\u043d\u043e\u0439 \u0440\u0430\u0431\u043e\u0442\u044b. \u041a\u0440\u043e\u043c\u0435 \u0442\u043e\u0433\u043e, \u0431\u044e\u0434\u0436\u0435\u0442\u0430 \u0434\u043b\u044f \u043f\u0440\u0438\u0432\u043b\u0435\u0447\u0435\u043d\u0438\u044f \u043d\u0430 \u043f\u0440\u043e\u0435\u043a\u0442 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u0444\u0440\u043e\u043d\u0442\u0430, \u0431\u044d\u043a\u0430, \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u0430, \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0449\u0438\u043a\u0430, \u0432\u043d\u0435\u0434\u0440\u0435\u043d\u0446\u0430 \u0438 \u0440\u0443\u043a\u043e\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044f \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u0443 \u0431\u043e\u043b\u044c\u0448\u0438\u043d\u0441\u0442\u0432\u0430 \u0437\u0430\u043a\u0430\u0437\u0447\u0438\u043a\u043e\u0432 \u043a\u043e\u043d\u0435\u0447\u043d\u043e \u0436\u0435 \u043d\u0435\u0442: \u043e\u043d\u0438 \u0438\u0449\u0443\u0442 \u043a\u043e\u0433\u043e-\u0442\u043e \u043e\u0434\u043d\u043e\u0433\u043e, \u0441\u043e\u0447\u0435\u0442\u0430\u044e\u0449\u0435\u0433\u043e \u0432\u0441\u0435 \u044d\u0442\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438. \u0418 \u043c\u043d\u0435 \u043f\u0440\u043e\u0441\u0442\u043e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442, \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0449\u0438\u0439 \u0432\u0435\u0441\u0442\u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0443 \u0432 \u0435\u0434\u0438\u043d\u043e\u043c \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u0435 \u0431\u0435\u0437 \u043c\u043d\u043e\u0433\u043e\u0441\u043b\u043e\u0439\u043d\u044b\u0445 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0435\u0439. \u041d\u043e \u0435\u0441\u043b\u0438 \u043a\u0442\u043e-\u0442\u043e \u0434\u0443\u043c\u0430\u0435\u0442, \u0447\u0442\u043e \u0444\u0440\u0438\u043b\u0430\u043d\u0441\u0435\u0440\u0443-\u043e\u0434\u0438\u043d\u043e\u0447\u043a\u0435 \u043e\u0442\u0434\u0430\u044e\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u044b \u0432\u0440\u043e\u0434\u0435 \u043b\u0435\u043d\u0434\u0438\u043d\u0433\u043e\u0432, \u0442\u043e \u0441\u043f\u0435\u0448\u0443 \u0440\u0430\u0437\u043e\u0447\u0430\u0440\u043e\u0432\u0430\u0442\u044c: \u043a \u0443\u0441\u043b\u0443\u0433\u0430\u043c \u0444\u0440\u0438\u043b\u0430\u043d\u0441\u0435\u0440\u043e\u0432 \u043e\u0431\u0440\u0430\u0449\u0430\u044e\u0442\u0441\u044f \u0441\u0435\u0442\u0438 Duty Free, \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0435 \u043a\u043e\u043c\u0431\u0438\u043d\u0430\u0442\u044b, \u043b\u043e\u0433\u0438\u0441\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043a\u043e\u043c\u043f\u0430\u043d\u0438\u0438, \u0441\u0435\u0442\u0438 \u0440\u0435\u0441\u0442\u043e\u0440\u0430\u043d\u043e\u0432, \u0441\u0443\u043f\u0435\u0440\u043c\u0430\u0440\u043a\u0435\u0442\u0430, \u0447\u0430\u0441\u0442\u043d\u044b\u0435 \u043c\u0435\u0434\u0438\u0446\u0438\u043d\u0441\u043a\u0438\u0435 \u043a\u043b\u0438\u043d\u0438\u043a\u0438, \u043f\u0440\u0435\u0434\u043f\u0440\u0438\u044f\u0442\u0438\u044f \u043e\u0431\u043e\u0440\u043e\u043d\u043d\u043e\u0439 \u043f\u0440\u043e\u043c\u044b\u0448\u043b\u0435\u043d\u043d\u043e\u0441\u0442\u0438. \u0418 \u0437\u0430\u0434\u0430\u0447\u0438 \u0443 \u043d\u0438\u0445 \u043e\u0431\u044a\u0435\u043c\u043d\u044b\u0435. \u041f\u043e\u044d\u0442\u043e\u043c\u0443, \u0442\u0440\u0435\u0442\u044c\u0435 \u0442\u0440\u0435\u0431\u043e\u0432\u0430\u043d\u0438\u0435 \u043a \u043c\u043e\u0435\u043c\u0443 \u043f\u043e\u0434\u0440\u0443\u0447\u043d\u043e\u043c\u0443 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u0443 \u2013 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043e\u043f\u0435\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043e\u0431\u044a\u0435\u043a\u0442\u0430\u043c\u0438 \u0438 \u0441\u0443\u0449\u043d\u043e\u0441\u0442\u044f\u043c\u0438 \u043f\u0440\u0435\u0434\u043c\u0435\u0442\u043d\u043e\u0439 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0431\u0438\u0437\u043d\u0435\u0441 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u0432, \u0442\u0430\u043a\u0438\u043c\u0438, \u043a\u0430\u043a \u0441\u043f\u0440\u0430\u0432\u043e\u0447\u043d\u0438\u043a, \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442 \u0441 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u043c\u0438 \u0442\u0430\u0431\u043b\u0438\u0447\u043d\u044b\u043c\u0438 \u0447\u0430\u0441\u0442\u044f\u043c\u0438, \u043e\u0442\u0447\u0435\u0442\u044b, \u0441\u0442\u043e\u043a\u0438 \u0438 \u043a\u043e\u043b\u043b\u0435\u043a\u0442\u043e\u0440\u044b \u0434\u0430\u043d\u043d\u044b\u0445, \u0443\u0441\u0442\u043e\u0439\u0447\u0438\u0432\u044b\u0439 \u043c\u043d\u043e\u0433\u043e\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u0440\u0435\u0436\u0438\u043c, \u043f\u043e\u0434\u043a\u0430\u0447\u043a\u0430 \u0438\u0437 \u0431\u0430\u0437\u044b \u0434\u0430\u043d\u043d\u044b\u0445, \u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u044c\u2026 \u041d\u0443 \u0438 \u0432 \u0437\u0430\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0438, \u043f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u044f \u044f\u0432\u043b\u044f\u044e\u0441\u044c \u0430\u0434\u0435\u043f\u0442\u043e\u043c \u043e\u0431\u044a\u0435\u043a\u0442\u043d\u043e-\u043e\u0440\u0438\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0433\u043e \u043f\u043e\u0434\u0445\u043e\u0434\u0430 \u0432 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0438, \u0442\u043e \u043e\u0442\u043a\u0430\u0437 \u043e\u0442 \u0442\u0435\u0433\u043e\u0432 \u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u043d\u0430 \u043a\u043b\u0430\u0441\u0441\u0430\u0445 \u043f\u0440\u043e\u0437\u0432\u0443\u0447\u0430\u043b\u0430, \u043a\u0430\u043a \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0439 \u0432\u044b\u0437\u043e\u0432 \u0438 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0432\u0437\u0433\u043b\u044f\u043d\u0443\u0442\u044c \u043d\u0430 WEB-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0443 \u043f\u043e-\u043d\u043e\u0432\u043e\u043c\u0443. \u0422\u0430\u043a \u0438 \u043f\u043e\u044f\u0432\u0438\u043b\u0430\u0441\u044c \u0438\u0434\u0435\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0430 LOTIS (Low Time Script), \u0435\u0433\u043e \u043f\u0435\u0440\u0432\u044b\u0435, \u043d\u0435\u0443\u0434\u0430\u0447\u043d\u044b\u0435 \u0440\u0435\u043b\u0438\u0437\u044b \u0438 \u0442\u0435\u043a\u0443\u0449\u0430\u044f, \u0441\u0442\u0430\u0431\u0438\u043b\u044c\u043d\u0430\u044f \u0432\u0435\u0440\u0441\u0438\u044f. \u0418\u0441\u0442\u043e\u0440\u0438\u044f \u0434\u043b\u0438\u043d\u043e\u044e \u0432 \u0434\u0435\u0441\u044f\u0442\u044c \u043b\u0435\u0442.\u2b50 \u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u043e\u0442\u043b\u0438\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438 LOTIS\u0424\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u0434\u043b\u044f \u0431\u044b\u0441\u0442\u0440\u043e\u0439 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0441\u043b\u043e\u0436\u043d\u044b\u0445 \u0431\u0438\u0437\u043d\u0435\u0441-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439 \u043e\u0434\u043d\u0438\u043c \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u043c \u0438\u043b\u0438 \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u043e\u0439 \u043a\u043e\u043c\u0430\u043d\u0434\u043e\u0439\u0415\u0434\u0438\u043d\u043e\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0435 \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e: \u043b\u0438\u043d\u0435\u0439\u043d\u0430\u044f \u043b\u043e\u0433\u0438\u043a\u0430, \u0431\u0435\u0437 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u043d\u0430 \u043a\u043b\u0438\u0435\u043d\u0442\/\u0441\u0435\u0440\u0432\u0435\u0440 \u0420\u0430\u0431\u043e\u0442\u0430 \u0441 \u043e\u0431\u044a\u0435\u043a\u0442\u0430\u043c\u0438 \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0438, \u0430 \u043d\u0435 \u0441 DOM-\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c\u0438 \u041e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0438\u0435 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u0438 \u043f\u0438\u0441\u0430\u0442\u044c HTML \u0432\u0440\u0443\u0447\u043d\u0443\u044e: \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0441\u0442\u0440\u043e\u0438\u0442\u0441\u044f \u043d\u0430 \u043a\u043b\u0430\u0441\u0441\u0430\u0445LOTIS \u0440\u0435\u0430\u043b\u0438\u0437\u0443\u0435\u0442 \u043c\u043e\u0434\u0435\u043b\u044c CMA (Construct \u2013 Metadata &#8212; Assembly)\u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510     \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510     \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510\u2502           \u2502     \u2502           \u2502     \u2502           \u2502\u2502  CONSTRUCT\u2502\u2500\u2500\u2500\u2500&gt;\u2502 METADATA  \u2502\u2500\u2500\u2500\u2500&gt;\u2502 ASSEMBLY  \u2502\u2502           \u2502     \u2502           \u2502     \u2502           \u2502\u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518     \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518     \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518     \u2502                  \u2502                  \u2502     \u2502 \u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435         \u2502 \u0413\u0435\u043d\u0435\u0440\u0430\u0446\u0438\u044f        \u2502 \u041f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u043d\u0438\u0435     \u2502 \u043e\u0431\u044a\u0435\u043a\u0442\u043d\u043e\u0439 \u043c\u043e\u0434\u0435\u043b\u0438 \u2502 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0438\u0440\u043e\u0432\u0430\u043d-  \u2502 \u043c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u0445     \u2502                  \u2502 \u043d\u044b\u0445 \u0434\u0430\u043d\u043d\u044b\u0445       \u2502 \u0432 DOM     \u25bc                  \u25bc                  \u25bc  \u041e\u0431\u044a\u0435\u043a\u0442\u044b          \u041c\u0430\u0441\u0441\u0438\u0432\u044b \u0434\u0430\u043d\u043d\u044b\u0445     \u0413\u043e\u0442\u043e\u0432\u044b\u0439 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441  PHP\/JS           (\u0442\u0438\u043f, id, \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430)  \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435\u0421\u0443\u0442\u044c CMA: \u0412\u044b \u043f\u0438\u0448\u0435\u0442\u0435 \u043e\u0431\u044a\u0435\u043a\u0442\u043d\u043e-\u043e\u0440\u0438\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u043a\u043e\u0434 \u043a\u0430\u043a \u0432 \u0434\u0435\u0441\u043a\u0442\u043e\u043f\u043d\u043e\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438, \u0431\u0435\u0437 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u043d\u0430 \u043a\u043b\u0438\u0435\u043d\u0442 \u0438 \u0441\u0435\u0440\u0432\u0435\u0440, \u0430 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u0443\u0435\u0442 \u0435\u0433\u043e \u0432 \u043c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u0435, \u043f\u043e \u043a\u043e\u0442\u043e\u0440\u044b\u043c \u0438\u043d\u0442\u0435\u0440\u043f\u0440\u0435\u0442\u0430\u0442\u043e\u0440 \u0441\u0442\u0440\u043e\u0438\u0442 \u0432\u0435\u0431-\u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441.\u0422\u0440\u0430\u0434\u0438\u0446\u0438\u043e\u043d\u043d\u044b\u0439 \u043f\u043e\u0434\u0445\u043e\u0434     LOTIS (CMA)     \u0420\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u043d\u0430 \u043a\u043b\u0438\u0435\u043d\u0442\/\u0441\u0435\u0440\u0432\u0435\u0440     \u0415\u0434\u0438\u043d\u043e\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0435 \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e     \u0420\u0430\u0431\u043e\u0442\u0430 \u0441 DOM-\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c\u0438     \u0420\u0430\u0431\u043e\u0442\u0430 \u0441 \u043e\u0431\u044a\u0435\u043a\u0442\u0430\u043c\u0438 \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0438     \u041d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 HTML \u0432\u0440\u0443\u0447\u043d\u0443\u044e     \u0410\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0433\u0435\u043d\u0435\u0440\u0430\u0446\u0438\u044f \u0447\u0435\u0440\u0435\u0437 \u043c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u0435     \u0421\u043b\u043e\u0436\u043d\u044b\u0435 AJAX-\u0437\u0430\u043f\u0440\u043e\u0441\u044b     \u041f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u043b\u043e\u0433\u0438\u043a\u0430 \u0431\u0435\u0437 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u0438\u044f     \ud83d\udce6 \u041e\u0431\u044a\u0435\u043a\u0442\u043d\u0430\u044f \u043c\u043e\u0434\u0435\u043b\u044c LOTIS\u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510    \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510    \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510    \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510    \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510\u2502  Ether  \u2502 \u2190\u2500 \u2502 Construct \u2502 \u2190\u2500 \u2502   Quark  \u2502 \u2190\u2500 \u2502  Element  \u2502 \u2190\u2500 \u2502   Space   \u2502\u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518    \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518    \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518    \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518    \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518 \u0418\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441      \u0411\u0430\u0437\u043e\u0432\u044b\u0439 \u0446\u0438\u043a\u043b    \u0423\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435      HTML-\u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430     \u0421\u0431\u043e\u0440\u043a\u0430 DOM \u043a\u043e\u043d\u0442\u0440\u0430\u043a\u0442\u0430      \u0438 \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u044b \u043f\u043e\u0442\u043e\u043c\u043a\u0430\u043c\u0438       \u0438 \u043c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u0435    \u043f\u043e \u043c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u043cEther \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u043c\u0435\u0442\u043e\u0434\u044b \u0436\u0438\u0437\u043d\u0435\u043d\u043d\u043e\u0433\u043e \u0446\u0438\u043a\u043b\u0430 \u043e\u0431\u044a\u0435\u043a\u0442\u0430Construct \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442 \u0436\u0438\u0437\u043d\u0435\u043d\u043d\u044b\u043c \u0446\u0438\u043a\u043b\u043e\u043c \u043e\u0431\u044a\u0435\u043a\u0442\u0430Quark \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u0442 \u0441\u0438\u0441\u0442\u0435\u043c\u0443 \u0445\u0440\u0430\u043d\u0435\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u044b\u0445 \u0438 \u0440\u0430\u0431\u043e\u0442\u0443 \u0441 \u043f\u043e\u0442\u043e\u043c\u043a\u0430\u043c\u0438Element \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u0438\u0437\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u043d\u0430 \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u044b\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u0445Space \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442 \u0441\u0431\u043e\u0440 \u043c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u0445 \u0438 \u043f\u043e\u0441\u0442\u0440\u043e\u043a\u0435\u043d\u0438\u0435 DOM \u041c\u0435\u0442\u043e\u0434\u044b \u0436\u0438\u0437\u043d\u0435\u043d\u043d\u043e\u0433\u043e \u0446\u0438\u043a\u043b\u0430compile \u2013 \u043f\u0440\u0435\u0434\u0432\u0430\u0440\u0438\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u0434\u043e \u0433\u0435\u043d\u0435\u0440\u0430\u0446\u0438\u0438 \u043c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u0445shine \u2013 \u0433\u0435\u043d\u0435\u0440\u0430\u0446\u0438\u044f \u043c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u0445addinspace \u2013 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u0445 \u0432\u043e \u0432\u0441\u0435\u043b\u0435\u043d\u043d\u0443\u044echilds \u2013 \u043e\u0431\u0445\u043e\u0434 \u043f\u043e\u0442\u043e\u043c\u043a\u043e\u0432 \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u0438 \u0437\u0430\u043f\u0443\u0441\u043a \u0434\u043b\u044f \u043d\u0438\u0445 createcreate \u2013 \u043f\u043e\u043b\u043d\u044b\u0439 \u0436\u0438\u0437\u043d\u0435\u043d\u043d\u044b\u0439 \u0446\u0438\u043a\u043b.\u0416\u0438\u0437\u043d\u0435\u043d\u043d\u044b\u0439 \u0446\u0438\u043a\u043b \u043e\u0431\u044a\u0435\u043a\u0442\u0430\u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510   \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510   \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510   \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510\u2502   check   \u2502 \u2192 \u2502   before  \u2502 \u2192 \u2502   shine   \u2502 \u2192 \u2502 addinspace\u2502\u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518   \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518   \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518   \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518        \u2502        \u2514\u2500\u2500\u2500\u25b6 [\u043f\u0440\u0435\u043a\u0440\u0430\u0449\u0435\u043d\u0438\u0435 \u043f\u043e\u0441\u0442\u0440\u043e\u0435\u043d\u0438\u044f]\u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510   \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510   \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510   \u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510\u2502 checkchilds  \u2502 \u2192 \u2502 beforechilds\u2502 \u2192 \u2502   childs  \u2502 \u2192 \u2502  onchilds \u2502\u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518   \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518   \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518   \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518        \u2502        \u2514\u2500\u2500\u2500\u25b6 [\u043f\u0440\u0435\u043a\u0440\u0430\u0449\u0435\u043d\u0438\u0435 \u043f\u043e\u0441\u0442\u0440\u043e\u0435\u043d\u0438\u044f \u043f\u043e\u0442\u043e\u043c\u043a\u043e\u0432]\u250c\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510\u2502    on     \u2502\u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518\u041c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u0435 \u2013 \u044d\u0442\u043e \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0435 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u0432 \u0432\u0438\u0434\u0435 \u043c\u0430\u0441\u0441\u0438\u0432\u0430:\u041f\u0440\u0438\u043c\u0435\u0440: [    &#8216;type&#8217; =&gt; &#8216;html&#8217;,    &#8216;id&#8217; =&gt; &#8216;O5&#8217;,    &#8216;tagname&#8217; =&gt; &#8216;div&#8217;,    &#8216;class&#8217; =&gt; &#8216;my-class&#8217;,    &#8216;attr\u2019 =&gt; [&#8216;data-role&#8217; =&gt; &#8216;button&#8217;, &#8216;disabled&#8217; =&gt; true],    &#8216;caption&#8217; =&gt; &#8216;\u041a\u043d\u043e\u043f\u043a\u0430&#8217;,    &#8216;parent&#8217; =&gt; &#8216;O4&#8217;]\u26a1 \u0423\u043d\u0438\u043a\u0430\u043b\u044c\u043d\u044b\u0435 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438 \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u044b\u0415\u0434\u0438\u043d\u0430\u044f \u0442\u043e\u0447\u043a\u0430 \u0432\u0445\u043e\u0434\u0430\u041c\u043d\u0435 \u043d\u0435 \u0445\u043e\u0442\u0435\u043b\u043e\u0441\u044c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c composer \u0438 \u043f\u043e\u0434\u043e\u0431\u043d\u044b\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b. \u042f \u0437\u0430\u0434\u0430\u043b\u0441\u044f \u0446\u0435\u043b\u044c\u044e \u043c\u0438\u043d\u0438\u043c\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043f\u043e\u0440\u043e\u0433 \u0432\u0445\u043e\u0436\u0434\u0435\u043d\u0438\u044f \u0432 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u0438 \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0435\u0433\u043e \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u043e \u043b\u0435\u0433\u043a\u0438\u043c. \u0420\u0435\u0448\u0435\u043d\u0438\u0435\u043c \u0441\u0442\u0430\u043b\u0430 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0444\u0430\u0431\u0440\u0438\u0447\u043d\u043e\u0433\u043e \u0430\u0431\u0441\u0442\u0440\u0430\u043a\u0442\u043d\u043e\u0433\u043e \u043a\u043b\u0430\u0441\u0441\u0430 LTS, \u0441\u0442\u0430\u0432\u0448\u0435\u0433\u043e \u0435\u0434\u0438\u043d\u043e\u0439 \u0442\u043e\u0447\u043a\u043e\u0439 \u0432\u0445\u043e\u0434\u0430.\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438:\u0410\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u0435\u0442 \u0432\u0441\u0435 \u043a\u043b\u0430\u0441\u0441\u044b \u043f\u043e \u043c\u0435\u0440\u0435 \u0438\u0445 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u043f\u0440\u0438 \u043f\u043e\u043c\u043e\u0449\u0438 spl_autoload_register\u041f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0444\u0430\u0431\u0440\u0438\u0447\u043d\u044b\u0435 \u043c\u0435\u0442\u043e\u0434\u044b \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043e\u0431\u044a\u0435\u043a\u0442\u043e\u0432: LTS::Form, LTS::Grid, LTS::Events \u0438 \u0442.\u0434. \u0432\u0441\u0435\u0433\u043e 41 \u043a\u043b\u0430\u0441\u0441.\u0414\u043b\u044f \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0430 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u043a \u043f\u0440\u043e\u0435\u043a\u0442\u0443 \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0434\u0438\u043d \u0435\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0439 \u0444\u0430\u0439\u043b: lotis.php:include_once &#8216;newlotis\/lotis.php&#8217;;\u0415\u0434\u0438\u043d\u043e\u0435 \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445\u0412 LOTIS \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u043e\u043c\u0435\u0449\u0430\u0442\u044c \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u0438\u0439 \u0438 \u0441\u0435\u0440\u0432\u0435\u0440\u043d\u044b\u0439 \u043a\u043e\u0434 \u0432 \u043e\u0434\u0438\u043d \u0444\u0430\u0439\u043b, \u043d\u043e \u0442\u0430\u043a\u0436\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043e\u0434\u043d\u0438 \u0442\u0435 \u0436\u0435 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 \u0432 PHP \u0438 JavaScript. \u042d\u0442\u043e \u0441\u0435\u0440\u044c\u0435\u0437\u043d\u043e \u043e\u0431\u043b\u0435\u0433\u0447\u0430\u0435\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0443:$mygrid = LTS::Grid();$mybutton = LTS::Button()-&gt;capt(&#8216;\u041f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0438\u0442\u044c&#8217;)    -&gt;click(&lt;&lt;&lt;JS   LTS(mygrid).mode(&#8216;content&#8217;); \/\/ \u0412\u044b\u0437\u043e\u0432 \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u043e\u0433\u043e \u043c\u0435\u0442\u043e\u0434\u0430 mode \u043a\u043b\u0430\u0441\u0441\u0430 Grid  $(mybutton).hide();        \/\/ \u0412\u044b\u0437\u043e\u0432 jQuery-\u043c\u0435\u0442\u043e\u0434\u0430 hideJS);\u0421\u043e\u0431\u044b\u0442\u0438\u044f \u0431\u0435\u0437 Ajax\u041a\u043b\u0430\u0441\u0441 Events \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u043a\u043b\u0438\u0435\u043d\u0442-\u0441\u0435\u0440\u0432\u0435\u0440\u043d\u043e\u0435 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u043a\u0430\u043a \u0435\u0434\u0438\u043d\u044b\u0439 \u043f\u043e\u0442\u043e\u043a:\/\/ \u041e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u0441\u043e\u0431\u044b\u0442\u0438\u044f$myevents = LTS::Events()-&gt;client(&#8216;hello(name)&#8217;, &lt;&lt;&lt;JS alert(result); JS)-&gt;server(&#8216;hello&#8217;, function ($args) {$name = $args[&#8216;name&#8217;];return &#171;Hello, {$name}!&#187;;});\/\/\u0412\u044b\u0437\u043e\u0432 \u0441\u043e\u0431\u044b\u0442\u0438\u044f \u043d\u0430 \u043a\u043b\u0438\u0435\u043d\u0442\u0435:$nameinput = LTS::Input()-&gt;text(&#8216;myname&#8217;, &#8216;\u0412\u0430\u0448\u0435 \u0438\u043c\u044f&#8217;);LTS::Button()-&gt;capt(&#8216;\u0412\u044b\u043f\u043e\u043b\u043d\u0438\u0442\u044c&#8217;)-&gt;click(&lt;&lt;&lt;JSLTS(myevents).hello($(nameinput).val());JS);\u0421\u0438\u0433\u043d\u0430\u043b\u044b\u0414\u043b\u044f \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u0430\u0446\u0438\u0438 \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u0438\u043c\u0438 \u043e\u0431\u044a\u0435\u043a\u0442\u0430\u043c\u0438 \u043f\u0440\u0435\u0434\u0443\u0441\u043c\u043e\u0442\u0440\u0435\u043d\u044b \u0441\u0438\u0433\u043d\u0430\u043b\u044b \u043e\u043f\u043e\u0432\u0435\u0449\u0435\u043d\u0438\u044f \u0438 \u043f\u043e\u0434\u043f\u0438\u0441\u043a\u0438 \u043d\u0430 \u043d\u0438\u0445:\/\/ \u041f\u043e\u0434\u043f\u0438\u0441\u043a\u0430:$myelement-&gt;signal(&#8216;hideAll&#8217;, &lt;&lt;&lt;JS    $(myelement).hide();JS);\/\/ \u041e\u043f\u043e\u0432\u0435\u0449\u0435\u043d\u0438\u0435:$mybutton-&gt;click(&lt;&lt;&lt;JS LTS.signal(&#8216;hideAll&#8217;); JS);\u041a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u0438\u0435 \u043c\u0435\u0442\u043e\u0434\u044b\u0424\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u043b\u044e\u0431\u043e\u0433\u043e \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0430 \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u0438\u043c\u0438 \u043c\u0435\u0442\u043e\u0434\u0430\u043c\u0438. $mydiv = LTS::Div()-&gt;method(&#8216;hello&#8217;, &lt;&lt;&lt;JS alert(&#8216;Hello, world!&#8217;); JS);\u0413\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0435 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435\u041a\u043b\u0430\u0441\u0441 Vars \u043f\u0440\u0435\u0434\u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d \u0434\u043b\u044f \u0441\u0438\u043d\u0445\u0440\u043e\u043d\u0438\u0437\u0430\u0446\u0438\u0438 \u0434\u0430\u043d\u043d\u044b\u0445 \u043f\u0440\u0438 \u043a\u043b\u0438\u0435\u043d\u0442-\u0441\u0435\u0440\u0432\u0435\u0440\u043d\u043e\u043c \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0438 \u0431\u0435\u0437 \u0443\u0447\u0430\u0441\u0442\u0438\u044f \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u0438\u0441\u0442\u0430.\/\/ \u041d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440\u0435$vars = LTS::Vars();$value = $vars-&gt;get(&#8216;counter&#8217;); \/\/ \u041d\u0430 \u043a\u043b\u0438\u0435\u043d\u0442\u0435let counter = LTS.vars().get(&#8216;counter&#8217;);LTS.vars().set(&#8216;counter&#8217;, ++counter).store();\u041f\u043e\u0441\u0442\u0430\u0432\u043a\u0430 \u0431\u0435\u0437 \u0438\u0441\u0445\u043e\u0434\u043d\u043e\u0433\u043e \u043a\u043e\u0434\u0430\u0410\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0430 CMA \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442:\u0421\u043e\u0445\u0440\u0430\u043d\u044f\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u043c\u0435\u0442\u0430\u0434\u0430\u043d\u043d\u044b\u0435 (\u043d\u0435 \u0438\u0441\u0445\u043e\u0434\u043d\u044b\u0439 \u043a\u043e\u0434) \u0417\u0430\u0433\u0440\u0443\u0436\u0430\u0442\u044c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0438\u0437 \u0441\u0435\u0440\u0438\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043d\u043d\u043e\u0433\u043e \u043c\u0430\u0441\u0441\u0438\u0432\u0430 \u0423\u0432\u0435\u043b\u0438\u0447\u0438\u0442\u044c \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 \u0417\u0430\u0449\u0438\u0442\u0438\u0442\u044c \u0430\u0432\u0442\u043e\u0440\u0441\u043a\u0438\u0435 \u043f\u0440\u0430\u0432\u0430\ud83d\udcbb \u041f\u0440\u0438\u043c\u0435\u0440\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u043a\u043b\u0430\u0441\u0441\u043e\u0432 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0430\u041f\u043e\u0441\u0442\u0440\u043e\u0435\u043d\u0438\u0435 \u0438\u0435\u0440\u0430\u0440\u0445\u0438\u0438\u0412\u044b \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0435 \u043e\u0431\u044a\u0435\u043a\u0442\u043d\u0443\u044e \u043c\u043e\u0434\u0435\u043b\u044c \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430, \u0430 \u043d\u0435 HTML-\u0440\u0430\u0437\u043c\u0435\u0442\u043a\u0443. \u041d\u0435\u0442 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u0438 \u0434\u0443\u043c\u0430\u0442\u044c \u043e \u0442\u043e\u043c, \u043a\u0430\u043a \u044d\u0442\u043e \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0432 DOM \u2014 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u043f\u043e\u0437\u0430\u0431\u043e\u0442\u0438\u0442\u0441\u044f \u043e\u0431 \u044d\u0442\u043e\u043c.$content = LTS::Div()-&gt;columnbox();$header = LTS::Div()-&gt;rowbox()-&gt;height(&#8217;50px&#8217;);$header-&gt;addmany(LTS::Button()-&gt;capt(&#8216;Button 1&#8217;), LTS::Button()-&gt;capt(&#8216;Button 2&#8217;));$body = LTS::Div()-&gt;flex();$body-&gt;css(&#8216;background&#8217;, &#8216;#000000&#8217;)-&gt;css(&#8216;color&#8217;, &#8216;#ffffff&#8217;)-&gt;capt(&#8216;Body content \u2026&#8217;);$footer = LTS::Div()-&gt;height(&#8217;50px&#8217;)-&gt;capt(&#8216;Footer&#8217;);$content-&gt;addmany($header, $body, $footer);LTS::Space()-&gt;build($content);\u0420\u0430\u0431\u043e\u0442\u0430 \u0441 \u0444\u043e\u0440\u043c\u0430\u043c\u0438\u041b\u043e\u0433\u0438\u043a\u0430 \u0444\u043e\u0440\u043c\u044b \u0438 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 \u0434\u043b\u044f \u043a\u043d\u043e\u043f\u043e\u043a \u043d\u0430\u0445\u043e\u0434\u044f\u0442\u0441\u044f \u0432 \u043e\u0434\u043d\u043e\u043c \u043c\u0435\u0441\u0442\u0435. \/\/ \u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0444\u043e\u0440\u043c\u044b$myform = LTS::Form();\/\/ \u0414\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043f\u043e\u043b\u0435\u0439$myform-&gt;text(&#8216;username&#8217;, &#8216;\u041b\u043e\u0433\u0438\u043d&#8217;)     -&gt;password(&#8216;password&#8217;, &#8216;\u041f\u0430\u0440\u043e\u043b\u044c&#8217;)     -&gt;email(&#8217;email&#8217;, &#8216;Email&#8217;);\/\/ \u0414\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043a\u043d\u043e\u043f\u043e\u043a$myform-&gt;button(&#8216;close&#8217;, &#8216;\u0417\u0430\u043a\u0440\u044b\u0442\u044c&#8217;)-&gt;click(&lt;&lt;&lt;JS $(myform).hide() JS);$clickbutton = $myform-&gt;button(&#8216;clickme&#8217;, &#8216;\u041d\u0430\u0436\u043c\u0438 \u043c\u0435\u043d\u044f&#8217;);\/\/ \u041f\u0440\u0438\u0432\u044f\u0437\u043a\u0430 \u0441\u043e\u0431\u044b\u0442\u0438\u044f \u043a \u043a\u043d\u043e\u043f\u043a\u0435$myform-&gt;event($clickbutton, &lt;&lt;&lt;JS    alert(result);JS)  -&gt;event($clickbutton, function($args) {    return &#8216;\u041f\u0440\u0438\u0432\u0435\u0442, &#8216; . $args[&#8216;username&#8217;];});\u0422\u0430\u0431\u043b\u0438\u0446\u044b\u0412\u044b \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442\u0435 \u0441 \u0442\u0430\u0431\u043b\u0438\u0446\u0430\u043c\u0438, \u043a\u0430\u043a \u0441 \u043e\u0431\u044a\u0435\u043a\u0442\u0430\u043c\u0438, \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044f \u0441\u043e\u0441\u0442\u0430\u0432 \u043a\u043e\u043b\u043e\u043d\u043e\u043a, \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435, \u0441\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u043a\u0443 \u0441\u0442\u0440\u043e\u043a. \u0412\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0434\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u043e\u0434\u043a\u0430\u0447\u0438\u0432\u0430\u0442\u044c, \u043e\u0431\u043d\u043e\u0432\u043b\u044f\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0442\u0430\u0431\u043b\u0438\u0446\u044b \u0431\u0435\u0437 \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u043a\u0438 DOM. \/\/ \u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0431\u0430\u0437\u043e\u0432\u043e\u0439 \u0442\u0430\u0431\u043b\u0438\u0446\u044b$table = LTS::DataTable()    -&gt;head([&#8216;name&#8217; &#8230;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[],"tags":[],"class_list":["post-476592","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/476592","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=476592"}],"version-history":[{"count":0,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/476592\/revisions"}],"wp:attachment":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=476592"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=476592"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=476592"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}