Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Jonathan L Folland 31 posts 173 karma points
    Aug 29, 2023 @ 18:44
    Jonathan L Folland
    0

    Add simple javascript to backend

    I would like to add a simple jquery to customize the backend. I have tried doing that with an app plugin. I have a manifest:

        {
      "name": "MyTweaks",
      "version": "1.0.0",
      "allowPackageTelemetry": true,
      "bundleOptions": "Default",
      "css": [
        "~/App_Plugins/tweaks/css/umbraco-tweaks.css"
      ],
      "js": [
        "~/App_Plugins/tweaks/js/umbraco-tweaks.js"
      ]
    }
    

    I see that the css file gets loaded, but the js file, which is a simple jquery block does not:

    $(document).on('DOMNodeInserted', function(e) {
        if ( $(e.target).is("div.tox-tinymce")) {
           var styleAttr = $(e.target).attr("style");
           if (styleAttr && styleAttr.indexOf("height: 300px;") >  0) { 
            var umbContainer = $(e.target).closest("div.umb-rte-editor-con");
            if (umbContainer){
                umbContainer.addClass("umb-rte-editor-con-rich-text-light");
            }
           }
        }
    });
    
    1. Is there something that needs to be done to get umbraco to include this file?
    2. Will umbraco not include a simple js file?
    3. Is there a cache that can be cleared and if so where?
    4. what options are available on the package manifest bundleOptions property?
  • Bo Jacobsen 605 posts 2403 karma points
    Aug 29, 2023 @ 21:43
    Bo Jacobsen
    1

    I am not quite sure if the backoffice actuelly loads jquery, so you could try use pure javascript.

    document.addEventListener('DOMNodeInserted', function(e) {
        if (e.target.matches("div.tox-tinymce")) {
            var styleAttr = e.target.getAttribute("style");
            if (styleAttr && styleAttr.indexOf("height: 300px;") > 0) {
                var umbContainer = e.target.closest("div.umb-rte-editor-con");
                if (umbContainer) {
                    umbContainer.classList.add("umb-rte-editor-con-rich-text-light");
                }
            }
        }
    });
    
  • Jonathan L Folland 31 posts 173 karma points
    Aug 30, 2023 @ 13:30
    Jonathan L Folland
    100

    It turned out to be the manifest. I compared to another. I was using:

    "js": [
        "~/App_Plugins/tweaks/js/umbraco-tweaks.js"
      ]
    

    instead of:

    "javascript": [
        "~/App_Plugins/tweaks/js/umbraco-tweaks.js"
      ]
    
Please Sign in or register to post replies

Write your reply to:

Draft