custimizable TitleRenderer callback for tab titles

[PerBothner]

This implements a customization hook that allows an application to customize how tab titles are drawn. It is based on this comment. It provides part of the needed functionality for issue #736 - it allows customizing the title part of an individual tab, but does not provide any mechanism to further customize headers, (That is a problem for another day, and can build on this PR.)

The hook is a function that has type TitleRenderer and is registered by container.setTitleRenderer. As an example of how it is used in DomTerm:

r.setTitleRenderer((container, el, width, flags) => {
   if (wname &&
        ((flags & Tab.RenderFlags.InDropdownMenu) ||
         ! (flags & Tab.RenderFlags.DropdownActive))) {
        el.innerHTML =
            DomTerm.escapeText(title)+'<span class="domterm-windowname"> '+DomTerm.escapeText(wname)+'</span>';
    } else {
        el.innerText = title;
    }
});

The functions takes four argument:

• The container that corresponds to the Tab.
• The lm_title element to "paint". The function is responsible for reusing or removing existing children. This allows reuse of title components, which may sometimes be a worthwhile optimization. Existing children are automatically replaced by innerHTML or innerText, which is while the example doesn't do it explicitly.
• The available width for the title. This is a hint which the function can ignore, but in that case the caller can enforce it.
• A set of flags: DropdownActive if there is a drop-down menu in the header; InDropdownMenu if we're creating the drop-down menu; IsActiveTab if the tab is active.

This is working acceptably for me in DomTerm, but should be considered a work-in-process. Most specifically, the tryUpdateTabSizes function in tabs-container.ts needs some polishing. For example, if space is tight, we could and should remove the close button for inactive tabs. It also needs some work to truncate a tab title if necessary.

This builds on PR #737. I've made some progress some progress is using HTML drag-and-drop (issue #680): I can drag and sort-of-drop a component from one top-level window to another. However, I'd like to move forward on customizing titles so I don't have too many changes at once - but regardless using the draggable attribute seems a good step.

[PerBothner]

I checked in some polishing of the logic to layout tabs headers. I think it is pretty good now.

One new feature is "tight mode", indicated by adding lm_tight_mode to the lm_header. It is set when there isn't enough space in normal mode. Most significantly, it remove the close button from non-active tabs. It also reduces some padding. Further reductions could be done to tighten things up.

The overlap logic is enhanced. The active tab has highest z-index, and then drops off on either side. Overlap is added whenever the active tab is partially hidden. Very narrow windows degrade in a much nicer way.

[PerBothner]

I optimized updateTabSizes by wrapping it in a requestAnimationFrame.

[WillooWisp]

@PerBothner any news about this PR actually being merged and released?

[PerBothner]

@WillooWisp Sorry, none of the maintainers seem to have time for GoldenLayout.
You are of course free to use my fork. The d-n-d-api branch is what I'm using and maintaining. Expect some slight incompatibilies and some internal lack of polish: Given the lack of upstream activity, polishing hasn't been a priority; I've prioritized what I need for DomTerm. However, if you run into problems, let me know.