|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<title>Telegram Bot Visual Editor</title> |
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/drawflow/dist/drawflow.min.css"> |
|
|
<script src="https://cdn.jsdelivr.net/npm/drawflow/dist/drawflow.min.js"></script> |
|
|
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script> |
|
|
</head> |
|
|
<body> |
|
|
<div id="drawflow" style="width: 800px; height: 600px; border: 1px solid black;"></div> |
|
|
|
|
|
<script> |
|
|
const id = document.getElementById("drawflow"); |
|
|
const editor = new Drawflow(id); |
|
|
editor.start(); |
|
|
|
|
|
|
|
|
editor.addNode('StartCommand', 0, 1, 150, 300, 'telegram', { command: '/start', response: 'Привет! Я ваш бот.' }); |
|
|
editor.addNode('EchoCommand', 0, 1, 400, 300, 'telegram', { response: '{{message}}' }); |
|
|
|
|
|
|
|
|
function generateAndSendPythonCode() { |
|
|
const nodes = editor.getNodes(); |
|
|
let code = ''; |
|
|
|
|
|
nodes.forEach(node => { |
|
|
if (node.data.command) { |
|
|
code += `def ${node.data.command.slice(1)}(update: Update, context: CallbackContext) -> None:\n`; |
|
|
code += ` update.message.reply_text('${node.data.response}')\n`; |
|
|
code += `\n`; |
|
|
} else if (node.data.response) { |
|
|
code += `def echo(update: Update, context: CallbackContext) -> None:\n`; |
|
|
code += ` update.message.reply_text(update.message.text)\n`; |
|
|
code += `\n`; |
|
|
} |
|
|
}); |
|
|
|
|
|
axios.post('/execute', { command: '/start', code: code }) |
|
|
.then(response => { |
|
|
console.log(response.data); |
|
|
}) |
|
|
.catch(error => { |
|
|
console.error(error); |
|
|
}); |
|
|
} |
|
|
</script> |
|
|
</body> |
|
|
</html> |
