{% if not included %}
{% extends 'index.html' %}
{% endif %}

{% set included = True %}

{% block content%}


<form data-name="{{name}}">
  <h4>{{name}}</h4>
  {% with show_controls=True %}
  {% include "defaults.html" %}
  {% endwith %}
  {% include "defaults-list.html" %}
  <button id="update-ob" class="col-2 me-2 btn btn-primary" type="submit" >Update</button>  
</form>

<script>
  
  $("[data-button='delete-template']").click(function(e){
      e.preventDefault()
      var id = $(this).data("instance")
      $("[data-instance='"+id+"']").fadeOut.remove()
  })
  
  $("#update-ob").click(function(e){
      e.preventDefault()
      var data = []
      
      $("fieldset").each(function(d,i){
          console.log(d)
          data.push({"template": $(this).data("template"),
                     "params" : serializeObject(this)
                    })
      });

      console.log(data)
      
      $.ajax({
          url: "/block/"+$("form").data("name"),
          type: 'PUT',
          data: JSON.stringify(data),
          contentType: "application/json",
      })
          .done(function(){
              console.log("ok")
              $("button").css("border","1px solid green")
            })
          .fail(function(){
              console.log("not ok")                    
                $("button").css("border","1px solid yellow")
          })
          .always(function(){
              console.log("Finished")                    
          })
      
  })
</script>


{% endblock content %}
