مدیاویکی:Gadget-ModernInfoboxForm-script-0.js

( function ( mw, $, OO ) {
    'use strict';

    console.log( 'ModernInfoboxForm: اسکریپت لود شد' );

    function ModernInfoboxForm() {
        ModernInfoboxForm.super.call( this );
        this.initUI();
    }
    OO.inheritClass( ModernInfoboxForm, OO.ui.PanelLayout );

    ModernInfoboxForm.prototype.initUI = function () {
        this.$element.addClass( 'modern-infobox-form' );
        this.$element.css( { 
            'padding': '20px', 
            'border': '1px solid #ccc', 
            'margin': '10px',
            'width': '100%',
            'max-width': '800px',
            'min-height': '400px',
            'overflow-y': 'auto'
        } );

        this.templateInput = new OO.ui.TextInputWidget( {
            placeholder: 'نام الگو را وارد کنید (مثلاً اینفوباکس مدرن)',
            dir: 'rtl'
        } );

        this.submitButton = new OO.ui.ButtonWidget( {
            label: 'ایجاد فرم',
            flags: [ 'primary', 'progressive' ]
        } );

        this.formContainer = new OO.ui.FieldsetLayout( {
            label: 'فرم پارامترها',
            dir: 'rtl'
        } );

        this.submitButton.on( 'click', this.onSubmit.bind( this ) );

        var inputContainer = new OO.ui.PanelLayout( { padded: false } );
        inputContainer.$element.append( this.templateInput.$element, this.submitButton.$element );

        this.$element.append( inputContainer.$element, this.formContainer.$element );
    };

    ModernInfoboxForm.prototype.onSubmit = function () {
        var templateName = this.templateInput.getValue().trim();
        if ( !templateName ) {
            OO.ui.alert( 'لطفاً نام الگو را وارد کنید!' );
            return;
        }
        this.fetchTemplateData( templateName );
    };

    ModernInfoboxForm.prototype.fetchTemplateData = function ( templateName ) {
        var self = this;
        var api = new mw.Api();
        var fullTemplateName = templateName.match( /^Template:/i ) ? templateName : 'Template:' + templateName;

        api.get( {
            action: 'templatedata',
            titles: fullTemplateName,
            format: 'json',
            formatversion: 2,
            redirects: true
        } ).done( function ( data ) {
            console.log( 'ModernInfoboxForm: پاسخ کامل API', JSON.stringify( data, null, 2 ) );
            if ( !data ) {
                OO.ui.alert( 'پاسخ API دریافت نشد!' );
                return;
            }
            var pages = data.pages;
            if ( !pages || Object.keys( pages ).length === 0 ) {
                OO.ui.alert( 'الگوی "' + fullTemplateName + '" یافت نشد یا TemplateData ندارد!' );
                return;
            }
            var firstPage = Object.values( pages )[0];
            if ( !firstPage || !firstPage.params ) {
                OO.ui.alert( 'TemplateData برای الگوی "' + fullTemplateName + '" شامل پارامترها نیست!' );
                return;
            }
            self.buildForm( firstPage.params, templateName );
        } ).fail( function ( error ) {
            console.error( 'ModernInfoboxForm: خطا در API', error );
            OO.ui.alert( 'خطا در دریافت اطلاعات الگو: ' + error );
        } );
    };

    ModernInfoboxForm.prototype.buildForm = function ( params, templateName ) {
        console.log( 'ModernInfoboxForm: ساخت فرم شروع شد', params );
        this.formContainer.clearItems();
        this.fields = {};
        this.dynamicCounters = {};

        Object.keys( params ).forEach( function ( paramName ) {
            var param = params[ paramName ];
            var field;

            if ( param.type === 'number' ) {
                field = new OO.ui.NumberInputWidget( { dir: 'rtl' } );
            } else if ( param.suggestedvalues && param.suggestedvalues.length > 0 ) {
                field = new OO.ui.DropdownInputWidget( {
                    options: param.suggestedvalues.map( function ( value ) {
                        return { data: value, label: value };
                    } ),
                    dir: 'rtl'
                } );
            } else if ( paramName === 'باز1' || paramName === 'باز2' ) {
                field = new OO.ui.DropdownInputWidget( {
                    options: [
                        { data: 'yes', label: 'بله' },
                        { data: 'no', label: 'خیر' }
                    ],
                    value: 'no', // مقدار پیش‌فرض
                    dir: 'rtl'
                } );
            } else {
                field = new OO.ui.TextInputWidget( { dir: 'rtl' } );
            }

            this.fields[ paramName ] = field;

            var fieldLayout = new OO.ui.FieldLayout( field, {
                label: param.label && param.label.fa ? param.label.fa : paramName,
                help: param.description && param.description.fa ? param.description.fa : '',
                align: 'right'
            } );

            this.formContainer.addItems( [ fieldLayout ] );
            console.log( 'ModernInfoboxForm: فیلد اضافه شد', paramName );
        }, this );

        this.addDynamicSectionControls( 'بخش1' );
        this.addDynamicSectionControls( 'بخش2' );

        var generateButton = new OO.ui.ButtonWidget( {
            label: 'تولید کد الگو',
            flags: [ 'primary', 'constructive' ]
        } );
        generateButton.on( 'click', this.generateTemplateCode.bind( this, templateName ) );

        this.formContainer.addItems( [ generateButton ] );
        console.log( 'ModernInfoboxForm: دکمه تولید کد اضافه شد' );
    };

    ModernInfoboxForm.prototype.addDynamicSectionControls = function ( sectionName ) {
        var self = this;
        this.dynamicCounters[ sectionName ] = 1;

        var addRowButton = new OO.ui.ButtonWidget( {
            label: 'اضافه کردن ردیف به ' + sectionName
        } );
        addRowButton.on( 'click', function () {
            self.addDynamicFields( sectionName, self.dynamicCounters[ sectionName ]++ );
        } );

        this.formContainer.addItems( [ addRowButton ] );
        console.log( 'ModernInfoboxForm: دکمه داینامیک اضافه شد', sectionName );
    };

    ModernInfoboxForm.prototype.addDynamicFields = function ( sectionName, index ) {
        var labelField = new OO.ui.TextInputWidget( { dir: 'rtl' } );
        var infoField = new OO.ui.TextInputWidget( { dir: 'rtl' } );
        var iconField = new OO.ui.TextInputWidget( { dir: 'rtl' } );

        var paramLabel = sectionName + '_برچسب' + index;
        var paramInfo = sectionName + '_اطلاعات' + index;
        var paramIcon = sectionName + '_آیکون' + index;

        this.fields[ paramLabel ] = labelField;
        this.fields[ paramInfo ] = infoField;
        this.fields[ paramIcon ] = iconField;

        var labelLayout = new OO.ui.FieldLayout( labelField, {
            label: 'برچسب ' + index + ' (' + sectionName + ')',
            align: 'right'
        } );
        var infoLayout = new OO.ui.FieldLayout( infoField, {
            label: 'اطلاعات ' + index + ' (' + sectionName + ')',
            align: 'right'
        } );
        var iconLayout = new OO.ui.FieldLayout( iconField, {
            label: 'آیکون ' + index + ' (' + sectionName + ') (اختیاری)',
            align: 'right'
        } );

        this.formContainer.addItems( [ labelLayout, infoLayout, iconLayout ] );
        console.log( 'ModernInfoboxForm: فیلدهای داینامیک اضافه شدند', sectionName + index );
    };

    ModernInfoboxForm.prototype.generateTemplateCode = function ( templateName ) {
        console.log( 'ModernInfoboxForm: شروع تولید کد الگو' );
        var code = '{{' + templateName + '\n';
        var self = this;

        Object.keys( this.fields ).forEach( function ( paramName ) {
            var field = self.fields[ paramName ];
            var value = '';

            if ( field && typeof field.getValue === 'function' ) {
                value = field.getValue();
                console.log( 'ModernInfoboxForm: مقدار فیلد', paramName, '=', value );
            } else {
                console.warn( 'ModernInfoboxForm: فیلد نامعتبر یا بدون getValue یافت شد:', paramName, field );
            }

            if ( value ) {
                code += '| ' + paramName + ' = ' + value + '\n';
            }
        } );

        code += '}}';
        console.log( 'ModernInfoboxForm: کد تولید شده:', code );

        // تست اولیه برای اطمینان از کار کردن OO.ui.alert
        try {
            OO.ui.alert( code, { size: 'large', dir: 'rtl' } ).done( function () {
                console.log( 'ModernInfoboxForm: پنجره کد با موفقیت نمایش داده شد' );
            } );
        } catch ( e ) {
            console.error( 'ModernInfoboxForm: خطا در نمایش OO.ui.alert:', e );
            // اگر OO.ui.alert کار نکرد، از alert معمولی استفاده می‌کنیم
            window.alert( code );
        }
    };

    function FormDialog() {
        FormDialog.super.call( this, { size: 'full' } );
    }
    OO.inheritClass( FormDialog, OO.ui.ProcessDialog );

    FormDialog.static.name = 'modernInfoboxFormDialog';
    FormDialog.static.title = 'فرم اینفوباکس مدرن';
    FormDialog.static.actions = [
        { action: 'close', label: 'بستن', flags: 'safe' }
    ];

    FormDialog.prototype.initialize = function () {
        FormDialog.super.prototype.initialize.call( this );
        var form = new ModernInfoboxForm();
        this.content = new OO.ui.PanelLayout( { padded: true, expanded: false } );
        this.content.$element.append( form.$element );
        this.$body.append( this.content.$element );
    };

    FormDialog.prototype.getActionProcess = function ( action ) {
        if ( action === 'close' ) {
            return new OO.ui.Process( function () {
                this.close();
            }, this );
        }
        return FormDialog.super.prototype.getActionProcess.call( this, action );
    };

    mw.hook( 'wikipage.content' ).add( function () {
        console.log( 'ModernInfoboxForm: آماده‌سازی لینک ابزار' );
        var $toolbox = $( '#p-tb .body ul' );
        var $link = $( '<li>' ).append(
            $( '<a>' )
                .attr( 'href', '#' )
                .text( 'فرم اینفوباکس مدرن' )
                .on( 'click', function ( e ) {
                    e.preventDefault();
                    console.log( 'ModernInfoboxForm: لینک کلیک شد' );
                    var windowManager = OO.ui.getWindowManager();
                    var dialog = new FormDialog();
                    windowManager.addWindows( [ dialog ] );
                    windowManager.openWindow( dialog );
                } )
        );

        if ( $toolbox.length > 0 ) {
            $toolbox.append( $link );
            console.log( 'ModernInfoboxForm: لینک به بخش ابزارها اضافه شد' );
        } else {
            console.warn( 'ModernInfoboxForm: بخش ابزارها (#p-tb) یافت نشد، لینک به بالای صفحه اضافه می‌شود' );
            $( '#mw-content-text' ).prepend( $link );
            console.log( 'ModernInfoboxForm: لینک به بالای صفحه اضافه شد' );
        }
    } );
}( mediaWiki, jQuery, OO ) );