(function ($) {
    /**
     * カテゴリセットの名前からカテゴリ一覧を取得する
     *
     * @param categorySetName
     * @returns {Promise<null|string|String|*|null>}
     */
    const getCategories = async (categorySetName) => {
        // 【注】Data API のパスは適宜変更してください。
        const response = await fetch(`/mt7/MT7/plugins/DataAPIProxy/dataapiproxy.cgi/v4/sites/${mtappVars.blog_id}/categorySets`);
        const data = await response.json();
        const items = data.items;
        const categorySet = items.find((item) => item.name === categorySetName);
        return categorySet ? categorySet.categories : null;
    };

    /**
     * カテゴリフィールドで選択されているカテゴリを取得する
     *
     * @param categories
     * @param field
     * @returns {*}
     */
    const getCheckedCategory = (categories, field) => {
        const fieldId = field.id;
        const $checkedField = $(`[name="content-field-${field.id}"]:checked`);
        if ($checkedField.length === 0) {
            return undefined;
        }
        const checkedCategoryId = parseInt($checkedField.val());
        return categories.find((category) => category.id === checkedCategoryId);
    };

    /**
     * アイテムのアップロード先を選択したカテゴリセットによって動的に変更する
     */
    (async function () {
        'use strict';

        // コンテンツデータ編集画面で実行
        if (mtappVars.screen_id !== 'edit-content-type-data') return;

        // 「お料理」コンテンツタイプで実行
        if (mtappVars.contentType.name === 'お料理') {
            mtapp.loadingImage('show');

            // お料理の種類カテゴリを取得
            const foodTypes = await getCategories('お料理の種類');
            mtapp.loadingImage('hide');

            // 「お料理の種類」カテゴリフィールドのフィールドIDと名前を取得
            const categoryField = mtappVars.contentDataFieldsArray.find((item) => item.name === 'お料理の種類');

            // 「画像」フィールドのフィールドIDと名前を取得
            const imageField = mtappVars.contentDataFieldsArray.find((item) => item.name === '画像');

            // 画像フィールドでアセットを選択する時の処理を追加
            const $imageFieldBlock = $(`#contentField${imageField.id}`);
            const $triggerLink = $imageFieldBlock.find('a[href*="__mode=list_asset"]');
            // リンクにマウスを乗せたときにアップロード先を決めるようにする
            $triggerLink.on('mouseenter', function (event) {
                const checkedCategory = getCheckedCategory(foodTypes, categoryField);

                // カテゴリが選択されていない場合は警告メッセージを出す
                if (checkedCategory) {
                    $(this).next('p.alert-danger').remove();
                } else {
                    if ($(this).next('p.alert-danger').length === 0) {
                        $(this).after(`<p class="alert alert-danger mt-3">${categoryField.name}を選択してください。</p>`);
                    }
                    return;
                }

                // アップロードリンクの href をセット
                let href = $(this).attr('href');
                href = href.replace(/&extra_path=[^&]*/gi, '');
                href += `&extra_path=food/${checkedCategory.basename}`;
                $(this).attr('href', href);
            });
        }
    })();
})(jQuery);

/**
 * アセットのダイアログ内で下記のコードを実行する
 */
(function ($) {
    if (!mtappVars.params.dialog) return;

    // extra_path を取得
    const extraPath = mtappVars.params.extra_path || '';
    if (extraPath) {
        $('#extra_path').val(extraPath);
    }
})(jQuery);