112 lines
3.8 KiB
Markdown
112 lines
3.8 KiB
Markdown
# Saxonite
|
|
|
|
## Sarand - Wawam collaboration
|
|
|
|
### Online Environment
|
|
|
|
#### Home Page Activities
|
|
|
|
Informative items presented on Home page, primarily filters by Sports and regions associated with the user.
|
|
The type of activity determines the sequence and period for which they are presented.
|
|
|
|
- Articles by individuals (journalists) or for organisations.
|
|
- Sequencened by publication date (newest first).
|
|
- Expiry up to 3 months after publication (user selectable on publication).
|
|
- Organisation Events.
|
|
- Sequenced by number of days until event happens, nearest first.
|
|
- Expires a number of days after events happens (user selectable).
|
|
- Organisation Opportunities.
|
|
- Sequencened by publication date (newest first).
|
|
- Expiry up to 1 month after publication (user selectable on publication).
|
|
|
|
#### User Profile
|
|
|
|
- User details: name, date of birth, country.
|
|
- User's sports, level of interest/participation and experience for each.
|
|
- User's organisations, editable where user has rights.-
|
|
- Articles: for journalists or members of orgsniations allowed to author articles.
|
|
- Events: members of orgsniations allowed to manage events.
|
|
- Opportunities: members of orgsniations allowed to manage opportunities.
|
|
|
|
### Data Components
|
|
|
|
- Regions
|
|
- Hierarchy: World, Continents, Countries, Provinces
|
|
- Sports
|
|
- Specific sports (positions, disciplines etc)
|
|
- Banner (related) sports (Athletics - Track and Field, Swimmming - pool and wild).
|
|
- Grouped sports (Organisation supporting Baseball and Softball).
|
|
- Individual has interest and experience in specific and banner sports.
|
|
- Organisation identifies any level of sport as their remit.
|
|
- Relationships: parent holds list of child sports.
|
|
|
|
### Application Components
|
|
|
|
#### Styling
|
|
|
|
- Web resources:
|
|
- Colour analysis, including complementary etc. https://www.crispedge.com/color/556B2F
|
|
|
|
##### Online
|
|
|
|
- Colours:
|
|
- Base: #556B2F Dark Olive Green
|
|
- Darker: #445525, #33401c. Lighter: #768858, #99a682, #a6c275, #b7ce90.
|
|
|
|
#### Graphics
|
|
|
|
- Icons
|
|
- **Bootstrap**: https://icons.getbootstrap.com/
|
|
- Where to find icons: https://www.canva.com/learn/free-icons-download/
|
|
- https://icons8.com
|
|
- https://www.smashingmagazine.com/category/freebies
|
|
- https://goodstuffnononsense.com/icons-category/free/
|
|
- https://www.iconfinder.com/
|
|
- Animated gifs
|
|
- https://icons8.com/preloaders/
|
|
|
|
#### Page Functionality
|
|
|
|
##### Timepicker
|
|
|
|
* JQuery TimePicker
|
|
* https://github.com/jonthornton/jquery-timepicker
|
|
* https://github.com/technovistalimited/bootstrap4-datetimepicker
|
|
* Requires moment.js:
|
|
* NuGet package contents can be found under **C:\\Users\\[user]\\.nuget\\packages\\moment.js**
|
|
|
|
##### HTML Editor Controls
|
|
|
|
- RoosterJS
|
|
- https://github.com/microsoft/roosterjs
|
|
- https://github.com/microsoft/roosterjs/wiki/How-to-use
|
|
- https://github.com/microsoft/roosterjs/wiki#useful-links
|
|
- https://github.com/microsoft/roosterjs/tree/master/packages/roosterjs-editor-api/lib/format - styling interface.
|
|
- https://www.npmjs.com/package/roosterjs - distribution files.
|
|
- https://registry.npmjs.org/roosterjs/latest - dist - tarball for download URL.
|
|
- Download specific version: https://registry.npmjs.org/roosterjs/-/roosterjs-8.41.0.tgz
|
|
|
|
###### TinyMCE
|
|
|
|
- - TinyMCE
|
|
- NuGet package available but effectively does nothing - no longer able to copy script filles to aapplication folders.
|
|
- Manually copy files from: https://www.tiny.cloud/get-tiny/self-hosted/
|
|
|
|
* HTML editor
|
|
* Journallist Articles etc
|
|
* Initialisation:
|
|
```js
|
|
tinymce.init({
|
|
branding: false, // Show/hide on editor footer.
|
|
elementpath: true, // Show/hide on element footer.
|
|
min_height: 280,
|
|
resize: false,
|
|
selector: '.sax-editor-html'
|
|
});
|
|
```
|
|
* Show/hide editor:
|
|
```js
|
|
let editorId = $("#textareaId").attr('id');
|
|
tinymce.get(editorId).show() | hide();
|
|
```
|