var OKAdmin = function(){
  
  // initialize our (single) ajax image uploader with an element and a template
  OKUpload.bind( document.getElementById("file") )
  OKUpload.add = function(data){
    var url = data[0].extra.Location
    add_image(url)
  }

  // also handle straight image urls
  $("#add-image-url").keydown(pressEnter(function(e){
    var url = $(this).val()
    $(this).val("")
    add_image(url)
  }))

  // clone and populate template
  function add_image(url){
    var imageTemplate = $("#captioned-image-template").html()
    var $el = $(imageTemplate)
    $el.find(".uri").val(url)
    $el.find("img").attr("src", url)
    $(".captioned-image-list ol").append($el)
  }

  // make the region sortable with drag-and-drop
  $(".captioned-image-list ol").sortable()
  $(".captioned-image-list ol").disableSelection()

  // delete image
  $(document).on("mousedown", ".remove-image", function(){
    if (confirm("Delete this image?")) {
      $(this).parent().remove()
    }
  })
  
  // populate a video field with info from our url parser
  var last_url
  $(".video .url").on("focus", function(){
    var $el = $(this)
    last_url = $el.val()
  })
  $(".video .url").on("keydown blur", pressEnter(function(){
    var $el = $(this)
    var url = $el.val()
    if (url == last_url) { return }
    Parser.parse( url, function(media){
      console.log(url,media)
      $el.parent().addClass("loaded")
      $el.parent().find(".video-type").val( media.type )
      $el.parent().find(".video-token").val( media.token )
      $el.parent().find(".video-title").val( media.title )
      $el.parent().find(".video-thumb").val( media.thumbnail )
    })
  }))
  
  // fix post indexing in list-driven inputs
  $(".main.resource form").submit(function(e){
    var $id = $("[name=id]"), $title = $("[name=title]"), $menu = $("[name=menu]"), $section = $(".resource.main")
    var id = $section.data("id"), type = $section.data("type")

    if ($title.length && ! $title.val()) {
      $title.focus()
      alert("Please enter a title")
      e.preventDefault()
      return
    }

    if ($menu.length && ! $menu.val()) {
      $menu.val( $title.val() )
    }

    // TODO: pass through whether this page is static
    if (type === "page" && (id == "contact" || id == "about")) {
      ;
    }
    else {
      var slug = slugify( $title.val() )
      $id.val( slug )
    }

    $(".image-element").each(function(index){
      $(this).find("input,textarea").each(function(){
        var field = $(this).attr("name").replace(/\[[0-9]*\]/, "[" + index + "]")
        $(this).attr("name", field)
      })
    })
  })
  
  $("#delete_form").submit(function(e){
  	if (confirm("Are you sure you want to delete this record?")) {
  		return
  	}
  	else {
  		e.preventDefault()
  	}
  })

  $(".resource-category").on("click", ".edit-btn", function(e) {
    e.preventDefault();
    var $parent = $(e.delegateTarget);
    var $editBtn = $parent.find(".edit-btn");
    var $cancelBtn = $parent.find(".cancel-btn");
    var $saveBtn = $parent.find(".save-btn");
    var $ol = $parent.find("ol");
    var toggles = [$parent, $cancelBtn, $saveBtn, $editBtn];

    $ol.sortable();
    $ol.disableSelection();
    toggle();

    $cancelBtn.one("click", function(e) {
      $ol.sortable("cancel");
      $ol.enableSelection();
      toggle();
    });

    $saveBtn.one("click", function(e) {
      $ol.sortable();
      toggle();
    });

    function toggle() {
      toggles.forEach(function($el) {
        $el.toggleClass('active');
      })
    }
  });

  $(".resource-category").on("submit", "form", function(e) {
    var $parent = $(e.delegateTarget);
    $parent.find(".resource-input").each(function(index) {
      var $input = $(this);
      var parsed = JSON.parse($input.val());
      parsed.__index = index;
      $input.val(JSON.stringify(parsed));
    })
  });
  
  function pressEnter(fn){
    return function(e){
      if (e.keyCode && e.keyCode !== 13) return
      e.preventDefault()
      console.log("hi")
      fn.apply(this)
    }
  }
}

$(function(){
  window.app = new OKAdmin ()
})


function slugify (s){ return (s || "").toLowerCase().replace(/\s/g,"-").replace(/[^-_a-zA-Z0-9]/g, '-').replace(/-+/g, "-") }