Concept
Master as a concept is used by many apps to centrally control the sizes, behaviour and the design of their elements or building blocks. Powerpoint user master slide to control the layout of the slides and the content displayed inside the slides. Design prototype tools like Sketch, etc. also use master concept to control the color, size, styling and the overall design of their visual elements. We can use Master dashboards inside Squirro to have a centralised guiding place for storing master layouts, sizes, content, etc.
Layout Master
We introduce a master for layout called Layout Master.
It is the central place for controlling things like tabs alignment to the center section (via master),
It can be used to have uniform layout for all dashboards,
It can be used to having consistent header, footer, theme, etc.
Layout Master dashboard has its own config. options which are different from a normal dashboard.
If we design master dashboard to have content, ex: footer, it cannot be modified from the individual dashboards which adhere to master.
Dashboard editor will have a button to sync to and jump to master if needed.
Individual dashboards can choose to sync to master. Although, It is not compulsory to do so and they are not in sync by default.
Master will be used to left align the dashboard tabs in the compact mode to the center section from the master so as to have SCB like designs, which is a very commonly desired layout.
Every project gets a master dashboard by default, which cannot be deleted or transferred to another dashboard.
Master dashboard will not be visible under the dashboard space.
Global Search Master
The current master dashboard where global search layers are configured should be renamed to Global Search master.
Global Search master dashboard is essentially a templating dashboard where by using layers, one creates visual templates for different NLP query parameters and visibility conditions.
This dashboard is not designed to be any of the main dashboards shared with the end-user, instead it is supposed to show layers which meet a visibility condition caused by a NLP or normal query.
By default, a project does not has a dashboard marked as Global search master but any dashboard in a project can be promoted to be so.
Only one dashboard at a time can be a Global search master.
Just like the Layout master, this dashboard is also not visible in the Dashboard space.
This dashboard controls the visibility of the Global Searchbar in the appbar. If a dashboard is marked as Global search master, Global Searchbar will appear, otherwise not.
MVP Implementation stage 1 technical notes
We introduce a master for a layout called Layout Master
Every project will have a master dashboard, this will need a migration script
Dashboards will have a new attribute
roleThe dashboard for all intents and purposes is a regular dashboard as far as the backend is concerned. It will have all the objects of a regular dashboard model required to be accepted by the backend in order to be saved and edited. The key difference will be its
roleattributeToday we have an idea of “search master” for this we introduced a new attribute
master: truethis attribute will be migrated away in favour of aroleSearch Master will need a role for this migration and a new attribute
role: 'search'The Layout master will have the following
role:'layout'We will also need to change the current default new project to have this new second dashboard called Layout Master
...
Layout Master dashboard has its own config. options are slightly different from current dashboards:
Dashboard editor can select a theme
Dashboard editor can enable and disable sections
Dashboard editor can resize sections
All other functionality is disabled and hidden
You can not view this dashboard (so we should remove the edit toggle for this view)
Changing these settings in master will not affect any dashboards, dashboards have to be manually synced one by one
...
Normal Dashboards will have a new “Sync” icon which will be highlighted if the settings of that dashboard are the same as the master
Pressing this “Sync” button will copy settings down to the current dashboard
If you change any settings to make the current dashboard different from master the “Sync” icon will have “de-synced” state
When syncing a dashboard you will be warned that this is potentially a destructive process and work may be lost if you continue
Syncing specifics:
it copies the layout (so which panels are turned on or off)
if in master there's a panel that doesn't exist in the edited dashboard, then we would add it
if a normal dashboard has a panel that doesn't exist in the master dashboard, remove it and its widgets
If mobile editing is “un-synced” then copy the settings from master down to the dashboard will only affect the desktop version. If mobile editing is synced then the master settings will also apply to mobile
Task Separation / Modifying Existing View
...
Modify List View - Visualise Tab
The list is sorted alphabetically still
Add a new list item "Master Layout" this comes as a new dashboard from the backend.
Only Edit is possible (Hide Lock Icon / Replace with a cog)
Hide all actions except “Edit”
...
Modify Edit Dashboard View
See above “Normal Dashboards“ notes for the implementation instructions
...
Modify App & Nav Bar Settings View
Add another option to project settings page “App & Nav Bar”
Under “Enable compact nav bar options” and under the label "When not enough space available..."
Add new option:
“Align to center section of the master dashboard”
It should be greyed out when the above enable button is disabled
This option will try to align the ‘Compact Nav’ with the width of the left section using the following rules:
Only apply to compact nav
Keep the minimum size of logo
Keep the minimum size of project name with … (This is defined today already, we have a width there)
Only left align when there is room and the above to criteria are met this means the width of the left section must be larger than the logo + project title + small inner padding on tab.
Also only align if the current left panel width is the same as master (synced) (There is no concept of SYNCED, so it’s a simple rule width == layoutWidth)
...
This page can now be found at Layout Master Dashboard on the Squirro Docs site.