70107c6376
Still need to resolve an issue where if the slave filter has values set when the master filter updates, thus triggering a change of the available options to the slave, the original values are still set on the slave but not actually visible in the popup as options because they're no longer valid options. To fix this we'll need the ability to get the browser to refresh the slave filter's selected values (count icon basically since it already forces the options popup to refresh) when its masters update; while at the same rechecking the slave's scope values set on the server to ensure that they're all valid and there aren't values left over from the previous request that are no longer valid but are still being applied to the query. |
||
|---|---|---|
| .. | ||
| docs | ||
| font | ||
| images | ||
| js | ||
| less | ||
| vendor | ||
| README.md | ||
| storm-min.js | ||
| storm.css | ||
| storm.js | ||
| storm.less | ||
README.md
October Storm
Welcome to the client-side framework designed exclusively for the OctoberCMS back-end area, referred to as October Storm. The library is quite large as it has many features and it is not really itended to be used outside of October.
Design consideration
Each LESS library should always include the global.less to ensure all mixins and variables are available.
Compiling JavaScript depends on October's asset combiner as the =require directive was invented here to emulate the LESS @import functionality.
UI Components
Components are a mixture of CSS and JavaScript (Controls), or can be solely style-based (Styles) or solely script-based (Scripts).
Each component has a strong name, for example the loading indicator has the name loader. For complex components, they can be broken in to child components, for example loader.stripe. Not all child components can be used independently of their parents, but this is certainly possible and a nice idea.
Note: Documentation for each component can be found in the docs/ directory.
Naming conventions
In most cases a control will be styled in CSS with the prefix control-something and the JavaScript is applied using data-control="something". This allows a rendering as a styled control only, without the JavaScript and vice versa.
<div class="control-list" data-control="list">...</div>
The appearance of a control can be modified using additional CSS classes. These modifiers should be prefixed with the control name or the word is if the modification is binary (a boolean). For example:
<div class="control-list list-purple is-sortable"></div>
The above uses two modifiers; one to make it purple and one to declare that it is sortable. In the above example, the class is-purple is not recommended because it is a variable attribute as opposed to a binary one. Here are some common words used for attributes and their meanings:
- flush: The control will use no margin, padding and/or border to the controls or containers surrounding it. Eg:
list-flush - inset: The control will use a negative margin on the left or right side to negate a padded container. Eg:
list-inset - offset: The control will use a positive margin or padding on the left or right to assist a container with padding. Eg:
list-offset - padded: The control will use padding all around. Eg:
list-padded