Refactor element class and interface structure
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.
Showing
- projects/common/component-utils.ts 0 additions, 44 deletionsprojects/common/component-utils.ts
- projects/common/components/control-bar/control-bar.component.css 0 additions, 0 deletions...s/common/components/control-bar/control-bar.component.css
- projects/common/components/control-bar/control-bar.component.html 18 additions, 19 deletions.../common/components/control-bar/control-bar.component.html
- projects/common/components/control-bar/control-bar.component.ts 22 additions, 21 deletions...ts/common/components/control-bar/control-bar.component.ts
- projects/common/components/control-bar/player-time-format.pipe.ts 0 additions, 0 deletions.../common/components/control-bar/player-time-format.pipe.ts
- projects/common/directives/compound-element.directive.ts 2 additions, 2 deletionsprojects/common/directives/compound-element.directive.ts
- projects/common/directives/element-component.directive.ts 1 addition, 1 deletionprojects/common/directives/element-component.directive.ts
- projects/common/directives/form-element-component.directive.ts 1 addition, 1 deletion...cts/common/directives/form-element-component.directive.ts
- projects/common/directives/input-background-color.directive.ts 0 additions, 0 deletions...cts/common/directives/input-background-color.directive.ts
- projects/common/directives/media-player-element-component.directive.ts 1 addition, 1 deletion...on/directives/media-player-element-component.directive.ts
- projects/common/interfaces/UIElementInterfaces.ts 0 additions, 56 deletionsprojects/common/interfaces/UIElementInterfaces.ts
- projects/common/models/audio-element.ts 0 additions, 37 deletionsprojects/common/models/audio-element.ts
- projects/common/models/button-element.ts 0 additions, 27 deletionsprojects/common/models/button-element.ts
- projects/common/models/checkbox-element.ts 0 additions, 26 deletionsprojects/common/models/checkbox-element.ts
- projects/common/models/compound-elements/radio-group-images.ts 0 additions, 27 deletions...cts/common/models/compound-elements/radio-group-images.ts
- projects/common/models/dropdown-element.ts 0 additions, 27 deletionsprojects/common/models/dropdown-element.ts
- projects/common/models/radio-button-group-element.ts 0 additions, 29 deletionsprojects/common/models/radio-button-group-element.ts
- projects/common/models/section.ts 15 additions, 13 deletionsprojects/common/models/section.ts
- projects/common/models/uI-element.ts 123 additions, 22 deletionsprojects/common/models/uI-element.ts
- projects/common/models/video-element.ts 0 additions, 37 deletionsprojects/common/models/video-element.ts
Loading
Please register or sign in to comment