$(document).ready(function() {

  function group_type_update() {
    var hosts_selectize = $("#hosts")[0].selectize;
    if( $("#type option:selected").text() == "STATIC" ) {
      hosts_selectize.enable();
    } else {
      hosts_selectize.clear();
      hosts_selectize.disable();
    }
  }

  // Disable or enable hosts on group type update
  $("#type").on('change', function() {
    group_type_update();
  });

  // Disable or enable hosts on page load depending on group type
  if( $("#groupForm").length || $("#editGroupForm").length ) {
    group_type_update();
  }

  if( $("#groupForm").length || $("#editGroupForm").length ) {
    var groupVarsEditor = CodeMirror.fromTextArea(vars, {
        lineNumbers: true,
        mode: "yaml"
    });
    groupVarsEditor.setSize(null, 120);
    var handle = cmResize(groupVarsEditor, {
      minHeight: 120,
      resizableWidth: false,
      resizableHeight: true,
    });
  }

  var groups_table =  $("#groups_table").DataTable({
    "ajax": function(data, callback, settings) {
      $.getJSON(
        $SCRIPT_ROOT + "/network/_retrieve_groups",
        function(json) {
          callback(json);
        });
    },
    "paging": false,
    "columns": [
      { data: 'name',
        render: function(data, type, row) {
          // render funtion to create link to group view page
          if ( data === null ) {
            return data;
          }
          var url = $SCRIPT_ROOT + "/network/groups/view/" + data;
          return '<a href="' + url + '">' + data + '</a>';
        }
      },
      { data: 'vars',
        render: function(data, type, row) {
          if ( data === null ) {
            return "";
          }
          return '<pre style="white-space: pre-wrap">' + JSON.stringify(data, null, 2) + '</pre>';
        }
      },
      { data: 'type' },
      { data: 'children' },
      { data: 'hosts' }
    ]
  });

});