This project was created to develop Angular (+ Material, NgRx, e2e Testing & OpenSeadragon) skills. It is based off the function of a previous technical challenge where only pure JS + no imports were allowed.
App Component
--- Page Content Component
--- Loading Card Component
--- Viewer Settings Component
--- View Component
The loading card component displays the progress spinner as the default .vmic is loaded. The viewer settings component displays sliders to ajust the filters on the OpenSeadragon canvas. The view component contains the OpenSeadragon wrapper, and contains the bulk of the typescript.
Initially, the viewer component will use JSZip to asynchronously load the default .vmic file, and then it also unzips the inner Image/.vmici file. Next all the tile files stored within the dzc_output folder are loaded as blobs, these blobs are each generated into object URLS, and finally stored in an array, accessibile as array[level][x][y]. Next the dzc_output XML file is processed using XMLJS. Finally the processed values from the XML are used to initiate OpenSeadragon, with its tile source linked to the blob URLs array. While OSD can work with .vmic files out of the box, processing the XML values first was required as OSD also needs a custom tileSources option/getTileUrl function to retrieve from the URL array.
This project was generated with Angular CLI version 11.1.2.
Run ng serve for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.
Run ng generate component component-name to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module.
Run ng build to build the project. The build artifacts will be stored in the dist/ directory. Use the --prod flag for a production build.
Run ng test to execute the unit tests via Karma.
Run# ng e2e to execute the end-to-end tests via Protractor.
To get more help on the Angular CLI use ng help or go check out the Angular CLI Overview and Command Reference page.