var kodShlasha = "שגיאה: לא הגיע קוד שלשה";
var kodIndex = 0;
var kod2Index = 0;
var kod3Index=0;
var subject1;
var subject2;
var subject3;

$(document).ready(function () {
	 subject1 = Wiz('subject1')
	 subject2 = Wiz('subject2')
	 subject3 = Wiz('subject3')

    subject1.on('change', subject1Function)

    subject2.disable()
    subject2.on('change', subject2Function)

    subject3.disable()
    subject3.on('change', subject3Function)
})

function subject1Function() {
    const subject1Value = subject1.getValue()

    var availableSubject2 = ''
    var availableSubject2Values = ''

    showAllDropDownValues('subject2');
    showAllDropDownValues('subject3');

    if (subject1Value != undefined) { // If user didnt chose "בחירה"
        availableSubject2 = shlashot.find(subject1Temp => subject1Temp.subject1Name === subject1Value);
        availableSubject2Values = availableSubject2.subject2.map(obj => obj.subject2Name);

        kodIndex = shlashot.findIndex((shlasha) => shlasha.subject1Name === subject1Value);
        kodShlasha = shlashot[kodIndex].subject2[0].subject3[0].kodShlasha;
        Wiz("ManagedList_Shlasha").setValue(kodShlasha);

        showDropDownValues(availableSubject2Values, 'subject2');
        subject2.enable()
        subject2.setValue('')
        if (availableSubject2Values[0] == "בחירה") {
            subject2.disable()
        }
    }
    else { 
        // If user chose "בחירה"
        subject2.disable()
        subject3.disable()
        subject2.setValue('')
        subject3.setValue('')
    }
}

function subject2Function() {
    const subject1Value = subject1.getValue()

    const availableSubject2 = shlashot.find(subject1Temp => subject1Temp.subject1Name === subject1Value);

    const subject2Value = subject2.getValue()

    // Set subject3 value to "בחירה"
    showAllDropDownValues('subject3');

    if (subject2Value != undefined) { // If user didn't chose "בחירה"
        const availableSubject3 = availableSubject2.subject2.find(subject2Temp => subject2Temp.subject2Name === subject2Value);
        const availableSubject3Values = availableSubject3.subject3.map(elem => elem.subject3Name);

        kod2Index = shlashot[kodIndex].subject2.findIndex((sub2Title) => sub2Title.subject2Name === subject2Value);
        kodShlasha = shlashot[kodIndex].subject2[kod2Index].subject3[0].kodShlasha;
        Wiz("ManagedList_Shlasha").setValue(kodShlasha);

        showDropDownValues(availableSubject3Values, 'subject3');
        subject3.enable()
        subject3.setValue('')
        if (availableSubject3Values[0] == "בחירה") {
            subject3.disable()
        }
    } else { // If user chose "בחירה"
        subject3.setValue('')
        subject3.disable()
    }
}

function subject3Function() {
    const subject1Value = subject1.getValue()

    const availableSubject2 = shlashot.find(subject1Temp => subject1Temp.subject1Name === subject1Value);

    const subject2Value = subject2.getValue()

    const subject3Value = subject3.getValue();

    if (subject3Value != undefined) { // If user didn't chose "בחירה"
        const availableSubject3 = availableSubject2.subject2.find(subject2Temp => subject2Temp.subject2Name === subject2Value);
        const availableSubject3Values = availableSubject3.subject3.map(elem => elem.subject3Name);

        kod3Index = shlashot[kodIndex].subject2[kod2Index].subject3.findIndex((sub3Title) => sub3Title.subject3Name === subject3Value);
        kodShlasha = shlashot[kodIndex].subject2[kod2Index].subject3[kod3Index].kodShlasha;
        Wiz("ManagedList_Shlasha").setValue(kodShlasha);
    }
}

function showDropDownValues(values, fieldid) {
    // Hides all dropdown options in values array [string] from being chosen
    const field = Wiz(fieldid)
    // const dropdownOptions = field.getOptions();
    var dropdownOptions = $(`[fieldid="${fieldid}"] .textSelect select option`).toArray() // Shift is to keep "בחירה" option
    dropdownOptions.shift()
    for (const option of dropdownOptions) {
        if (!values.includes(option.text)) {
            // Convert the visible option tag to div tag
            var divElem = $('<div>').text($(option).text()).addClass('hide-select-option');
            $(option).replaceWith(divElem);

            // $(option).css('display', 'none');
            // $(option).addClass("hidden");
        }
    }
}

function showAllDropDownValues(fieldid) {
    console.log(`showing all dropdown values of ${fieldid}`)
    // Shows all dropdown options (used to reset the options hidden after calling showAllDropDownValues() function)
    const field = Wiz(fieldid)
    // const dropdownOptions = field.getOptions();
    var dropdownOptions = $(`[fieldid="${fieldid}"] .textSelect select`).children().toArray() // Shift is to keep "בחירה" option

    for (const option of dropdownOptions) {
        // Convert the hidden div tag to options tag
        var optionElem = $('<option>').val($(option).text()).text($(option).text());
        $(option).replaceWith(optionElem);
    }
}

function disable(fieldid) {
    Wiz(fieldid).attr('disable', true)
}

function enable(fieldid) {
    Wiz(fieldid).attr('disable', false)
}