November Happy Hour will be moved to Thursday December 5th.

Restrict access to table properties option in the TinyMCE Table plugin

Vote:
 

Hi all,

Is there a way to restrict access to a specific option in the TinyMCE table plugin menubar.

In reading the TinyMCE documentation (https://www.tiny.cloud/docs/plugins/table/#table_toolbar, https://www.tiny.cloud/docs/configure/editor-appearance/#menu), it should be possible, but I can't figure out how to make it work with the Episerver configuration initialization. 

Thanks,

Joe Mayberry

#205980
Jul 30, 2019 16:38
Vote:
 

Update:

I wasn't able to find a way to  remove the table properties option in the menu bar. However, I was able to hide most of the options in the table properties using the table_ settings in the config initialization, then enabling them if the user is in a specific set of roles. Not a perfect solution, but one that looks like it will work.


TinyMCEInitialization.cs

using System.Collections.Generic;
using EPiServer.Cms.TinyMce.Core;
using EPiServer.Framework;
using EPiServer.Framework.Initialization;
using EPiServer.ServiceLocation;

namespace Website.Business.Initialization
{
    [ModuleDependency(typeof(TinyMceInitialization))]
    public class ExtendedTinyMceInitialization : IConfigurableModule
    {
        public void Initialize(InitializationEngine context)
        {
        }

        public void Uninitialize(InitializationEngine context)
        {
        }

        public void ConfigureContainer(ServiceConfigurationContext context)
        {

            var customSettings = new Dictionary<string, object>
            {
                {
                    "extended_valid_elements",
                    "section[*],&[*],i[*],div[*],a[*],span[*],script[*],style[*],iframe[*],container[*], h3[*]"
                },
                {
                    "valid_children",
                    "+a[img|h1|h2|h3|h4|h5|h6|p|span|div|i|noscript], +span[a|h1|h2|h3|h4|h5|h6|p|span|i|div|noscript], +div[a|h1|h2|h3|h4|h5|h6|p|span|i|div|noscript]"
                }
            };

            context.Services.Configure<TinyMceConfiguration>(config =>
            {
                config.Default()
                    .Menubar("file edit insert view format tools")
                    .DisableMenubar()
                    .AddEpiserverSupport()
                    .AddPlugin("epi-link epi-image-editor epi-dnd-processor epi-personalized-content epi-image-tools print preview searchreplace autolink directionality visualblocks visualchars fullscreen image link media template code charmap hr pagebreak nonbreaking anchor toc insertdatetime advlist lists textcolor wordcount imagetools contextmenu colorpicker textpattern help anchor")
                    .Toolbar("styleselect formatselect | bold italic | cut copy paste pastetext removeformat | epi-personalized-content | fullscreen",
                        "bullist numlist outdent indent | alignleft aligncenter alignright | table | epi-image-editor epi-image-tools image media epi-link unlink anchor | epi-dnd-processor")
                    .RawSettings(customSettings)
                    .ContentCss("/Static/Assets/css/editor.css")
                    .AddSetting("invalid_styles", new { td = "width height", tr = "width height", th = "width height", table = "height" })
                    .AddSetting("table_default_attributes", new { border = 0 })
                    .AddSetting("table_default_styles", new { borderCollapse = "inherit", width = "100%" })
                    .AddSetting("image_title", true)
                    .AppendToolbar("table")
                    .AddSetting("table_appearance_options", false)
                    .AddSetting("table_advtab", false)
                    .AddSetting("table_row_advtab", false)
                    .AddSetting("table_cell_advtab", false)
                    .AddSetting("table_resize_bars", false);
                   
            });
        }
    }
}

EditorDescriptor.cs (role check)

using System;
using System.Collections;
using System.Collections.Generic;
using System.Linq;
using EPiServer.Core;
using EPiServer.Shell.ObjectEditing.EditorDescriptors;

namespace Website.Business.EditorDescriptors
{
    [EditorDescriptorRegistration(TargetType = typeof(XhtmlString), EditorDescriptorBehavior = EditorDescriptorBehavior.PlaceLast)]
    public class CustomXhtmlStringEditorDescriptor : EditorDescriptor
    {
        public override void ModifyMetadata(EPiServer.Shell.ObjectEditing.ExtendedMetadata metadata,
            IEnumerable<Attribute> attributes)
        {
            var userInRole = PageUtilities.IsInValidRole;

            if (userInRole)
            {
                var settings = metadata.EditorConfiguration["settings"] as Dictionary<string, object>;
                if (settings != null)
                {
                    var toolbarList = ((IEnumerable)settings["toolbar"]).Cast<string>().ToList();
                    if (toolbarList.Count > 1)
                        toolbarList[1] = toolbarList[1] + " | code";
                    settings["toolbar"] = toolbarList;

                    // Table properties
                    settings["table_appearance_options"] = true;
                    settings["table_advtab"] = true;
                    settings["table_row_advtab"] = true;
                    settings["table_cell_advtab"] = true;
                    settings["table_resize_bars"] = true;

                }
            }
        }
    }
}

#206057
Aug 01, 2019 14:59
This topic was created over six months ago and has been resolved. If you have a similar question, please create a new topic and refer to this one.
* You are NOT allowed to include any hyperlinks in the post because your account hasn't associated to your company. User profile should be updated.