templates/domainsSearch.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  2. {% block title %}Rezerwacja domen{% endblock %}
  3. {% block work_area %}
  4.     <form method="POST" action='javascript:checkDomainsAvailability ();' name='form' class="uk-width-expand">
  5.         <fieldset class="uk-fieldset uk-width-expand">
  6.             <legend class="uk-legend">Wyszukiwanie domen</legend>
  7.             <label class="uk-form-label">Wpisz domenę, jeśli jest ich kilka, rozdziel je spacjami:</label>
  8.             <div class="uk-margin" uk-margin>
  9.                 <div class="uk-width-2-3" uk-form-custom>
  10.                     <input class="uk-input" type="text" placeholder="nazwa domeny" name="domainName"/>
  11.                 </div>
  12.                 <button type="submit" class="uk-width-auto uk-button uk-button-primary"><span uk-icon="icon: search"></span> Sprawdź dostępność</button>
  13.             </div>
  14.         </fieldset>
  15.     </form>
  16.     <div id="spinner" class="uk-hidden">
  17.         <div uk-spinner></div> Sprawdzanie dostępności...
  18.     </div>
  19.     <div id="frmResult">
  20.     </div>
  21. {% endblock %}
  22. {% block javascripts %}
  23.     <script>
  24.         function checkDomainsAvailability() {
  25.             $("#spinner").removeClass("uk-hidden");
  26.             $("#frmResult").addClass("uk-hidden");
  27.             $.ajax({
  28.                 type: "POST",
  29.                 url: "{{ path ("hrd-get-domains-propositions") }}",
  30.                 data: {
  31.                     domainName: document.form.domainName.value
  32.                 },
  33.                 success: function (ans) {
  34.                     if (ans.SUCCESS) {                        
  35.                         $("#spinner").addClass("uk-hidden");
  36.                         $("#frmResult").find("div").remove();
  37.                         $("#frmResult").removeClass("uk-hidden");
  38.                         var PIERWSZA = true;
  39.                         var NDX = 1;
  40.                         for (var GROUPINDEX in ans.GROUPS) {
  41.                             var RESCARD = $("<div>").addClass("uk-card").addClass("uk-width-1");
  42.                             var TITLE = $("<h3>").addClass("uk-card-title").html(ans.GROUPS [GROUPINDEX].GROUP);
  43.                             if (!PIERWSZA) {
  44.                                 $(TITLE).css("cursor", "pointer").append("&nbsp;&nbsp;&nbsp;").append($("<h5>").css("display", "inline").html("(kliknij żeby zwinąć / rozwinąć)"));
  45.                             }
  46.                             var TABLE_PANEL = $("<div>").addClass("uk-card-body").attr("id", "panel-" + NDX);
  47.                             if (!PIERWSZA) {
  48.                                 $(TABLE_PANEL).addClass("uk-hidden");
  49.                             }
  50.                             $(RESCARD).append(TITLE).append(TABLE_PANEL);
  51.                             var TABLE = $("<table>").addClass("uk-table").addClass("uk-table-striped").addClass("uk-table-hover");
  52.                             var TABLE_BODY = $("<tbody>");
  53.                             for (var DI in ans.GROUPS [GROUPINDEX].DOMAINS) {
  54.                                 var ROW = $("<tr>");
  55.                                 $(ROW).append($("<td>").html(ans.GROUPS[GROUPINDEX].DOMAINS[DI]["DOMAIN"]));
  56.                                 if (ans.GROUPS[GROUPINDEX].DOMAINS[DI]["STATUS"] == "taken") {
  57.                                     $(ROW).append($("<td>").html("niedostępna").addClass("uk-text-danger"));
  58.                                 } else if (ans.GROUPS[GROUPINDEX].DOMAINS[DI]["STATUS"] == "available") {
  59.                                     $(ROW).append($("<td>").html("dostępna").addClass("uk-text-success"));
  60.                                 } else {
  61.                                     $(ROW).append($("<td>").html(ans.GROUPS[GROUPINDEX].DOMAINS[DI]["STATUS"]));
  62.                                 }
  63.                                 $(ROW).append($("<td>").html(ans.GROUPS[GROUPINDEX].DOMAINS[DI]["PRICE_STR"]));
  64.                                 var TDBUTTON = $("<td>");
  65.                                 if (ans.GROUPS[GROUPINDEX].DOMAINS[DI]["STATUS"] == "taken") {
  66.                                     $(TDBUTTON).html("-");
  67.                                 } else if (ans.GROUPS[GROUPINDEX].DOMAINS[DI]["STATUS"] == "available") {
  68.                                     var BTN = $("<button>").addClass("uk-button").addClass("uk-button-default");
  69.                                     if (ans.GROUPS[GROUPINDEX].DOMAINS[DI].CART) {
  70.                                         $(BTN).html("<span uk-icon='check'></span> wybrano");
  71.                                         $(BTN).attr("data-action", "REMOVE");
  72.                                     } else {
  73.                                         $(BTN).html("<span uk-icon='question'></span> wybierz");
  74.                                         $(BTN).attr("data-action", "ADD");
  75.                                     }
  76.                                     $(BTN).attr("data-domain", ans.GROUPS[GROUPINDEX].DOMAINS[DI]["DOMAIN"]);
  77.                                     $(BTN).attr("data-price", ans.GROUPS[GROUPINDEX].DOMAINS[DI]["PRICE"]);
  78.                                     $(BTN).attr("data-price-str", ans.GROUPS[GROUPINDEX].DOMAINS[DI]["PRICE_STR"]);
  79.                                     $(BTN).on("click", function () {
  80.                                         addRemove(this);
  81.                                     });
  82.                                     $(TDBUTTON).append(BTN);
  83.                                 }
  84.                                 $(ROW).append(TDBUTTON);
  85.                                 $(TABLE_BODY).append(ROW);
  86.                             }
  87.                             $(TABLE).append(TABLE_BODY);
  88.                             $(TABLE_PANEL).append(TABLE);
  89.                             $("#frmResult").append(RESCARD);
  90.                             if (!PIERWSZA) {
  91.                                 $(TITLE).attr("data-target", "panel-" + NDX).on("click", function () {
  92.                                     $("#" + $(this).attr("data-target")).toggleClass("uk-hidden");
  93.                                 });
  94.                             }
  95.                             PIERWSZA = false;
  96.                             NDX++;
  97.                         }
  98.                     } else {
  99.                         alert("COŚ SIE POJEBAŁO: " + ans.MESSAGE);
  100.                     }
  101.                     console.log(ans);
  102.                 },
  103.                 error: function (ans) {
  104.                     console.log("AJAX: \"{{ path ("hrd-get-domains-propositions") }}\": " + ans)
  105.                 }
  106.             });
  107.             //alert (document.form.domainName.value);
  108.         }
  109.         function removeFromCart(domainName) {
  110.             var URL = "{{ path("app_cart_operation", {domainName: "DOMAIN_NAME"}) }}";
  111.             URL = URL.replace("DOMAIN_NAME", domainName);
  112.             $.ajax({
  113.                 type: "GET",
  114.                 url: URL,
  115.                 data: {
  116.                     domain: domainName
  117.                 },
  118.                 success: function (ans) {
  119.                     $("#cartPreview").html(ans);
  120.                     var BTN = $.find("button[data-domain='" + domainName + "']");
  121.                     if (BTN.length == 1) {
  122.                         $(BTN).attr("data-action", "ADD").html("<span uk-icon='question'></span> Wybierz");
  123.                     }
  124.                 },
  125.                 error: function (ans) {
  126.                     console.log(ans);
  127.                 }
  128.             });
  129.         }
  130.         function addRemove(btn) {
  131.             var URL = "{{ path("app_cart_operation", {domainName: "DOMAIN_NAME"}) }}";
  132.             URL = URL.replace("DOMAIN_NAME", $(btn).attr("data-domain"));
  133.             $.ajax({
  134.                 type: "GET",
  135.                 url: URL,
  136.                 data: {
  137.                     domain: $(btn).attr("data-domain")
  138.                 },
  139.                 success: function (ans) {
  140.                     $("#cartPreview").html(ans);
  141.                     if ($(btn).attr("data-action") == "ADD") {
  142.                         $(btn).attr("data-action", "REMOVE").html("<span uk-icon='check'></span> Wybrano");
  143.                     } else {
  144.                         $(btn).attr("data-action", "ADD").html("<span uk-icon='question'></span> Wybierz");
  145.                     }
  146.                 },
  147.                 error: function (ans) {
  148.                     console.log(ans);
  149.                 }
  150.             });
  151.         }
  152.     </script>
  153. {% endblock %}