(function( $ ) {
    'use strict';

    /**
     * All of the code for your admin-facing JavaScript source
     * should reside in this file.
     *
     * Note: It has been assumed you will write jQuery code here, so the
     * $ function reference has been prepared for usage within the scope
     * of this function.
     *
     * This enables you to define handlers, for when the DOM is ready:
     *
     * $(function() {
     *
     * });
     *
     * When the window is loaded:
     *
     * $( window ).load(function() {
     *
     * });
     *
     * ...and/or other possibilities.
     *
     * Ideally, it is not considered best practise to attach more than a
     * single DOM-ready or window-load handler for a particular page.
     * Although scripts in the WordPress core, Plugins and Themes may be
     * practising this, we should strive to set a better example in our own work.
     */

    document.addEventListener('DOMContentLoaded', function() {

        // Type/Delay field controls
        var $type = document.getElementById( 'adunblocker-type' );

        if(elementExists($type)) {
            $type.addEventListener( "change", toggle_delay );
            toggle_delay();
        }

        // Color picker functionality
        $( '.adunblocker-color-picker' ).each( function() {

            var $this = $( this );
            var id = $this.attr( 'id' );
            $('#' + id).wpColorPicker();

        } );

    });


})( jQuery );

function toggle_delay() {

    var $type       = document.getElementById('adunblocker-type');
    var $delay      = document.getElementById('adunblocker-delay');
    var $tr         = $delay.parentNode.parentNode;

    if( $type.value != 'temp' ) {
        $tr.style.display = 'none';
    } else {
        $tr.style.display = 'table-row';
    }

}

function elementExists(element) {

    if (typeof(element) != 'undefined' && element != null) {
      return true;
    }

    return false;
}