Free javascript Hosting


vqmm.js

Uploaded on Apr 17 2022 18:18 by namndwebdev

(function () {
var $,
ele,
container,
canvas,
num,
prizes,
btn,
deg = 0,
fnGetPrize,
fnGotBack,
optsPrize;

var cssPrefix,
eventPrefix,
vendors = {
"": "",
Webkit: "webkit",
Moz: "",
O: "o",
ms: "ms"
},
testEle = document.createElement("p"),
cssSupport = {};

Object.keys(vendors).some(function (vendor) {
if (
testEle.style[vendor + (vendor ? "T" : "t") + "ransitionProperty"] !==
undefined
) {
cssPrefix = vendor ? "-" + vendor.toLowerCase() + "-" : "";
eventPrefix = vendors[vendor];
return true;
}
});


function normalizeEvent(name) {
return eventPrefix ? eventPrefix + name : name.toLowerCase();
}


function normalizeCss(name) {
name = name.toLowerCase();
return cssPrefix ? cssPrefix + name : name;
}

cssSupport = {
cssPrefix: cssPrefix,
transform: normalizeCss("Transform"),
transitionEnd: normalizeEvent("TransitionEnd")
};

var transform = cssSupport.transform;
var transitionEnd = cssSupport.transitionEnd;

function init(opts) {
fnGetPrize = opts.getPrize;
fnGotBack = opts.gotBack;
opts.config(function (data) {
prizes = opts.prizes = data;
num = prizes.length;
draw(opts);
});
events();
}

$ = function (id) {
return document.getElementById(id);
};

function draw(opts) {
opts = opts || {};
if (!opts.id || num >>> 0 === 0) return;

var id = opts.id,
rotateDeg = 360 / num / 2 + 90,
ctx,
prizeItems = document.createElement("ul"),
turnNum = 1 / num,
html = [];

ele = $(id);
canvas = ele.querySelector(".hc-luckywheel-canvas");
container = ele.querySelector(".hc-luckywheel-container");
btn = ele.querySelector(".hc-luckywheel-btn");

if (!canvas.getContext) {
showMsg("Browser is not support");
return;
}

ctx = canvas.getContext("2d");

for (var i = 0; i < num; i++) {
ctx.save();
ctx.beginPath();
ctx.translate(250, 250);
ctx.moveTo(0, 0);
ctx.rotate((((360 / num) * i - rotateDeg) * Math.PI) / 180);
ctx.arc(0, 0, 250, 0, (2 * Math.PI) / num, false);
if (i % 2 == 0) {
ctx.fillStyle = "#ffb820";
} else {
ctx.fillStyle = "#ffcb3f";
}
ctx.fill();
ctx.lineWidth = 1;
ctx.strokeStyle = "#e4370e";
ctx.stroke();
ctx.restore();
var prizeList = opts.prizes;
html.push('<li class="hc-luckywheel-item"> <span style="');
html.push(transform + ": rotate(" + i * turnNum + 'turn)">');
if (opts.mode == "both") {
html.push("<p id='curve'>" + prizeList[i].text + "</p>");
html.push('<img src="' + prizeList[i].img + '" />');
} else if (prizeList[i].img) {
html.push('<img src="' + prizeList[i].img + '" />');
} else {
html.push('<p id="curve">' + prizeList[i].text + "</p>");
}
html.push("</span> </li>");
if (i + 1 === num) {
prizeItems.className = "hc-luckywheel-list";
container.appendChild(prizeItems);
prizeItems.innerHTML = html.join("");
}
}
}

function showMsg(msg) {
alert(msg);
}


function runRotate(deg) {

container.style[transform] = "rotate(" + deg + "deg)";
}


function events() {
bind(btn, "click", function () {

addClass(btn, "disabled");

fnGetPrize(function (data) {
if (data[0] == null && !data[1] == null) {
return;
}
optsPrize = {
prizeId: data[0],
chances: data[1]
};
deg = deg || 0;
deg = deg + (360 - (deg % 360)) + (360 * 10 - data[0] * (360 / num));
runRotate(deg);
});
bind(container, transitionEnd, eGot);
});
}

function eGot() {
if (optsPrize.chances == null) {
return fnGotBack(null);
} else {
removeClass(btn, "disabled");
return fnGotBack(prizes[optsPrize.prizeId].text);
}
}

function bind(ele, event, fn) {
if (typeof addEventListener === "function") {
ele.addEventListener(event, fn, false);
} else if (ele.attachEvent) {
ele.attachEvent("on" + event, fn);
}
}


function hasClass(ele, cls) {
if (!ele || !cls) return false;
if (ele.classList) {
return ele.classList.contains(cls);
} else {
return ele.className.match(new RegExp("(\\s|^)" + cls + "(\\s|$)"));
}
}

function addClass(ele, cls) {
if (ele.classList) {
ele.classList.add(cls);
} else {
if (!hasClass(ele, cls)) ele.className += "" + cls;
}
}

function removeClass(ele, cls) {
if (ele.classList) {
ele.classList.remove(cls);
} else {
ele.className = ele.className.replace(
new RegExp(
"(^|\\b)" + className.split(" ").join("|") + "(\\b|$)",
"gi"
),
" "
);
}
}

var hcLuckywheel = {
init: function (opts) {
return init(opts);
}
};

window.hcLuckywheel === undefined && (window.hcLuckywheel = hcLuckywheel);

if (typeof define == "function" && define.amd) {
define("HellCat-Luckywheel", [], function () {
return hcLuckywheel;
});
}
})();




var isPercentage = true;
var prizes = [
{
text: "Áo thun J2Team",
img: "images/Ao.png",
number: 1,
percentpage: 0.01
},
{
text: "Nón J2 Team",
img: "images/Non.png",
number: 1,
percentpage: 0.05
},
{
text: "Vòng Tay J2Team",
img: "images/Vong.png",
number: 1,
percentpage: 0.1
},
{
text: "J2Team Security",
img: "images/j2_logo.png",
number: 1,
percentpage: 0.24
},
{
text: "Chúc bạn may mắn lần sau",
img: "images/miss.png",
number: 2,
percentpage: 0.6
},
];
document.addEventListener(
"DOMContentLoaded",
function () {
hcLuckywheel.init({
id: "luckywheel",
config: function (callback) {
callback &&
callback(prizes);
},
mode: "both",
getPrize: function (callback) {
var rand = randomIndex(prizes);
var chances = rand;
callback && callback([rand, chances]);
},
gotBack: function (data) {
if (data == null) {
Swal.fire(
'Chương trình kết thúc',
'Đã hết phần thưởng',
'error'
)
} else if (data == 'Chúc bạn may mắn lần sau') {
Swal.fire(
'Bạn không trúng thưởng',
data,
'error'
)
} else {
Swal.fire(
'Đã trúng giải',
data,
'success'
)
}
}
});
},
false
);

function shuffleArr(array) {
let currentIndex = array.length, randomIndex;

while (currentIndex != 0) {

randomIndex = Math.floor(Math.random() * currentIndex);
currentIndex--;

[array[currentIndex], array[randomIndex]] = [
array[randomIndex], array[currentIndex]];
}

return array;
}
function get_random(list) {
return list[Math.floor((Math.random() * list.length))];
}

function randomIndex(prizes) {
if (isPercentage) {
var listRandom = []
var counter = 1;
for (let i = 0; i < prizes.length; i++) {
if (prizes[i].number == 0) {
counter++
}
}
if (counter == prizes.length) {
return null
}
let prizeIndex = null;
let rand = Math.random();
prizes.forEach((item, index) => {
let time = item.percentpage * 100
for (let o = 0; o < time; o++) {
listRandom.push(index)
}
});

shuffleArr(listRandom)
shuffleArr(listRandom)
prizeIndex = get_random(listRandom)

if (prizes[prizeIndex].number != 0) {
prizes[prizeIndex].number = prizes[prizeIndex].number - 1
return prizeIndex
} else {
return randomIndex(prizes)
}
}
}

Back to list