Hello all,
Just a thought whilst walking to the shop.

I was going to approach this with JS only and load in a custom JS file, but I am unsure how to load a JS file on the content editor without an associated editor/property on the document type/content node to fire the AngularJS controller with the associated Dependencies on Umbraco's services.

Next thought is could I listen for a specific event that the Umbraco backoffice JS fires/emits and allows me to do something similar.

Anyway look forward to any thoughts/suggestions on how this could be approached, if at all.

Thanks,
Warren

I'm working on something similair, already am able to disable/hide properties. (now working on tabs)
Just some quick pointers that might help you while I complete my solution (which I'll share when complete :-) )

I'm using a big hack using CSS3 animations/keyframes to "emulate" DOMNodeInserted, which you can find here: http://www.backalleycoder.com/2012/04/25/i-want-a-damnodeinserted/
This will basicly fire a custom event when a DOM node is inserted (so we can hook intro Angular). I have "injected" this into the Backoffice as a simple Plugin which only adds some Javascript and CSS through package.manifest

On the server I have hooked in the Web API using DelegatingHandler, more information here: http://issues.umbraco.org/issue/U4-2670#comment=67-15418
I'm intercepting calls to /umbraco/backoffice/umbracoapi/content/getbyid and adding custom information in the Config property.

The "emulated" event then uses jQuery to do some DOM manipulation to "disable"/hide properties. Next stop will be tabs.

I'll try to post some code in the next couple of days.

Hope this helps!
Danny 

Hello,

I did something similar like what Danny said, but for the media picker start nodes which I mentioned in the last uHangout. If you want a full working example check the Hybrid Framework :-). https://github.com/jbreuer/Hybrid-Framework-for-Umbraco-v7-Best-Practises/blob/master/Umbraco.Extensions/Utilities/WebApiHandler.cs

Jeroen

I want to hide tabs too :-) Was just about to start a new thread then I saw this one.

This package seems to do what I would want: http://our.umbraco.org/projects/backoffice-extensions/attackmonkey-tab-hider

Seems pretty popular, does anyone know if this works with umbraco 7?

Hi Ayo,
I don't believe it is works with V7 but I would recommend trying to get in touch with Tim Payne aka @attackMonkey the developer to see if it is or not.

@Danny & @Jeroen thanks for the replies I will take a look into your suggestions.

Cheers,
Warren

Hi Warren

Have you figured out a workaround (even if its a hack) to simply disable a certain tab to a user/group?

I came across this post while wondering if there is a simple way to just hide a tab on v7.

Would appreciate if you can share your findings/progress so far.

cheers

Attack Monkey doesn't work for v7, as it relies on WebForms.

We created a tab hider via a hack, which is working fine for us, but it's not really extensible.  I'll need to research Jeroen's result to see if I can integrate this into our current solution to make it more extensible.

I'd be glad to build this functionality correctly, but haven't been able to get any good info from Core about how to integrate this (http://our.umbraco.org/forum/developers/extending-umbraco/53754-Extend-umbraco-backoffice-content-editor-and-disable-validation-hook-into-angular-controllers).

Anyhow, here's what we did:

1. umbraco/js/umbraco.controllers.js - created tab hider function which injects a tabVisible property (setHiderVisibleData)
2. umbraco/js/umbraco.controllers.js - call tab hider function
3. /umbraco/views/edit.html - minor code modifications to only show visible tabs

If anyone has good architecture suggestions for the questions posted here: http://our.umbraco.org/forum/developers/extending-umbraco/53754-Extend-umbraco-backoffice-content-editor-and-disable-validation-hook-into-angular-controllers, we'd be happy to review them and potentially implement an extensible package for this functionality. 

While I am too busy to actually complete my solution, I just wanted to share it with you guys anyway.
This solution allows you to hide tabs and properties, without breaking anything and without the need to modigy any core files :-)

I don't think it'll work on older browsers and have only tested myself in IE11 and the latest Chrome.
Please note that this is not a fool-proof solution as it is clientside only.

But perhaps some of you still find it useful in some scenarios.
Keep in mind that this is still a prototype.

The important part takes place in TabsAndPropertiesHiderApplication.cs in the FilterTabsAndProperties() method.
Currently, this prototype hides tabs and properties based on their aliases defined in hide-props.txt and hide-tabs.txt in App_Data.
Obviously you want to refactor that code to fit in your own logic, based on username/group/whatever.

You can find my prototype at https://dl.dropboxusercontent.com/u/23094523/TabsAndPropertiesHider.zip

Please give us any feedback so we can work together to get a good tabs/property hider package working! :-)

Thanks for posting this. It's exactly what I need for a new project I'm working on. H5YR

Jeroen

Thanks Danny for taking the time to share the complete solution. Im sure it will become handy for quick fixes when required.

I noticed it does have some bugs, I need to use it now for a project of my own as well.
Am fixing the bug and extending it so simple configuration can occur through an XML file.
Will post later this day! :-) 

Cool thanks!

I'll probably add it to the Hybrid Framework and will try to make it configurable through a custom table in the database. The same as Content Override that is used for the media picker start node.

Jeroen

Another tip. In your event you only use getbyid, but you should also use getempty. That way the code is also executed when you create a new node instead of only editing existing nodes.

Jeroen

Good thinking, thanks! :-) maybe we can team up on making it a package?

I'm also thinking about making the media picker start node a package. Only thing is that it also needs a UI to edit the database rows. Don't have time for that currently.

Jeroen

Same here for UI making, that's why - for myself - I am currently configuring through XML.

Just uploaded a quick update:

https://dl.dropboxusercontent.com/u/23094523/TabsAndPropertiesHide_v2.zip

Things that changed:

• Bug removed - when no properties from the first tab were hidden, tabs wouldn't get hidden
• TabsAndPropertiesHider.config added to /Config (you are able to use comma-delimited lists of UserTypes
• Just hides tabs and properties now in stead of showing a message that you can't edit them
• Also works for creating new items (thanks Jeroen!)

Edit: just found out it screws up some Contour related field. Will look at it tonight, but just so you know!

Edit: bug fixed, above link still applies!

As an FYI, we created a property hider that works great.  It overrides the GetById and GetEmpty calls and utilizes a pretty extensible xml config file for easy management.

We haven't extended this for tabs yet, but I'll try and upload the config files and config singleton later.

Hi Zac

Can you share the implementation on property hider?

It definitely compliments tab hiding as there are times one dont want to shop optional field X (instead of entire tab) to certain user/group;

group A: can see tab 1,2

groub B: cant see tab2, a (opt.) field in tab 1

Hi keilo,

My updated solution allows that through XML config, you can check the Dropbox link in the previous post.
You can hide properties and/or tabs for usertypes.

Zac, does your solution require modified files or not? If not, than your solution sounds great! 

Keilo, I'll try and post it soon.

Danny, my solution requires one modified line (not a ton of modifications like the previous hack).  This is because we need to support older browsers (IE9+) and we hadn't figured out a way to inject js changes without touching the angular view.  Does your solution work with older browsers?

I'll try and download your code and compare it with ours.  Ours has a lot of configuration options for property hiding too.  It allows properties to be hidden by doc type, user type, site id (multi site environments), etc.

Guys,

Further to this post, here is what I am looking to build.  I need to have a property editor with checkbox list (was going to do with prevalues but do not think that will work) when the user checks an item it will show a tab, user can select more than one checkbox.  So I guess I can use the code built by Jeroen, however in my property editor on check call api method eg "/umbraco/backoffice/umbracoapi/content/checkBoxChecked" then in webapi handler class do my show hide?  

Regards

Ismail

This is a very old post, but I was looking for a simple way to hide tabs in the UI purely with JS. I found a simple solution of my own, hijacking an existing angular directive (valTab) - angular will run both directives. I didn't need to use animation events, so this easily has full browser support. This hides a tab called "Internal" for any non-admin user:

angular.module('umbraco.directives')
.directive('valTab', ['userService', function (userService) {
  return {
    restrict: 'A',

    link: function (scope, element) {

      // Check the tab label - we only need to hide the internal tab
      if (scope.tab.label === 'Internal') {

        // Check if the user is an admin user - we only hide the tab for non admin users
        userService.getCurrentUser().then(function (user) {
          if (user.userType !== 'admin') {

            // Hide the tab
            element.hide();
          }
        });
      }
    }
  }
}]);

The best way i can find is to use a server side event.

protected override void ApplicationStarting(UmbracoApplicationBase umbracoApplication, ApplicationContext applicationContext)
{
EditorModelEventManager.SendingContentModel += EditorModelEventManager_SendingContentModel;
}

private void EditorModelEventManager_SendingContentModel(System.Web.Http.Filters.HttpActionExecutedContext sender, EditorModelEventArgs<global::Umbraco.Web.Models.ContentEditing.ContentItemDisplay> e)
        {
            e.Model.Tabs = e.Model.Tabs.Where(x => x.Alias.ToLowerInvariant() != "content".ToLowerInvariant()).ToList();
        }

No hacks or anything required

is working on a reply...