annnoo
commented
3 years ago More or less finished everything as a base for further work. At some points it was a bit tricky, but in the end a more or less solid base is provided.
Open Tasks (which are related to the tasks which were described in the issue):
- Bookmarks-Page (Bookmarks can already be saved and deleted, but they are not shown yet)
- Polishing of Footer-Bar
- Polishing of Pagination for Chapters
- Dynamic Menu loading and enabling links in the text
Regarding the last task I propose the following adjustments for the json file (as you can see in the prelude.json):
- For each link add the css class custom__link. After the HTML is rendered the Angular component iterates through all of the HTML Elements with this CSS-class and adds an onclick-event-listener
- Add the custom HTML attribute data-type to the a-tag. This property should tell the angular component to what kind of stuff the link refers to. For example: This could be an track (for Soundcloud, identifier track) or a location (displayed via. google maps. identifier could be location, but not implemented yet ). Example:
data-type="track" - Add the custom HTML attribute data-link-param to the a-tag. This property is used as a parameter for the given data-type (as described above). This could be the name of the track for example. The value of the property is passed to the event-listener. Example:
data-link-param="fugato"
To correctly display the icon you have to do the following:
- change i-Tag to a
span-Tag. - Add the following classes to the tag:
material-icons small-icon - Add the name of the icon to the content of the span.
- Example:
<a class=\"custom__link\" data-type=\"track\" data-link-param=\"fugato\" >he pressed play <span class=\"material-icons small-icon\">music_note</span>.</a> - Example (without escapes:
<a class="custom__link" data-type="track" data-link-param="fugato"> he pressed play <span class="material-icons small-icon">music_note</span>. </a>
Related Issue
2
Proposed Changes
Additional Info
Checklist
Screenshots