All Downloads are FREE. Search and download functionalities are using the official Maven repository.

views.static.WebCmsModule.js.wcm-admin-text-components.js Maven / Gradle / Ivy

There is a newer version: 6.5.1
Show newest version
/*
 * Copyright 2017 the original author or authors
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Central registry for component profiles.
 * A profile is attached to a 'componentType' and has a unique name.
 * A profile is expected to be a JS object, usually a dictionary.
 *
 * It can optionally specify a '_parentProfile' holding the name of the parent
 * that should be merged into this profile.  Properties of the parent will be
 * overridden by the child.
 *
 * How a profile is used is entirely up to the actual component implementation,
 * this registry simply provides access to named configuration objects and the merging between parent-child.
 */
var WebCmsComponentProfileRegistry = (function ( $ ) {
    return {
        componentTypes: {},

        /**
         * Registers a new profile for a component type.
         *
         * @param componentType name of the component type
         * @param profileName name of the profile
         * @param profile dictionary object
         */
        registerProfileForComponentType: function ( componentType, profileName, profile ) {
            if ( !(componentType in this.componentTypes) ) {
                this.componentTypes[componentType] = {};
            }

            this.componentTypes[componentType][profileName] = profile;
        },

        /**
         * Get a named profile for a particular component type.
         *
         * @param componentType to get the profile for
         * @param profileName name of the profile
         * @param forTemplate true if no warnings should be logged (mainly for internal use)
         * @returns profile or null if none found
         */
        getProfile: function ( componentType, profileName, forTemplate ) {
            var actualProfileName = profileName ? profileName : 'default';

            var profiles = this.componentTypes[componentType];
            if ( profiles != null ) {
                var profile = profiles[actualProfileName];

                if ( profile != null ) {
                    if ( '_parentProfile' in profile ) {
                        var parentProfile = this.getProfile( componentType, profile['_parentProfile'], true );
                        if ( parentProfile != null ) {
                            var p = $.extend( {}, parentProfile );
                            p = $.extend( p, profile );
                            delete p['_parentProfile'];
                            return p;
                        }
                    }

                    var value = $.extend( {}, profile );
                    delete value['_parentProfile'];
                    return value;
                }
                else if ( !forTemplate ) {
                    console.warn( "No profile named '" + actualProfileName + "' for component type '" + componentType + "'" );
                }
            }
            else if ( !forTemplate ) {
                console.warn( "No profiles registered for component type '" + componentType + "'" );
            }

            return null;
        }

    };
})( jQuery );

(function ( $ ) {
    /**
     * Register base TinyMCE (rich-text) profile that configures technical settings.
     */
    WebCmsComponentProfileRegistry.registerProfileForComponentType( 'rich-text', '_base', {
        branding: false,
        relative_urls: false,
        remove_script_host: true,
        // todo: document_base_url: "http://localhost:8080",
        file_picker_types: 'image',
        file_picker_callback: function ( callback, value, meta ) {
            // Provide image and alt text for the image dialog
            if ( meta.filetype === 'image' ) {
                WebCmsModule.imageSelector( {
                                                outputBox: {width: 800, height: 800},
                                                callback: function ( image ) {
                                                    callback( image.url, {'data-wcm-object-id': image.imageId} );
                                                }
                                            } );
            }
        },
        content_css: [
            AcrossWebModule.staticPath + '/WebCmsModule/css/wcm-tinymce-content.css'
        ],
        setup: function ( theEditor ) {
            theEditor.on( 'focus', function () {
                $( this.contentAreaContainer.parentElement )
                        .toggleClass( 'wcm-mce-toolbar-hidden', false )
                        .find( "div.mce-toolbar-grp" ).unstick().sticky( {topSpacing: 60} );
            } );
            theEditor.on( 'blur', function ( e ) {
                theEditor.selection.collapse();
                var parent = $( this.contentAreaContainer.parentElement );
                setTimeout( function () {
                    parent.toggleClass( 'wcm-mce-toolbar-hidden', true );
                }, 250 );
            } );
            theEditor.on( "init", function () {
                $( this.contentAreaContainer.parentElement )
                        .toggleClass( 'wcm-mce-toolbar-hidden', true )
                        .find( "div.mce-toolbar-grp" ).unstick();
            } );

            theEditor.on( "change", function ( cm ) {
                $( this.contentAreaContainer.parentElement ).closest( 'form' ).data( 'changed', true );
            } );
        }
    } );

    /**
     * Register default profile for TinyMCE editors.
     */
    WebCmsComponentProfileRegistry.registerProfileForComponentType( 'rich-text', 'default', {
        _parentProfile: '_base',
        plugins: 'autoresize image contextmenu table hr pagebreak code codesample noneditable lists advlist link paste textcolor charmap anchor',
        toolbar1: 'undo redo | insert | styleselect | bold italic forecolor backcolor ' +
        '| outdent indent | bullist numlist table | link image codesample | pastetext',
        insert_button_items: 'image link inserttable | pagebreak hr anchor charmap',
        autoresize_bottom_margin: 0,
        statusbar: false,
        menubar: false,
        object_resizing: 'img',
        codesample_languages: [
            {text: 'C#', value: 'csharp'},
            {text: 'CSS', value: 'css'},
            {text: 'HTML/XML', value: 'markup'},
            {text: 'Java', value: 'java'},
            {text: 'JavaScript', value: 'javascript'},
            {text: 'JSON', value: 'json'},
            {text: 'PHP', value: 'php'},
            {text: 'Properties file', value: 'properties'},
            {text: 'Python', value: 'python'},
            {text: 'YAML', value: 'yaml'}
        ]
    } );

    /**
     * Basic rich-text profile is the same as default.
     */
    WebCmsComponentProfileRegistry.registerProfileForComponentType( 'rich-text', 'rich-text', {_parentProfile: 'default'} );

    /**
     * Register default markup profile.
     */
    WebCmsComponentProfileRegistry.registerProfileForComponentType( 'markup', 'default', {
        _parentProfile: '_base', lineNumbers: true, mode: 'htmlmixed', viewportMargin: Infinity
    } );

    /**
     * Initialize text components.
     * Uses the WebCmsComponentProfileRegistry where the value of 'data-wcm-markup-type' attribute is the component type.
     */
    EntityModule.registerInitializer( function ( node ) {
        $( '[data-wcm-markup-type=rich-text]', node ).each( function () {
            var id = '[id="' + $( this ).attr( 'id' ) + '"]';
            var profile = WebCmsComponentProfileRegistry.getProfile( 'rich-text', $( this ).data( 'wcm-profile' ) );
            profile['selector'] = id;

            tinymce.init( profile );
        } );

        $( '[data-wcm-markup-type=markup]', node ).each( function () {
            var profile = WebCmsComponentProfileRegistry.getProfile( 'markup', $( this ).data( 'wcm-profile' ) );
            var cm = CodeMirror.fromTextArea( $( this )[0], profile );

            cm.on( "change", function ( cm ) {
                $( cm.getTextArea().closest( 'form' ) ).data( 'changed', true );
            } );

            $( this ).on( 'wcm:componentRefresh',
                          function () {
                              cm.refresh();
                          } )
                    .attr( 'data-wcm-component-refresh', 'true' );

            if ( profile._configurationCallback ) {
                profile._configurationCallback( cm, $( this ) );
            }
        } );
    } );
})
( jQuery );




© 2015 - 2024 Weber Informatics LLC | Privacy Policy