Making WordPress.org

Changeset 12511


Ignore:
Timestamp:
03/29/2023 02:13:09 PM (3 years ago)
Author:
amieiro
Message:

Translate: Add the backend items to support OpenAI and DeepL

Location:
sites/trunk/wordpress.org/public_html/wp-content/plugins/wporg-gp-customizations/templates
Files:
4 edited

Legend:

Unmodified
Added
Removed
  • sites/trunk/wordpress.org/public_html/wp-content/plugins/wporg-gp-customizations/templates/helper-functions.php

    r12406 r12511  
    3232        [ 'gp-editor', 'autosize' ],
    3333        filemtime( __DIR__ . '/js/editor.js' )
     34);
     35
     36wp_localize_script(
     37        'wporg-translate-editor',
     38        'wporgEditorSettings',
     39        array(
     40                'nonce' => wp_create_nonce( 'wporg-editor-settings' ),
     41        )
    3442);
    3543
  • sites/trunk/wordpress.org/public_html/wp-content/plugins/wporg-gp-customizations/templates/js/editor.js

    r11732 r12511  
    22        var $html = $( 'html' );
    33        var $document = $( document );
     4        var $openAITranslationsUsed = [];
     5        var $deeplTranslationsUsed = [];
    46
    57        function checkStorage() {
     
    6870
    6971                autosize( $textarea );
     72        }
     73
     74        /**
     75         * Adds the suggestion to the translation in an array, and removes the previous suggestions, so
     76         * we only store the last one in the database, using the saveExternalSuggestions() function.
     77         *
     78         * @return {void}
     79         */
     80        function addSuggestion() {
     81                var $row = $( this );
     82                var $originalId = $row.closest( 'tr' ).attr( 'id' ).substring( 7 );
     83                var $CSSclass = $row.attr( 'class' );
     84                if ( $CSSclass.indexOf( 'openai' ) > -1 ) {
     85                        $openAITranslationsUsed[ $originalId ] = $row.find( '.translation-suggestion__translation' ).text();
     86                        $deeplTranslationsUsed.splice( $originalId, 1 );
     87                } else if ( $CSSclass.indexOf( 'deepl' ) > -1 ) {
     88                        $deeplTranslationsUsed[ $originalId ] = $row.find( '.translation-suggestion__translation' ).text();
     89                        $openAITranslationsUsed.splice( $originalId, 1 );
     90                }
     91        }
     92
     93        /**
     94         * Saves the number of external suggestions used and used without modification.
     95         *
     96         * @return {void}
     97         **/
     98        function saveExternalSuggestions() {
     99                var $button = $( this );
     100                var $row = $button.closest( 'tr.editor' );
     101                var $originalId = $row.attr( 'id' ).substring( 7 );
     102                var $translation = $row.find( 'textarea' ).val();
     103                var $data = {
     104                        nonce: wporgEditorSettings.nonce,
     105                        translation: $translation,
     106                        openAITranslationsUsed: $openAITranslationsUsed[$originalId],
     107                        deeplTranslationsUsed: $deeplTranslationsUsed[$originalId]
     108                };
     109                $.ajax({
     110                        url: '/-save-external-suggestions',
     111                        type: 'POST',
     112                        data: $data,
     113                });
    70114        }
    71115
     
    277321                                .on( 'click', 'button.translation-actions__copy', $gp.editor.hooks.copy )
    278322                                .on( 'click', 'button.translation-actions__insert-tab', $gp.editor.hooks.tab )
     323                                .on( 'click', 'button.translation-actions__save', saveExternalSuggestions )
    279324                                .on( 'click', 'button.translation-actions__save', $gp.editor.hooks.ok )
    280325                                .on( 'click', 'button.translation-actions__help', openHelpModal )
     
    283328                                .on( 'focus', 'textarea', textareaAutosize )
    284329                                .on( 'click', 'summary', toggleDetails )
    285                                 .on( 'click', 'button.button-menu__toggle', toggleLinkMenu );
     330                                .on( 'click', 'button.button-menu__toggle', toggleLinkMenu )
     331                                .on( 'click', '.translation-suggestion.with-tooltip.openai', addSuggestion )
     332                                .on( 'click', '.translation-suggestion.with-tooltip.deepl', addSuggestion );
    286333                }
    287334        })( $gp.editor.install_hooks );
  • sites/trunk/wordpress.org/public_html/wp-content/plugins/wporg-gp-customizations/templates/settings-edit.php

    r11837 r12511  
    2323        );
    2424}
     25
     26$gp_external_translations = get_user_option( 'gp_external_translations' );
    2527?>
    2628
    2729<table class="form-table">
    2830        <tr>
    29                 <th><label for="per_page"><?php _e( 'Number of items per page:', 'glotpress' ); ?></label></th>
     31                <th><label for="per_page"><?php esc_html_e( 'Number of items per page:', 'glotpress' ); ?></label></th>
    3032                <td><input type="number" id="per_page" name="per_page" value="<?php echo esc_attr( $gp_per_page ); ?>"/></td>
    3133        </tr>
    3234        <tr>
    33                 <th><label for="default_sort[by]"><?php _e( 'Default Sort By:', 'glotpress' ); ?></label></th>
     35                <th><label for="default_sort[by]"><?php esc_html_e( 'Default Sort By:', 'glotpress' ); ?></label></th>
    3436                <td>
    3537                        <?php
     
    4143        </tr>
    4244        <tr>
    43                 <th><label for="default_sort[how]"><?php _e( 'Default Sort Order:', 'glotpress' ); ?></label></th>
     45                <th><label for="default_sort[how]"><?php esc_html_e( 'Default Sort Order:', 'glotpress' ); ?></label></th>
    4446                <td>
    4547                        <?php
     
    6163                 and I have to modify the GlotPress core to add a new configuration item. -->
    6264        <tr>
    63                 <th><label for="default_sort[notifications_optin]"><?php _e( 'I want to receive notifications of discussions:', 'glotpress' ); ?></label></th>
     65                <th><label for="default_sort[notifications_optin]"><?php esc_html_e( 'I want to receive notifications of discussions:', 'glotpress' ); ?></label></th>
    6466                <td><input type="checkbox" id="default_sort[notifications_optin]" name="default_sort[notifications_optin]" <?php gp_checked( 'on' == gp_array_get( $gp_default_sort, 'notifications_optin', 'off' ) ); ?> /></td>
    6567        </tr>
     68        <tr>
     69                <th>
     70                        <h4><?php esc_html_e( 'External translating services', 'glotpress' ); ?></h4>
     71                </th>
     72        </tr>
     73        <tr>
     74                <th><label for="default_sort[external_services_exclude_some_status]"><?php esc_html_e( 'Don\'t use OpenAI and DeepL with translations in current, rejected or old status.', 'glotpress' ); ?></label></th>
     75                <td><input type="checkbox" id="default_sort[external_services_exclude_some_status]" name="default_sort[external_services_exclude_some_status]" <?php gp_checked( 'on' == gp_array_get( $gp_default_sort, 'external_services_exclude_some_status', 'off' ) ); ?> /></td>
     76        </tr>
     77        <tr>
     78                <th>
     79                        <h4><?php esc_html_e( 'OpenAI (ChatGPT) settings', 'glotpress' ); ?></h4>
     80                </th>
     81        </tr>
     82        <tr>
     83                <th><label for="default_sort[openai_api_key]">
     84                                <?php esc_html_e( 'OpenAI API Key', 'glotpress' ); ?>
     85                        </label>
     86                                        <?php
     87                                        if ( gp_array_get( $gp_external_translations, 'openai_translations_used', 0 ) > 0 ) {
     88                                                echo '<br>';
     89                                                echo '<small>';
     90                                                /* translators: Number of OpenAI translations used. */
     91                                                echo esc_html( sprintf( _n( '%s OpenAI translation used:', '%s OpenAI translations used:', 'glotpress' ), number_format_i18n( gp_array_get( $gp_external_translations, 'openai_translations_used', 0 ) ) ) );
     92                                                if ( gp_array_get( $gp_external_translations, 'openai_same_translations_used', 0 ) > 0 ) {
     93                                                        echo ' ' . esc_html(
     94                                                                sprintf(
     95                                                                /* translators: 1: Number of OpenAI translations used with modifications. 2: Number of OpenAI translations used without modifications. */
     96                                                                        __( '%1$s with modifications and %2$s without modifications.', 'glotpress' ),
     97                                                                        number_format_i18n( gp_array_get( $gp_external_translations, 'openai_translations_used', 0 ) - gp_array_get( $gp_external_translations, 'openai_same_translations_used', 0 ) ),
     98                                                                        number_format_i18n( gp_array_get( $gp_external_translations, 'openai_same_translations_used', 0 ) ),
     99                                                                )
     100                                                        );
     101                                                }
     102                                                echo '</small>';
     103                                        }
     104                                        ?>
     105                                <br>
     106                                <a href="https://platform.openai.com/account/usage" target="_blank"><small>
     107                                        <?php
     108                                        $openai_tokens_used = gp_array_get( $gp_external_translations, 'openai_tokens_used', 0 );
     109                                        if ( $openai_tokens_used > 0 ) {
     110                                                /* translators: Number of OpenAI tokens used. */
     111                                                echo esc_html( sprintf( __( 'OpenAI tokens used: %s', 'glotpress' ), number_format_i18n( $openai_tokens_used ) ) );
     112                                        }
     113                                        ?>
     114                                </small></a>
     115                                <br>
     116                                <br>
     117                        </th>
     118                <td><input type="text" class="openai_api_key" id="default_sort[openai_api_key]" name="default_sort[openai_api_key]" value="<?php echo esc_html( gp_array_get( $gp_default_sort, 'openai_api_key', '' ) ); ?>" placeholder="Enter your OpenAI API key" /></td>
     119        </tr>
     120        <tr>
     121                <th><label for="default_sort[openai_custom_prompt]"><?php esc_html_e( 'Custom Prompt', 'glotpress' ); ?></label></th>
     122                <td><textarea class="openai_custom_prompt" id="default_sort[openai_custom_prompt]" name="default_sort[openai_custom_prompt]" placeholder="Enter your custom prompt for ChatGPT translation suggestions"><?php echo esc_html( gp_array_get( $gp_default_sort, 'openai_custom_prompt', '' ) ); ?></textarea></td>
     123        </tr>
     124        <tr>
     125                <th><label for="default_sort[openai_temperature]"><?php esc_html_e( 'Temperature', 'glotpress' ); ?></label></th>
     126                <td><input type="number" min="0" max="2" step=".1" class="openai_temperature" id="default_sort[openai_temperature]" name="default_sort[openai_temperature]" value="<?php echo esc_html( gp_array_get( $gp_default_sort, 'openai_temperature', 0 ) ); ?>" placeholder="Enter your OpenAI key" /></td>
     127        </tr>
     128        <tr>
     129                <th>
     130                        <h4><?php esc_html_e( 'DeepL settings', 'glotpress' ); ?></h4>
     131                </th>
     132        </tr>
     133        <tr>
     134                <th><label for="default_sort[deepl_api_key]">
     135                                <?php esc_html_e( 'DeepL Free API Key', 'glotpress' ); ?>
     136                        </label>
     137                                        <?php
     138                                        if ( gp_array_get( $gp_external_translations, 'deepl_translations_used', 0 ) > 0 ) {
     139                                                echo '<br>';
     140                                                echo '<small>';
     141                                                /* translators: Number of DeepL translations used. */
     142                                                echo esc_html( sprintf( _n( '%s DeepL translation used:', '%s DeepL translations used:', 'glotpress' ), number_format_i18n( gp_array_get( $gp_external_translations, 'deepl_translations_used', 0 ) ) ) );
     143                                                if ( gp_array_get( $gp_external_translations, 'deepl_same_translations_used', 0 ) > 0 ) {
     144                                                        echo ' ' . esc_html(
     145                                                                sprintf(
     146                                                                /* translators: 1: Number of DeepL translations used with modifications. 2: Number of DeepL translations used without modifications. */
     147                                                                        __( '%1$s with modifications and %2$s without modifications.', 'glotpress' ),
     148                                                                        number_format_i18n( gp_array_get( $gp_external_translations, 'deepl_translations_used', 0 ) - gp_array_get( $gp_external_translations, 'deepl_same_translations_used', 0 ) ),
     149                                                                        number_format_i18n( gp_array_get( $gp_external_translations, 'deepl_same_translations_used', 0 ) ),
     150                                                                )
     151                                                        );
     152                                                }
     153                                                echo '</small>';
     154                                        }
     155                                        ?>
     156                                <br>
     157                                <a href="https://www.deepl.com/account/usage" target="_blank"><small>
     158                                                <?php
     159                                                $deepl_chars_used = gp_array_get( $gp_external_translations, 'deepl_chars_used', 0 );
     160                                                if ( $deepl_chars_used > 0 ) {
     161                                                        /* translators: Number of chars translated with DeepL. */
     162                                                        echo esc_html( sprintf( __( 'Chars translated with DeepL: %s', 'glotpress' ), number_format_i18n( $deepl_chars_used ) ) );
     163                                                }
     164                                                ?>
     165                                        </small></a>
     166                        </th>
     167                <td><input type="text" class="deepl_api_key" id="default_sort[deepl_api_key]" name="default_sort[deepl_api_key]" value="<?php echo esc_html( gp_array_get( $gp_default_sort, 'deepl_api_key' ) ); ?>" placeholder="Enter your DeepL API key" /></td>
     168        </tr>
    66169</table>
  • sites/trunk/wordpress.org/public_html/wp-content/plugins/wporg-gp-customizations/templates/style.css

    r12451 r12511  
    153153        box-shadow: none;
    154154        background: var( --gp-color-btn-bg );
     155}
     156
     157.gp-content .openai_api_key, .gp-content .deepl_api_key {
     158        width: auto;
     159}
     160
     161.gp-content .openai_custom_prompt {
     162        width: auto;
     163        border: #7e7e7e thin solid !important;
     164        border-radius: 3px;
     165        height: 8rem;
     166}
     167
     168@media screen and (min-width: 750px) {
     169        .gp-content .openai_api_key, .gp-content .deepl_api_key  {
     170                width: 30rem;
     171        }
     172
     173        .gp-content .openai_custom_prompt {
     174                width: 30rem;
     175        }
    155176}
    156177
Note: See TracChangeset for help on using the changeset viewer.