Upgrade to keep using KANE and unlock all automation features
KANE
BETA
14 days left in trial
Automation Templates
Stripe Payments
Automate payment workflows
Calendly Scheduler
Automate appointment booking
Google Sheets
Sync data automatically
Make.com
Build complex workflows
Recent Automations
Stripe → Google Sheets
Sync new payments
Calendly → Slack
Notify team of new bookings
Form → Make.com
Process form submissions
Hello! I'm KANE, your AI automation assistant. I can help you set up automations between different platforms like Stripe, Google Sheets, Calendly, and more. What would you like to automate today?
KANE is an experimental AI tool available only to AiVoiceHub DIY template users
// ============= CONFIGURATION =============
// Replace this with your actual n8n webhook URL
const N8N_WEBHOOK_URL = 'https://wajeeh.app.n8n.cloud/webhook/kane';
// ============= N8N INTEGRATION =============
let isConnected = true;
let isProcessing = false;
// Function to update connection status
function updateConnectionStatus(connected) {
const statusIndicator = document.getElementById('statusIndicator');
const statusText = document.getElementById('statusText');
isConnected = connected;
if (connected) {
statusIndicator.className = 'status-indicator status-connected';
statusText.textContent = 'Connected to KANE';
} else {
statusIndicator.className = 'status-indicator status-disconnected';
statusText.textContent = 'Connection Lost';
}
}
// Function to send message to n8n
async function sendToN8n(message) {
try {
const response = await fetch(N8N_WEBHOOK_URL, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
message: message,
timestamp: new Date().toISOString(),
sessionId: getOrCreateSessionId()
})
});
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
const data = await response.json();
updateConnectionStatus(true);
// Expecting n8n to return { response: "AI response here" }
return data.response || "I received your message but couldn't generate a response.";
} catch (error) {
console.error('Error communicating with n8n:', error);
updateConnectionStatus(false);
// Fallback response when n8n is unavailable
return "I'm having trouble connecting to my automation brain right now. Please check that n8n is running and the webhook URL is correct.";
}
}
// Function to get or create session ID
function getOrCreateSessionId() {
let sessionId = sessionStorage.getItem('kane-session-id');
if (!sessionId) {
sessionId = 'kane-' + Date.now() + '-' + Math.random().toString(36).substr(2, 9);
sessionStorage.setItem('kane-session-id', sessionId);
}
return sessionId;
}
// Function to show typing indicator
function showTypingIndicator() {
const chatContainer = document.getElementById('chatContainer');
const typingIndicator = document.createElement('div');
typingIndicator.id = 'typingIndicator';
typingIndicator.className = 'chat-message-ai rounded-lg p-4 max-w-3xl mx-auto';
typingIndicator.innerHTML = `
KANE is thinking
`;
chatContainer.appendChild(typingIndicator);
chatContainer.scrollTop = chatContainer.scrollHeight;
}
// Function to remove typing indicator
function removeTypingIndicator() {
const typingIndicator = document.getElementById('typingIndicator');
if (typingIndicator) {
typingIndicator.remove();
}
}
// ============= CHAT HANDLING =============
// Handle chat form submission
document.getElementById('chatForm').addEventListener('submit', async function(e) {
e.preventDefault();
console.log('✅ Form submitted');
const input = document.getElementById('messageInput');
const message = input.value.trim();
const sendButton = document.getElementById('sendButton');
const sendButton = document.getElementById('sendButton');
if (message) {
isProcessing = true;
sendButton.disabled = true;
sendButton.style.opacity = '0.5';
// Add user message to chat
addMessageToChat(message, 'user');
input.value = '';
// Show typing indicator
showTypingIndicator();
try {
// Send to n8n and get response
const aiResponse = await sendToN8n(message);
// Remove typing indicator and show response
removeTypingIndicator();
addMessageToChat(aiResponse, 'ai');
} catch (error) {
console.error('Error processing message:', error);
removeTypingIndicator();
addMessageToChat('Sorry, I encountered an error processing your request. Please try again.', 'error');
}
isProcessing = false;
sendButton.disabled = false;
sendButton.style.opacity = '1';
}
});
function escapeHtml(text) {
const div = document.createElement('div');
div.textContent = text;
return div.innerHTML;
}
// Add message to chat container
function addMessageToChat(message, sender) {
const chatContainer = document.getElementById('chatContainer');
const messageDiv = document.createElement('div');
if (sender === 'user') {
messageDiv.className = 'chat-message-user rounded-lg p-4 max-w-3xl ml-auto';
messageDiv.innerHTML = `