Use unit field of UnitService directly to detect changes.

This makes for cleaner imports.

The dropListList generation is now done when things are changed via the 
section menu and no longer on element update via unit service.
Also remove some interfaces to avoid circular imports. The interfaces 
are so small and insignificant that their form might as well be 
specified at usage point.

No longer have unit as subject. Components can use the unit variable as 
is and still get updated.
This removes some listener stuff in conected components.

Was not correctly creating new instances of non-primitive values. Now
uses "JSON.parse(JSON.stringify(element))" for deep copying the element
first.

Also refactor by moving the method to the UnitService, where all ID
handling should take place.

No longer is a singleton but a normal servicce now again. The singleton 
logic was needed in the past but not anymore.

Now correctly sets the chosen background color and additionally sets 
another (configurable) color to the selected value.

The other  variants are basically the same as filled. The only
difference is the background color, which we are manilupating anyway.
So there is no reason to keep them.

Also for the background color directive different target elements are
needed for the different appearance variants. This is now possible.
As stylings of the old appearance are kept when changing the appearance
the styles need to be removed first.
In the moment the appearance value is changed the component is not
actually changed yet and there we need to wait for another Angular
change detection cycle, via timeout.

This allows to select elements without clicking them on the canvas, as 
elements may be obstructed or not visible for some reason.

The selection logic is a bit complicated because usually only the 
overlay components are usd for selection which are also the place to 
apply any highlighting on. Here we have to find the component element 
reference from the section. Therefore the double looping 
'getElementComponent' method.

Also when an elements is selected it briefly gets z-index 100 so it is 
moved to the front and visible and manipulatable.

Delete and duplicate buttons are no longer part of the tab view but are 
always visible below it.

Basically a div with border properties as usual.

Create object list, when none is existent yet. Otherwise append as 
before.

Use a copy of the original elements to avoid accidentally changing them.

The change of moving some properties to sub objects broke the creation 
of the combinedProperties object, which can't deal with nested objects. 
To circumvent that all elements are now flattened before being combined.
The connected property panels now again look for the properties on the 
element itself and not in sub-objects.

If the property is set, the video will be scaled as far as its
container (static element or grid) allows, otherwise only up to its
maximum native size.

If the property is set, the image will be scaled as far as its
container (static element or grid) allows, otherwise only up to its
maximum native size.

- Dnd values now have a special type that has an ID, a string and
  another string for an image path.
- A new dialog exists for editing thoe options. Similarly to the likert
  header.

- Fix the name to not have redundant 'component' suffix
- Move template to its own file

Broke during the refactoring of the element models. Now correctly uses 
the positionProps field.

Also improve variable naming.

The problem being solved is that compound-sub-elements must not have
all the properties other elements have. For exampe positioning info.
Sub-Elements are positioned inline. To avoid having similar class
inheritance structures for positioned and inline elements, we use
interface. Positioning is done via interface and is therefore optional.

Those optional properties are kept in an object in a variable. This
allows to hide specifics from element classes and removes the need to
initialize all the fields in every class using the interface.
The elements mostly care about their own specific properties anyway.

The same technique is used for font and surface elements. Here we also
don't want to initialize all the styles in every class.

Changing values of element properties works like before. Just set the
property as if it would be a direkt prop of the element. The element
itself puts the value in the currect sub-object (positioningProps,
fontProps etc).

For reading the values there is a similar method, but it is not used
anywhere by now. Since the properties panel operates on the raw values
anyway (refer CombinedProperties) and for element components this would
mean calling a function in the template, which caused change detection
to run the function very often and is therefore bad practice.

Additional notes and refactorings:
- Restructure all files in common. UIElements in the same folder etc.
- Move all interfaces to the UIElement file. This avoids circular
  imports, which would be needed to allow PositionedElement to extend
  UIElement.
- Interface initializers also handle reading values in the old form.
- Add PositionedElement for use in canvas overlays. This is a UIElement
  with guaranteed postionProps.
- Don't export all Material packages from common, only the ones
  used in player and editor. The rest is only used in common and
  does not need to be exported.

Highlighted (background colored) text is done with mark elements which
don't have a color and make the contained text lose the styling of the
parent span, which has the text-color property.
To solve it we simply inherit the color of the parent span.

Min-height should be optional for dynamically positioned elements, as 
you usually don't need it and it causes more problems than it solves. 
Elements with min-height have cause unexpected margins between elements.

No longer needs the appropriate section, but instead loops through all 
page sections. It was somewhat complicated to know the corresponding 
section and this solution solves that. Though at the price of some 
unnecessary element lookup.

Another upside is that elements from different sections can be deleted 
simultaneously.

This reverts commit c71cf1a2.

A new variable is introduced for CompoundComponents: 
"allowClickThrough". With this set components can set their children and 
overlays to allow clicking on child elements or not. In the editor this 
is not wanted as the elements internal structure is different and the 
resulting event target can not be reliably styled. There we need the 
(span) overlay.
In the player though elements should be clickable as usual. The player 
can completely ignore this setting as it is on true (allowing clicking) 
by default.

Need to bubble the event further up to where there is a section 
reference.

Was not correctly setting the pointer event for ClozeComponents.