Tap any button below. Every notification is rendered by the Pulse SDK with one line of code.
Every input type works inside Pulse.form(). Tap to try each one.
<script src="https://pulsenotify.online/sdk/pulse.js"></script>
<script>
Pulse.init({
apiKey: "pn_your_api_key",
baseUrl: "https://pulsenotify.online/api/notify.php"
});
</script>
Pulse.success("Saved successfully!");
Pulse.error("Connection failed.");
Pulse.warning("License expires in 7 days.");
Pulse.info("Welcome back!");
// with custom title
Pulse.success("File uploaded.", { title: "Upload complete" });
// modal with OK button
Pulse.modal("success", "All done!");
Pulse.modal("error", "Something went wrong.");
// confirm (Yes / No) — returns true/false
const ok = await Pulse.confirm("Delete this record?");
if (ok) {
// user clicked Yes
}
// toast with image
Pulse.success("Your photo is live.", {
title: "Upload complete",
image: "https://yoursite.com/photo.jpg"
});
// modal with image
Pulse.modal("Thanks for joining!", {
type: "success",
title: "Welcome",
image: "https://yoursite.com/welcome.png"
});
// toast closes after 3s (with progress bar)
Pulse.info("Closing in 3 seconds", { timer: 3000 });
// hide the bar
Pulse.info("No bar", { timer: 3000, timerBar: false });
// modal auto-closes after 4s
Pulse.modal("Auto-closing", { type: "warning", timer: 4000 });
Pulse.modal("Hold the dots on top to move me.", {
type: "info",
title: "Drag me",
draggable: true
});
const l = Pulse.loading("Processing...");
// ...do your work...
l.close();
l.setText("Almost done...");
// single input
const name = await Pulse.prompt("What's your name?", {
title: "Enter name", placeholder: "Juan"
});
// password input (with show/hide toggle)
const pw = await Pulse.prompt("Enter password", { password: true });
// multi-field form — returns { field: value }
const r = await Pulse.form({
title: "Create account",
icon: "user",
okText: "Sign up",
fields: [
{ name: "name", type: "text", label: "Full name" },
{ name: "email", type: "email", label: "Email" },
{ name: "pass", type: "password", label: "Password" }
]
});
if (r) console.log(r.name, r.email, r.pass);
const r = await Pulse.form({
title: "All input types",
okText: "Submit",
fields: [
{ name: "name", type: "text", label: "Name" },
{ name: "email", type: "email", label: "Email" },
{ name: "site", type: "url", label: "Website" },
{ name: "pass", type: "password", label: "Password" },
{ name: "bio", type: "textarea", label: "Bio", rows: 3 },
{ name: "plan", type: "select", label: "Plan",
options: [
{ value: "monthly", label: "Monthly" },
{ value: "lifetime", label: "Lifetime" }
] },
{ name: "gender", type: "radio", label: "Gender",
options: ["Male", "Female"] },
{ name: "agree", type: "checkbox", checkboxLabel: "I agree" },
{ name: "bday", type: "date", label: "Birthday" },
{ name: "photo", type: "file", label: "Photo", accept: "image/*" },
{ name: "level", type: "range", label: "Level",
min: 1, max: 10, value: 5 }
]
});
// r = { name, email, site, pass, bio, plan, gender,
// agree:true/false, bday, photo:File, level }
console.log(r);
loginForm.addEventListener('submit', async function(e){
e.preventDefault();
// ask Yes/No first
const ok = await Pulse.confirm("Do you want to login now?");
if (!ok) return;
// show loading then submit
const l = Pulse.loading("Signing you in...");
setTimeout(() => { l.close(); loginForm.submit(); }, 600);
});
async function deleteItem(id){
const ok = await Pulse.confirm("Delete this permanently?");
if (!ok) return;
await fetch("/delete?id=" + id);
Pulse.success("Item deleted.");
}
Pulse.modal("Your order shipped!", {
type: "success",
title: "Order #1234",
image: "https://yoursite.com/box.png",
timer: 5000, // auto-close after 5s
draggable: true // and draggable
});