BlindBox
🎉 Điền thông tin để tham gia mở quà 🎉
👉 Tham gia ngay
📜 Thể lệ chương trình:
✅ Chỉ áp dụng với khách hàng mua máy tại SoundHub .
✅ Mỗi khách hàng chỉ được mở một lần .
✅ Số điện thoại nhập phải trùng với
Số điện thoại bảo hành .
✅ Nếu trúng thưởng, hãy chụp màn hình và gửi vào
Zalo để nhận quà.
🚫 Hành vi gian lận sẽ bị cấm.
#blindbox-game {
font-family: Arial, sans-serif;
background: linear-gradient(135deg, #ffe0e0, #fff5f5);
padding: 20px;
text-align: center;
}
#blindbox-name {
font-size: 32px;
font-weight: bold;
color: #000;
margin-bottom: 10px;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
}
#blindbox-game h1 {
margin-bottom: 20px;
color: #b71c1c;
}
#blindbox-game form {
margin: 0 auto 20px auto;
max-width: 400px;
padding: 20px;
background: #fff;
border-radius: 10px;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
text-align: center;
}
#blindbox-game input {
padding: 10px 12px;
margin: 8px 0 2px 0;
border: 1px solid #ccc;
border-radius: 6px;
width: 100%;
box-sizing: border-box;
font-size: 14px;
}
#blindbox-game input:focus {
border-color: #d84315;
outline: none;
background-color: #fff;
}
.error-message {
font-size: 13px;
color: #d32f2f;
text-align: left;
margin-bottom: 8px;
min-height: 16px;
}
#blindbox-game button {
padding: 10px;
background: linear-gradient(145deg, #ff7675, #d63031);
border: none;
color: white;
font-weight: bold;
border-radius: 6px;
cursor: pointer;
margin-top: 10px;
width: 100%;
transition: background 0.3s;
}
#blindbox-game button:hover {
background: linear-gradient(145deg, #ff4757, #e84118);
}
#blindbox-game .gift-container {
display: grid;
grid-template-columns: repeat(6, minmax(50px, 90px));
gap: 12px;
justify-content: center;
margin: 20px auto;
}
#blindbox-game .gift-box {
width: 100%;
aspect-ratio: 1 / 1;
font-size: clamp(20px, 4vw, 45px);
cursor: pointer;
background: linear-gradient(145deg, #ff7675, #d63031);
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.25);
transition:
transform 0.3s ease,
box-shadow 0.3s ease;
}
#blindbox-game .gift-box:hover {
animation: shake 0.8s infinite;
box-shadow: 0 12px 20px rgba(0, 0, 0, 0.35);
}
@keyframes shake {
0% {
transform: rotate(0deg);
}
20% {
transform: rotate(-8deg);
}
40% {
transform: rotate(8deg);
}
60% {
transform: rotate(-5deg);
}
80% {
transform: rotate(5deg);
}
100% {
transform: rotate(0deg);
}
}
#blindbox-game .gift-box.opened {
animation: bounce 0.6s;
}
@keyframes bounce {
0%,
100% {
transform: scale(1);
}
30% {
transform: scale(1.2);
}
50% {
transform: scale(0.9);
}
70% {
transform: scale(1.1);
}
}
#blindbox-game .gift-opened {
font-size: 14px;
font-weight: bold;
color: #fff;
background: linear-gradient(145deg, #2ecc71, #27ae60);
border-radius: 8px;
padding: 6px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
animation: fadeIn 0.5s ease-in-out;
text-align: center;
}
@keyframes fadeIn {
from {
opacity: 0;
transform: scale(0.8);
}
to {
opacity: 1;
transform: scale(1);
}
}
#blindbox-rules {
margin: 20px auto 0 auto;
max-width: 600px;
background: #fff8e1;
border: 1px solid #ffe082;
border-radius: 8px;
padding: 15px 20px;
text-align: left;
font-size: 14px;
line-height: 1.6;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}
#blindbox-rules h3 {
margin-top: 0;
margin-bottom: 10px;
color: #d84315;
font-size: 16px;
text-align: center;
}
#blindbox-rules ul {
padding-left: 20px;
margin: 0;
}
#blindbox-rules li {
margin-bottom: 8px;
list-style: none;
}
#blindbox-popup {
display: none;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.6);
justify-content: center;
align-items: center;
z-index: 9999;
padding: 10px;
}
#blindbox-popup .popup-content {
background: #fff;
padding: 20px;
border-radius: 12px;
text-align: center;
max-width: 500px;
width: 90%;
animation: bounceIn 0.6s;
}
@keyframes bounceIn {
0% {
transform: scale(0.5);
opacity: 0;
}
60% {
transform: scale(1.2);
opacity: 1;
}
100% {
transform: scale(1);
}
}
#popup-message {
font-size: 18px;
line-height: 1.5;
word-wrap: break-word;
white-space: normal;
color: #27ae60;
}
#blindbox-popup button {
padding: 10px;
margin-top: 15px;
width: 100%;
background: #d84315;
border: none;
color: white;
border-radius: 6px;
cursor: pointer;
}
#blindbox-popup button:hover {
background: #b71c1c;
}
const container = document.getElementById(“giftContainer”);
const form = document.getElementById(“userForm”);
// ❌ Bỏ hẳn biến này vì không còn nhóm cao
// const highValueRate = 0.01;
function isValidEmail(email) {
const regex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
return regex.test(email);
}
function isValidPhone(phone) {
const regex = /^(0|\+84)(\d{9,10})$/;
return regex.test(phone);
}
if(localStorage.getItem(“played”)) {
form.style.display = “none”;
document.getElementById(“blindbox-title”).style.display = “none”;
container.style.display = “none”;
const resultDiv = document.createElement(“div”);
resultDiv.id = “played-message”;
resultDiv.style.fontSize = “18px”;
resultDiv.style.fontWeight = “bold”;
resultDiv.style.color = “#c62828”;
resultDiv.style.marginTop = “20px”;
const prizeWon = localStorage.getItem(“prizeWon”);
if (prizeWon) {
resultDiv.innerHTML = `⚠️ Bạn đã mở quà rồi!
Phần quà bạn nhận được:
${prizeWon} `;
} else {
resultDiv.textContent = “⚠️ Bạn đã mở quà rồi!”;
}
document.getElementById(“blindbox-game”).appendChild(resultDiv);
}
form.addEventListener(“submit”, function(e) {
e.preventDefault();
let hasError = false;
const name = document.getElementById(“name”).value.trim();
const email = document.getElementById(“email”).value.trim();
const phone = document.getElementById(“phone”).value.trim();
document.getElementById(“error-name”).textContent = “”;
document.getElementById(“error-email”).textContent = “”;
document.getElementById(“error-phone”).textContent = “”;
if (name === “”) {
document.getElementById(“error-name”).textContent = “⚠️ Vui lòng nhập họ và tên!”;
hasError = true;
}
if (!isValidEmail(email)) {
document.getElementById(“error-email”).textContent = “⚠️ Email không hợp lệ!”;
hasError = true;
}
if (!isValidPhone(phone)) {
document.getElementById(“error-phone”).textContent = “⚠️ Số điện thoại không hợp lệ! (Ví dụ: 0938317740 hoặc +84938317740)”;
hasError = true;
}
if (hasError) return;
localStorage.setItem(“userName”, name);
localStorage.setItem(“userEmail”, email);
localStorage.setItem(“userPhone”, phone);
form.style.display = “none”;
document.getElementById(“blindbox-title”).style.display = “none”;
container.style.display = “grid”;
createGiftBoxes();
});
function createGiftBoxes() {
for (let i = 1; i openGift(box);
container.appendChild(box);
}
}
function openGift(box) {
if (box.classList.contains(“opened”) || localStorage.getItem(“played”)) return;
let prizeWon = choosePrize();
box.innerHTML = `
${prizeWon}
`;
box.classList.add(“opened”);
localStorage.setItem(“played”, “true”);
localStorage.setItem(“prizeWon”, prizeWon);
fetch(“/wp-admin/admin-ajax.php”, {
method: “POST”,
headers: { “Content-Type”: “application/x-www-form-urlencoded” },
body: new URLSearchParams({
action: “send_gift_email”,
name: localStorage.getItem(“userName”),
email: localStorage.getItem(“userEmail”),
phone: localStorage.getItem(“userPhone”),
prize: prizeWon
})
});
launchConfetti();
showPopup(prizeWon);
}
// ✅ NEW: 200 – 60%, 300 – 15%, 400 – 15%, 500 – 10%
function choosePrize() {
const prizes = [
{ name: “🎁 Voucher 200K”, weight: 63 },
{ name: “🎁 Voucher 300K”, weight: 15 },
{ name: “🎁 Voucher 400K”, weight: 12 },
{ name: “🎁 Voucher 500K”, weight: 10 }
];
const total = prizes.reduce((sum, p) => sum + p.weight, 0); // = 100
let r = Math.random() * total;
let cumulative = 0;
for (const p of prizes) {
cumulative += p.weight;
if (r < cumulative) return p.name;
}
return "🎁 Voucher 200K"; // fallback
}
function launchConfetti() {
var duration = 2 * 1000;
var end = Date.now() + duration;
(function frame() {
confetti({ particleCount: 5, angle: 60, spread: 55, origin: { x: 0 } });
confetti({ particleCount: 5, angle: 120, spread: 55, origin: { x: 1 } });
if (Date.now() < end) requestAnimationFrame(frame);
})();
}
function showPopup(prize) {
const name = localStorage.getItem("userName") || "";
document.getElementById("popup-message").innerHTML =
`🎉 Chúc mừng
${name} !
Bạn nhận được:
${prize}
📸 Vui lòng chụp màn hình và gửi vào
Zalo
để nhận quà.
`;
document.getElementById(“blindbox-popup”).style.display = “flex”;
}
function closePopup() {
document.getElementById(“blindbox-popup”).style.display = “none”;
}
Wanneer consumenten een laptop kiezen, analyseren ze specificaties, staat van het apparaat en toekomstige prestaties. Dit proces lijkt op een strategische afweging waarbij inzicht en timing belangrijk zijn. Binnen een interactieve online omgeving toont https://qbetnederland.com/ hoe digitale platforms eveneens draaien om keuzes en ritme. Het laat zien hoe verschillende sectoren worden verbonden door dezelfde principes van afweging.
449B Bạch Đằng, Phường Gia Định, TP Hồ Chí Minh
Laptop
Âm thanh
Phụ kiện
Thu cũ
Hàng cũ
Tin công nghệ
Khuyến mại
Sửa chữa máy tính
Hàng đặt trước
Laptop
MacBook Air
MacBook Pro
Dell
HP
Microsoft Surface
Lenovo
ASUS
Âm Thanh
Phụ kiện
Tin công nghệ
Khuyến mại
Trang chủ
Danh mục
Tài khoản
Cửa hàng
Xem thêm