Timefox Selectize

timefoxselectize.user.js

// ==UserScript==
// @name         TimeFox Project Dropdown
// @version      0.2
// @author       Me
// @match        https://fox1.functionfox.com/timefox/*
// @grant        GM_addStyle
// @grant        GM_getResourceText
// @require      https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js
// @require      https://selectize.github.io/selectize.js/js/selectize.js
// @resource     selectizeCss https://brianreavis.github.io/selectize.js/css/selectize.default.css
// ==/UserScript==
/* jshint -W097 */
//'use strict';

// Add Selectize CSS
var newCSS = GM_getResourceText ("selectizeCss");
GM_addStyle (newCSS);

// Force selectize width
GM_addStyle (".selectize-control { width: 285px !important; }");

// Inject selectize
jQuery(document).ready(function()
{
    var fieldsToSelectize = [
        'select[name=pid]', // Personnel dropdown
        'select[name=cln_cd2]', // Client
        'select[name=job_cd2]', // Project
        'select[name=tsk_cd]', // Task
    ];

    // Inject default selectize
    jQuery(fieldsToSelectize.join(', ')).selectize();
    
    // Selectize in the future
    jQuery(document).on('change propertychange input', 'select', function()
    {
        console.log('selected named '+$(this).attr('name')+' changed');

        jQuery(fieldsToSelectize.join(', ')).selectize();
    });

    jQuery(document).bind('DOMAttrModified', function()
    {
        console.log('selected named '+$(this).attr('name')+' changed');
        jQuery(fieldsToSelectize.join(', ')).selectize();
    });

    jQuery(document).bind('DOMNodeInserted', function()
    {
        jQuery(fieldsToSelectize.join(', ')).selectize();
    });
});