{% extends 'base.html.twig' %}
{% block title %}Rezerwacja domen{% endblock %}
{% block work_area %}
<form method="POST" action='javascript:checkDomainsAvailability ();' name='form' class="uk-width-expand">
<fieldset class="uk-fieldset uk-width-expand">
<legend class="uk-legend">Wyszukiwanie domen</legend>
<label class="uk-form-label">Wpisz domenę, jeśli jest ich kilka, rozdziel je spacjami:</label>
<div class="uk-margin" uk-margin>
<div class="uk-width-2-3" uk-form-custom>
<input class="uk-input" type="text" placeholder="nazwa domeny" name="domainName"/>
</div>
<button type="submit" class="uk-width-auto uk-button uk-button-primary"><span uk-icon="icon: search"></span> Sprawdź dostępność</button>
</div>
</fieldset>
</form>
<div id="spinner" class="uk-hidden">
<div uk-spinner></div> Sprawdzanie dostępności...
</div>
<div id="frmResult">
</div>
{% endblock %}
{% block javascripts %}
<script>
function checkDomainsAvailability() {
$("#spinner").removeClass("uk-hidden");
$("#frmResult").addClass("uk-hidden");
$.ajax({
type: "POST",
url: "{{ path ("hrd-get-domains-propositions") }}",
data: {
domainName: document.form.domainName.value
},
success: function (ans) {
if (ans.SUCCESS) {
$("#spinner").addClass("uk-hidden");
$("#frmResult").find("div").remove();
$("#frmResult").removeClass("uk-hidden");
var PIERWSZA = true;
var NDX = 1;
for (var GROUPINDEX in ans.GROUPS) {
var RESCARD = $("<div>").addClass("uk-card").addClass("uk-width-1");
var TITLE = $("<h3>").addClass("uk-card-title").html(ans.GROUPS [GROUPINDEX].GROUP);
if (!PIERWSZA) {
$(TITLE).css("cursor", "pointer").append(" ").append($("<h5>").css("display", "inline").html("(kliknij żeby zwinąć / rozwinąć)"));
}
var TABLE_PANEL = $("<div>").addClass("uk-card-body").attr("id", "panel-" + NDX);
if (!PIERWSZA) {
$(TABLE_PANEL).addClass("uk-hidden");
}
$(RESCARD).append(TITLE).append(TABLE_PANEL);
var TABLE = $("<table>").addClass("uk-table").addClass("uk-table-striped").addClass("uk-table-hover");
var TABLE_BODY = $("<tbody>");
for (var DI in ans.GROUPS [GROUPINDEX].DOMAINS) {
var ROW = $("<tr>");
$(ROW).append($("<td>").html(ans.GROUPS[GROUPINDEX].DOMAINS[DI]["DOMAIN"]));
if (ans.GROUPS[GROUPINDEX].DOMAINS[DI]["STATUS"] == "taken") {
$(ROW).append($("<td>").html("niedostępna").addClass("uk-text-danger"));
} else if (ans.GROUPS[GROUPINDEX].DOMAINS[DI]["STATUS"] == "available") {
$(ROW).append($("<td>").html("dostępna").addClass("uk-text-success"));
} else {
$(ROW).append($("<td>").html(ans.GROUPS[GROUPINDEX].DOMAINS[DI]["STATUS"]));
}
$(ROW).append($("<td>").html(ans.GROUPS[GROUPINDEX].DOMAINS[DI]["PRICE_STR"]));
var TDBUTTON = $("<td>");
if (ans.GROUPS[GROUPINDEX].DOMAINS[DI]["STATUS"] == "taken") {
$(TDBUTTON).html("-");
} else if (ans.GROUPS[GROUPINDEX].DOMAINS[DI]["STATUS"] == "available") {
var BTN = $("<button>").addClass("uk-button").addClass("uk-button-default");
if (ans.GROUPS[GROUPINDEX].DOMAINS[DI].CART) {
$(BTN).html("<span uk-icon='check'></span> wybrano");
$(BTN).attr("data-action", "REMOVE");
} else {
$(BTN).html("<span uk-icon='question'></span> wybierz");
$(BTN).attr("data-action", "ADD");
}
$(BTN).attr("data-domain", ans.GROUPS[GROUPINDEX].DOMAINS[DI]["DOMAIN"]);
$(BTN).attr("data-price", ans.GROUPS[GROUPINDEX].DOMAINS[DI]["PRICE"]);
$(BTN).attr("data-price-str", ans.GROUPS[GROUPINDEX].DOMAINS[DI]["PRICE_STR"]);
$(BTN).on("click", function () {
addRemove(this);
});
$(TDBUTTON).append(BTN);
}
$(ROW).append(TDBUTTON);
$(TABLE_BODY).append(ROW);
}
$(TABLE).append(TABLE_BODY);
$(TABLE_PANEL).append(TABLE);
$("#frmResult").append(RESCARD);
if (!PIERWSZA) {
$(TITLE).attr("data-target", "panel-" + NDX).on("click", function () {
$("#" + $(this).attr("data-target")).toggleClass("uk-hidden");
});
}
PIERWSZA = false;
NDX++;
}
} else {
alert("COŚ SIE POJEBAŁO: " + ans.MESSAGE);
}
console.log(ans);
},
error: function (ans) {
console.log("AJAX: \"{{ path ("hrd-get-domains-propositions") }}\": " + ans)
}
});
//alert (document.form.domainName.value);
}
function removeFromCart(domainName) {
var URL = "{{ path("app_cart_operation", {domainName: "DOMAIN_NAME"}) }}";
URL = URL.replace("DOMAIN_NAME", domainName);
$.ajax({
type: "GET",
url: URL,
data: {
domain: domainName
},
success: function (ans) {
$("#cartPreview").html(ans);
var BTN = $.find("button[data-domain='" + domainName + "']");
if (BTN.length == 1) {
$(BTN).attr("data-action", "ADD").html("<span uk-icon='question'></span> Wybierz");
}
},
error: function (ans) {
console.log(ans);
}
});
}
function addRemove(btn) {
var URL = "{{ path("app_cart_operation", {domainName: "DOMAIN_NAME"}) }}";
URL = URL.replace("DOMAIN_NAME", $(btn).attr("data-domain"));
$.ajax({
type: "GET",
url: URL,
data: {
domain: $(btn).attr("data-domain")
},
success: function (ans) {
$("#cartPreview").html(ans);
if ($(btn).attr("data-action") == "ADD") {
$(btn).attr("data-action", "REMOVE").html("<span uk-icon='check'></span> Wybrano");
} else {
$(btn).attr("data-action", "ADD").html("<span uk-icon='question'></span> Wybierz");
}
},
error: function (ans) {
console.log(ans);
}
});
}
</script>
{% endblock %}