alchemy-badge
Version:
AlchemyBadge is a customizable badge component for React that allows you to display information in a visually appealing manner. With Alchemy Badge, you can easily create badges with custom text, colors, and icons, making it perfect for displaying user inf
60 lines (59 loc) • 2.32 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
var ALCHEMY_ANALYTICS_URL = "https://analytics.alchemyapi.io/analytics";
var AlchemyBadge = /** @class */ (function () {
function AlchemyBadge(badgeId) {
var _this = this;
this._intervalId = null;
this._badgeId = '';
this._alchemyUrl = '';
this.logBadgeClick = function () {
var _a;
if (!_this._badgeId) {
throw 'BADGE_ID must be initialized before calling logBadgeClick';
}
fetch("".concat(ALCHEMY_ANALYTICS_URL, "/badge-click"), {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
badge_id: _this._badgeId
})
});
(_a = window.open(_this._alchemyUrl, '_blank')) === null || _a === void 0 ? void 0 : _a.focus();
};
this._badgeId = badgeId;
this._alchemyUrl = "https://alchemyapi.io/?r=badge:".concat(badgeId);
this._intersectionObserving();
}
AlchemyBadge.prototype._intersectionObserving = function () {
var _this = this;
this._intervalId = setInterval(function () {
var badge = document.getElementById('badge-button');
if (badge && _this._isBadgeInViewpoint(badge.getBoundingClientRect())) {
_this._logBadgeView();
clearInterval(_this._intervalId);
}
}, 2000);
};
AlchemyBadge.prototype._logBadgeView = function () {
fetch("".concat(ALCHEMY_ANALYTICS_URL, "/badge-view"), {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
badge_id: this._badgeId
})
});
};
AlchemyBadge.prototype._isBadgeInViewpoint = function (bounding) {
return (bounding.top >= 0
&& bounding.left >= 0
&& bounding.bottom <= (window.innerHeight || document.documentElement.clientHeight)
&& bounding.right <= (window.innerWidth || document.documentElement.clientWidth));
};
return AlchemyBadge;
}());
exports.default = AlchemyBadge;