$(function () { $('#rdg-wizard-select-widget').select2({ width: "100%", cache: true, }); $('#rdg-wizard-select-widget').change(function () { hideAll(); $("#rdg-wizard-select-level-container").css("display", "none"); $("#rdg-wizard-select-level").val(0).change(); $("#rdg-wizard-select-sport-container").css("display", "none"); if ($(this).val() != "0") { $("#rdg-wizard-select-level-container").css("display", "block"); } }); $('#rdg-wizard-select-level').select2({ width: "100%", cache: true, }); $('#rdg-wizard-select-level').change(function () { hideAll(); if ($(this).val() == 4) { $("#rdg-wizard-select-sport-container").css("display", "block"); $("#rdg-wizard-select-league-container").css("display", "block"); } else if ($(this).val() == 0) { $("#rdg-wizard-select-widget-sport-container").css("display", "none"); } else { $('#rdg-wizard-select-widget-sport').empty(); $("#rdg-wizard-select-widget-sport-container").css("display", "block"); hideForm(); $('#rdg-wizard-select-widget-group').empty(); $("#rdg-wizard-select-widget-group-container").css("display", "none"); } }); $('#rdg-wizard-select-widget-sport').select2({ width: "100%", ajax: { url: 'https://widgets.sportshub.com/widget/widgetSports', type: "GET", data: function (params) { var data = { idWidget: $('#rdg-wizard-select-widget').val(), pattern: params.term, type: 'public' }; return data; }, processResults: function (result) { return { results: $.map(result, function (obj) { return { id: obj.IdWidgetSports, text: obj.Name }; }) }; }, cache: true, } }); $('#rdg-wizard-select-widget-sport').change(function () { $("#rdg-wizard-input-container").css("display", "block"); $("#rdg-wizard-input-days").css("display", "none"); if ($('#rdg-wizard-select-level').val() == 2) { specificSport($(this).val(), $("#rdg-wizard-select-widget").val()); } else { hideForm(); $('#rdg-wizard-select-widget-group').empty(); $("#rdg-wizard-select-widget-group-container").css("display", "block"); } }); $('#rdg-wizard-select-widget-group').select2({ width: "100%", ajax: { url: 'https://widgets.sportshub.com/widget/widgetGroups', type: "GET", data: function (params) { var data = { idWidgetSport: $('#rdg-wizard-select-widget-sport').val(), pattern: params.term, type: 'public' }; return data; }, processResults: function (result) { return { results: $.map(result, function (obj) { return { id: obj.IdWidgetGroup, text: obj.Name }; }) }; }, cache: true, } }); $('#rdg-wizard-select-widget-group').change(function () { $("#rdg-wizard-input-container").css("display", "block"); $("#rdg-wizard-input-days").css("display", "none"); if ($('#rdg-wizard-select-level').val() == 3) { groupOfLeagues($(this).val(), $('#rdg-wizard-select-widget-sport').val()); } }); $('#rdg-wizard-select-sport').select2({ width: "100%", ajax: { url: 'https://widgets.sportshub.com/wizard/sports', type: "GET", data: function (params) { var data = { pattern: params.term, type: 'public' }; return data; }, processResults: function (result) { return { results: $.map(result, function (obj) { return { id: obj.IdSport, text: obj.SportName }; }) }; }, cache: true, } }); $('#rdg-wizard-select-sport').change(function () { $("#rdg-wizard-input-container").css("display", "none"); $("#rdg-wizard-amount-of-days").val('3'); $("#rdg-wizard-show-more").prop('checked', false); $("#rdg-wizard-select-league-container").css("display", "block"); $("#rdg-wizard-select-league").empty(); $("#rdg-wizard-btn-generate").css("display", "none"); $("#rdg-wizard-btn-preview").css("display", "none"); $("#rdg-wizard-text-area-container").css("display", "none"); $('#rdg-wizard-select-league').select2({ width: "100%", ajax: { url: 'https://widgets.sportshub.com/wizard/sportLeagues', type: "GET", data: function (params) { var data = { idSport: $('#rdg-wizard-select-sport').val(), pattern: params.term, type: 'public' }; return data; }, processResults: function (result) { return { results: $.map(result, function (obj) { var nextGames = obj.NextDate == "No games soon" ? obj.NextDate : "Next date: " + obj.NextDate + ", games: " + obj.GamesCount; return { id: obj.IdLeague, text: obj.Description + " (" + nextGames + ")" }; }) }; }, cache: true, } }); }); $('#rdg-wizard-select-league').change(function () { $("#rdg-wizard-input-container").css("display", "block"); $("#rdg-wizard-input-days").css("display", "block"); if ($('#rdg-wizard-select-level').val() == 4) { specificLeague($(this).val()); } }); $("#rdg-wizard-preview-form").submit(function (event) { $("#RDGWizardHead").val($("#rdg-wizard-text-area-header").val()); $("#RDGWizardBody").val($("#rdg-wizard-text-area-script").val()); }); $("#rdg-wizard-text-area-header-btn").click(function () { copyToClipBoard($(this), $('#rdg-wizard-text-area-header')); }); $("#rdg-wizard-text-area-script-btn").click(function () { copyToClipBoard($(this), $('#rdg-wizard-text-area-script')); }); }); function copyToClipBoard(element, textArea) { textArea.focus(); textArea.select(); document.execCommand('copy'); element.animate({ opacity: 0 }, 300, function () { element.css({ opacity: 1 }); }); } function hideAll() { $("#rdg-wizard-select-league").empty(); $("#rdg-wizard-select-sport").empty(); $("#rdg-wizard-select-sport-container").css("display", "none"); $("#rdg-wizard-select-league-container").css("display", "none"); $("#rdg-wizard-amount-of-days").val(3); $("#rdg-wizard-preview-form").css("display", "none"); $("#rdg-wizard-select-widget-sport-container").css("display", "none"); $("#rdg-wizard-select-widget-group-container").css("display", "none"); $("#rdg-wizard-select-widget-league-container").css("display", "none"); $("#rdg-wizard-input-container").css("display", "none"); $("#rdg-wizard-text-area-container").css("display", "none"); $("#rdg-wizard-btn-generate").css("display", "none"); $("#rdg-wizard-btn-preview").css("display", "none"); $("#rdg-wizard-btn-preview").prop("disabled", true); } function cleanForm() { $("#rdg-wizard-btn-generate").css("display", "inline-block"); $("#rdg-wizard-text-area-container").css("display", "block"); $("#rdg-wizard-btn-preview").css("display", "block"); $("#rdg-wizard-preview-form").css("display", "inline-block"); $("#rdg-wizard-text-area-header").val(''); $("#rdg-wizard-text-area-script").val(''); $("#rdg-wizard-btn-preview").prop("disabled", true); } function hideForm() { $("#rdg-wizard-amount-of-days").val('3'); $("#rdg-wizard-show-more").prop('checked', false); $("#rdg-wizard-btn-generate").css("display", "none"); $("#rdg-wizard-text-area-container").css("display", "none"); $("#rdg-wizard-btn-preview").css("display", "none"); $("#rdg-wizard-preview-form").css("display", "none"); $("#rdg-wizard-text-area-header").val(''); $("#rdg-wizard-text-area-script").val(''); $("#rdg-wizard-btn-preview").prop("disabled", true); $("#rdg-wizard-input-container").css("display", "none"); } function allSports(idWidget) { cleanForm(); generateWidget("ShowRDGHome", { "IdWidget": idWidget }); } function specificSport(idWidgetSports, idWidget) { cleanForm(); generateWidget("ShowRDGSport", { "IdWidget": idWidget, "IdWidgetSports": idWidgetSports }); } function groupOfLeagues(idWidgetGroup, idWidgetSport) { cleanForm(); generateWidget("ShowRDGGroup", { "IdWidgetSport": idWidgetSport, "IdWidgetGroup": idWidgetGroup }); } function specificLeague(leagueId) { cleanForm(); generateWidget("ShowRDGLeague", { "IdLeague": leagueId }); } function generateWidget(method, json) { $("#rdg-wizard-btn-generate").click(function () { let timestamp = new Date().valueOf(); defaults = {}; if (method == "ShowRDGLeague") { defaults = $("#rdg-wizard-show-more").is(":checked") == true ? { "Container": `rdg-widget-${timestamp}`, "AmountOfDays": $("#rdg-wizard-amount-of-days").val(), "ShowMore": true } : { "Container": `rdg-widget-${timestamp}`, "AmountOfDays": $("#rdg-wizard-amount-of-days").val() }; } else { defaults = $("#rdg-wizard-show-more").is(":checked") == true ? { "Container": `rdg-widget-${timestamp}`, "ShowMore": true } : { "Container": `rdg-widget-${timestamp}`}; } let finalParams = Object.assign(defaults, json); $("#rdg-wizard-btn-preview").prop("disabled", false); $("#rdg-wizard-text-area-header").val(`<script src="https://widgets.sportshub.com/js/widget.js?v=${timestamp}"></script>`); $("#rdg-wizard-text-area-script").val(`<div id=rdg-widget-${timestamp}></div><script>${method}(${JSON.stringify(finalParams)});</script>`); }); }