Channels facilitate the embedding of SVG into a containing website or app through which SVG is trafficked and navigated. Apart from being embedded individually they also automatically feature in a SVG Portal configuring the channel according to the portals styling.
As demonstrated by illustrations below, all the repositories SVG content is trafficked through Channels which in turn are configured through the use of URL parameters specifying the view port (dimensions) and styling (look and feel). All these parameters are annotated as per the following URL below :
For convenience sake there is a Channel Previewer screen available in the Admin Web Portal where these various parameters can be tweaked to meet a prerequisite configuration through the use of its applicable form elements. This is very useful when needing to define the presentation logic of a channel to match the specific dimensions and branding within the container of a mobile app or website hosting it. Blue bars are navigators and white the content area.
All the SVG compositions regardless of their original dimensions will always rescale automatically according to the view port available in the content area without any distortion as is the purpose of scalable vector graphics. The smallest viewport which it accommodates is that of 200X200
Fit Width : as per parameter fitWidth=500
Fit Height : as per parameter fitHeight=500
Show Tracker : as per parameter showTracker=true
Icon Scale : as per parameter trackerScale=1.0
All the icons are 50X50 and will scale down automatically when the viewport is less than 500X500 but can also be configured to be smaller when the view port is 500X500 or over for a larger content area
For convenient reach SVG compositions trafficked in channels have a 4 way navigation mechanism :
From Root - When clicking an icon on the left root navigation bar a new icon is fetched and added to the history navigation bar and a new SVG composition is fetched then also caching the both of them.
From History - When clicking an icon on the top history navigation bar it reloads an SVG composition from the cache to prevent re-fetching it from the server again thus improving further performance.
From Composition - When clicking a link element in a composition like a shape, symbol or text the cache is first queried and if not found it fetches a new icon and SVG composition also caching them.
From Search - When clicking on the top left button "?" and capturing the would be name which will list candidates which clicked on will fetch a new icon and SVG composition which is then also cached.
For presentational flexibility the plain theme makes for a mat look and feel. Apart from the search form field and search results table, when less than 3 characters are typed into search an alert message conforming to the plain styled button with the background of the 2 lightest generated color's displays.
Plain Theme : as per parameter glass=false
For presentation flexibility the glass theme makes for a glossy look and feel. Apart from the search form field and search results table, when less than 3 characters are typed into search an alert message conforming to the glass styled button with the background of the 2 lightest generated color's displays.
Glass Theme : as per parameter glass=true
The color scheme is partly configured and generated. It consists of 6 colors which are used to color the user interface of a channel. A color scheme allows a channel to adjust its look and feel to complement the brand of its host container when embeded in mobile apps or websites through iframes. Channels thus present SVG content with a highly customizable look and feel that can vary whereever it features.
Navigator Color : as per parameter navColor=b5d7e
Primary Color : as per parameter color=0178af
Generated Colors : as per algorithm lighter shades of primary color