autonomic-cooperative/hubl
0
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge branch 'master' of https://git.startinblox.com/applications/hubl into feature/resource-component

Browse Source
This commit is contained in:
Marjolaine Le Bon 2020-12-02 14:48:34 +01:00
commit f86dff4081
112 changed files with 14045 additions and 2004 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

398
.gitlab-ci.yml
View File

@ -44,6 +44,7 @@ test:e2e:
before_script: before_script:
# install missing dependencies # install missing dependencies
- npm install -g sirv-cli - npm install -g sirv-cli
- npm install cypress-localstorage-commands
# making sure the process is orphan # making sure the process is orphan
- sirv dist --port 3000 > /dev/null 2>&1 & - sirv dist --port 3000 > /dev/null 2>&1 &
script: script:
@ -99,6 +100,7 @@ test3:
script: script:
- echo "$APP_CONFIG_TEST3" > config.json - echo "$APP_CONFIG_TEST3" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key - echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- sed -i -E 's/component-chat@([0-9]+).([0-9]+)/component-chat@beta/g' src/dependencies.pug
- npm run build - npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* test3@astral.startinblox.com:~/front/ - scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* test3@astral.startinblox.com:~/front/
only: only:
@ -553,42 +555,6 @@ apidays:
tags: tags:
- deploy - deploy
ejp:
stage: deployment
environment:
name: ejp
url: https://ejp.hubl.world
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_EJP" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* georgetown-uni@astral.startinblox.com:~/front/
only:
- master
when: manual
tags:
- deploy
fichemetierfr:
stage: deployment
environment:
name: fichemetierfr
url: https://fichemetier.fr.hubl.world
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_FICHEMETIERFR" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* fichemetierfr@astral.startinblox.com:~/front/
only:
- master
when: manual
tags:
- deploy
toulouse: toulouse:
stage: deployment stage: deployment
environment: environment:
@ -606,3 +572,363 @@ toulouse:
when: manual when: manual
tags: tags:
- deploy - deploy
lepool:
stage: deployment
environment:
name: lepool
url: https://lepool.hubl.world
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_LEPOOL" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* lepool@astral.startinblox.com:~/front/
only:
- master
when: manual
tags:
- deploy
cpe:
stage: deployment
environment:
name: cpe
url: https://cpe.hubl.world
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_CPE" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* cpe@astral.startinblox.com:~/front/
only:
- master
when: manual
tags:
- deploy
lescanumeriques:
stage: deployment
environment:
name: lescanumeriques
url: https://fichemetier.fr.hubl.world
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_LESCANUMERIQUES" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* lescanumeriques@astral.startinblox.com:~/front/
only:
- master
when: manual
tags:
- deploy
phares:
stage: deployment
environment:
name: phares
url: https://le.phares.hubl.world
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_LE_PHARES" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* phares@astral.startinblox.com:~/front/
only:
- master
when: manual
tags:
- deploy
esspace:
stage: deployment
environment:
name: esspace
url: https://ess.pace.hubl.world
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_ESSPACE" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* esspace@astral.startinblox.com:~/front/
only:
- master
when: manual
tags:
- deploy
grandecoco:
stage: deployment
environment:
name: grandecoco
url: https://la.grande.coco.hubl.world
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_COCO" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* grande-coco@astral.startinblox.com:~/front/
only:
- master
when: manual
tags:
- deploy
espaceimaginaire:
stage: deployment
environment:
name: espaceimaginaire
url: https://espace-imaginaire.hubl.world
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_ESPACEIMAGINAIRE" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* espace-imaginaire@astral.startinblox.com:~/front/
only:
- master
when: manual
tags:
- deploy
hallesciviques:
stage: deployment
environment:
name: hallesciviques
url: https://les.halles.civiques.hubl.world
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_HALLES" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* halles-civiques@astral.startinblox.com:~/front/
only:
- master
when: manual
tags:
- deploy
ctc:
stage: deployment
environment:
name: ctc
url: https://collectif.tansition.citoyenne.hubl.world
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_CTC" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* collectif-tansition-citoyenne@astral.startinblox.com:~/front/
only:
- master
when: manual
tags:
- deploy
studiossinguliers:
stage: deployment
environment:
name: studiossinguliers
url: https://studios-singuliers.hubl.world
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_SINGULIER" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* studios-singuliers@astral.startinblox.com:~/front/
only:
- master
when: manual
tags:
- deploy
apluscestmieux:
stage: deployment
environment:
name: apluscestmieux
url: https://apluscestmieux.hubl.world
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_APLUS" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* apluscestmieux@astral.startinblox.com:~/front/
only:
- master
when: manual
tags:
- deploy
projetlerepaire:
stage: deployment
environment:
name: projetlerepaire
url: https://projet.le.repaire.hubl.world
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_LEREPAIRE" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* projetlerepaire@astral.startinblox.com:~/front/
only:
- master
when: manual
tags:
- deploy
oxamyne:
stage: deployment
environment:
name: oxamyne
url: https://oxamyne.hubl.world
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_OXAMYNE" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* oxamyne@astral.startinblox.com:~/front/
only:
- master
when: manual
tags:
- deploy
laruchesaintgermain:
stage: deployment
environment:
name: laruchesaintgermain
url: https://la.ruche.saint-germain.hubl.world
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_LARUCHE" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* laruche-saint-germain@astral.startinblox.com:~/front/
only:
- master
when: manual
tags:
- deploy
artefacts:
stage: deployment
environment:
name: artefacts
url: https://artefacts.hubl.world
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_ARTEFACTS" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* artefacts@astral.startinblox.com:~/front/
only:
- master
when: manual
tags:
- deploy
lab01:
stage: deployment
environment:
name: lab01
url: https://le.lab01.hubl.world
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_LAB01" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* le-lab01@astral.startinblox.com:~/front/
only:
- master
when: manual
tags:
- deploy
makesense:
stage: deployment
environment:
name: makesense
url: https://makesense.hubl.world
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_MAKESENSE" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* makesense@astral.startinblox.com:~/front/
only:
- master
when: manual
tags:
- deploy
moulindepontru:
stage: deployment
environment:
name: moulindepontru
url: https://moulin.de.pont-ru.hubl.world
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_MOULINPONTRU" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* moulin-de-pont-ru@astral.startinblox.com:~/front/
only:
- master
when: manual
tags:
- deploy
latreso:
stage: deployment
environment:
name: latreso
url: https://la.treso.hubl.world
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_LATRESO" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* la-treso@astral.startinblox.com:~/front/
only:
- master
when: manual
tags:
- deploy
montpellier:
stage: deployment
environment:
name: montpellier
url: https://app.montpellier.happy-dev.fr
before_script:
- npm ci --cache .npm --prefer-offline --only=production
script:
- echo "$APP_CONFIG_MONTPELLIER" > config.json
- echo "$SSH_DEPLOY_KEY" | tr -d '\r' > gitlab.key && chmod 600 gitlab.key
- npm run build
- scp -i gitlab.key -o StrictHostKeyChecking=no -r dist/* montpellier@ssh-montpellier.happy-dev.fr:~/front/
only:
- master
when: manual
tags:
- deploy

20
.gitlab/issue_templates/bug.md
View File

@ -1,28 +1,24 @@
/label ~BUG # What's happening?
### What's happening? Describe in a few words what's happening
*Describe in a few words what's happening* ## Steps to reproduce
### Steps to reproduce How one can reproduce the issue - this is very important
*How one can reproduce the issue - this is very important*
1. Step 1 1. Step 1
2. Step 2 2. Step 2
3. Step 3 3. Step 3
### Relevant logs and/or screenshots ## Relevant logs and/or screenshots
*If possible, please add a screenshot.* If possible, please add a screenshot.
### Your Environment ## Your Environment
(Include relevant details about the environment you experienced the bug in) (Include relevant details about the environment you experienced the bug in)
* Browser name and version: * Browser name and version:
* Operating System and version (desktop or mobile): * Operating System and version (desktop or mobile):
/label ~BUG

12
.gitlab/issue_templates/feature.md
View File

@ -1,16 +1,12 @@
## What needs to be done? # What needs to be done
/label ~Feature request
## Technical details ## Technical details
*Are there any technical details worth mentioning?* Are there any technical details worth mentioning?
## Test cases ## Test cases
*Describe here the tests needed in order to validate this feature* Describe here the tests needed in order to validate this feature
1. Step 1 1. Step 1
2. Step 2 2. Step 2
@ -20,3 +16,5 @@
1. Link to user story in wiki 1. Link to user story in wiki
2. other related Gitlab issues 2. other related Gitlab issues
/label ~Feature request

36
.gitlab/issue_templates/new_instance.md
View File

@ -1,40 +1,16 @@
/label ~"New Instance" # Please fill all these info
# Please fill all these info:
## General info ## General info
- Name of the instance: - Name of the instance:
- Domain: - Domain: .hubl.world
## Settings:
- Does the instance allow people to sign up? **Yes / No**
- Does the instance want new people to get a welcome email? **Yes / No**
## Federation:
- Which current instance should see this new instance data? **Please provide the info module by module and include the instance itself.**
- Do those current instances agree to share their public data with this new instance? **Yes / No**
Example:
- *Instance G is the new kid in town*
- *Instance G wants to only see their dashboard, but want to access the circles of A, B, C, D, E & F.*
- *Instance G wants to be able to chat with users from A, B, C, D, E & F.*
- *Instance G wants to be able to see A and B job offers*
Let's say every instances agree to this scenario, the issue should describe the following:
- Dashboard: G
- Circles: A, B, C, D, E, F & G
- Job offers: A, B, F, G
- Users: A, B, C, D, E, F & G
- Profile directory: A, B, C, D, E, F & G
- G agrees that any new instance can see their public data.
## Cosmetics ## Cosmetics
- Logo: - Logo:
- Favicon: - Favicon:
- 4 Colors: - 4 Colors:
/label ~"New Instance"

8
.gitlab/merge_request_templates/checklist_before_merging.md
View File

@ -1,4 +1,4 @@
## Checklist # Checklist
<!--- <!---
Please, make sure you have changed the topic and also Please, make sure you have changed the topic and also
@ -12,8 +12,6 @@ I have done ...
- [ ] Tests for the changes have been added - [ ] Tests for the changes have been added
- [ ] Docs have been added or updated - [ ] Docs have been added or updated
- [ ] I have assigned my architect to review this merge request - [ ] I have assigned my architect to review this merge request
- [ ] I have checked how to create a [merge request]()
## Issues ## Issues
@ -25,7 +23,6 @@ Format is: Closes #X or Refs #Y
Docs: https://docs.gitlab.com/ee/user/project/issues/closing_issues.html#via-merge-request Docs: https://docs.gitlab.com/ee/user/project/issues/closing_issues.html#via-merge-request
--> -->
## Time spent ## Time spent
<!--- <!---
@ -38,7 +35,6 @@ Docs: https://docs.gitlab.com/ee/workflow/time_tracking.html
/spend Xh /spend Xh
## Assignee ## Assignee
<!--- <!---
@ -49,7 +45,6 @@ Docs: https://docs.gitlab.com/ee/user/project/quick_actions.html
/assign /assign
## Feedback ## Feedback
<!--- <!---
@ -57,5 +52,4 @@ Did you encounter any other problems you want to share with us?
Optional. Feel free to remove this section if you don't have any feedback. Optional. Feel free to remove this section if you don't have any feedback.
--> -->
<!--- Thank you for you contribution! --> <!--- Thank you for you contribution! -->

33
README.md
View File

@ -10,23 +10,24 @@ These instructions will get you a copy of the project up and running on your loc
To install Hubl, you'll need: To install Hubl, you'll need:
* A Hubl Server (djangoldp>=0.7.11) with the appropriate modules * A [Hubl Server](https://git.startinblox.com/djangoldp-packages/server-manager/) (djangoldp>1)
* A Prosody Server (with [appropriate modules](https://git.startinblox.com/infra/prosody-modules/) * A [Prosody Server](https://prosody.im/) (with [appropriate modules](https://git.startinblox.com/infra/prosody-modules/))
* A SMTP Server (optional) * A SMTP Server (optional)
* NodeJS on your machine * NodeJS on your machine
Before diving in you have to check your Hubl Server supports the following LDP packages: Before diving in you have to check your Hubl Server supports the following LDP packages:
* djangoldp_account * djangoldp_account
* djangoldp_community
* djangoldp_notification * djangoldp_notification
* djangoldp_profile * djangoldp_profile
* djangoldp_skill * djangoldp_skill
* djangoldp_uploader * djangoldp_uploader
* oidc_provider: 'git+https://github.com/jblemee/django-oidc-provider.git@develop' * oidc_provider: django-webidoidc-provider
Those packages are given with the last stable version tested. Those packages are given with the last stable version tested.
Refer to the [documentation to install a Hubl Server](https://git.startinblox.com/documentation/doc/wikis/devops/install_sib_server) with this configuration. Refer to the [documentation to install a Hubl Server](https://docs.startinblox.com/import_documentation/install-sib-server.html) with this configuration.
## Build the application ## Build the application
@ -76,6 +77,8 @@ On `config.json`:
```json ```json
{ {
"xmpp": "https://jabber.happy-dev.fr/http-bind/", "xmpp": "https://jabber.happy-dev.fr/http-bind/",
"clientName": "My local Hubl",
"clientLogo": "/images/logo.webp",
"authority": "http://localhost:8000/", "authority": "http://localhost:8000/",
"endpoints": { "endpoints": {
"skills": "http://server.url/skills/", "skills": "http://server.url/skills/",
@ -87,9 +90,23 @@ On `config.json`:
Where: Where:
* `clientName` is the name of your Hubl
* `clientLogo` is an URL to an image file
* `xmpp` is your [Prosody](https://prosody.im/) with [appropriate modules](https://git.startinblox.com/infra/prosody-modules/) configured on. * `xmpp` is your [Prosody](https://prosody.im/) with [appropriate modules](https://git.startinblox.com/infra/prosody-modules/) configured on.
* `authority` is the OpenID Provider. Usually, if you use `djangoldp-account` it's the same as your djangoldp server. * `authority` is the OpenID Provider. Usually, if you use `djangoldp-account` it's the same as your djangoldp server.
* `endpoints.users` is the API endpoints for Users on your djangoldp server. * `endpoints.users` is the API endpoints for Users on your djangoldp server. (djangoldp-account)
* `endpoints.skills` is the API endpoints for Skills on your djangoldp server. (djangoldp-skill)
* `endpoints.uploads` is the API endpoints for Uploads on your djangoldp server. (djangoldp-upload)
### Communities
Communities are mandatory to have an Hubl. If you're upgrading an existion Hubl, you can assign all your local users to a community this way:
```bash
./manage.py create_community --name="My community"
```
Don't forget to set some users as admin from the Django Admin if you want to allow them to create new users from app.
### Optional personalisation ### Optional personalisation
@ -97,8 +114,8 @@ On `config.json`:
```json ```json
"clientName": "Hubl", "clientName": "Hubl",
"clientFavicon": "/images/favicon.png", "clientFavicon": "/images/favicon.webp",
"clientLogo": "/images/logo.png", "clientLogo": "/images/logo.webp",
"clientLogoHeight": "32px", "clientLogoHeight": "32px",
"clientCSS": "/path/to/custom.css", "clientCSS": "/path/to/custom.css",
"authorityName": "djangoldp-server-name" "authorityName": "djangoldp-server-name"
@ -203,7 +220,7 @@ On `config.json`:
```json ```json
"endpoints": { "endpoints": {
"joboffers": "http://server.url/joboffers/", "joboffers": "http://server.url/job-offers/",
"skills": "http://server.url/skills/", "skills": "http://server.url/skills/",
"uploads": "http://server.url/upload/" "uploads": "http://server.url/upload/"
} }

180
client.sample.etuc.scss
View File

@ -1,180 +0,0 @@
:root {
--color-primary: #063B5C;
--color-secondary: #3A3A3A;
--color-complementary: #C4262E;
--color-complementary-darken: #36383B;
--color-white: #FFFFFF;
--color-black-h: 216;
--color-black-s: 4%;
--color-black-l: 22%;
--color-main-background: var(--color-grey-13);
--color-main-text: #7A7F85;
--color-highlight-primary: var(--color-primary);
--color-user-panel: var(--color-black);
--color-bell: var(--color-secondary);
--color-avatar-background: #E4E8ED;
--color-title: #36383B;
--color-h1: var(--color-title);
--color-h2: var(--color-title);
/* Depreciated */
--color-tag-group-text: #9BA0A7;
--color-tag-group-border: var(--color-primary);
--color-label-dark: var(--color-grey-6);
/* Header's elements */
--color-header-background: var(--color-white);
--color-bell: var(--color-complementary-darken);
--color-user-panel-header-text: var(--color-complementary-darken);
--color-user-panel-header-background: var(--color-white);
--color-user-panel-header-text-open: var(--color-white);
--color-user-panel-header-background-open: var(--color-secondary);
--color-user-panel-list-background: var(--color-white);
--color-user-panel-list-text-hover: var(--color-complementary);
--color-user-panel-list-border: #E4E8ED;
/* Left menu */
--color-menu-highlight-primary:var(--color-white);
--color-menu-background: var(--color-secondary);
--color-menu-text: var(--color-white);
--color-menu-text-active: var(--color-complementary);
--color-menu-background-active: var(--color-menu-highlight-primary);
--color-menu-badge-background: var(--color-menu-highlight-primary);
--color-menu-badge-text-active: var(--color-menu-highlight-primary);
--color-menu-badge-background-active: var(--color-secondary);
--color-menu-icon-background-active: var(--color-secondary);
/* Right menu */
--color-right-menu-background: #e8e8e8;
--color-right-menu-text: #3c3F57;
--color-right-menu-link-border: #BDC2D7;
--color-right-menu-active-text: var(--color-white);
--color-right-menu-active-background: var(--color-complementary);
--color-right-menu-active-icon: var(--color-primary);
/* Scrollbar */
--color-scrollbar-right-background: var(--color-white);
--color-scrollbar-right-track: var(--color-grey-6);
--color-scrollbar-left-background: var(--color-secondary);
--color-scrollbar-left-track: var(--color-grey-11);
/* Tags */
--color-tag-admin-text: var(--color-complementary);
--color-tag-admin-border: var(--color-complementary);
/* Form elements */
--color-button-white: var(--color-white);
--color-button-primary: var(--color-primary);
--color-button-secondary: var(--color-complementary);
--color-button-complementary: var(--color-secondary);
--color-input-background: #EDF1FA;
--color-input-text: var(--color-secondary);
--color-input-icon: var(--color-complementary);
--color-input-active: var(--color-complementary);
--color-fieldset: var(--color-title);
--color-fieldset-border: #DAE2F3;
--color-button-modal: var(--color-title);
--color-select-list: var(--color-secondary);
--color-select-add-button: var(--color-button-secondary);
--color-select-add-button-background: var(--color-button-white);
--color-label-light: var(--color-grey-6);
/* Skill */
--color-skill-background: var(--color-primary);
--color-skill-text: var(--color-white);
/* Icon */
--color-icon: var(--color-primary);
/* Table */
--color-table-header-background: #BDC2D7;
--color-table-header-text: var(--color-white);
--color-table-border: #BDC2D7;
/* User thumb */
--color-user-thumb-name: #7A7F85;
--color-backlink: var(--color-secondary);
--color-content-header: #DAE2F3;
/* Chat */
--color-chat-white: var(--color-white);
--color-chat-primary: var(--color-primary);
--color-chat-complementary: var(--color-complementary);
--color-chat-secondary: var(--color-secondary);
--color-chat-complementary-darken: var(--color-complementary-darken);
--color-chat-grey-1: var(--color-grey-4);
--color-chat-grey-2: var(--color-grey-6);
--color-chat-grey-3: var(--color-grey-10);
/* Directory */
--color-directory-grey-4: #7A7F85;
--color-directory-grey-5: #F0F3F6;
--color-directory-avatar-background: #E4E8ED;
--color-directory-back-link: #36383B;
--color-directory-border: #DAE2F3;
--color-directory-content-header-border: #DAE2F3;
--color-directory-h1: var(--color-complementary-darken);
--color-directory-list-icon: var(--color-primary);
--color-directory-text: var(--color-directory-grey-4);
--color-directory-form-input: #EDF1FA;
--color-directory-form-input-text: var(--color-directory-grey-4);
--color-directory-form-input-active: var(--color-complementary);
--color-directory-form-select-icon: var(--color-complementary);
}
#main__menu {
font-family: "RefrigeratorDelxW01Bold";
}
#main__menu .menu {
font-size: 2rem;
}
#main__menu .unread {
font-weight: bold;
}
#main__menu .menu[active=""] {
color: var(--color-complementary);
}
#main__menu .sub-menu.menu-notification {
font-family: Facit;
}
#main__menu solid-router sib-route.menu, #main__menu sib-router sib-route.menu {
padding: 1.2rem 0;
}
#viewport .content-box {
font-family: Facit;
}
#viewport #circle .content-box__header solid-display div {
text-align: center;
}
#viewport #circle .content-box__header .h1-like {
font-family: "RefrigeratorDelxW01Bold";
font-size: 3.2rem;
color: var(--color-primary);
}
#viewport #circle .content-box__header solid-display div .h1-aside {
margin: 10px 0;
}
#viewport .with-sidebar nav > solid-router {
color: #3C3F57;
}
#viewport .with-sidebar nav > solid-router > ul > sib-route[active] {
background-color: var(--color-right-menu-active-background);
color: var(--color-right-menu-active-text);
display: inline-block;
}
@media (min-width: 992px) {
.content-box__height {
min-height: calc(100vh - 83px - 98px);
}
#viewport .chat-view {
height: calc(100vh - 84px - 98px);
}
}

12
client.sample.etuc.css → client.sample.happy-dev.css
View File

@ -1,6 +1,6 @@
:root { :root {
--color-primary: pink; --color-primary: #FFB700;
--color-secondary: green; --color-secondary: #3C3F57;
--color-complementary: #6259E5; --color-complementary: #6259E5;
--color-complementary-darken: #36383B; --color-complementary-darken: #36383B;
--color-white: #FFFFFF; --color-white: #FFFFFF;
@ -42,7 +42,7 @@
--color-user-panel-list-border: #E4E8ED; --color-user-panel-list-border: #E4E8ED;
/* Left menu */ /* Left menu */
--color-menu-highlight-primary: #000c42; --color-menu-highlight-primary: #FFD759;
--color-menu-background: var(--color-secondary); --color-menu-background: var(--color-secondary);
--color-menu-text: var(--color-white); --color-menu-text: var(--color-white);
--color-menu-text-active: var(--color-secondary); --color-menu-text-active: var(--color-secondary);
@ -144,6 +144,12 @@
--color-directory-form-select-icon: var(--color-complementary) !important; --color-directory-form-select-icon: var(--color-complementary) !important;
} }
/* Text color for the beta label */
#header>div.header-left>span.beta-tag {
color: var(--color-complementary);
}
/* Button to edit a channel or a project (in project-profile) */ /* Button to edit a channel or a project (in project-profile) */
#project solid-link[next="project-edit"], #project solid-link[next="project-edit"],
#circle solid-link[next="circle-edit"] { #circle solid-link[next="circle-edit"] {

2
config.sample.federated.json
View File

@ -1,6 +1,8 @@
{ {
"xmpp": "https://jabber.happy-dev.fr/http-bind/", "xmpp": "https://jabber.happy-dev.fr/http-bind/",
"authority": "http://localhost:8000/", "authority": "http://localhost:8000/",
"clientName": "Hubl",
"clientLogo": "https://cdn.startinblox.com/logos/hubl-logo.png",
"endpoints": { "endpoints": {
"get": { "get": {
"skills": "http://localhost:8000/skills/", "skills": "http://localhost:8000/skills/",

2
config.sample.json
View File

@ -2,6 +2,8 @@
"xmpp": "https://jabber.happy-dev.fr/http-bind/", "xmpp": "https://jabber.happy-dev.fr/http-bind/",
"authority": "http://localhost:8000/", "authority": "http://localhost:8000/",
"authorityName": "djangoldp-server-name", "authorityName": "djangoldp-server-name",
"clientName": "Hubl",
"clientLogo": "https://cdn.startinblox.com/logos/hubl-logo.png",
"endpoints": { "endpoints": {
"groups": "http://localhost:8000/groups/", "groups": "http://localhost:8000/groups/",
"skills": "http://localhost:8000/skills/", "skills": "http://localhost:8000/skills/",

5
cypress.json
View File

@ -1,7 +1,8 @@
{ {
"baseUrl": "http://127.0.0.1:3000", "baseUrl": "http://127.0.0.1:3000",
"defaultCommandTimeout": 60000, "defaultCommandTimeout": 1000,
"chromeWebSecurity": false, "chromeWebSecurity": false,
"viewportWidth": 1920, "viewportWidth": 1920,
"viewportHeight": 1080 "viewportHeight": 1080,
"video": false
} }

54
cypress/README.md Normal file
View File

@ -0,0 +1,54 @@
## Users:
```
- signin
- signup
- create
- listing
- edit
// TO-FIX: Uncomment workaround (blocked by: nested routing bug)
```
## Job Offers:
```
- create
- edit
- listing
// TO-FIX: Search by title and description (blocked by: no search fields available)
- post
// TO-DO: Entire flow (blocked by: no published / unpublished flag)
```
## Channels:
```
- create
- edit
- leave
- retire
- delete
- join
// TO-DO: Join other user created project (blocked by: can't create new user to create a channel)
- invite
// TO-DO
```
## Projects:
```
- create
- edit
- leave
- retire
- delete
// TO-DO: Delete a project (blocked by: no option to delete a project)
- join
// TO-DO: Join other user created project (blocked by: can't create new user to create a project)
- invite
// TO-DO
```
## Breakdown:
```
DONE: 15
TO-FIX: 2
BLOCKED: 4
NOT DONE: 2
```

4
cypress/fixtures/admin.json Normal file
View File

@ -0,0 +1,4 @@
{
"username": "admin",
"password": "admin"
}

116
cypress/integration/create-channel.spec.js Normal file
View File

@ -0,0 +1,116 @@
/// <reference types="Cypress" />
/* globals cy, expect */
context('Create Channel Browser Testing', () => {
before(() => {
cy.clearLocalStorageSnapshot();
cy.clearLocalStorage({ domain: null });
cy.clearCookies({ domain: null });
});
beforeEach(() => cy.restoreLocalStorage());
afterEach(() => cy.saveLocalStorage());
it('should visit user login screen', () => cy.userLogin());
it('should login', () => cy.login());
describe('Channel Creation process #1', () => {
let channelName = 'Test Channel ',
description = 'Test Description ';
it('should visit the channel creation screen', () => {
cy.visit('/admin/admin-circle-create');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/admin/admin-circle-create');
});
});
it('should enter correct channel data', () => {
cy.randomNum().then(num => {
channelName += num;
description += num;
cy.get('#admin-circle-create input[name="name"]').clear().type(channelName);
cy.get('#admin-circle-create input[name="name"]').should('have.value', channelName);
cy.get('#admin-circle-create input[name="description"]').clear().type(description);
cy.get('#admin-circle-create input[name="description"]').should('have.value', description);
});
});
it('should click on create channel button', () => {
cy.get('#admin-circle-create input[type="submit"]').click();
});
it('should land on channels list screen', () => {
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/admin');
});
});
it('should land newly created channel on channels list screen', () => {
cy.contains('solid-display-value[name="circle.name"]', channelName).should("exist");
cy.fixture('admin.json').then(admin => {
cy.contains('solid-display-value[name="username"]', admin.username).should("exist");
});
});
});
describe('Channel Creation process #2', () => {
let channelName = 'Test Channel ',
description = 'Test Description ';
it('should visit the channel creation screen', () => {
cy.visit('/admin/admin-circle-create');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/admin/admin-circle-create');
});
});
it('should enter correct channel data', () => {
cy.randomNum().then(num => {
channelName += num;
description += num;
cy.get('#admin-circle-create input[name="name"]').clear().type(channelName);
cy.get('#admin-circle-create input[name="name"]').should('have.value', channelName);
cy.get('#admin-circle-create input[name="description"]').clear().type(description);
cy.get('#admin-circle-create input[name="description"]').should('have.value', description);
});
});
it('should click on create channel button', () => {
cy.get('#admin-circle-create input[type="submit"]').click();
});
it('should land on channels list screen', () => {
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/admin');
});
});
it('should land newly created channel on channels list screen', () => {
cy.contains('solid-display-value[name="circle.name"]', channelName).should("exist");
cy.fixture('admin.json').then(admin => {
cy.contains('solid-display-value[name="username"]', admin.username).should("exist");
});
});
});
describe('Channel Creation process #3', () => {
let channelName = 'Test Channel ',
description = 'Test Description ';
it('should visit the channel creation screen', () => {
cy.visit('/admin/admin-circle-create');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/admin/admin-circle-create');
});
});
it('should enter correct channel data', () => {
cy.randomNum().then(num => {
channelName += num;
description += num;
cy.get('#admin-circle-create input[name="name"]').clear().type(channelName);
cy.get('#admin-circle-create input[name="name"]').should('have.value', channelName);
cy.get('#admin-circle-create input[name="description"]').clear().type(description);
cy.get('#admin-circle-create input[name="description"]').should('have.value', description);
});
});
it('should click on create channel button', () => {
cy.get('#admin-circle-create input[type="submit"]').click();
});
it('should land on channels list screen', () => {
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/admin');
});
});
it('should land newly created channel on channels list screen', () => {
cy.contains('solid-display-value[name="circle.name"]', channelName).should("exist");
cy.fixture('admin.json').then(admin => {
cy.contains('solid-display-value[name="username"]', admin.username).should("exist");
});
});
});
});

52
cypress/integration/create-job-offer.spec.js Normal file
View File

@ -0,0 +1,52 @@
/// <reference types="Cypress" />
/* globals cy, expect */
context('Create Job Offer Browser Testing', () => {
let jobDate = '',
jobTitle = 'Test Job Offer ',
description = 'Test Description ';
before(() => {
cy.nextYear(1).then(year => {
jobDate = year + '-12-31';
});
cy.randomNum().then(num => {
jobTitle += num;
description += num;
});
cy.clearLocalStorageSnapshot();
cy.clearLocalStorage({ domain: null });
cy.clearCookies({ domain: null });
});
beforeEach(() => cy.restoreLocalStorage());
afterEach(() => cy.saveLocalStorage());
it('should visit user login screen', () => cy.userLogin());
it('should login', () => cy.login());
describe('Job Offer Creation process', () => {
it('should visit the job offer creation screen', () => {
cy.visit('/job-offers/job-offers-create');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/job-offers/job-offers-create');
});
});
it('should enter correct job offer data', () => {
cy.get('#job-offers-create input[name="closingDate"]').clear().type(jobDate);
cy.get('#job-offers-create input[name="closingDate"]').should('have.value', jobDate);
cy.get('#job-offers-create input[name="title"]').clear().type(jobTitle);
cy.get('#job-offers-create input[name="title"]').should('have.value', jobTitle);
cy.get('#job-offers-create textarea[name="description"]').clear().type(description);
cy.get('#job-offers-create textarea[name="description"]').should('have.value', description);
});
it('should click on create job offer button', () => {
cy.get('#job-offers-create input[type="submit"]').click();
});
it('should land on job offers list screen', () => {
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/job-offers');
});
});
it('should land newly created job offer on job offers list screen', () => {
cy.contains('solid-display-value[name="title"]', jobTitle).should("exist");
cy.contains('solid-display-value[name="description"]', description).should("exist");
});
});
});

90
cypress/integration/create-project.spec.js Normal file
View File

@ -0,0 +1,90 @@
/// <reference types="Cypress" />
/* globals cy, expect */
context('Create Project Browser Testing', () => {
before(() => {
cy.clearLocalStorageSnapshot();
cy.clearLocalStorage({ domain: null });
cy.clearCookies({ domain: null });
});
beforeEach(() => cy.restoreLocalStorage());
afterEach(() => cy.saveLocalStorage());
it('should visit user login screen', () => cy.userLogin());
it('should login', () => cy.login());
describe('Project Creation process #1', () => {
let projectName = 'Test Project ',
customerName = 'Test Customer ',
description = 'Test Description ';
it('should visit the project creation screen', () => {
cy.visit('/admin/admin-projects/admin-project-create');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/admin/admin-projects/admin-project-create');
});
});
it('should enter correct project data', () => {
cy.randomNum().then(num => {
projectName += num;
customerName += num;
description += num;
cy.get('#admin-project-create input[name="customer.name"]').clear().type(customerName);
cy.get('#admin-project-create input[name="customer.name"]').should('have.value', customerName);
cy.get('#admin-project-create input[name="name"]').clear().type(projectName);
cy.get('#admin-project-create input[name="name"]').should('have.value', projectName);
cy.get('#admin-project-create textarea[name="description"]').clear().type(description);
cy.get('#admin-project-create textarea[name="description"]').should('have.value', description);
});
});
it('should click on create project button', () => {
cy.get('#admin-project-create input[type="submit"]').click();
});
it('should land on projects list screen', () => {
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/admin/admin-projects');
});
});
it('should land newly created project on projects list screen', () => {
cy.contains('solid-display-value[name="project.name"]', projectName).should("exist");
cy.fixture('admin.json').then(admin => {
cy.contains('solid-display-value[name="username"]', admin.username).should("exist");
});
});
});
describe('Project Creation process #2', () => {
let projectName = 'Test Project ',
customerName = 'Test Customer ',
description = 'Test Description ';
it('should visit the project creation screen', () => {
cy.visit('/admin/admin-projects/admin-project-create');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/admin/admin-projects/admin-project-create');
});
});
it('should enter correct project data', () => {
cy.randomNum().then(num => {
projectName += num;
customerName += num;
description += num;
cy.get('#admin-project-create input[name="customer.name"]').clear().type(customerName);
cy.get('#admin-project-create input[name="customer.name"]').should('have.value', customerName);
cy.get('#admin-project-create input[name="name"]').clear().type(projectName);
cy.get('#admin-project-create input[name="name"]').should('have.value', projectName);
cy.get('#admin-project-create textarea[name="description"]').clear().type(description);
cy.get('#admin-project-create textarea[name="description"]').should('have.value', description);
});
});
it('should click on create project button', () => {
cy.get('#admin-project-create input[type="submit"]').click();
});
it('should land on projects list screen', () => {
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/admin/admin-projects');
});
});
it('should land newly created project on projects list screen', () => {
cy.contains('solid-display-value[name="project.name"]', projectName).should("exist");
cy.fixture('admin.json').then(admin => {
cy.contains('solid-display-value[name="username"]', admin.username).should("exist");
});
});
});
});

56
cypress/integration/create-user.spec.js Normal file
View File

@ -0,0 +1,56 @@
/// <reference types="Cypress" />
/* globals cy, expect */
// Unable to create an user without a community. Unable to create community from app
// context('Create User Browser Testing', () => {
// let firstName = 'First ',
// lastName = 'Last ',
// username = 'testuser_creation_',
// email = '';
// before(() => {
// cy.randomNum().then(num => {
// firstName += num;
// lastName += num;
// username += num;
// email = username + '@testemail.com';
// });
// cy.clearLocalStorageSnapshot();
// cy.clearLocalStorage({ domain: null });
// cy.clearCookies({ domain: null });
// });
// beforeEach(() => cy.restoreLocalStorage());
// afterEach(() => cy.saveLocalStorage());
// it('should visit user login screen', () => cy.userLogin());
// it('should login', () => cy.login());
// describe('User Creation process', () => {
// it('should visit the user creation screen', () => {
// cy.visit('/admin/admin-users/admin-users-create');
// cy.location().should((loc) => {
// expect(loc.pathname).to.eq('/admin/admin-users/admin-users-create');
// });
// });
// it('should enter correct user data', () => {
// cy.get('#admin-users-create input[name="first_name"]').clear().type(firstName);
// cy.get('#admin-users-create input[name="first_name"]').should('have.value', firstName);
// cy.get('#admin-users-create input[name="last_name"]').clear().type(lastName);
// cy.get('#admin-users-create input[name="last_name"]').should('have.value', lastName);
// cy.get('#admin-users-create input[name="username"]').clear().type(username);
// cy.get('#admin-users-create input[name="username"]').should('have.value', username);
// cy.get('#admin-users-create input[name="email"]').clear().type(email);
// cy.get('#admin-users-create input[name="email"]').should('have.value', email);
// });
// it('should click on create user button', () => {
// cy.get('#admin-users-create input[type="submit"]').click();
// });
// it('should land on users list screen', () => {
// cy.location().should((loc) => {
// expect(loc.pathname).to.eq('/admin/admin-users');
// });
// });
// it('should land newly created user on users list screen', () => {
// cy.contains('solid-display-value[name="name"]', firstName + ' ' + lastName).should("exist");
// cy.contains('solid-display-value[name="username"]', username).should("exist");
// });
// });
// });

63
cypress/integration/delete-channel.spec.js Normal file
View File

@ -0,0 +1,63 @@
/// <reference types="Cypress" />
/* globals cy, expect */
context('Delete Channel Browser Testing', () => {
let menuQuery = [
'solid-display.circle-tab',
'solid-display:last-child',
'solid-display[order-by="name"]'
],
menuCountQuery = [
'solid-display.circle-tab',
'solid-display',
'solid-display[order-by="name"]'
];
before(() => {
cy.clearLocalStorageSnapshot();
cy.clearLocalStorage({ domain: null });
cy.clearCookies({ domain: null });
});
beforeEach(() => cy.restoreLocalStorage());
afterEach(() => cy.saveLocalStorage());
it('should visit user login screend', () => cy.userLogin());
it('should login', () => cy.login());
describe('Channel Retirement process', () => {
let channelsLength;
it('should visit the channels list screen', () => {
cy.visit('/admin');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/admin');
});
});
it('should visit the last channel edit screen', () => {
cy.get(menuQuery.join(' '))
.invoke('attr', 'data-src')
.then(url => cy.encodeUrl(url).then(id => {
cy.visit('/circle/@' + id + '/circle-information');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/circle/@' + id + '/circle-information');
});
}));
});
it('should count the number of joined channels', () => {
cy.get(menuCountQuery.join(' ')).its('length').then(length => channelsLength = length);
});
it('should click button to retire the channel', () => {
cy.get('#circle-profile solid-delete[data-label="Supprimer le canal"] button').click();
});
it('should stay on channel edit screen', () => {
cy.get(menuQuery.join(' '))
.invoke('attr', 'data-src')
.then(url => cy.encodeUrl(url).then(id => {
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/circle/@' + id + '/circle-information');
});
}));
});
it('should check if chennel was retired', () => {
cy.get(menuCountQuery.join(' ')).its('length').should(length => {
expect(length).to.eq(channelsLength - 1);
});
});
});
});

65
cypress/integration/edit-channel.spec.js Normal file
View File

@ -0,0 +1,65 @@
/// <reference types="Cypress" />
/* globals cy, expect */
context('Edit Channel Browser Testing', () => {
let channelName = 'Edited Test Channel ',
description = 'Edited Test Description ',
menuQuery = [
'solid-display.circle-tab',
'solid-display:last-child',
'solid-display[order-by="name"]'
];
before(() => {
cy.randomNum().then(num => {
channelName += num;
description += num;
});
cy.clearLocalStorageSnapshot();
cy.clearLocalStorage({ domain: null });
cy.clearCookies({ domain: null });
});
beforeEach(() => cy.restoreLocalStorage());
afterEach(() => cy.saveLocalStorage());
it('should visit user login screen', () => cy.userLogin());
it('should login', () => cy.login());
describe('Channel Edition process', () => {
it('should visit the channel list screen', () => {
cy.visit('/admin');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/admin');
});
});
it('should visit the last channel edit screen', () => {
cy.get(menuQuery.join(' '))
.invoke('attr', 'data-src')
.then(url => cy.encodeUrl(url).then(id => {
cy.visit('/circle/@' + id + '/circle-information/circle-edit');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/circle/@' + id + '/circle-information/circle-edit');
});
}));
});
it('should enter new channel data', () => {
cy.get('#circle-edit input[name="name"]').clear().type(channelName);
cy.get('#circle-edit input[name="name"]').should('have.value', channelName);
cy.get('#circle-edit input[name="description"]').clear().type(description);
cy.get('#circle-edit input[name="description"]').should('have.value', description);
});
it('should click button to save the channel', () => {
cy.get('#circle-edit input[value="Enregistrer"]').click();
});
it('should land on channel information screen', () => {
cy.get(menuQuery.join(' '))
.invoke('attr', 'data-src')
.then(url => cy.encodeUrl(url).then(id => {
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/circle/@' + id + '/circle-information');
});
}));
});
it('should show edited channel data on channel information screen', () => {
cy.contains('solid-display-value[name="name"]', channelName).should("exist");
cy.contains('solid-display-value[name="description"]', description).should("exist");
});
});
});

66
cypress/integration/edit-job-offer.spec.js Normal file
View File

@ -0,0 +1,66 @@
/// <reference types="Cypress" />
/* globals cy, expect */
context('Edit Job Offer Browser Testing', () => {
let jobDate = '',
jobTitle = 'Edited Test Job Offer ',
description = 'Edited Test Description ',
menuQuery = [
'solid-display.job-board__list',
'solid-display:last-child'
];
before(() => {
cy.nextYear(2).then(year => {
jobDate = year + '-12-31';
});
cy.randomNum().then(num => {
jobTitle += num;
description += num;
});
cy.clearLocalStorageSnapshot();
cy.clearLocalStorage({ domain: null });
cy.clearCookies({ domain: null });
});
beforeEach(() => cy.restoreLocalStorage());
afterEach(() => cy.saveLocalStorage());
it('should visit user login screen', () => cy.userLogin());
it('should login', () => cy.login());
describe('Job Offer Edition process', () => {
it('should visit the job offers list screen', () => {
cy.visit('/job-offers');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/job-offers');
});
});
it('should visit the last job offer edit screen', () => {
cy.get(menuQuery.join(' '))
.invoke('attr', 'data-src')
.then(url => cy.encodeUrl(url).then(id => {
cy.visit('/job-offers/job-offers-edit/@' + id);
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/job-offers/job-offers-edit/@' + id);
});
}));
});
it('should enter new job offer data', () => {
cy.get('#job-offers-edit input[name="closingDate"]').clear().type(jobDate);
cy.get('#job-offers-edit input[name="closingDate"]').should('have.value', jobDate);
cy.get('#job-offers-edit input[name="title"]').clear().type(jobTitle);
cy.get('#job-offers-edit input[name="title"]').should('have.value', jobTitle);
cy.get('#job-offers-edit textarea[name="description"]').clear().type(description);
cy.get('#job-offers-edit textarea[name="description"]').should('have.value', description);
});
it('should click button to save the job offer', () => {
cy.get('#job-offers-edit input[type="submit"]').click();
});
it('should land on job offers list screen', () => {
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/job-offers');
});
});
it('should show edited job offer data on job offer information screen', () => {
cy.contains('solid-display-value[name="title"]', jobTitle).should("exist");
cy.contains('solid-display-value[name="description"]', description).should("exist");
});
});
});

69
cypress/integration/edit-project.spec.js Normal file
View File

@ -0,0 +1,69 @@
/// <reference types="Cypress" />
/* globals cy, expect */
context('Edit Project Browser Testing', () => {
let projectName = 'Edited Test Project ',
customerName = 'Edited Test Customer ',
description = 'Edited Test Description ',
menuQuery = [
'solid-display.project-tab',
'solid-display:last-child',
'solid-display[order-by="customer.name"]'
];
before(() => {
cy.randomNum().then(num => {
projectName += num;
customerName += num;
description += num;
});
cy.clearLocalStorageSnapshot();
cy.clearLocalStorage({ domain: null });
cy.clearCookies({ domain: null });
});
beforeEach(() => cy.restoreLocalStorage());
afterEach(() => cy.saveLocalStorage());
it('should visit user login screen', () => cy.userLogin());
it('should login', () => cy.login());
describe('Project Edition process', () => {
it('should visit the project list screen', () => {
cy.visit('/admin/admin-projects');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/admin/admin-projects');
});
});
it('should visit the last project edit screen', () => {
cy.get(menuQuery.join(' '))
.invoke('attr', 'data-src')
.then(url => cy.encodeUrl(url).then(id => {
cy.visit('/project/@' + id + '/project-information/project-edit');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/project/@' + id + '/project-information/project-edit');
});
}));
});
it('should enter new project data', () => {
cy.get('#project-edit input[name="customer.name"]').clear().type(customerName);
cy.get('#project-edit input[name="customer.name"]').should('have.value', customerName);
cy.get('#project-edit input[name="name"]').clear().type(projectName);
cy.get('#project-edit input[name="name"]').should('have.value', projectName);
cy.get('#project-edit textarea[name="description"]').clear().type(description);
cy.get('#project-edit textarea[name="description"]').should('have.value', description);
});
it('should click button to save the project', () => {
cy.get('#project-edit input[value="Enregistrer"]').click();
});
it('should land on project information screen', () => {
cy.get(menuQuery.join(' '))
.invoke('attr', 'data-src')
.then(url => cy.encodeUrl(url).then(id => {
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/project/@' + id + '/project-information');
});
}));
});
it('should show edited project data on project information screen', () => {
cy.contains('solid-display-value[name="customer.name"]', customerName).should("exist");
cy.contains('solid-display-value[name="name"]', projectName).should("exist");
});
});
});

73
cypress/integration/edit-user.spec.js Normal file
View File

@ -0,0 +1,73 @@
/// <reference types="Cypress" />
/* globals cy, expect */
context('Edit User Browser Testing', () => {
let userFirstName = 'Edited User First Name ',
userLastName = 'Edited User Last Name ',
jobDescription = 'Edited Job Description ',
city = 'Edited City ',
phone = '+1234',
website = 'https://test.site/';
before(() => {
cy.randomNum().then(num => {
userFirstName += num;
userLastName += num;
jobDescription += num;
city += num;
phone += num;
website += num;
});
cy.clearLocalStorageSnapshot();
cy.clearLocalStorage({ domain: null });
cy.clearCookies({ domain: null });
});
beforeEach(() => cy.restoreLocalStorage());
afterEach(() => cy.saveLocalStorage());
it('should visit user login screen', () => cy.userLogin());
it('should login', () => cy.login());
describe('User Edition process', () => {
it('should visit the user edit screen', () => {
cy.visit('/profile/solid-profile-edit-profile');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/profile/solid-profile-edit-profile');
});
});
/// Workaround - Routing bug - user won't land on edit profile screen
it('should navigate to user edit screen', () => {
cy.get('#solid-profile-my-profile solid-link[next="solid-profile-edit-profile"]').click();
});
/// End workaround
it('should enter new user data', () => {
cy.get('#solid-profile-edit-profile input[name="first_name"]').clear().type(userFirstName);
cy.get('#solid-profile-edit-profile input[name="first_name"]').should('have.value', userFirstName);
cy.get('#solid-profile-edit-profile input[name="last_name"]').clear().type(userLastName);
cy.get('#solid-profile-edit-profile input[name="last_name"]').should('have.value', userLastName);
cy.get('#solid-profile-edit-profile textarea[name="profile.job"]').clear().type(jobDescription);
cy.get('#solid-profile-edit-profile textarea[name="profile.job"]').should('have.value', jobDescription);
cy.get('#solid-profile-edit-profile input[name="profile.city"]').clear().type(city);
cy.get('#solid-profile-edit-profile input[name="profile.city"]').should('have.value', city);
cy.get('#solid-profile-edit-profile input[name="profile.phone"]').clear().type(phone);
cy.get('#solid-profile-edit-profile input[name="profile.phone"]').should('have.value', phone);
cy.get('#solid-profile-edit-profile input[name="profile.website"]').clear().type(website);
cy.get('#solid-profile-edit-profile input[name="profile.website"]').should('have.value', website);
});
it('should click button to save the user', () => {
cy.get('#solid-profile-edit-profile input[value="ENREGISTRER"]').click();
});
it('should land on user information screen', () => {
cy.location().should(location => {
/// Workaround - Routing bug - route pathname won't be /profile as it should
expect(location.pathname).to.eq('/');
// expect(location.pathname).to.eq('/profile');
/// End workaround
});
});
it('should show edited user data on user information screen', () => {
cy.contains('solid-display-value[name="name"]', userFirstName + ' ' + userLastName).should("exist");
cy.contains('solid-display-value[name="profile.job"]', jobDescription).should("exist");
cy.contains('solid-display-value[name="profile.city"]', city).should("exist");
cy.contains('directory-link-tel a', phone).should("exist");
cy.contains('directory-website a', website).should("exist");
});
});
});

42
cypress/integration/leave-channel.spec.js Normal file
View File

@ -0,0 +1,42 @@
/// <reference types="Cypress" />
/* globals cy, expect */
context('Leave Channel Browser Testing', () => {
let tableQuery = [
'solid-display.table-body',
'solid-display:last-child',
'hubl-admin-circle-leave-button',
'solid-delete'
],
tableListQuery = [
'solid-display[nested-field="circles"]',
'div >',
'solid-display'
];
before(() => {
cy.clearLocalStorageSnapshot();
cy.clearLocalStorage({ domain: null });
cy.clearCookies({ domain: null });
});
beforeEach(() => cy.restoreLocalStorage());
afterEach(() => cy.saveLocalStorage());
it('should visit user login screend', () => cy.userLogin());
it('should login', () => cy.login());
describe('Channel Leaving process', () => {
it('should visit the channels list screen', () => {
cy.visit('/admin');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/admin');
});
});
it('should click the last channel leave button', () => {
cy.get(tableListQuery.join(' ')).its('length').as('channelsLength');
cy.get(tableQuery.join(' ')).click();
});
it('should check if chennel was left', () => {
cy.get(tableListQuery.join(' ')).its('length').should(length => {
expect(length).to.eq(this.channelsLength - 1);
});
});
});
});

42
cypress/integration/leave-project.spec.js Normal file
View File

@ -0,0 +1,42 @@
/// <reference types="Cypress" />
/* globals cy, expect */
context('Leave Project Browser Testing', () => {
let tableQuery = [
'solid-display.table-body',
'solid-display:last-child',
'hubl-admin-project-leave-button',
'solid-delete'
],
tableListQuery = [
'solid-display[nested-field="projects"]',
'div >',
'solid-display'
];
before(() => {
cy.clearLocalStorageSnapshot();
cy.clearLocalStorage({ domain: null });
cy.clearCookies({ domain: null });
});
beforeEach(() => cy.restoreLocalStorage());
afterEach(() => cy.saveLocalStorage());
it('should visit user login screend', () => cy.userLogin());
it('should login', () => cy.login());
describe('Project Leaving process', () => {
it('should visit the projects list screen', () => {
cy.visit('/admin/admin-projects');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/admin/admin-projects');
});
});
it('should click the last project leave button', () => {
cy.get(tableListQuery.join(' ')).its('length').as('projectsLength');
cy.get(tableQuery.join(' ')).click();
});
it('should check if project was left', () => {
cy.get(tableListQuery.join(' ')).its('length').should(length => {
expect(length).to.eq(this.projectsLength - 1);
});
});
});
});

84
cypress/integration/list-job-offers.spec.js Normal file
View File

@ -0,0 +1,84 @@
/// <reference types="Cypress" />
/* globals cy, expect */
context('List Job Offers Browser Testing', () => {
let listQuery = 'solid-display.job-board__list',
filtersQuery = [
listQuery,
'solid-form',
'input'
],
listingCountQuery = [
listQuery,
'solid-display'
],
firstListingQuery = [
listQuery,
'solid-display:first-child',
'solid-display-value'
];
before(() => {
cy.clearLocalStorageSnapshot();
cy.clearLocalStorage({ domain: null });
cy.clearCookies({ domain: null });
});
beforeEach(() => cy.restoreLocalStorage());
afterEach(() => cy.saveLocalStorage());
it('should visit user login screen', () => cy.userLogin());
it('should login', () => cy.login());
describe('Job Offer Listing process', () => {
let listingTitle,
listingDesccription,
listingCount;
it('should visit the job offers listing screen', () => {
cy.visit('/job-offers');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/job-offers');
});
});
it('should get the listing count', () => {
cy.get(listingCountQuery.join(' ')).its('length').then(length => listingCount = length);
});
it('should get the first job offer listing data', () => {
cy.get(firstListingQuery.join(' ') + '[name="title"]').invoke('text').then(text => listingTitle = text);
cy.get(firstListingQuery.join(' ') + '[name="description"]').invoke('text').then(text => listingDesccription = text);
});
// TO-DO: Search by title and description
/*it('should filter the listing by first name', () => {
cy.get(filtersQuery.join(' ') + '[name="title"]').clear().type(listingTitle);
cy.get(filtersQuery.join(' ') + '[name="title"]').should('have.value', listingTitle);
});
it('should get filtered listing count', () => {
cy.get(listingCountQuery.join(' ')).its('length').then(length => {
expect(length).to.eq(1);
});
});
it('should clear the first name filter', () => {
cy.get(filtersQuery.join(' ') + '[name="title"]').clear();
cy.get(filtersQuery.join(' ') + '[name="title"]').should('have.value', '');
});
it('should get previous listing count', () => {
cy.get(listingCountQuery.join(' ')).its('length').then(length => {
expect(length).to.eq(listingCount);
});
});
it('should filter the listing by first name', () => {
cy.get(filtersQuery.join(' ') + '[name="description"]').clear().type(listingDesccription);
cy.get(filtersQuery.join(' ') + '[name="description"]').should('have.value', listingDesccription);
});
it('should get filtered listing count', () => {
cy.get(listingCountQuery.join(' ')).its('length').then(length => {
expect(length).to.eq(1);
});
});
it('should clear the first name filter', () => {
cy.get(filtersQuery.join(' ') + '[name="description"]').clear();
cy.get(filtersQuery.join(' ') + '[name="description"]').should('have.value', '');
});
it('should get previous listing count', () => {
cy.get(listingCountQuery.join(' ')).its('length').then(length => {
expect(length).to.eq(listingCount);
});
});*/
});
});

124
cypress/integration/list-users.spec.js Normal file
View File

@ -0,0 +1,124 @@
/// <reference types="Cypress" />
/* globals cy, expect */
context('List Users Browser Testing', () => {
let listQuery = 'solid-display#members-list__content',
filtersQuery = [
listQuery,
'solid-form',
'input'
],
listingCountQuery = [
listQuery,
'div:first-child',
'span'
],
firstListingQuery = [
listQuery,
'solid-display:first-child',
'solid-display-value'
];
before(() => {
cy.clearLocalStorageSnapshot();
cy.clearLocalStorage({ domain: null });
cy.clearCookies({ domain: null });
});
beforeEach(() => cy.restoreLocalStorage());
afterEach(() => cy.saveLocalStorage());
it('should visit user login screen', () => cy.userLogin());
it('should login', () => cy.login());
describe('User Listing process', () => {
let listingFirstName,
listingLastName,
listingJob,
listingCity,
listingCount;
it('should visit the users listing screen', () => {
cy.visit('/members');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/members');
});
});
it('should get the listing count', () => {
cy.get(listingCountQuery.join(' ')).invoke('text').then(text => listingCount = text);
});
it('should get the first user listing data', () => {
cy.get(firstListingQuery.join(' ') + '[name="first_name"]').invoke('text').then(text => listingFirstName = text);
cy.get(firstListingQuery.join(' ') + '[name="last_name"]').invoke('text').then(text => listingLastName = text);
cy.get(firstListingQuery.join(' ') + '[name="profile.job"]').invoke('text').then(text => listingJob = text);
cy.get(firstListingQuery.join(' ') + '[name="profile.city"]').invoke('text').then(text => listingCity = text);
});
it('should filter the listing by first name', () => {
cy.get(filtersQuery.join(' ') + '[name="name"]').clear().type(listingFirstName);
cy.get(filtersQuery.join(' ') + '[name="name"]').should('have.value', listingFirstName);
});
it('should get filtered listing count', () => {
cy.get(listingCountQuery.join(' ')).invoke('text').then(text => {
expect(text).to.eq('1 membres');
});
});
it('should clear the first name filter', () => {
cy.get(filtersQuery.join(' ') + '[name="name"]').clear();
cy.get(filtersQuery.join(' ') + '[name="name"]').should('have.value', '');
});
it('should get previous listing count', () => {
cy.get(listingCountQuery.join(' ')).invoke('text').then(text => {
expect(text).to.eq(listingCount);
});
});
it('should filter the listing by last name', () => {
cy.get(filtersQuery.join(' ') + '[name="name"]').clear().type(listingLastName);
cy.get(filtersQuery.join(' ') + '[name="name"]').should('have.value', listingLastName);
});
it('should get filtered listing count', () => {
cy.get(listingCountQuery.join(' ')).invoke('text').then(text => {
expect(text).to.eq('1 membres');
});
});
it('should clear the last name filter', () => {
cy.get(filtersQuery.join(' ') + '[name="name"]').clear();
cy.get(filtersQuery.join(' ') + '[name="name"]').should('have.value', '');
});
it('should get previous listing count', () => {
cy.get(listingCountQuery.join(' ')).invoke('text').then(text => {
expect(text).to.eq(listingCount);
});
});
it('should filter the listing by job description', () => {
cy.get(filtersQuery.join(' ') + '[name="member-job"]').clear().type(listingJob);
cy.get(filtersQuery.join(' ') + '[name="member-job"]').should('have.value', listingJob);
});
it('should get filtered listing count', () => {
cy.get(listingCountQuery.join(' ')).invoke('text').then(text => {
expect(text).to.eq('1 membres');
});
});
it('should clear the job description filter', () => {
cy.get(filtersQuery.join(' ') + '[name="member-job"]').clear();
cy.get(filtersQuery.join(' ') + '[name="member-job"]').should('have.value', '');
});
it('should get previous listing count', () => {
cy.get(listingCountQuery.join(' ')).invoke('text').then(text => {
expect(text).to.eq(listingCount);
});
});
it('should filter the listing by city', () => {
cy.get(filtersQuery.join(' ') + '[name="member-city"]').clear().type(listingCity);
cy.get(filtersQuery.join(' ') + '[name="member-city"]').should('have.value', listingCity);
});
it('should get filtered listing count', () => {
cy.get(listingCountQuery.join(' ')).invoke('text').then(text => {
expect(text).to.eq('1 membres');
});
});
it('should clear the city filter', () => {
cy.get(filtersQuery.join(' ') + '[name="member-city"]').clear();
cy.get(filtersQuery.join(' ') + '[name="member-city"]').should('have.value', '');
});
it('should get previous listing count', () => {
cy.get(listingCountQuery.join(' ')).invoke('text').then(text => {
expect(text).to.eq(listingCount);
});
});
});
});

63
cypress/integration/retire-channel.spec.js Normal file
View File

@ -0,0 +1,63 @@
/// <reference types="Cypress" />
/* globals cy, expect */
context('Retire Channel Browser Testing', () => {
let menuQuery = [
'solid-display.circle-tab',
'solid-display:last-child',
'solid-display[order-by="name"]'
],
menuCountQuery = [
'solid-display.circle-tab',
'solid-display',
'solid-display[order-by="name"]'
];
before(() => {
cy.clearLocalStorageSnapshot();
cy.clearLocalStorage({ domain: null });
cy.clearCookies({ domain: null });
});
beforeEach(() => cy.restoreLocalStorage());
afterEach(() => cy.saveLocalStorage());
it('should visit user login screend', () => cy.userLogin());
it('should login', () => cy.login());
describe('Channel Retirement process', () => {
let channelsLength;
it('should visit the channels list screen', () => {
cy.visit('/admin');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/admin');
});
});
it('should visit the last channel edit screen', () => {
cy.get(menuQuery.join(' '))
.invoke('attr', 'data-src')
.then(url => cy.encodeUrl(url).then(id => {
cy.visit('/circle/@' + id + '/circle-information/circle-edit');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/circle/@' + id + '/circle-information/circle-edit');
});
}));
});
it('should count the number of joined channels', () => {
cy.get(menuCountQuery.join(' ')).its('length').then(length => channelsLength = length);
});
it('should click button to retire the channel', () => {
cy.get('solid-multiple[name="members"] solid-delete[data-label="Retirer"] button').click();
});
it('should stay on channel edit screen', () => {
cy.get(menuQuery.join(' '))
.invoke('attr', 'data-src')
.then(url => cy.encodeUrl(url).then(id => {
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/circle/@' + id + '/circle-information/circle-edit');
});
}));
});
it('should check if chennel was retired', () => {
cy.get(menuCountQuery.join(' ')).its('length').should(length => {
expect(length).to.eq(channelsLength - 1);
});
});
});
});

63
cypress/integration/retire-project.spec.js Normal file
View File

@ -0,0 +1,63 @@
/// <reference types="Cypress" />
/* globals cy, expect */
context('Retire Project Browser Testing', () => {
let menuQuery = [
'solid-display.project-tab',
'solid-display:last-child',
'solid-display[order-by="customer.name"]'
],
menuCountQuery = [
'solid-display.project-tab',
'solid-display',
'solid-display[order-by="customer.name"]'
];
before(() => {
cy.clearLocalStorageSnapshot();
cy.clearLocalStorage({ domain: null });
cy.clearCookies({ domain: null });
});
beforeEach(() => cy.restoreLocalStorage());
afterEach(() => cy.saveLocalStorage());
it('should visit user login screend', () => cy.userLogin());
it('should login', () => cy.login());
describe('Project Retirement process', () => {
let projectsLength;
it('should visit the projects list screen', () => {
cy.visit('/admin/admin-projects');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/admin/admin-projects');
});
});
it('should visit the last project edit screen', () => {
cy.get(menuQuery.join(' '))
.invoke('attr', 'data-src')
.then(url => cy.encodeUrl(url).then(id => {
cy.visit('/project/@' + id + '/project-information/project-edit');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/project/@' + id + '/project-information/project-edit');
});
}));
});
it('should count the number of joined projects', () => {
cy.get(menuCountQuery.join(' ')).its('length').then(length => projectsLength = length);
});
it('should click button to retire the project', () => {
cy.get('solid-multiple[name="members"] solid-delete[data-label="Retirer"] button').click();
});
it('should stay on project edit screen', () => {
cy.get(menuQuery.join(' '))
.invoke('attr', 'data-src')
.then(url => cy.encodeUrl(url).then(id => {
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/project/@' + id + '/project-information/project-edit');
});
}));
});
it('should check if project was retired', () => {
cy.get(menuCountQuery.join(' ')).its('length').should(length => {
expect(length).to.eq(projectsLength - 1);
});
});
});
});

17
cypress/integration/tests.spec.js → cypress/integration/signin.spec.js
View File

@ -1,19 +1,13 @@
/// <reference types="Cypress" /> /// <reference types="Cypress" />
/* globals cy, expect */
context('Browser testing', () => { context('Browser testing', () => {
before(() => { before(() => {
cy.clearLocalStorageSnapshot();
cy.clearLocalStorage({ domain: null}); cy.clearLocalStorage({ domain: null});
cy.clearCookies({ domain: null }); cy.clearCookies({ domain: null });
}); });
it('visit the homepage', () => { it('should visit user login screen', () => cy.userLogin());
cy.visit('/');
});
it('should await for an user login', () => {
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/auth/login/');
});
});
describe('Login process', () => { describe('Login process', () => {
it('should write "admin" on username field and "password" on password field', () => { it('should write "admin" on username field and "password" on password field', () => {
cy.get('#id_username').type('admin'); cy.get('#id_username').type('admin');
@ -25,7 +19,7 @@ context('Browser testing', () => {
cy.get(':nth-child(1) > .flex-column > [type="submit"]').click(); cy.get(':nth-child(1) > .flex-column > [type="submit"]').click();
}); });
it('should provide an error, username and password mismatch.', () => { it('should provide an error, username and password mismatch.', () => {
cy.get('.error').should('contain.text', 'Ton nom d\'utilisateur et ton mot de passe ne correspondent pas. Réessaye.') cy.get('.error').should('contain.text', 'Ton nom d\'utilisateur et ton mot de passe ne correspondent pas. Réessaye.');
}); });
it('should write "admin" on password field then press the login button', () => { it('should write "admin" on password field then press the login button', () => {
cy.get('#id_password').type('admin'); cy.get('#id_password').type('admin');
@ -34,7 +28,7 @@ context('Browser testing', () => {
}); });
it('should ask for user permission to access their datas.', () => { it('should ask for user permission to access their datas.', () => {
cy.location().should((loc) => { cy.location().should((loc) => {
expect(loc.pathname).to.eq('/authorize') expect(loc.pathname).to.eq('/authorize');
}); });
cy.get('.accept-button').click(); cy.get('.accept-button').click();
}); });
@ -105,4 +99,3 @@ context('Browser testing', () => {
// }); // });
}); });
}); });

61
cypress/integration/signup.spec.js Normal file
View File

@ -0,0 +1,61 @@
/// <reference types="Cypress" />
/* globals cy */
context('Signup Browser Testing', () => {
let username = 'testuser_creation_',
email = '',
password = 'testpwd';
before(() => {
cy.randomNum().then(num => {
username += num;
email = username + '@testemail.com';
});
cy.clearLocalStorageSnapshot();
cy.clearLocalStorage({ domain: null });
cy.clearCookies({ domain: null });
});
it('should visit user login screen', () => cy.userLogin());
describe('Signup process', () => {
it('should click on signup page link', () => {
cy.get('.sib-link.sib-register-link').click();
});
it('should write incorrect user data', () => {
cy.get('#id_username').type('!"#$%&');
cy.get('#id_username').should('have.value', '!"#$%&');
cy.get('#id_email').type(email.split('.')[0]);
cy.get('#id_email').should('have.value', email.split('.')[0]);
cy.get('#id_password1').type(password + 'wrong1');
cy.get('#id_password1').should('have.value', password + 'wrong1');
cy.get('#id_password2').type(password + 'wrong2');
cy.get('#id_password2').should('have.value', password + 'wrong2');
});
it('should click on signup button', () => {
cy.get('.sib-registration-btn').click();
});
it('should provide errors about incorrect user data', () => {
cy.get('tbody tr:nth-child(1) ul.errorlist li')
.should('contain.text', 'Enter a valid username. This value may contain only letters, numbers, and ./+/-/_ characters.');
cy.get('tbody tr:nth-child(2) ul.errorlist li')
.should('contain.text', 'Enter a valid email address.');
cy.get('tbody tr:nth-child(4) ul.errorlist li')
.should('contain.text', 'The two password fields didn\'t match.');
});
it('should write correct user data', () => {
cy.get('#id_username').clear().type(username);
cy.get('#id_username').should('have.value', username);
cy.get('#id_email').clear().type(email);
cy.get('#id_email').should('have.value', email);
cy.get('#id_password1').clear().type(password);
cy.get('#id_password1').should('have.value', password);
cy.get('#id_password2').clear().type(password);
cy.get('#id_password2').should('have.value', password);
});
it('should click on signup button', () => {
cy.get('.sib-registration-btn').click();
});
it('should show email confirmation dialog', () => {
cy.contains('h1.text-center', 'Un e-mail d\'activation a été envoyé.').should("exist");
cy.contains('p.text-center', 'Vérifie ta boite mail et clique sur le lien pour activer ton compte.').should("exist");
});
});
});

47
cypress/support/commands.js
View File

@ -23,3 +23,50 @@
// //
// -- This will overwrite an existing command -- // -- This will overwrite an existing command --
// Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... }) // Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... })
/* globals Cypress, cy, expect */
import 'cypress-localstorage-commands';
Cypress.Commands.add('login', () => {
cy.fixture('admin.json').then(admin => {
cy.get('#id_username').type(admin.username);
cy.get('#id_username').should('have.value', admin.username);
cy.get('#id_password').type(admin.password);
cy.get('#id_password').should('have.value', admin.password);
cy.get('.connection-btn').click();
cy.location('pathname').should('include', '/authorize');
cy.get('.accept-button').click();
cy.location().should(location => {
expect(location.pathname).to.eq('/');
});
});
});
Cypress.Commands.add('userLogin', () => {
cy.visit('/');
cy.location().should((loc) => {
expect(loc.pathname).to.eq('/auth/login/');
});
});
Cypress.Commands.add('encodeUrl', url => {
const encodeIdReplacement = [
['~', '~~'],
['.', '~!'],
[':', '~@'],
['/', '~_'],
];
encodeIdReplacement.forEach(([char, repl]) => {
url = url.split(char).join(repl);
});
return url;
});
Cypress.Commands.add('randomNum', () => {
return Math.floor(1000 + Math.random() * 9000);
});
Cypress.Commands.add('nextYear', increment => {
return new Date().getFullYear() + ( increment || 1 );
});

11
cypress/support/index.js
View File

@ -13,8 +13,10 @@
// https://on.cypress.io/configuration // https://on.cypress.io/configuration
// *********************************************************** // ***********************************************************
/* globals Cypress */
// Import commands.js using ES2015 syntax: // Import commands.js using ES2015 syntax:
import './commands' import './commands';
//require('cypress-terminal-report').installSupport(); //require('cypress-terminal-report').installSupport();
@ -27,4 +29,9 @@ Cypress.on('uncaught:exception', (err, runnable) => {
return false; return false;
}); });
Cypress.on('fail', () => Cypress.runner.abort()) Cypress.on('fail', (error) => {
console.log(error);
if ( typeof Cypress.runner.abort == 'function' ) {
Cypress.runner.abort();
}
});

39
make-webmanifest.mjs Normal file
View File

@ -0,0 +1,39 @@
'use strict';
import fs from 'fs';
if(!fs.existsSync("config.json")) throw "[Error] (Mandatory) Missing config.json file";
let config = JSON.parse(fs.readFileSync('config.json'));
if(!config.clientName) throw "[Error] (Mandatory) Missing clientName on config.json";
if(!config.clientLogo) throw "[Error] (Mandatory) Missing clientLogo on config.json";
let manifest = {
"lang": "fr",
"dir": "ltr",
"name": config.clientName,
"description": `Hubl of ${config.clientName}`,
"short_name": config.clientName,
"icons": [{
"src": config.clientLogo,
"purpose": "any"
}, {
"src": "/images/hubl-icon-192.png",
"sizes": "192x192",
"type": "image/png"
}, {
"src": "/images/hubl-icon-512.png",
"sizes": "512x512",
"type": "image/png"
}],
"start_url": ".",
"display": "standalone",
"orientation": "portrait",
"background_color": "#fff",
'theme_color': "white"
}
fs.existsSync("dist") || fs.mkdirSync("dist");
fs.writeFileSync('dist/manifest.webmanifest', JSON.stringify(manifest, null, 2));
console.log(`Created manifest for ${config.clientName}`);

9538
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

36
package.json
View File

@ -9,22 +9,40 @@
"scripts": { "scripts": {
"build": "run-p copy:* build:*", "build": "run-p copy:* build:*",
"build:css": "node-sass src/styles/index.scss -o dist/styles/", "build:css": "node-sass src/styles/index.scss -o dist/styles/",
"build:js": "babel 'src/scripts/*.js' -o dist/scripts/index.js", "build:js": "babel \"src/scripts/*.js\" -o dist/scripts/index.js",
"build:jscomponents": "babel 'src/components/*.js' --out-dir dist/components/", "build:jscomponents": "babel \"src/components/*.js\" --out-dir dist/components/",
"build:html": "pug src/index.pug -o dist/ --obj config.json", "build:pug": "pug src/index.pug -o dist/ --obj config.json",
"build:manifest": "node --experimental-modules make-webmanifest.mjs",
"build:i18n": "copyfiles -u 2 src/locales/*.json dist/locales",
"copy:font": "copyfiles -f src/fonts/* dist/fonts", "copy:font": "copyfiles -f src/fonts/* dist/fonts",
"copy:image": "copyfiles -f src/images/* dist/images", "copy:image": "copyfiles -f src/images/* dist/images",
"copy:sw": "copyfiles -f src/sw.js dist",
"serve": "pushstate-server -d ./dist -p 3000", "serve": "pushstate-server -d ./dist -p 3000",
"watch": "run-p copy:* watch:* serve", "watch": "run-p build watch:* serve",
"watch:css": "npm run build:css && npm run build:css -- -w", "watch:css": "npm-watch build:css",
"watch:js": "babel --watch \"src/scripts/*.js\" -o dist/scripts/index.js", "watch:js": "npm-watch build:js",
"watch:jscomponents": "babel --watch \"src/components/*.js\" --out-dir dist/components/", "watch:jscomponents": "npm-watch build:jscomponents",
"watch:manifest": "npm-watch build:manifest",
"watch:pug": "pug --watch src/index.pug -o dist/ --obj config.json", "watch:pug": "pug --watch src/index.pug -o dist/ --obj config.json",
"watch:i18n": "npm-watch build:i18n",
"watch:font": "npm-watch copy:font",
"watch:image": "npm-watch copy:image",
"watch:sw": "npm-watch copy:sw",
"cypress:open": "cypress open", "cypress:open": "cypress open",
"cypress:verify": "cypress verify", "cypress:verify": "cypress verify",
"cypress:info": "cypress info", "cypress:info": "cypress info",
"test": "cypress run" "test": "cypress run"
}, },
"watch": {
"build:css": "src/styles/**/*",
"build:manifest": "make-webmanifest.mjs",
"build:i18n": "src/locales/**/*",
"copy:images": "src/fonts/*.js",
"copy:fonts": "src/images/*.js",
"copy:sw": "src/sw.js",
"build:js": "src/scripts/*.js",
"build:jscomponents": "src/components/*.js"
},
"release": { "release": {
"branches": [ "branches": [
"master" "master"
@ -68,6 +86,8 @@
}, },
"devDependencies": { "devDependencies": {
"cypress": "^4.5.0", "cypress": "^4.5.0",
"cypress-terminal-report": "^1.2.1" "cypress-localstorage-commands": "^1.2.1",
"cypress-terminal-report": "^1.2.1",
"npm-watch": "^0.7.0"
} }
} }

12
src/components/hubl-reactivity.js
View File

@ -1,6 +1,4 @@
import { store } from 'https://unpkg.com/@startinblox/core@0.10'; import { store, Sib, StoreMixin } from 'https://cdn.skypack.dev/@startinblox/core@0.13';
import { Sib } from "https://unpkg.com/@startinblox/core@0.10/dist/libs/Sib.js";
import { StoreMixin } from "https://unpkg.com/@startinblox/core@0.10/dist/mixins/storeMixin.js";
export const HublReactivity = { export const HublReactivity = {
name: 'hubl-reactivity', name: 'hubl-reactivity',
@ -13,10 +11,8 @@ export const HublReactivity = {
this.subscribe(); this.subscribe();
} }
}, },
dataSrc: { },
type: String, async fetchData(value) {
default: '',
callback: async function (value) {
this.resourceId = null; this.resourceId = null;
if (this.nestedField) { if (this.nestedField) {
const resource = store.get(value) || await store.getData(value, this.context); const resource = store.get(value) || await store.getData(value, this.context);
@ -26,8 +22,6 @@ export const HublReactivity = {
this.resourceId = value; this.resourceId = value;
} }
this.subscribe(); this.subscribe();
}
},
}, },
subscribe() { subscribe() {
if (this.resourceId && this.targetSrc) { if (this.resourceId && this.targetSrc) {

2
src/components/hubl-search-users.js
View File

@ -1,4 +1,4 @@
import { widgetFactory } from 'https://unpkg.com/@startinblox/core@0.10/dist/widgets/widget-factory.js'; import { widgetFactory } from 'https://cdn.skypack.dev/@startinblox/core@0.13';
const HublSearchUsers = widgetFactory( const HublSearchUsers = widgetFactory(
'hubl-search-users', 'hubl-search-users',

11
src/components/hubl-status.js
View File

@ -1,6 +1,5 @@
import { widgetFactory } from 'https://unpkg.com/@startinblox/core@0.10/dist/widgets/widget-factory.js'; import { widgetFactory, Helpers } from 'https://cdn.skypack.dev/@startinblox/core@0.13';
import { importCSS } from 'https://unpkg.com/@startinblox/core@0.10/dist/libs/helpers.js'; import SlimSelect from 'https://cdn.skypack.dev/slim-select@1.23';
import SlimSelect from 'https://dev.jspm.io/slim-select@1.23';
const HublStatus = widgetFactory( const HublStatus = widgetFactory(
'hubl-status', 'hubl-status',
@ -11,10 +10,10 @@ const HublStatus = widgetFactory(
name="\${name}"> name="\${name}">
<option <option
value="Public" value="Public"
\${value=="Public" ? 'selected' : ''}>Public</option> \${value=="Public" ? 'selected' : ''} data-trans="hublStatus.public">Public</option>
<option <option
value="Private" value="Private"
\${value=="Private" ? 'selected' : ''}>Privé</option> \${value=="Private" ? 'selected' : ''} data-trans="hublStatus.private">Privé</option>
</select> </select>
</label>`, </label>`,
'', '',
@ -22,7 +21,7 @@ const HublStatus = widgetFactory(
let select = formWidget.querySelector('select'); let select = formWidget.querySelector('select');
if (!select) return; if (!select) return;
const slimSelect = new SlimSelect({select: select}); const slimSelect = new SlimSelect({select: select});
importCSS('https://dev.jspm.io/slim-select/dist/slimselect.min.css'); Helpers.importCSS('https://dev.jspm.io/slim-select/dist/slimselect.min.css');
select.addEventListener('change', () => slimSelect.render()); select.addEventListener('change', () => slimSelect.render());
}, },
); );

8
src/components/sentry.js Normal file
View File

@ -0,0 +1,8 @@
if(typeof Sentry !== 'undefined') {
Sentry.init({
dsn: 'https://b4b29557689049a39168599577adb940@sentry.startinblox.com/4',
integrations: [new Sentry.Integrations.BrowserTracing()],
environment: document.location.hostname,
tracesSampleRate: 0.2,
});
}

43
src/dependencies.pug
View File

@ -1,46 +1,55 @@
script(src="https://browser.sentry-cdn.com/5.25.0/bundle.tracing.min.js" defer)
script(type="module" src="/components/sentry.js" defer)
script(type="module" src="/components/hubl-search-users.js" defer) script(type="module" src="/components/hubl-search-users.js" defer)
script(type="module" src="/components/hubl-status.js" defer) script(type="module" src="/components/hubl-status.js" defer)
script(type="module" src="/components/hubl-reactivity.js" defer) script(type="module" src="/components/hubl-reactivity.js" defer)
script(type="module" src="https://unpkg.com/@startinblox/core@0.10" defer) script(type="module" src="https://cdn.skypack.dev/@startinblox/core@0.13" defer)
//- script(type="module" src="/lib/sib-core/dist/index.js" defer) //- script(type="module" src="/lib/sib-core/dist/index.js" defer)
script(type="module" src="https://unpkg.com/@startinblox/oidc@0.9" defer) script(type="module" src="https://cdn.skypack.dev/@startinblox/oidc@0.11" defer)
//- script(type="module" src="/lib/sib-oidc/index.js" defer) //- script(type="module" src="/lib/sib-auth/index.js" defer)
script(type="module" src="https://unpkg.com/@startinblox/router@0.8" defer) script(type="module" src="https://cdn.skypack.dev/@startinblox/router@0.11" defer)
//- script(type="module" src="/lib/solid-router/src/index.js" defer) //- script(type="module" src="/lib/sib-router/src/index.js" defer)
script(type="module" src="https://unpkg.com/@startinblox/component-notifications@0.6.2" defer) script(type="module" src="https://cdn.skypack.dev/@startinblox/component-notifications@0.8" defer)
//- script(type="module" src="/lib/sib-notifications/index.js" defer) //- script(type="module" src="/lib/sib-notifications/index.js" defer)
if (endpoints.events || (endpoints.get && endpoints.get.events)) && (endpoints.typeevents || (endpoints.get && endpoints.get.typeevents)) //- DISABLED - please migrate to dev.skypack.dev + upgrade to core@0.13
script(type="module" src="https://unpkg.com/@startinblox/component-event@1.1" defer) //- if (endpoints.events || (endpoints.get && endpoints.get.events)) && (endpoints.typeevents || (endpoints.get && endpoints.get.typeevents))
//- script(type="module" src="https://cdn.skypack.dev/@startinblox/component-event@1.2" defer)
//- script(type="module" src="/lib/sib-event-component/sib-event.js" defer) //- script(type="module" src="/lib/sib-event-component/sib-event.js" defer)
if (endpoints.resources || (endpoints.get && endpoints.get.resources)) && (endpoints.resourceskeywords || (endpoints.get && endpoints.get.resourceskeywords)) && (endpoints.resourcestypes || (endpoints.get && endpoints.get.resourcestypes)) //- DISABLED - please migrate to dev.skypack.dev + upgrade to core@0.13
script(type="module" src="https://unpkg.com/@startinblox/component-resource@1.0" defer) //- if (endpoints.resources || (endpoints.get && endpoints.get.resources)) && (endpoints.resourceskeywords || (endpoints.get && endpoints.get.resourceskeywords)) && (endpoints.resourcestypes || (endpoints.get && endpoints.get.resourcestypes))
//- script(type="module" src="https://cdn.skypack.dev/@startinblox/component-resource@1.0" defer)
//- script(type="module" src="/lib/sib-resource/sib-resource.js" defer) //- script(type="module" src="/lib/sib-resource/sib-resource.js" defer)
if endpoints.joboffers || (endpoints.get && endpoints.get.joboffers) if endpoints.joboffers || (endpoints.get && endpoints.get.joboffers)
script(type="module" src="https://unpkg.com/@startinblox/component-job-board@0.6" defer) script(type="module" src="https://cdn.skypack.dev/@startinblox/component-job-board@1.2" defer)
//- script(type="module" src="/lib/solid-job-board/dist/index.js" defer) //- script(type="module" src="/lib/solid-job-board/dist/index.js" defer)
if (endpoints.uploads || (endpoints.get && endpoints.get.uploads)) && (endpoints.skills || (endpoints.get && endpoints.get.skills)) && (endpoints.users || (endpoints.get && endpoints.get.users)) if (endpoints.uploads || (endpoints.get && endpoints.get.uploads)) && (endpoints.skills || (endpoints.get && endpoints.get.skills)) && (endpoints.users || (endpoints.get && endpoints.get.users))
script(type="module" src="https://unpkg.com/@startinblox/component-directory@0.7" defer) script(type="module" src="https://cdn.skypack.dev/@startinblox/component-directory@1.2" defer)
//- script(type="module" src="/lib/solid-directory/dist/index.js" defer) //- script(type="module" src="/lib/solid-directory/dist/index.js" defer)
if endpoints.dashboards || (endpoints.get && endpoints.get.dashboards) if endpoints.dashboards || (endpoints.get && endpoints.get.dashboards)
script(type="module" src="https://unpkg.com/@startinblox/component-dashboard@0.3" defer) script(type="module" src="https://cdn.skypack.dev/@startinblox/component-dashboard@0.6" defer)
//- script(type="module" src="/lib/solid-dashboard/dist/index.js" defer) //- script(type="module" src="/lib/solid-dashboard/dist/index.js" defer)
if endpoints.users || (endpoints.get && endpoints.get.users) if endpoints.users || (endpoints.get && endpoints.get.users)
script(type="module" src="https://unpkg.com/@startinblox/component-chat@0.8" defer) script(type="module" src="https://cdn.skypack.dev/@startinblox/component-chat@1.4" defer)
//- script(type="module" src="/lib/solid-xmpp-chat/dist/index.js" defer) //- script(type="module" src="/lib/solid-xmpp-chat/dist/index.js" defer)
if endpoints.polls || (endpoints.get && endpoints.get.polls) //- DISABLED - please migrate to dev.skypack.dev + upgrade to core@0.13
script(type="module" src="https://unpkg.com/@startinblox/component-poll@1.0" defer) //- if endpoints.polls || (endpoints.get && endpoints.get.polls)
//- script(type="module" src="/lib/sib-event-component/sib-event.js" defer) //- script(type="module" src="https://cdn.skypack.dev/@startinblox/component-poll@1.0" defer)
//- script(type="module" src="/lib/sib-polls-component/index.js" defer)
//- swal2 does not work with skypack
script(src="https://cdn.jsdelivr.net/npm/sweetalert2@10")
script(src="/scripts/index.js" defer) script(src="/scripts/index.js" defer)

21
src/header.pug
View File

@ -1,6 +1,9 @@
.header-left
.logo .logo
solid-link(next='dashboard') solid-link(next='dashboard')
img(src=`${clientLogo || '/images/logo.png'}` style=`max-height:${clientLogoHeight || '32px'}`) img(src=`${clientLogo || '/images/logo.webp'}` style=`max-height:${clientLogoHeight || '74px'}`)
span.beta-tag(data-trans='header.beta')
solid-notifications.notLoggedIn( solid-notifications.notLoggedIn(
nested-field="inbox" nested-field="inbox"
@ -8,8 +11,8 @@ solid-notifications.notLoggedIn(
) )
//- Templates for notifications from circles and from other users //- Templates for notifications from circles and from other users
include views/circle/page-circle-notifications.pug include views/notifications/message-circle.pug
include views/user/page-user-notifications.pug include views/notifications/message-private.pug
include templates/hubl-user-avatar.pug include templates/hubl-user-avatar.pug
@ -27,18 +30,18 @@ details#user-controls.notLoggedIn
ul ul
if (endpoints.uploads || (endpoints.get && endpoints.get.uploads)) && (endpoints.skills || (endpoints.get && endpoints.get.skills)) && (endpoints.users || (endpoints.get && endpoints.get.users)) if (endpoints.uploads || (endpoints.get && endpoints.get.uploads)) && (endpoints.skills || (endpoints.get && endpoints.get.skills)) && (endpoints.users || (endpoints.get && endpoints.get.users))
li li
solid-link(next='profile') Mon profil solid-link(next='profile' data-trans='header.myProfile')
li li
solid-link(next='admin') Administration solid-link(next='admin' data-trans='header.admin')
li li
solid-link(next='about') A propos solid-link(next='about' data-trans='header.about')
button(role='log out' onclick="document.querySelector('sib-auth').logout();") Se déconnecter button(role='log out' onclick="document.querySelector('sib-auth').logout();" data-trans='header.logOut')
button.loggedIn(role='log in' onclick="document.querySelector('sib-auth').login();") Se connecter button.loggedIn(role='log in' onclick="document.querySelector('sib-auth').login();" data-trans='header.logIn')
button.notLoggedIn.mobile-menu-icon.icon-menu#toggleMainMenu button.notLoggedIn.mobile-menu-icon.icon-menu#toggleMainMenu
sib-auth(style='display:none!important') sib-auth(style='display:none!important', auto-login)
sib-auth-provider( sib-auth-provider(
data-authority=`${authority}` data-authority=`${authority}`
data-id=`${authorityName || "authority"}` data-id=`${authorityName || "authority"}`

BIN
src/images/favicon.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 7.5 KiB

BIN
src/images/favicon.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 832 B

BIN
src/images/hubl-icon-192.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 32 KiB

BIN
src/images/hubl-icon-512.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 106 KiB

BIN
src/images/logo.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 8.5 KiB

BIN
src/images/logo.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.0 KiB

28
src/index.pug
View File

@ -9,11 +9,11 @@ html(lang="en")
if clientFavicon if clientFavicon
link(rel="icon" type="image/png" href=`${clientFavicon}`) link(rel="icon" type="image/png" href=`${clientFavicon}`)
else else
link(rel="icon" type="image/png" href="/images/favicon.png") link(rel="icon" type="image/webp" href="/images/favicon.webp")
include dependencies.pug include dependencies.pug
if clientCSS if clientCSS
link(rel='stylesheet', href=`${clientCSS}`) link(rel='stylesheet', href=`${clientCSS}`)
link(rel="manifest" href="/manifest.webmanifest")
body body
.wrapper .wrapper
@ -27,15 +27,15 @@ html(lang="en")
main#viewport.content.notLoggedIn main#viewport.content.notLoggedIn
if endpoints.dashboards || (endpoints.get && endpoints.get.dashboards) if endpoints.dashboards || (endpoints.get && endpoints.get.dashboards)
#dashboard(hidden).no-sidebar.with-padding #dashboard(hidden, data-view="dashboard").no-sidebar.with-padding
include page-dashboard.pug include page-dashboard.pug
if publicDirectory && (endpoints.users || (endpoints.get && endpoints.get.users)) if publicDirectory && (endpoints.users || (endpoints.get && endpoints.get.users))
#members(hidden).no-sidebar.with-padding #members(hidden, data-view="members", no-render).no-sidebar.with-padding
include page-directory.pug include page-directory.pug
if endpoints.joboffers || (endpoints.get && endpoints.get.joboffers) if endpoints.joboffers || (endpoints.get && endpoints.get.joboffers)
#job-offers(hidden).no-sidebar.with-padding #job-offers(hidden, data-view="job-offers", no-render).no-sidebar.with-padding
if (endpoints.post && endpoints.post.joboffers) && (endpoints.get && endpoints.get.joboffers) if (endpoints.post && endpoints.post.joboffers) && (endpoints.get && endpoints.get.joboffers)
hubl-reactivity(data-src=`${endpoints.post.joboffers}current/` target-src=`${endpoints.get.joboffers}`) hubl-reactivity(data-src=`${endpoints.post.joboffers}current/` target-src=`${endpoints.get.joboffers}`)
hubl-reactivity(data-src=`${endpoints.post.joboffers}expired/` target-src=`${endpoints.get.joboffers}`) hubl-reactivity(data-src=`${endpoints.post.joboffers}expired/` target-src=`${endpoints.get.joboffers}`)
@ -49,7 +49,7 @@ html(lang="en")
include page-job-offers.pug include page-job-offers.pug
if endpoints.projects || (endpoints.get && endpoints.get.projects) if endpoints.projects || (endpoints.get && endpoints.get.projects)
#project(hidden).with-sidebar #project(hidden, data-view="project", no-render).with-sidebar
if (endpoints.post && endpoints.post.projects) && (endpoints.get && endpoints.get.projects) if (endpoints.post && endpoints.post.projects) && (endpoints.get && endpoints.get.projects)
hubl-reactivity(data-src=`${endpoints.post.projects}joinable/` target-src=`${endpoints.get.projects}`) hubl-reactivity(data-src=`${endpoints.post.projects}joinable/` target-src=`${endpoints.get.projects}`)
hubl-reactivity(data-src=`${endpoints.post.projects}` target-src=`${endpoints.get.projects}`) hubl-reactivity(data-src=`${endpoints.post.projects}` target-src=`${endpoints.get.projects}`)
@ -61,7 +61,7 @@ html(lang="en")
include page-project.pug include page-project.pug
if endpoints.circles || (endpoints.get && endpoints.get.circles) if endpoints.circles || (endpoints.get && endpoints.get.circles)
#circle(hidden).with-sidebar #circle(hidden, data-view="circle", no-render).with-sidebar
if (endpoints.post && endpoints.post.circles) && (endpoints.get && endpoints.get.circles) if (endpoints.post && endpoints.post.circles) && (endpoints.get && endpoints.get.circles)
hubl-reactivity(data-src=`${endpoints.post.circles}joinable/` target-src=`${endpoints.get.circles}`) hubl-reactivity(data-src=`${endpoints.post.circles}joinable/` target-src=`${endpoints.get.circles}`)
hubl-reactivity(data-src=`${endpoints.post.circles}` target-src=`${endpoints.get.circles}`) hubl-reactivity(data-src=`${endpoints.post.circles}` target-src=`${endpoints.get.circles}`)
@ -72,29 +72,29 @@ html(lang="en")
hubl-reactivity(bind-user nested-field="circles" target-src=`${endpoints.circles || endpoints.get.circles}joinable/`) hubl-reactivity(bind-user nested-field="circles" target-src=`${endpoints.circles || endpoints.get.circles}joinable/`)
include page-circle.pug include page-circle.pug
if endpoints.users || (endpoints.get && endpoints.get.users) if endpoints.users || (endpoints.get && endpoints.get.users)
#messages(hidden).with-sidebar #messages(hidden, data-view="messages", no-render).with-sidebar
include page-messages.pug include page-messages.pug
if endpoints.polls || (endpoints.get && endpoints.get.polls) if endpoints.polls || (endpoints.get && endpoints.get.polls)
#polls(hidden).with-sidebar #polls(hidden, data-view="polls", no-render).with-sidebar
include page-polls.pug include page-polls.pug
if endpoints.events || (endpoints.get && endpoints.get.events) if endpoints.events || (endpoints.get && endpoints.get.events)
#events(hidden) #events(hidden, data-view="events", no-render)
include page-events.pug include page-events.pug
if endpoints.resources || (endpoints.get && endpoints.get.resources) if endpoints.resources || (endpoints.get && endpoints.get.resources)
#resources(hidden) #resources(hidden, data-view="resources", no-render)
include page-resources.pug include page-resources.pug
#admin(hidden).with-sidebar #admin(hidden, data-view="admin", no-render).with-sidebar
include page-admin.pug include page-admin.pug
#about(hidden).no-sidebar.with-padding #about(data-view="about", no-render).no-sidebar.with-padding
include page-about.pug include page-about.pug
if (endpoints.skills || (endpoints.get && endpoints.get.skills)) && (endpoints.uploads || (endpoints.post && endpoints.post.uploads)) && (endpoints.users || (endpoints.post && endpoints.post.users)) if (endpoints.skills || (endpoints.get && endpoints.get.skills)) && (endpoints.uploads || (endpoints.post && endpoints.post.uploads)) && (endpoints.users || (endpoints.post && endpoints.post.users))
#profile(hidden).no-sidebar #profile(hidden, data-view="profile", no-render).no-sidebar
include page-profile.pug include page-profile.pug
if analytics if analytics

208
src/locales/en.json Normal file
View File

@ -0,0 +1,208 @@
{
"header": {
"beta": "Beta",
"myProfile": "My profile",
"admin": "Administration",
"about": "About",
"logOut": "Logout",
"logIn": "Log-in"
},
"menuLeft": {
"emptyCircleProject": {
"notPartOf": "You're not part of",
"createNew": "To create a new one, you can go in the",
"adminPanel": "administration panel",
"project": "project",
"circle": "circle"
},
"dashboard": "Dashboard",
"events": "Events",
"gov": "Governance",
"resources": "Resources",
"jobBoard": "Job offers",
"profileDirectory": "Profiles directory",
"projects": "Projects",
"circles": "Circles",
"messages": "Messages",
"search": "Search..."
},
"about": {
"title": "About",
"card1": {
"subTitle": "This application is developed by Startin'blox",
"paragraph1": "Startin'blox is a cooperative that develops open source tools to easily and cheaply build federated and interoperable applications based on the latest web standards pushed by the SOLID project.",
"paragraph2": "Its mission is to empower users by enabling them to regain control of their digital tools and benefit from a network effect within a chosen ecosystem in order to emancipate themselves from large platforms."
},
"card2": {
"title": "Contact us",
"paragraph-1": "You want to contribute, report a bug, suggest an improvement, work with us?",
"link": "Contact"
}
},
"admin": {
"menuRight": {
"fold": "Fold the menu",
"community": "Communities",
"circles": "Circles",
"projects": "Projects"
}
},
"dashboard": {
"title": "Dashboard"
},
"circle": {
"menuRight": {
"buttonMobile": "MENU",
"fold": "Fold the menu",
"chat": "Chat",
"information": "Information",
"resources": "Resources",
"events": "Events",
"polls": "Polls"
},
"create": {
"backlink": "Back",
"title": " Create a circle",
"labelStatus": "Statut du circle",
"labelName": "Circle name *",
"labelDescription": "Circle headline *",
"buttonSubmit": "Save"
},
"edit": {
"buttonDelete": "Remove",
"backlink": "Back",
"title": "Edit your circle",
"labelStatus": "Circle status",
"labelName": "Circle name *",
"labelOwner": "Admin *",
"labelDescription": "Circle headline *",
"subTitle": "Members list :",
"tableHeader1": "Name",
"tableHeader2": "Access",
"buttonSubmit": "Save",
"buttonAddMember": "Add a member"
},
"list": {
"title": "Administration",
"buttonMobile": "MENU",
"subTitle": "Circles",
"buttonCreate": " Create a circle",
"tableHeader1": "Name",
"tableHeader2": "Admins",
"tableHeader3": "Join",
"buttonQuit": "Leave",
"buttonJoin": "Join"
},
"left": {
"paragraphQuit": "You left this circle.",
"paragraphJoin": "To join it again, go to the panel",
"paragraphContact": "or contact an admin.",
"admin": "administration"
},
"profile": {
"creationDate": "Creation date : ",
"buttonModify": "Edit and add a member",
"buttonAdd": "Add a member",
"buttonDelete": "Remove the circle",
"buttonQuit": "Leave the circle",
"buttonJoin": "Join the circle",
"subTitle": "Members :"
}
},
"communities": {
"title": "Administration",
"menuMobile": "MENU",
"linkInvite": "Invite a new user",
"noPermission": "Member, no permission",
"subTitle": "Communities",
"tableHeader1": "Name",
"tableHeader2": "Action"
},
"project": {
"menuRight": {
"buttonMobile": "MENU",
"fold": "Fold the menu",
"chat": "Chat",
"information": "Information"
},
"create": {
"backlink": "Back",
"title": " Create a nouveau project",
"labelName": "Project name*",
"labelCustomer": "Customer name*",
"labelCaptain": "Project captain*",
"buttonSubmit": "Save"
},
"edit": {
"buttonDelete": "Remove",
"backlink": "Back",
"title": "Edit your project",
"labelName": "Project name *",
"labelCustomer": "Customer name *",
"subTitle": "Team members :",
"tableHeader1": "Name",
"tableHeader2": "Access",
"buttonSubmit": "Save",
"buttonAddMember": "Add a member"
},
"modifyPicture": {
"backlink": "Back",
"title": "Modify the project picture"
},
"list": {
"title": "Administration",
"buttonMobile": "MENU",
"subTitle": "Projects",
"buttonCreate": "Create a new project",
"tableHeader1": "Name",
"tableHeader2": "Admins",
"tableHeader3": "Captains",
"tableHeader4": "Join",
"buttonQuit": "Leave",
"buttonJoin":"Join"
},
"left": {
"paragraphQuit": "You left this project.",
"paragraphJoin": "This is a private project. To join it again, go to the panel",
"paragraphContact": "and request an invitation.",
"admin": "administration"
},
"profile": {
"creationDate": "Creation date : ",
"buttonModify": "Edit and add a member",
"buttonAdd": "Add a member",
"buttonDelete": "Delete the project",
"buttonQuit": "Leave the project",
"buttonJoin": "Join the project",
"captain": "Captain :",
"subTitle": "Team :"
}
},
"user": {
"create": {
"backlink": "Back",
"title": "Invite a user to ",
"labelUsername": "Username*",
"labelUsernameTitle": "Alphanumeric characters only",
"labelEmail": "E-mail *",
"labelFirstname": "Firstname *",
"labelLastname": "Lastname *",
"buttonSubmit": "Invite"
}
},
"notification": {
"circle": {
"in": "in"
},
"private": {
"private": "in private"
}
},
"template-captain": {
"isLead": "Captain"
},
"hublStatus": {
"private": "Private",
"public": "Public"
}
}

208
src/locales/es.json Normal file
View File

@ -0,0 +1,208 @@
{
"header": {
"beta": "Beta",
"myProfile": "Mi perfil",
"admin": "Administración",
"about": "Acerca de",
"logOut": "Cerrar sesión",
"logIn": "Iniciar sesión"
},
"menuLeft": {
"emptyCircleProject": {
"notPartOf": "No eres parte de ninguno",
"createNew": "Para crear uno nuevo, puede ir al ",
"adminPanel": "panel de administración",
"project": "proyecto",
"circle": "círculo"
},
"dashboard": "Panel de control",
"events": "Eventos",
"gov": "Gobernanza",
"resources": "Recursos",
"jobBoard": "Ofertas de trabajo",
"profileDirectory": "Directorio de miembrxs",
"projects": "Proyectos",
"circles": "Círculos",
"messages": "Mensajes",
"search": "Buscar..."
},
"about": {
"title": "Acerca de",
"card1": {
"subTitle": "Esta aplicación fue desarrollada por Startin'blox",
"paragraph1": "Startin'blox es una cooperativa que desarrolla herramientas gratuitas para construir de manera fácil y económica aplicaciones federadas e interoperables basadas en los últimos estándares web impulsados ​​por el proyecto SOLID.",
"paragraph2": "Su misión es devolver el poder a los usuarios permitiéndoles recuperar el control de su herramienta digital y beneficiarse de un efecto de red dentro de un ecosistema elegido para emanciparse de las grandes plataformas."
},
"card2": {
"title": "Contactenos",
"paragraph-1": "¿Quieres contribuir, informar de un error, sugerir una mejora, trabajar con nosotrxs?",
"link": "Contacto"
}
},
"admin": {
"menuRight": {
"fold": "Contraer el menú",
"community": "Comunidades",
"circles": "Círculos",
"projects": "Proyectos"
}
},
"dashboard": {
"title": "Panel de control"
},
"circle": {
"menuRight": {
"buttonMobile": "MENÚ",
"fold": "Contraer el menú",
"chat": "Chat",
"information": "Información",
"resources": "Recursos",
"events": "Eventos",
"polls": "Encuentas"
},
"create": {
"backlink": "Atrás",
"title": "Crear un círculo",
"labelStatus": "Estado del círculo",
"labelName": "Nombre del círculo *",
"labelDescription": "Subtítulo del círculo *",
"buttonSubmit": "Guardar"
},
"edit": {
"buttonDelete": "Eliminar",
"backlink": "Atrás",
"title": "Modificá tu círculo",
"labelStatus": "Estado del círculo",
"labelName": "Nombre del círculo *",
"labelOwner": "Administrador/a *",
"labelDescription": "Subtítulo del círculo *",
"subTitle": "Listado de miembrxs: ",
"tableHeader1": "Nombre",
"tableHeader2": "Acceso",
"buttonSubmit": "Guardar",
"buttonAddMember": "Añadir miembrx"
},
"list": {
"title": "Administración",
"buttonMobile": "MENÚ",
"subTitle": "Círculos",
"buttonCreate": "Crear un círculo",
"tableHeader1": "Nombre",
"tableHeader2": "Administradorxs",
"tableHeader3": "Unirse",
"buttonQuit": "Salir",
"buttonJoin": "Unirse"
},
"left": {
"paragraphQuit": "Dejaste este círculo.",
"paragraphJoin": "Para volver a unirse, vaya al panel",
"paragraphContact": "o contacte un/a administrador/a",
"admin": "de administración"
},
"profile": {
"creationDate": "Fecha de creación: ",
"buttonModify": "Editar y agregar un/a miembrx",
"buttonAdd": "Agregar un/a miebro",
"buttonDelete": "Eliminar el círculo",
"buttonQuit": "Salir del círculo",
"buttonJoin": "Unirse al círculo",
"subTitle": "Miembrxs: "
}
},
"communities": {
"title": "Administración",
"menuMobile": "MENÚ",
"linkInvite": "Invita a un/a nuevx usuarix",
"noPermission": "Miembrx sin permiso",
"subTitle": "Comunidades",
"tableHeader1": "Nombre",
"tableHeader2": "Acción"
},
"project": {
"menuRight": {
"buttonMobile": "MENÚ",
"fold": "Contraer el menú",
"chat": "Chat",
"information": "Información"
},
"create": {
"backlink": "Atrás",
"title": "Crear un proyecto nuevo",
"labelName": "Nombre del proyecto *",
"labelCustomer": "Nombre del/la clientx *",
"labelCaptain": "Líder del proyecto *",
"buttonSubmit": "Guardar"
},
"edit": {
"buttonDelete": "Eliminar",
"backlink": "Atrás",
"title": "Modificar tu proyecto",
"labelName": "Nombre del proyecto *",
"labelCustomer": "Nombre del/la clientx *",
"subTitle": "Lista de miembrxs: ",
"tableHeader1": "Nombre",
"tableHeader2": "Acceso",
"buttonSubmit": "Guardar",
"buttonAddMember": "Añadir miembrx"
},
"modifyPicture": {
"backlink": "Atrás",
"title": "Cambiar la imagen del proyecto"
},
"list": {
"title": "Administración",
"buttonMobile": "MENÚ",
"subTitle": "Proyectos",
"buttonCreate": "Crear un proyecto nuevo",
"tableHeader1": "Nombre",
"tableHeader2": "Administradorxs",
"tableHeader3": "Líderes",
"tableHeader4": "Unirse",
"buttonQuit": "Salir",
"buttonJoin": "Unirse"
},
"left": {
"paragraphQuit": "Dejaste este proyecto.",
"paragraphJoin": "Este es un proyecto privado. Para volver a unirse, vaya al panel",
"paragraphContact": "y solicite una invitación.",
"admin": "de administración"
},
"profile": {
"creationDate": "Fecha de creación: ",
"buttonModify": "Editar y agregar un/a miembrx",
"buttonAdd": "Añadir miembrx",
"buttonDelete": "Eliminar el proyecto",
"buttonQuit": "Salir del proyecto",
"buttonJoin": "Unirse al proyecto",
"captain": "Líder : ",
"subTitle": "Equipo : "
}
},
"user": {
"create": {
"backlink": "Atrás",
"title": "Invitar a un/a usuarix",
"labelUsername": "Nombre de usuarix *",
"labelUsernameTitle": "Solo caracteres alfanuméricos",
"labelEmail": "E-mail *",
"labelFirstname": "Nombre *",
"labelLastname": "Apellido *",
"buttonSubmit": "Invitar"
}
},
"notification": {
"circle": {
"in": "dentro"
},
"private": {
"private": "en privado"
}
},
"template-captain": {
"isLead": "Líder"
},
"hublStatus": {
"private": "Privado",
"public": "Público"
}
}

208
src/locales/fr.json Normal file
View File

@ -0,0 +1,208 @@
{
"header": {
"beta": "Beta",
"myProfile": "Mon profil",
"admin": "Administration",
"about": "A propos",
"logOut": "Se déconnecter",
"logIn": "Se connecter"
},
"menuLeft": {
"emptyCircleProject": {
"notPartOf": "Tu ne fais partie d'aucun",
"createNew": "Pour en créer un nouveau, tu peux te rendre dans le",
"adminPanel": "panneau d'administration",
"project": "projet",
"circle": "cercle"
},
"dashboard": "Tableau de bord",
"events": "Evènements",
"gov": "Gouvernance",
"resources": "Ressources",
"jobBoard": "Offres de mission",
"profileDirectory": "Annuaire des membres",
"projects": "Projets",
"circles": "Circles",
"messages": "Messages",
"search": "Rechercher..."
},
"about": {
"title": "A propos",
"card1": {
"subTitle": "Cette application est développée par Startin'blox",
"paragraph1": "Startin’blox est une coopérative qui développe des outils libres pour construire facilement et à moindre coût des applications fédérées et interopérables basées sur les derniers standards du web poussés par le projet SOLID.",
"paragraph2": "Sa mission est de redonner le pouvoir aux utilisateurs en leur permettant de reprendre la main sur leur outil numérique et de bénéficier d’un effet de réseau au sein d’un écosystème choisi afin de s’émanciper des grandes plateformes."
},
"card2": {
"title": "Contacte-nous",
"paragraph-1": "Tu veux contribuer, nous remonter un bug, nous suggérer une amélioration, travailler avec nous ?",
"link": "Contact"
}
},
"admin": {
"menuRight": {
"fold": "Replier le menu",
"community": "Communautés",
"circles": "Cercles",
"projects": "Projets"
}
},
"dashboard": {
"title": "Tableau de bord"
},
"circle": {
"menuRight": {
"buttonMobile": "MENU",
"fold": "Replier le menu",
"chat": "Chat",
"information": "Information",
"resources": "Resources",
"events": "Events",
"polls": "Polls"
},
"create": {
"backlink": "Retour",
"title": "Créer un cercle",
"labelStatus": "Statut du cercle",
"labelName": "Nom du cercle *",
"labelDescription": "Sous-titre du cercle *",
"buttonSubmit": "Enregistrer"
},
"edit": {
"buttonDelete": "Retirer",
"backlink": "Retour",
"title": "Modifie ton cercle",
"labelStatus": "Statut du cercle",
"labelName": "Nom du cercle *",
"labelOwner": "Administrateur ou administratrice *",
"labelDescription": "Sous-titre du cercle *",
"subTitle": "Liste des membres :",
"tableHeader1": "Nom",
"tableHeader2": "Accès",
"buttonSubmit": "Enregistrer",
"buttonAddMember": "Ajouter un membre"
},
"list": {
"title": "Administration",
"buttonMobile": "MENU",
"subTitle": "Cercles",
"buttonCreate": "Créer un cercle",
"tableHeader1": "Nom",
"tableHeader2": "Administrateurs",
"tableHeader3": "Rejoindre",
"buttonQuit": "Quitter",
"buttonJoin": "Rejoindre"
},
"left": {
"paragraphQuit": "Tu as quitté ce cercle.",
"paragraphJoin": "Pour le rejoindre à nouveau, rends-toi dans le panneau",
"paragraphContact": "ou contacte un administrateur.",
"admin": "d'administration"
},
"profile": {
"creationDate": "Date de création : ",
"buttonModify": "Modifier et ajouter un membre",
"buttonAdd": "Ajouter un membre",
"buttonDelete": "Supprimer le cercle",
"buttonQuit": "Quitter le cercle",
"buttonJoin": "Rejoindre le cercle",
"subTitle": "Membres :"
}
},
"communities": {
"title": "Administration",
"menuMobile": "MENU",
"linkInvite": "Inviter un nouvel utilisateur",
"noPermission": "Membre, aucune permission",
"subTitle": "Communautés",
"tableHeader1": "Nom",
"tableHeader2": "Action"
},
"project": {
"menuRight": {
"buttonMobile": "MENU",
"fold": "Replier le menu",
"chat": "Chat",
"information": "Information"
},
"create": {
"backlink": "Retour",
"title": "Créer un nouveau projet",
"labelName": "Nom du projet *",
"labelCustomer": "Nom du client*",
"labelCaptain": "Capitaine du projet*",
"buttonSubmit": "Enregistrer"
},
"edit": {
"buttonDelete": "Retirer",
"backlink": "Retour",
"title": "Modifie ton projet",
"labelName": "Nom du projet *",
"labelCustomer": "Nom du client *",
"subTitle": "Liste des membres :",
"tableHeader1": "Nom",
"tableHeader2": "Accès",
"buttonSubmit": "Enregistrer",
"buttonAddMember": "Ajouter un membre"
},
"modifyPicture": {
"backlink": "Retour",
"title": "Modifier l'image du projet"
},
"list": {
"title": "Administration",
"buttonMobile": "MENU",
"subTitle": "Projets",
"buttonCreate": "Créer un nouveau projet",
"tableHeader1": "Nom",
"tableHeader2": "Administrateurs",
"tableHeader3": "Capitaines",
"tableHeader4": "Rejoindre",
"buttonQuit": "Quitter",
"buttonJoin":"Rejoindre"
},
"left": {
"paragraphQuit": "Tu as quitté ce projet.",
"paragraphJoin": "Ceci est un projet privé. Pour le joindre à nouveau, rends-toi dans le panneau",
"paragraphContact": "et demande une invitation.",
"admin": "d'administration"
},
"profile": {
"creationDate": "Date de création : ",
"buttonModify": "Modifier et ajouter un membre",
"buttonAdd": "Ajouter un membre",
"buttonDelete": "Supprimer le projet",
"buttonQuit": "Quitter le projet",
"buttonJoin": "Rejoindre le projet",
"captain": "Capitaine :",
"subTitle": "Equipe :"
}
},
"user": {
"create": {
"backlink": "Retour",
"title": "Inviter un utilisateur à ",
"labelUsername": "Nom d'utilisateur*",
"labelUsernameTitle": "Caractères alphanumérique uniquement",
"labelEmail": "E-mail *",
"labelFirstname": "Prénom *",
"labelLastname": "Nom *",
"buttonSubmit": "Inviter"
}
},
"notification": {
"circle": {
"in": "dans"
},
"private": {
"private": "en privé"
}
},
"template-captain": {
"isLead": "Capitaine"
},
"hublStatus": {
"private": "Privé",
"public": "Public"
}
}

60
src/menu-left.pug
View File

@ -14,13 +14,17 @@ solid-widget(name='hubl-menu-publicprivate')
solid-widget(name='hubl-create') solid-widget(name='hubl-create')
template template
p.create Tu ne fais partie d'aucun ${value}. p.create
span(data-trans="menuLeft.emptyCircleProject.notPartOf")
span &nbsp;${value}.
br br
| Pour en créer un nouveau, tu peux te rendre dans le span(data-trans="menuLeft.emptyCircleProject.createNew")
solid-link(next='admin') panneau d'administration span &nbsp;
solid-link(next="${value == 'projet' ? 'admin-projects' : 'admin-circles'}", data-trans="menuLeft.emptyCircleProject.adminPanel")
solid-widget(name='hubl-menu-fix-url-circle') solid-widget(name='hubl-menu-fix-url-circle')
template template
solid-link(data-src="${value}" next="circle")
solid-display( solid-display(
data-src='${value}' data-src='${value}'
fields='status, name, jabberID, badge' fields='status, name, jabberID, badge'
@ -34,6 +38,7 @@ solid-widget(name='hubl-menu-fix-url-circle')
solid-widget(name='hubl-menu-fix-url-project') solid-widget(name='hubl-menu-fix-url-project')
template template
solid-link(data-src="${value}" next="project")
solid-display( solid-display(
data-src='${value}' data-src='${value}'
fields='status, project(customer.name, name, jabberID), badge' fields='status, project(customer.name, name, jabberID), badge'
@ -51,41 +56,43 @@ solid-widget(name='hubl-menu-fix-url-project')
solid-router#navbar-router(default-route='dashboard') solid-router#navbar-router(default-route='dashboard')
if endpoints.dashboards || (endpoints.get && endpoints.get.dashboards) if endpoints.dashboards || (endpoints.get && endpoints.get.dashboards)
solid-route.menu(name='dashboard') solid-route.menu(name='dashboard')
div.menu-label Tableau de bord div.menu-label(data-trans="menuLeft.dashboard")
div.menu-icon.icon-home div.menu-icon.icon-home
div.divider div.divider
if publicDirectory && (endpoints.users || (endpoints.get && endpoints.get.users)) if publicDirectory && (endpoints.users || (endpoints.get && endpoints.get.users))
solid-route.menu(name='members') solid-route.menu(name='members')
div.menu-label Annuaire des membres div.menu-label(data-trans="menuLeft.profileDirectory")
div.menu-icon.icon-people div.menu-icon.icon-people
div.divider div.divider
if endpoints.joboffers || (endpoints.get && endpoints.get.joboffers) if endpoints.joboffers || (endpoints.get && endpoints.get.joboffers)
solid-route.menu(name='job-offers', rdf-type='hd:joboffer') solid-route.menu(name='job-offers', rdf-type='hd:joboffer')
div.menu-label Offres de mission div.menu-label(data-trans="menuLeft.jobBoard")
div.menu-icon.icon-briefcase div.menu-icon.icon-briefcase
div.divider div.divider
if endpoints.resources || (endpoints.get && endpoints.get.resources) if endpoints.resources || (endpoints.get && endpoints.get.resources)
solid-route.menu(name='resources') solid-route.menu(name='resources')
div.menu-label Ressources div.menu-label(data-trans="menuLeft.resources")
div.menu-icon.icon-docs div.menu-icon.icon-docs
div.divider div.divider
if endpoints.polls || (endpoints.get && endpoints.get.polls) if endpoints.polls || (endpoints.get && endpoints.get.polls)
solid-route.menu(name='polls') solid-route.menu(name='polls')
div.menu-label Gouvernance div.menu-label(data-trans="menuLeft.gov")
div.menu-icon.icon-bubbles div.menu-icon.icon-bubbles
div.divider div.divider
if endpoints.events || (endpoints.get && endpoints.get.events) if endpoints.events || (endpoints.get && endpoints.get.events)
solid-route.menu(name='events') solid-route.menu(name='events')
div.menu-label Evènements div.menu-label(data-trans="menuLeft.events")
div.menu-icon.icon-calendar div.menu-icon.icon-calendar
div.divider div.divider
if endpoints.projects || (endpoints.get && endpoints.get.projects) if endpoints.projects || (endpoints.get && endpoints.get.projects)
div div.menu-wrapper
solid-link(next='admin-project-list') solid-link
//- (next='admin-project-list')
div.menu div.menu
div.menu-chevron div.menu-chevron
div.menu-icon.icon-arrow-right-circle div.menu-icon.icon-arrow-up
div.menu-label Projets //- div.menu-icon.icon-arrow-right-circle
div.menu-label(data-trans="menuLeft.projects")
div.menu-icon.icon-folder-alt div.menu-icon.icon-folder-alt
solid-route(name='project', rdf-type='hd:project', use-id='', hidden) solid-route(name='project', rdf-type='hd:project', use-id='', hidden)
div.sub-menu.menu-notification div.sub-menu.menu-notification
@ -100,19 +107,21 @@ solid-router#navbar-router(default-route='dashboard')
fields='project' fields='project'
loader-id='loader-projects' loader-id='loader-projects'
empty-widget='hubl-create' empty-widget='hubl-create'
empty-value='projet' empty-value=''
data-trans="empty-value=menuLeft.emptyCircleProject.project"
widget-project='hubl-menu-fix-url-project' widget-project='hubl-menu-fix-url-project'
order-by='project.customer.name' order-by="project.customer.name"
next='project'
) )
div.divider div.divider
if endpoints.circles || (endpoints.get && endpoints.get.circles) if endpoints.circles || (endpoints.get && endpoints.get.circles)
div div.menu-wrapper
solid-link(next='admin-circle-list') solid-link
//- (next='admin-circle-list')
div.menu div.menu
div.menu-chevron div.menu-chevron
div.menu-icon.icon-arrow-right-circle div.menu-icon.icon-arrow-up
div.menu-label Cercles //- div.menu-icon.icon-arrow-right-circle
div.menu-label(data-trans="menuLeft.circles")
div.menu-icon.icon-folder-alt div.menu-icon.icon-folder-alt
solid-route(name='circle', rdf-type='hd:circle', use-id='', hidden) solid-route(name='circle', rdf-type='hd:circle', use-id='', hidden)
div.sub-menu.menu-notification div.sub-menu.menu-notification
@ -127,10 +136,10 @@ solid-router#navbar-router(default-route='dashboard')
fields='circle' fields='circle'
loader-id='loader-circles' loader-id='loader-circles'
empty-widget='hubl-create' empty-widget='hubl-create'
empty-value='cercle' empty-value=''
data-trans="empty-value=menuLeft.emptyCircleProject.circle"
widget-circle='hubl-menu-fix-url-circle' widget-circle='hubl-menu-fix-url-circle'
order-by='circle.name' order-by="circle.name"
next='circle'
) )
div.divider div.divider
if endpoints.users || (endpoints.get && endpoints.get.users) if endpoints.users || (endpoints.get && endpoints.get.users)
@ -138,7 +147,7 @@ solid-router#navbar-router(default-route='dashboard')
div.menu div.menu
div.menu-chevron div.menu-chevron
div.menu-icon.icon-arrow-up div.menu-icon.icon-arrow-up
div.menu-label Messages div.menu-label(data-trans="menuLeft.messages")
div.menu-icon.icon-envelope-letter div.menu-icon.icon-envelope-letter
solid-route(name='messages', rdf-type='foaf:user', use-id='', hidden) solid-route(name='messages', rdf-type='foaf:user', use-id='', hidden)
div.sub-menu.menu-notification div.sub-menu.menu-notification
@ -152,7 +161,8 @@ solid-router#navbar-router(default-route='dashboard')
fields='name, chatProfile.jabberID, badge' fields='name, chatProfile.jabberID, badge'
loader-id='loader-messages' loader-id='loader-messages'
search-fields="name" search-fields="name"
search-label-name="Rechercher..." search-label-name=""
data-trans="search-label-name=menuLeft.search"
search-widget-name="hubl-search-users" search-widget-name="hubl-search-users"
widget-name='solid-display-div' widget-name='solid-display-div'
widget-badge='hubl-counter' widget-badge='hubl-counter'

14
src/page-about.pug
View File

@ -1,17 +1,17 @@
.views-container .views-container
h2 A propos h2(data-trans='about.title')
div.flex-content-white div.flex-content-white
div div
div div
h3 Cette application est développée par Startin'blox h3(data-trans='about.card1.subTitle')
p Startin’blox est une coopérative qui développe des outils libres pour construire facilement et à moindre coût des applications fédérées et interopérables basées sur les derniers standards du web poussés par le projet SOLID. p(data-trans='about.card1.paragraph1')
p Sa mission est de redonner le pouvoir aux utilisateurs en leur permettant de reprendre la main sur leur outil numérique et de bénéficier d’un effet de réseau au sein d’un écosystème choisi afin de s’émanciper des grandes plateformes. p(data-trans='about.card1.paragraph2')
div div
a(href="https://startinblox.com/fr/" target="_blank") https://startinblox.com/fr/ a(href="https://startinblox.com/fr/" target="_blank") https://startinblox.com/fr/
div div
div div
h3 Contacte-nous h3(data-trans='about.card2.subTitle')
p Tu veux contribuer, nous remonter un bug, nous suggérer une amélioration, travailler avec nous ? p(data-trans='about.card2.paragraph1')
div div
a(href="https://startinblox.com/fr/#home-contact" target="_blank").main-cta Contact a(href="https://startinblox.com/fr/#home-contact" target="_blank" data-trans='about.card2.link').main-cta

18
src/page-admin.pug
View File

@ -1,27 +1,27 @@
.views-container.sidebar-is-closed .views-container.sidebar-is-closed
if endpoints.circles || (endpoints.get && endpoints.get.circles) if endpoints.circles || (endpoints.get && endpoints.get.circles)
#admin-circles(hidden) #admin-circles(hidden, data-view="admin-circles")
include views/admin/page-admin-circles.pug include views/admin/page-admin-circles.pug
if endpoints.projects || (endpoints.get && endpoints.get.projects) if endpoints.projects || (endpoints.get && endpoints.get.projects)
#admin-projects(hidden) #admin-projects(hidden, data-view="admin-projects")
include views/admin/page-admin-projects.pug include views/admin/page-admin-projects.pug
if (endpoints.users || (endpoints.get && endpoints.get.users)) if (endpoints.users || (endpoints.get && endpoints.get.users))
#admin-users(hidden) #admin-communities(hidden, data-view="admin-communities")
include views/admin/page-admin-users.pug include views/admin/page-admin-communities.pug
nav.jsRightMenu(role='navigation') nav.jsRightMenu(role='navigation')
solid-router(default-route='admin-circles') solid-router(default-route='admin-circles')
ul ul
li.jsOffsiteToggle li.jsOffsiteToggle
a Replier le menu a(data-trans='admin.menuRight.fold')
if (endpoints.users || (endpoints.get && endpoints.get.users)) if (endpoints.users || (endpoints.get && endpoints.get.users))
solid-route.active-color(name='admin-users') solid-route(name='admin-communities')
li li
a Utilisateurs a(data-trans='admin.menuRight.community')
if endpoints.circles || (endpoints.get && endpoints.get.circles) if endpoints.circles || (endpoints.get && endpoints.get.circles)
solid-route(name='admin-circles') solid-route(name='admin-circles')
li li
a Cercles a(data-trans='admin.menuRight.circles')
if endpoints.projects || (endpoints.get && endpoints.get.projects) if endpoints.projects || (endpoints.get && endpoints.get.projects)
solid-route(name='admin-projects') solid-route(name='admin-projects')
li li
a Projets a(data-trans='admin.menuRight.projects')

24
src/page-circle.pug
View File

@ -9,41 +9,41 @@
class-name='h1-like' class-name='h1-like'
class-description='h1-aside description' class-description='h1-aside description'
) )
button.mobile-sidebar-button.jsMobileSidebarOpenButton.icon-arrow-left-circle MENU button.mobile-sidebar-button.jsMobileSidebarOpenButton.icon-arrow-left-circle(data-trans='circle.menuRight.buttonMobile')
div.content-box__height div.content-box__height
solid-ac-checker(permission='acl:Read', bind-resources) solid-ac-checker(permission='acl:Read', bind-resources)
#circle-chat(hidden) #circle-chat(hidden, data-view="circle-chat")
include views/circle/page-circle-chat.pug include views/circle/page-circle-chat.pug
#circle-information.content-box__height(hidden) #circle-information.content-box__height(hidden, data-view="circle-information")
include views/circle/page-circle-profile.pug include views/circle/page-circle-profile.pug
#circle-events(hidden) #circle-events(hidden, data-view="circle-events")
include views/circle/page-circle-events.pug include views/circle/page-circle-events.pug
#circle-resources(hidden) #circle-resources(hidden, data-view="circle-resources")
include views/circle/page-circle-resources.pug include views/circle/page-circle-resources.pug
#circle-polls(hidden) #circle-polls(hidden, data-view="circle-polls")
include views/circle/page-circle-polls.pug include views/circle/page-circle-polls.pug
nav.jsRightMenu(role='navigation') nav.jsRightMenu(role='navigation')
solid-router(default-route='circle-chat') solid-router(default-route='circle-chat')
ul ul
li.jsOffsiteToggle li.jsOffsiteToggle
a Replier le menu a(data-trans='circle.menuRight.fold')
solid-route(name='circle-chat') solid-route(name='circle-chat')
li li
a Chat a(data-trans='circle.menuRight.chat')
solid-route(name='circle-information') solid-route(name='circle-information')
li li
a Information a(data-trans='circle.menuRight.information')
if (endpoints.resources || (endpoints.get && endpoints.get.resources)) && (endpoints.resourceskeywords || (endpoints.get && endpoints.get.resourceskeywords)) && (endpoints.resourcestypes || (endpoints.get && endpoints.get.resourcestypes)) if (endpoints.resources || (endpoints.get && endpoints.get.resources)) && (endpoints.resourceskeywords || (endpoints.get && endpoints.get.resourceskeywords)) && (endpoints.resourcestypes || (endpoints.get && endpoints.get.resourcestypes))
solid-route(name='circle-resources' use-id) solid-route(name='circle-resources' use-id)
li li
a Resources a(data-trans='circle.menuRight.resources')
if (endpoints.events || (endpoints.get && endpoints.get.events)) && (endpoints.typeevents || (endpoints.get && endpoints.get.typeevents)) if (endpoints.events || (endpoints.get && endpoints.get.events)) && (endpoints.typeevents || (endpoints.get && endpoints.get.typeevents))
solid-route(name='circle-events' use-id) solid-route(name='circle-events' use-id)
li li
a Events a(data-trans='circle.menuRight.events')
if endpoints.polls || (endpoints.get && endpoints.get.polls) if endpoints.polls || (endpoints.get && endpoints.get.polls)
solid-route(name='circle-polls' use-id) solid-route(name='circle-polls' use-id)
li li
a Polls a(data-trans='circle.menuRight.polls')

2
src/page-dashboard.pug
View File

@ -1,5 +1,5 @@
.views-container .views-container
h1 Tableau de bord h1(data-trans='dashboard.title')
solid-dashboard( solid-dashboard(
data-src=`${endpoints.dashboards || endpoints.get.dashboards}` data-src=`${endpoints.dashboards || endpoints.get.dashboards}`
) )

16
src/page-messages.pug
View File

@ -3,21 +3,23 @@
div.content-box__header div.content-box__header
solid-display( solid-display(
bind-resources bind-resources
fields='name, parenthesis, username, endParenthesis' fields='avatar-container(account.picture), text(name, hyphen, at, username)'
value-parenthesis=" (" value-hyphen=" - "
value-endParenthesis=")" value-at="@"
class-parenthesis='h1-like' widget-account.picture='hubl-user-avatar'
class-endParenthesis='h1-like' class-text="avatar-text"
class-avatar-container="avatar-container"
class-account.picture='avatar'
class-name='h1-like' class-name='h1-like'
class-username='h1-like' class-hypen='h1-like'
) )
.chat-view .chat-view
solid-xmpp-chat( solid-xmpp-chat(
data-authentication='login', data-authentication='login',
data-auto-login='true', data-auto-login='true',
data-bosh-service-url=`${xmpp}`, data-websocket-url=`${xmppWebsocket || 'wss://jabber.happy-dev.fr/xmpp-websocket'}`,
data-i18n='en', data-i18n='en',
bind-resources bind-resources
) )

14
src/page-project.pug
View File

@ -13,25 +13,25 @@
value-const-title1='N°' value-const-title1='N°'
) )
button.mobile-sidebar-button.jsMobileSidebarOpenButton.icon-arrow-left-circle MENU button.mobile-sidebar-button.jsMobileSidebarOpenButton.icon-arrow-left-circle(data-trans='project.menuRight.buttonMobile')
div.content-box__height div.content-box__height
solid-ac-checker(permission='acl:Read', bind-resources) solid-ac-checker(permission='acl:Read', bind-resources)
#project-chat(hidden) #project-chat(hidden, data-view="project-chat")
include views/project/page-project-chat.pug include views/project/page-project-chat.pug
#project-information.content-box__height(hidden) #project-information.content-box__height(hidden, data-view="project-information")
include views/project/page-project-profile.pug include views/project/page-project-profile.pug
#project-picture(hidden) #project-picture(hidden, data-view="project-picture")
include views/project/page-project-picture.pug include views/project/page-project-picture.pug
nav.jsRightMenu(role='navigation') nav.jsRightMenu(role='navigation')
solid-router(default-route='project-chat') solid-router(default-route='project-chat')
ul ul
li.jsOffsiteToggle li.jsOffsiteToggle
a Replier le menu a(data-trans='project.menuRight.fold')
solid-route(name='project-chat') solid-route(name='project-chat')
li li
a Chat a(data-trans='project.menuRight.chat')
solid-route(name='project-information') solid-route(name='project-information')
li li
a Information a(data-trans='project.menuRight.information')
solid-route(name='project-picture' use-id) solid-route(name='project-picture' use-id)

71
src/page-user-profile.pug
View File

@ -1,71 +0,0 @@
include templates/hubl-groups.pug
.content-box.with-form.user-profile__container
.section.user-bio
solid-display.avatar-display(
bind-user=''
fields='account.picture'
label-account.picture=''
widget-account.picture='solid-display-img'
)
solid-display.name-diplay(
bind-user=''
fields='user-name-groups(name, groups), username'
class-name='name'
label-groups=''
multiple-groups=''
widget-groups='hubl-groups-name'
class-username='username'
)
solid-form.info-form(
bind-user=''
fields='profile.bio, inline-1(profile.city, email), inline-2(profile.phone, profile.website), inline-3(profile.available), account.picture, instruction'
class-profile.bio='form-label is-light'
label-profile.bio='short description'
class-profile.city='form-label is-light'
label-profile.city='your cell'
class-email='form-label is-light'
class-profile.phone='form-label is-light'
label-profile.phone='phone'
class-profile.website='form-label is-light'
label-profile.website='your website'
class-profile.available='form-label is-light'
label-profile.available='your availability'
class-account.picture='form-label is-light'
label-account.picture='your picture'
widget-instruction='hubl-instruction'
)
.section.user-skills
solid-form(
bind-user=''
range-skills=`${endpoints.skills || endpoints.get.skills}`
fields='skills'
class-skills='form-label is-dark'
label-skills='Your main skills (4 max.):'
multiple-skills='solid-multiple-select'
widget-skills='solid-form-auto-completion'
)
solid-widget(name='hubl-instruction')
template
span Show us your most beautiful smile
p Pictures help us to know ourselves and also to recognize ourselves, so don't be afraid to show your pretty face and avoid strange avatars.

60
src/scripts/firefox-scroll.js Normal file
View File

@ -0,0 +1,60 @@
document.addEventListener("DOMContentLoaded", () => {
const resizeChat = () => {
let isMobile = window.innerWidth < 993;
let isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1;
let isFirefoxMobile = navigator.platform.toLowerCase().indexOf("mobile") > -1 || navigator.platform.toLowerCase().indexOf("tablet") > -1;
let chatBox = Array.from(document.querySelectorAll("solid-xmpp-chat"))
.map((el) => el.shadowRoot ? el.shadowRoot.getElementById("conversejs") : false)
.filter((el) => el)
.pop();
if (chatBox) {
let chatTextArea = chatBox.querySelector(".message-form-container");
let ischatTextArea = setInterval(() => {
chatTextArea = chatBox.querySelector(".message-form-container");
if (chatTextArea) {
clearInterval(ischatTextArea);
if (
chatBox.getBoundingClientRect().height -
chatTextArea.getBoundingClientRect().height !=
chatTextArea.offsetTop
) {
let viewportChat = Array.from(
document.querySelectorAll("#viewport .chat-view")
);
viewportChat.forEach(
(c) => (c.style.height = isMobile ? (isFirefox && isFirefoxMobile) ? "calc(100vh - 106px - 57px)" : "calc(100vh - 106px)" : "calc(100vh - 64px - 83px)")
);
}
}
}, 15);
}
};
resizeChat();
let isbody = setInterval(() => {
if (document.body) {
clearInterval(isbody);
resizeChat();
}
}, 50);
window.addEventListener("load", () => {
setTimeout(() => {
resizeChat();
}, 0);
});
let windowResizing;
window.addEventListener("resize", () => {
windowResizing = setTimeout(() => {
clearInterval(windowResizing);
resizeChat();
}, 50);
});
document.addEventListener("navigate", () => {
setTimeout(() => {
resizeChat();
}, 0);
});
});

198
src/scripts/intl.js Normal file
View File

@ -0,0 +1,198 @@
/*
js intl, inspired by danabr/jsI18n
*/
class JsI18n {
constructor() {
this.locale = ""; //Current locale
this.locales = new Array(); //Available locales
}
/*
Method for automatically detecting the language, does not work in every browser.
*/
detectLanguage() {
if (localStorage.getItem('language') || (window.navigator.language !== null && window.navigator.language !== undefined)) {
this.setLocale(localStorage.getItem('language') || window.navigator.language.slice(0, 2));
} else {
console.error('Language not found');
this.setLocale('fr');
}
};
/*
Translates tag contents and
attributes depending on the
value of key.
*/
translateTag(node, key) {
if (key.indexOf("=") == -1) { //Simple key
this.translateNodeContent(node, key);
} else { //Attribute/key pairs
var parts = key.split(";");
for (var i = 0; i < parts.length; i++) {
var pair = parts[i].split("=");
var attr = pair[0].toLowerCase().trim();
var k = pair[1].trim();
if (attr == "html") {
this.translateNodeContent(node, k);
} else {
if(node.tagName == "SOLID-DELETE") {
let button = node.querySelector('button');
if(button != null) {
this.translateNodeContent(button, k);
}
}
this.translateNodeContent(node.attributes[attr], k);
}
}
}
}
/**
Replace the content of the given node
if there is a translation for the given key.
**/
translateNodeContent(node, key) {
var translation = this.t(key);
if (node != null && translation != undefined) {
if (node.nodeType == 1) { //Element
try {
node.innerHTML = translation;
} catch (e) {
node.text = translation;
}
} else if (node.nodeType == 2) { //Attribute
node.value = translation;
}
}
}
/*
Helper for translating a node
and all its child nodes.
*/
processNode(node) {
if (node != undefined) {
if (node.nodeType == 1) { //Element node
var key = node.attributes["data-trans"];
if (key != null) {
this.translateTag(node, key.nodeValue);
}
}
//Process child nodes
var children = node.childNodes;
for (var i = 0; i < children.length; i++) {
this.processNode(children[i]);
}
}
}
/*
Adds a locale to the list,
replacing the translations
if the locale is already defined.
*/
addLocale(locale, translations) {
this.locales[locale.toString()] = translations;
}
/*
Sets the locale to use when translating.
*/
setLocale(locale) {
try {
fetch(`/locales/${locale}.json`).then((result) => {
if (result.ok) {
result.json().then(e => {
this.addLocale(locale, e);
this.processPage();
}).catch(() => {
if (locale != "fr") {
console.warn(`Locale not found: ${locale}, fallback to french`);
this.setLocale("fr");
} else {
console.error("Language not found");
}
});
} else {
if (locale != "fr") {
console.warn(`Locale not found: ${locale}, fallback to french`);
this.setLocale("fr");
} else {
console.error("Language not found");
}
}
});
this.locale = locale;
} catch {
if (locale != "fr") {
console.warn(`Locale not found: ${locale}, fallback to french`);
this.setLocale("fr");
} else {
console.error("Language not found");
}
}
}
/*
Fetches the translation associated with the given key.
*/
t(key) {
var translations = this.locales[this.locale];
if (translations != undefined) {
let translation = key.toString().split('.').reduce((o, i) => (o ? o[i] : undefined), translations);
if(typeof translation == "string") {
return translation;
} else {
return translations[key.toString()];
}
}
return undefined;
}
/*
Alias for JsI18n.t
*/
translate(key) {
this.t(key);
}
/**
Replaces the contents of all tags
that have the data-trans attribute set.
**/
processPage() {
this.processNode(document.getElementsByTagName("html")[0]);
}
}
//Global
jsI18n = new JsI18n;
document.addEventListener("DOMContentLoaded", () => {
// Detect the lang & initialize, based on the browser or "language" item from localstorage
jsI18n.detectLanguage();
/*
recursivePopulate(DOMElement)
Will listen for the populate event of any sib element
Process the changed node every time it populate
Recursively add a populate listener for children elements
*/
function recursivePopulate(element) {
Array.from(element.querySelectorAll('*')).forEach((e) => {
e.addEventListener("populate", (e) => {
recursivePopulate(e.target);
jsI18n.processNode(e.target);
});
});
}
// Process every children from document
recursivePopulate(document);
});

4
src/scripts/login-element-visibility.js
View File

@ -1,4 +1,4 @@
document.addEventListener("DOMContentLoaded", function (event) { document.addEventListener("DOMContentLoaded", function () {
document document
.querySelector("sib-auth") .querySelector("sib-auth")
.getUser() .getUser()
@ -10,8 +10,6 @@ document.addEventListener("DOMContentLoaded", function (event) {
document document
.querySelector('.loggedIn') .querySelector('.loggedIn')
.setAttribute("style", "display:none !important"); .setAttribute("style", "display:none !important");
} else {
document.querySelector('sib-auth').login();
} }
}); });
}); });

11
src/scripts/menu-toggle.js Normal file
View File

@ -0,0 +1,11 @@
document.addEventListener("DOMContentLoaded", () => {
const menuWrappers = Array.from(document.querySelectorAll(".menu-wrapper"));
//- Toggle sub-menus
menuWrappers.forEach(menuWrapper => {
const menu = menuWrapper.querySelector(".menu");
menu.addEventListener("click", e => {
menuWrapper.classList.toggle("is-closed");
});
});
});

10
src/scripts/navigate-event.js
View File

@ -27,10 +27,10 @@ function closeUserControls() {
); );
} }
document.addEventListener("DOMContentLoaded", function(event) { document.addEventListener("DOMContentLoaded", function() {
//- View change event //- View change event
window.addEventListener("navigate", event => { window.addEventListener("navigate", () => {
closeLeftMenu(); closeLeftMenu();
closeUserControls(); closeUserControls();
}); });
@ -63,7 +63,7 @@ document.addEventListener("DOMContentLoaded", function(event) {
} }
}; };
document.querySelector("#toggleMainMenu").addEventListener("click", event => { document.querySelector("#toggleMainMenu").addEventListener("click", () => {
let leftMenu = document.querySelector("#main__menu"); let leftMenu = document.querySelector("#main__menu");
if (leftMenu.hasAttribute("open")) { if (leftMenu.hasAttribute("open")) {
closeLeftMenu(); closeLeftMenu();
@ -75,7 +75,7 @@ document.addEventListener("DOMContentLoaded", function(event) {
const rightMenus = Array.from(document.querySelectorAll("nav.jsRightMenu")); const rightMenus = Array.from(document.querySelectorAll("nav.jsRightMenu"));
rightMenus.forEach(rightMenu => { rightMenus.forEach(rightMenu => {
const btnRightMenu = rightMenu.querySelector("li.jsOffsiteToggle"); const btnRightMenu = rightMenu.querySelector("li.jsOffsiteToggle");
btnRightMenu.addEventListener("click", e => { btnRightMenu.addEventListener("click", () => {
if (rightMenu.hasAttribute("open")) { if (rightMenu.hasAttribute("open")) {
closeRightMenu(); closeRightMenu();
} else { } else {
@ -86,7 +86,7 @@ document.addEventListener("DOMContentLoaded", function(event) {
Array.from(document.querySelectorAll(".jsMobileSidebarOpenButton")).forEach( Array.from(document.querySelectorAll(".jsMobileSidebarOpenButton")).forEach(
el => { el => {
el.addEventListener("click", event => { el.addEventListener("click", () => {
openRightMenu(); openRightMenu();
}); });
} }

11
src/scripts/register-sw.js Normal file
View File

@ -0,0 +1,11 @@
// if('serviceWorker' in navigator) {
// var refreshing;
// navigator.serviceWorker.addEventListener('controllerchange', () => {
// if (refreshing) {
// return;
// }
// refreshing = true;
// window.location.reload();
// });
// navigator.serviceWorker.register('/sw.js');
// }

19
src/scripts/save-feedback.js Normal file
View File

@ -0,0 +1,19 @@
document.addEventListener("DOMContentLoaded", () => {
const Toast = Swal.mixin({
toast: true,
position: 'top',
showConfirmButton: false,
timer: 3000,
timerProgressBar: true,
didOpen: (toast) => {
toast.addEventListener('mouseenter', Swal.stopTimer)
toast.addEventListener('mouseleave', Swal.resumeTimer)
}
})
document.addEventListener("save", () => {
Toast.fire({
icon: 'success',
title: 'Succès!'
})
});
});

9
src/scripts/unreads-menu.js
View File

@ -1,4 +1,4 @@
document.addEventListener("DOMContentLoaded", function (event) { document.addEventListener("DOMContentLoaded", function () {
window.addEventListener('newMessage', event => { window.addEventListener('newMessage', event => {
let jid = event.detail.jid; let jid = event.detail.jid;
Array.from(document.querySelectorAll('[data-jabberID="' + jid + '"]')).forEach(el => { Array.from(document.querySelectorAll('[data-jabberID="' + jid + '"]')).forEach(el => {
@ -9,7 +9,12 @@ document.addEventListener("DOMContentLoaded", function (event) {
window.addEventListener('read', (event) => { window.addEventListener('read', (event) => {
if (event.detail && event.detail.resource && event.detail.resource['@id']) { if (event.detail && event.detail.resource && event.detail.resource['@id']) {
const badge = document.querySelector(`solid-badge[data-src="${event.detail.resource['@id']}"]`); const badge = document.querySelector(`solid-badge[data-src="${event.detail.resource['@id']}"]`);
if (badge) badge.parentElement.parentElement.classList.remove('unread'); if (badge) {
badge.parentElement.parentElement.classList.remove('unread');
const project = badge.parentElement.parentElement.querySelector('.unread');
if (project) project.classList.remove('unread');
}
} }
}); });
}); });

2
src/scripts/widget-extension.js
View File

@ -44,7 +44,7 @@ function recursiveAdaptWidgets(prefix, element, user) {
}); });
} }
document.addEventListener("DOMContentLoaded", function (event) { document.addEventListener("DOMContentLoaded", function () {
document document
.querySelector("sib-auth") .querySelector("sib-auth")
.getUser() .getUser()

2
src/styles/abstracts/_variables.scss
View File

@ -102,6 +102,8 @@
--color-select-list: var(--color-secondary); --color-select-list: var(--color-secondary);
--color-select-add-button: var(--color-button-secondary); --color-select-add-button: var(--color-button-secondary);
--color-select-add-button-background: var(--color-button-white); --color-select-add-button-background: var(--color-button-white);
--color-add-button-background: var(--color-button-secondary);
--color-add-button: var(--color-white);
--color-label-light: var(--color-grey-6); --color-label-light: var(--color-grey-6);

14
src/styles/base/about.scss
View File

@ -1,6 +1,4 @@
#about{ #about{
$main-color: rgb(236, 94, 92);
$second-color: white;
h2,h3{ h2,h3{
text-transform: uppercase; text-transform: uppercase;
} }
@ -37,10 +35,10 @@
} }
.main-cta{ .main-cta{
background: $second-color none repeat scroll 0% 0%; background: var(--color-white) none repeat scroll 0% 0%;
border: 1px solid $main-color; border: 1px solid var(--color-primary);
border-radius: 55px; border-radius: 55px;
color: $main-color; color: var(--color-primary);
cursor: pointer; cursor: pointer;
font-weight: bold; font-weight: bold;
text-transform: uppercase; text-transform: uppercase;
@ -51,8 +49,8 @@
} }
.main-cta:hover{ .main-cta:hover{
background: $main-color none repeat scroll 0% 0%; background: var(--color-primary) none repeat scroll 0% 0%;
border : 1px solid $second-color; border : 1px solid var(--color-primary);
color: $second-color; color: var(--color-white);
} }
} }

25
src/styles/base/form.scss
View File

@ -1,3 +1,9 @@
solid-form {
[data-id="error"] {
display: none !important; // Hide the default core message, english only with a weird message
}
}
.form form { .form form {
display: block; display: block;
height: fit-content; height: fit-content;
@ -41,16 +47,14 @@
.form-label { .form-label {
/*flex: 1 1 auto;*/ /*flex: 1 1 auto;*/
label {
display: flex; display: flex;
flex-direction: column; /* To align label and input vertically */ flex-direction: column; /* To align label and input vertically */
font-weight: 600; font-weight: 600;
margin-bottom: 0.8rem; margin-bottom: 0.8rem;
margin-top: 1.8rem; margin-top: 1.8rem;
text-transform: uppercase; text-transform: uppercase;
}
&.is-light label { &.is-light {
color: var(--color-label-light); color: var(--color-label-light);
} }
} }
@ -130,11 +134,14 @@ textarea {
/* WIDGETS SIB (let in .content-box to override default styles) */ /* WIDGETS SIB (let in .content-box to override default styles) */
solid-form-auto-completion, solid-form-dropdown-autocompletion,
solid-form-dropdown-autocompletion-label,
solid-form-multipleselect-autocompletion-label,
hubl-status { hubl-status {
.ss-main { .ss-main {
font-weight: normal; font-weight: normal;
margin-top: 0.8rem;
text-transform: none; text-transform: none;
@ -144,7 +151,6 @@ hubl-status {
border-radius: 0px; border-radius: 0px;
color: var(--color-input-text); color: var(--color-input-text);
font-weight: normal; font-weight: normal;
margin-top: 0.8rem;
min-height: 4.6rem; min-height: 4.6rem;
padding-left: 1.2rem; padding-left: 1.2rem;
@ -179,6 +185,7 @@ hubl-status {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
margin-bottom: 2.6rem; margin-bottom: 2.6rem;
margin-top: 1.8rem;
} }
label { label {
@ -199,6 +206,7 @@ hubl-status {
width: 100%; width: 100%;
@include breakpoint(lg) { @include breakpoint(lg) {
height: 32px;
margin: auto 0 auto 2.2rem; margin: auto 0 auto 2.2rem;
width: auto; width: auto;
} }
@ -288,13 +296,13 @@ solid-form-file {
} }
} }
/*solid-multiple-select { /*solid-form-multipleselect {
&.select-skills .ss-values .ss-disabled::before { &.select-skills .ss-values .ss-disabled::before {
content: "Select skills"; content: "Select skills";
} }
solid-form-auto-completion > label { solid-form-dropdown-autocompletion-label > label {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -378,7 +386,8 @@ hubl-member-form {
margin-bottom: 1rem; margin-bottom: 1rem;
} }
solid-form-auto-completion { solid-form-dropdown-autocompletion-label,
solid-form-multipleselect-autocompletion-label {
float: left; float: left;
} }

40
src/styles/base/header.scss
View File

@ -26,6 +26,34 @@
} }
} }
.header-left {
flex-grow: 1;
position: relative;
.logo {
display: inline-block;
}
.beta-tag {
display: none;
@include breakpoint(lg) {
display: inline-block;
font-size: 1.4rem;
font-weight: 600;
line-height: 19px;
letter-spacing: 0.19px;
padding: 3px 13px 3px 15px;
border-radius: 3px;
background: var(--color-primary);
color: var(--color-white);
position: fixed;
top: 12px;
left: 267px;
}
}
}
>*:not(:first-child) { >*:not(:first-child) {
margin-left: 2rem; margin-left: 2rem;
@ -34,15 +62,15 @@
} }
} }
.logo { /* Fix: to remove the place taken by these elements */
flex: 1 0 0;
align-items: stretch;
}
/* To remove the place taken by this element */
solid-widget[name='hubl-user-avatar'] { solid-widget[name='hubl-user-avatar'] {
display: contents; display: contents;
} }
solid-notifications-template[data-rdf-type='hd:circle'],
solid-notifications-template[data-rdf-type='foaf:user'] {
position: absolute;
}
} }
/* General styling for both notification and user's panel */ /* General styling for both notification and user's panel */

206
src/styles/base/main.scss
View File

@ -6,6 +6,7 @@
font-size: 10px; font-size: 10px;
font-family: Open Sans, sans-serif; font-family: Open Sans, sans-serif;
--sib-notifications-theme: var(--color-primary); --sib-notifications-theme: var(--color-primary);
body { body {
background-color: var(--color-main-background); background-color: var(--color-main-background);
box-sizing: border-box; box-sizing: border-box;
@ -15,19 +16,20 @@
height: -webkit-fill-available; height: -webkit-fill-available;
min-height: -webkit-fill-available; min-height: -webkit-fill-available;
} }
.notLoggedIn { .notLoggedIn {
visibility: hidden; visibility: hidden;
} }
} }
/* Fix for solid-dashboard fixture */ /* Fix for solid-dashboard fixture */
solid-dashboard section { solid-dashboard section {
padding: 1rem !important; padding: 1rem !important;
@include breakpoint(lg) { @include breakpoint(lg) {
padding: 4.2rem !important; padding: 4.2rem !important;
} }
.icon { .icon {
display: inline-block; display: inline-block;
} }
@ -35,10 +37,15 @@ solid-dashboard section {
.wrapper { .wrapper {
display: grid; display: grid;
grid-template-areas: "header" "content"; grid-template-areas:
"header"
"content";
@include breakpoint(lg) { @include breakpoint(lg) {
grid-template-columns: 265px auto; grid-template-columns: 265px auto;
grid-template-areas: "header header" "leftmenu content"; grid-template-areas:
"header header"
"leftmenu content";
} }
} }
@ -48,20 +55,23 @@ solid-dashboard section {
.left-menu { .left-menu {
grid-area: leftmenu; grid-area: leftmenu;
@include breakpoint(lg) { @include breakpoint(lg) {
height: calc(100vh - 83px); height: calc(100vh - 83px); /* 83px = nav height */
/* 83px = nav height */
position: sticky; position: sticky;
top: 0; top: 0;
overflow-x: hidden; overflow-x: hidden;
overflow-y: auto; overflow-y: scroll;
} }
&.jsLeftMenu { &.jsLeftMenu {
display: none; display: none;
@include breakpoint(lg) { @include breakpoint(lg) {
display: block; display: block;
} }
} }
&.jsLeftMenu[open] { &.jsLeftMenu[open] {
display: block; display: block;
bottom: 0; bottom: 0;
@ -71,6 +81,7 @@ solid-dashboard section {
right: 0; right: 0;
top: 0; top: 0;
z-index: 1000; z-index: 1000;
@include breakpoint(lg) { @include breakpoint(lg) {
display: none; display: none;
} }
@ -79,6 +90,7 @@ solid-dashboard section {
.content { .content {
grid-area: content; grid-area: content;
@include breakpoint(lg) { @include breakpoint(lg) {
position: sticky; position: sticky;
top: 0; top: 0;
@ -89,77 +101,76 @@ solid-dashboard section {
} }
/* Add scrollbar to the left and right menu, and to the content */
nav, /* Add scrollbar to the left and right menu, and to the content */
.views-container, nav, .views-container, .table-wrapper {
.table-wrapper {
overflow: auto; overflow: auto;
height: auto; height: auto;
-webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: touch;
-ms-overflow-style: none; -ms-overflow-style: none;
} }
/* Custom scrollbar of the left-menu */ /* Custom scrollbar of the left-menu */
nav { nav {
scrollbar-width: thin; scrollbar-width: thin;
scrollbar-color: var(--color-scrollbar-left-track) var(--color-scrollbar-left-background); scrollbar-color: var(--color-scrollbar-left-track) var(--color-scrollbar-left-background);
&::-webkit-scrollbar-track { &::-webkit-scrollbar-track {
background: var(--color-scrollbar-left-background); background: var(--color-scrollbar-left-background);
} }
&::-webkit-scrollbar-thumb { &::-webkit-scrollbar-thumb {
background-color: var(--color-scrollbar-left-track); background-color: var(--color-scrollbar-left-track);
border-radius: 6px; border-radius: 6px;
border: 3px solid var(--color-scrollbar-left-background); border: 3px solid var(--color-scrollbar-left-background);
} }
&::-webkit-scrollbar { &::-webkit-scrollbar {
width: 11px; width: 11px;
} }
} }
/* Custom scrollbar of the content */ /* Custom scrollbar of the content */
.views-container { .views-container {
scrollbar-width: thin; scrollbar-width: thin;
scrollbar-color: var(--color-scrollbar-right-track) var(--color-scrollbar-right-background); scrollbar-color: var(--color-scrollbar-right-track) var(--color-scrollbar-right-background);
&::-webkit-scrollbar-track { &::-webkit-scrollbar-track {
background: var(--color-scrollbar-right-background); background: var(--color-scrollbar-right-background);
} }
&::-webkit-scrollbar-thumb { &::-webkit-scrollbar-thumb {
background-color: var(--color-scrollbar-right-track); background-color: var(--color-scrollbar-right-track);
border-radius: 6px; border-radius: 6px;
border: 3px solid var(--color-scrollbar-right-background); border: 3px solid var(--color-scrollbar-right-background);
} }
&::-webkit-scrollbar { &::-webkit-scrollbar {
width: 11px; width: 11px;
} }
} }
/* Custom scrollbar of the table */ /* Custom scrollbar of the table */
.table-wrapper { .table-wrapper {
scrollbar-width: thin; scrollbar-width: thin;
scrollbar-color: var(--color-scrollbar-table-track) var(--color-scrollbar-table-background); scrollbar-color: var(--color-scrollbar-table-track) var(--color-scrollbar-table-background);
&::-webkit-scrollbar-track { &::-webkit-scrollbar-track {
background-color: var(--color-scrollbar-table-background); background-color: var(--color-scrollbar-table-background);
border-radius: 10px; border-radius: 10px;
} }
&::-webkit-scrollbar { &::-webkit-scrollbar {
height: 5px; height: 5px;
} }
&::-webkit-scrollbar-thumb { &::-webkit-scrollbar-thumb {
background-color: var(--color-scrollbar-table-track); background-color: var(--color-scrollbar-table-track);
border-radius: 10px; border-radius: 10px;
} }
} }
/* Quick fix. Will be removed later */ /* Quick fix. Will be removed later */
#admin-circles, #admin-circles,
#admin-projects, #admin-projects,
#admin-users { #admin-users {
@ -185,6 +196,7 @@ h4,
h5, h5,
h6 { h6 {
font-weight: bold; font-weight: bold;
/*span { /*span {
font-weight: 400; font-weight: 400;
padding-left: 0.85rem; padding-left: 0.85rem;
@ -195,18 +207,17 @@ h6 {
}*/ }*/
} }
h1, h1, .h1-like {
.h1-like {
color: var(--color-h1); color: var(--color-h1);
font-size: 2rem; font-size: 2rem;
text-transform: uppercase; text-transform: uppercase;
&.without-margin { &.without-margin {
margin: 0; margin: 0;
} }
} }
h2, h2, .h2-like {
.h2-like {
color: var(--color-h2); color: var(--color-h2);
font-size: 1.8rem; font-size: 1.8rem;
text-transform: uppercase; text-transform: uppercase;
@ -240,6 +251,7 @@ h5 {
justify-content: center; justify-content: center;
overflow: hidden; overflow: hidden;
position: relative; position: relative;
img { img {
background-color: white; background-color: white;
height: 100%; height: 100%;
@ -250,6 +262,7 @@ h5 {
top: 0; top: 0;
width: 100%; width: 100%;
} }
object { object {
height: 45%; height: 45%;
width: 45%; width: 45%;
@ -376,6 +389,7 @@ h5 {
flex-direction: column; flex-direction: column;
flex-grow: 1; flex-grow: 1;
margin: 2rem 1rem 5rem 2rem; margin: 2rem 1rem 5rem 2rem;
&.full-width { &.full-width {
background: var(--color-white); background: var(--color-white);
flex: 1; flex: 1;
@ -385,47 +399,53 @@ h5 {
} }
} }
/* Header inside circle, project view */ /* Header inside circle, project view */
.content-box__header { .content-box__header {
border-bottom: 1px solid var(--color-content-header); border-bottom: 1px solid var(--color-content-header);
padding: 1.8rem 0 1.4rem; padding: 1.8rem 0 1.4rem;
margin: 0 1.6rem; margin: 0 1.6rem;
@include breakpoint(lg) { @include breakpoint(lg) {
padding: 3rem; padding: 2rem;
margin: 0; margin: 0;
} }
.mobile-sidebar-button { .mobile-sidebar-button {
float: right; float: right;
color: var(--color-secondary); color: var(--color-secondary);
font-size: 1.8rem; font-size: 1.8rem;
font-weight: bold!important; font-weight: bold!important;
&::before { &::before {
font-size: 2.2rem; font-size: 2.2rem;
font-weight: normal; font-weight: normal;
margin-right: 1.2rem; margin-right: 1.2rem;
} }
@include breakpoint(lg) { @include breakpoint(lg) {
display: none; display: none;
} }
} }
solid-display { solid-display {
@include breakpoint(sm) { @include breakpoint(sm) {
float: left; float: left;
} }
} }
/* For solid-display on project, circle, or private message view */ /* For solid-display on project, circle, or private message view */
solid-display { solid-display {
width: calc(100% - 94px); width: calc(100% - 94px); /* 94px = width of .mobile-sidebar-button */
/* 94px = width of .mobile-sidebar-button */
div { div {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
width: calc(100% - 20px); width: calc(100% - 20px);
.h1-aside { .h1-aside {
font-size: 1.8rem; font-size: 1.8rem;
&:not(:empty)::before { &:not(:empty)::before {
color: var(--color-grey-4); color: var(--color-grey-4);
content: ' - '; content: ' - ';
@ -433,9 +453,12 @@ h5 {
font-weight: bold; font-weight: bold;
} }
} }
.description { .description {
color: var(--color-grey-4); color: var(--color-grey-4);
} }
.name { .name {
color: var(--color-grey-4); color: var(--color-grey-4);
font-weight: normal; font-weight: normal;
@ -445,8 +468,8 @@ h5 {
} }
.content-box__height { .content-box__height {
min-height: calc(100vh - 50px - 56px); min-height: calc(100vh - 50px - 56px); /* Heights of main header and sub-header */
/* Heights of main header and sub-header */
@include breakpoint(lg) { @include breakpoint(lg) {
min-height: calc(100vh - 83px - 84px); min-height: calc(100vh - 83px - 84px);
} }
@ -455,15 +478,16 @@ h5 {
.content-box__info { .content-box__info {
flex-direction: column; flex-direction: column;
padding: 1rem; padding: 1rem;
@include breakpoint(lg) { @include breakpoint(lg) {
padding: 3.2rem; padding: 3.2rem;
} }
* { * {
box-sizing: border-box; box-sizing: border-box;
} }
} }
/*.modal { /*.modal {
color: var(--color-white); color: var(--color-white);
margin: 75px; margin: 75px;
@ -493,23 +517,28 @@ h5 {
align-items: flex-start; align-items: flex-start;
margin-bottom: 20px; margin-bottom: 20px;
/*end */ /*end */
@include breakpoint(lg) { @include breakpoint(lg) {
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
margin-bottom: 5rem; margin-bottom: 5rem;
} }
h3 { h3 {
/* Quick fix for alignment on mobile before admin content rework */ /* Quick fix for alignment on mobile before admin content rework */
margin-bottom: 20px; margin-bottom: 20px;
/* end */ /* end */
@include breakpoint(lg) { @include breakpoint(lg) {
margin-top: 0; margin-top: 0;
} }
} }
solid-ac-checker, solid-ac-checker,
solid-link { solid-link {
width: 100%; width: 100%;
@include breakpoint(lg) { @include breakpoint(lg) {
width: auto; width: auto;
} }
@ -522,11 +551,13 @@ h5 {
font-size: 1.5rem; font-size: 1.5rem;
margin: 2rem 0 0 2rem; margin: 2rem 0 0 2rem;
text-decoration: underline; text-decoration: underline;
&::before { &::before {
font-size: 2rem; font-size: 2rem;
margin-right: 1rem; margin-right: 1rem;
text-decoration: none; text-decoration: none;
} }
&.right { &.right {
display: block; display: block;
text-align: right; text-align: right;
@ -537,12 +568,17 @@ h5 {
text-align: center; text-align: center;
} }
.block {
display: block;
}
.flex { .flex {
display: flex; display: flex;
} }
.desktop-button__end { .desktop-button__end {
display: block; display: block;
@include breakpoint(lg) { @include breakpoint(lg) {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
@ -551,6 +587,7 @@ h5 {
.space-between { .space-between {
justify-content: space-between; justify-content: space-between;
&.with-padding { &.with-padding {
padding-bottom: 1.4rem; padding-bottom: 1.4rem;
} }
@ -558,6 +595,7 @@ h5 {
.mobile-vertical-align { .mobile-vertical-align {
flex-direction: column; flex-direction: column;
@include breakpoint(lg) { @include breakpoint(lg) {
flex-direction: row; flex-direction: row;
} }
@ -573,6 +611,7 @@ h5 {
.mobile-margin__bottom { .mobile-margin__bottom {
margin-bottom: 1rem; margin-bottom: 1rem;
@include breakpoint(lg) { @include breakpoint(lg) {
margin-bottom: 0; margin-bottom: 0;
} }
@ -584,6 +623,7 @@ h5 {
@import 'header'; @import 'header';
@import 'menu-left'; @import 'menu-left';
@import 'user-thumb'; @import 'user-thumb';
// Button global CSS // Button global CSS
solid-delete, solid-delete,
solid-route, solid-route,
@ -597,169 +637,269 @@ a,
cursor: pointer; cursor: pointer;
display: inline-block; display: inline-block;
padding: 0; padding: 0;
&.button { &.button {
padding: 0.55rem 2.5rem; padding: 0.55rem 2.5rem;
border-radius: 100em; border-radius: 100em;
*, *,
& { & {
font-size: 1.4rem; font-size: 1.4rem;
} }
&.mobile-full-width { &.mobile-full-width {
margin-bottom: 1rem; margin-bottom: 1rem;
padding-left: 5rem; padding-left: 5rem;
width: -webkit-fill-available; width: -webkit-fill-available;
width: -moz-available; width: -moz-available;
@include breakpoint(lg) { @include breakpoint(lg) {
margin-bottom: 0; margin-bottom: 0;
padding-left: 2.5rem; padding-left: 2.5rem;
width: auto; width: auto;
} }
&::before { &::before {
margin-left: -2.6rem; margin-left: -2.6rem;
@include breakpoint(lg) { @include breakpoint(lg) {
margin-left: 0; margin-left: 0;
} }
} }
} }
&.desktop-btn-margin__left { &.desktop-btn-margin__left {
margin: 0; margin: 0;
@include breakpoint(lg) { @include breakpoint(lg) {
margin-left: 2.2rem; margin-left: 2.2rem;
} }
} }
&.small { &.small {
*, *,
& { & {
font-size: 1rem; font-size: 1rem;
} }
} }
&.text-bold { &.text-bold {
*, *,
& { & {
font-weight: bold; font-weight: bold;
} }
} }
&.text-uppercase { &.text-uppercase {
*, *,
& { & {
text-transform: uppercase; text-transform: uppercase;
} }
} }
&.rounded { &.rounded {
border-radius: 50%; border-radius: 50%;
font-size: 1.8rem; font-size: 1.8rem;
padding: 1rem; padding: 1rem;
height: 42px;
width: 42px;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto;
} }
&.button-link { &.button-link {
border-radius: 100em; border-radius: 100em;
*, *,
& { & {
text-decoration: underline; text-decoration: underline;
} }
&:hover { &:hover {
text-decoration: none; text-decoration: none;
} }
} }
&.with-icon::before { &.with-icon::before {
font-size: 1.6rem; font-size: 1.6rem;
margin-right: 1rem; margin-right: 1rem;
} }
&.button-primary{ &.button-primary{
background-color: var(--color-white); background-color: var(--color-white);
*, *,
& { & {
color: var(--color-primary); color: var(--color-primary);
} }
&.bordered { &.bordered {
border: 1px solid var(--color-primary); border: 1px solid var(--color-primary);
} }
&:hover { &:hover {
background-color: var(--color-primary); background-color: var(--color-primary);
*, *,
& { & {
color: var(--color-white); color: var(--color-white);
} }
} }
} }
&.button-disabled{
cursor: not-allowed;
background-color: var(--color-white);
*,
& {
color: var(--color-grey-3);
}
&.bordered {
border: 1px solid var(--color-grey-3);
}
&:hover {
background-color: var(--color-white);
*,
& {
color: var(--color-grey-3);
}
}
}
&.button-secondary { &.button-secondary {
background-color: var(--color-white); background-color: var(--color-white);
*, *,
& { & {
color: var(--color-secondary); color: var(--color-secondary);
} }
&.bordered { &.bordered {
border: 1px solid var(--color-secondary); border: 1px solid var(--color-secondary);
} }
&:hover { &:hover {
background-color: var(--color-secondary); background-color: var(--color-secondary);
*, *,
& { & {
color: var(--color-white); color: var(--color-white);
} }
} }
} }
&.button-complementary { &.button-complementary {
color: var(--color-complementary); color: var(--color-complementary);
background-color: var(--color-white); background-color: var(--color-white);
&.bordered { &.bordered {
border: 1px solid var(--color-complementary); border: 1px solid var(--color-complementary);
} }
&:hover { &:hover {
background-color: var(--color-complementary); background-color: var(--color-complementary);
color: var(--color-white); color: var(--color-white);
} }
} }
&.flex { &.flex {
display: flex; display: flex;
} }
&.reversed { &.reversed {
&.button-primary { &.button-primary {
background-color: var(--color-primary); background-color: var(--color-primary);
*, *,
& { & {
color: var(--color-white); color: var(--color-white);
} }
&:hover { &:hover {
background-color: var(--color-white); background-color: var(--color-white);
color: var(--color-primary); color: var(--color-primary);
*, *,
& { & {
color: var(--color-primary); color: var(--color-primary);
} }
&.bordered { &.bordered {
border: 1px solid var(--color-primary); border: 1px solid var(--color-primary);
} }
} }
} }
&.button-secondary {
background-color: var(--color-secondary); &.button-disabled{
cursor: not-allowed;
background-color: var(--color-grey-3);
*, *,
& { & {
color: var(--color-white); color: var(--color-white);
} }
&.bordered {
border: 1px solid var(--color-white);
}
&:hover {
background-color: var(--color-grey-3);
*,
& {
color: var(--color-white);
}
}
}
&.button-secondary {
background-color: var(--color-secondary);
*,
& {
color: var(--color-white);
}
&:hover { &:hover {
background-color: var(--color-white); background-color: var(--color-white);
*, *,
& { & {
color: var(--color-secondary); color: var(--color-secondary);
} }
&.bordered { &.bordered {
border: 1px solid var(--color-secondary); border: 1px solid var(--color-secondary);
} }
} }
} }
&.button-complementary { &.button-complementary {
background-color: var(--color-complementary); background-color: var(--color-complementary);
*, *,
& { & {
color: var(--color-white); color: var(--color-white);
} }
&:hover { &:hover {
background-color: var(--color-white); background-color: var(--color-white);
*, *,
& { & {
color: var(--color-complementary); color: var(--color-complementary);
} }
&.bordered { &.bordered {
border: 1px solid var(--color-complementary); border: 1px solid var(--color-complementary);
} }

109
src/styles/base/menu-left.scss
View File

@ -2,48 +2,59 @@
background-color: var(--color-menu-background); background-color: var(--color-menu-background);
color: var(--color-menu-text); color: var(--color-menu-text);
/*transition: flex-basis 0.5s ease-in-out;*/ /*transition: flex-basis 0.5s ease-in-out;*/
&.open { &.open {
transform: translateX(0); transform: translateX(0);
} }
.unread { .unread {
font-weight: bolder; font-weight: bolder;
} }
solid-router { solid-router {
.menu-wrapper { .menu-wrapper {
.menu-icon.icon-arrow-up {
visibility: hidden;
}
@include breakpoint(lg) {
.menu-icon.icon-arrow-up {
visibility: visible;
}
&.is-closed { &.is-closed {
.sub-menu { .sub-menu {
display: none; display: none;
} }
.menu-chevron { .menu-chevron {
transform: rotate(180deg); transform: rotate(180deg);
} }
} }
} }
}
solid-link { solid-link {
width: 100%; width: 100%;
} }
.menu { .menu {
cursor: pointer; cursor: pointer;
display: flex; display: flex;
flex-direction: row-reverse; flex-direction: row-reverse;
font-weight: bold; font-weight: bold;
padding: 1.2rem; padding: 1.2rem;
&[active] { &[active] {
background-color: var(--color-menu-highlight-primary); background-color: var(--color-menu-highlight-primary);
.menu-icon:before { .menu-icon:before {
background-color: var(--color-menu-icon-background-active); background-color: var(--color-menu-icon-background-active);
} }
.menu-notification>solid-display>div:first-child { .menu-notification>solid-display>div:first-child {
background-color: var(--color-menu-badge-background); background-color: var(--color-menu-badge-background);
} }
} }
&[name="dashboard"][active] .menu-icon:before,
&[name="members"][active] .menu-icon:before,
&[name="resources"][active] .menu-icon:before,
&[name="polls"][active] .menu-icon:before,
&[name="events"][active] .menu-icon:before {
background-color: transparent;
}
.menu-icon { .menu-icon {
align-items: center; align-items: center;
display: flex; display: flex;
@ -52,6 +63,7 @@
flex-shrink: 0; flex-shrink: 0;
font-size: 1.7rem; font-size: 1.7rem;
width: 3.2em; width: 3.2em;
&:before { &:before {
border-radius: 100%; border-radius: 100%;
height: 1.9em; height: 1.9em;
@ -59,6 +71,7 @@
width: 1.9em; width: 1.9em;
} }
} }
.menu-label { .menu-label {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -70,6 +83,7 @@
text-transform: uppercase; text-transform: uppercase;
width: 8em; width: 8em;
} }
.menu-chevron { .menu-chevron {
align-items: center; align-items: center;
display: flex; display: flex;
@ -78,36 +92,35 @@
justify-content: center; justify-content: center;
width: 2em; width: 2em;
} }
>solid-display { >solid-display {
display: block; display: block;
} }
&[name="events"],
&[name="resources"],
&[name="polls"],
&[name="dashboard"],
&[name="members"] {
.menu-label {
width: 9.9em;
}
}
} }
.sub-menu { .sub-menu {
/* Ellipsis for project tab */ /* Ellipsis for project tab */
.project-tab>div>solid-display>div:nth-child(1) { .project-tab>div>solid-display>div:nth-child(1) {
solid-set-default[name='project'] { solid-set-default[name='project'] {
flex: 3; flex: 3;
.project-customer, .project-customer,
.project-name { .project-name {
box-sizing: border-box; box-sizing: border-box;
display: block; display: block;
width: calc(80vw - 96px); width: calc(80vw - 96px); /*96px = padding of the element + width and margin of counter */
/*96px = padding of the element + width and margin of counter */
@include breakpoint(lg) { @include breakpoint(lg) {
width: 150px; width: 150px;
} }
} }
.project-customer, .project-customer,
.project-name>div { .project-name>div {
@include breakpoint(lg) { @include breakpoint(lg) {
display: block; display: block;
overflow: hidden; overflow: hidden;
@ -117,15 +130,19 @@
} }
} }
} }
/* Ellipsis for circle tab */ /* Ellipsis for circle tab */
.circle-tab>div>solid-display>div { .circle-tab>div>solid-display>div {
solid-display-div[name='name'] { solid-display-div[name='name'] {
flex: 3; flex: 3;
>div[name='name'] { >div[name='name'] {
box-sizing: border-box; box-sizing: border-box;
padding-left: 0.2em; padding-left: 0.2em;
width: calc(80vw - 96px); width: calc(80vw - 96px); /*96px = padding of the element + width and margin of counter */
/*96px = padding of the element + width and margin of counter */
@include breakpoint(lg) { @include breakpoint(lg) {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
@ -135,56 +152,64 @@
} }
} }
} }
/* Ellipsis for message tab */ /* Ellipsis for message tab */
.message-tab>div>solid-display>div>solid-display-div>div { .message-tab>div>solid-display>div>solid-display-div>div {
box-sizing: border-box; box-sizing: border-box;
width: calc(80vw - 96px); width: calc(80vw - 96px); /*96px = padding of the element + width and margin of counter */
/*96px = padding of the element + width and margin of counter */
@include breakpoint(lg) { @include breakpoint(lg) {
width: 150px; width: 150px;
} }
} }
solid-display.nosub>solid-form[fields="name"]>hubl-search-users>input { solid-display.nosub>solid-form[fields="name"]>hubl-search-users>input {
margin-left: 30px!important; margin-left: 30px;
margin-bottom: 10px; margin-bottom: 10px;
width: calc(80vw - 71px); width: calc(80vw - 71px);
display: block; display: block;
background-color: var(--color-secondary); background-color: var(--color-secondary);
color: var(--color-grey-6); color: var(--color-white);
border: 1px solid var(--color-grey-4); border: 1px solid var(--color-grey-4);
border-radius: 3px; border-radius: 3px;
padding: 4px; padding: 4px;
@include breakpoint(lg) { @include breakpoint(lg) {
margin: auto; margin: auto;
margin-bottom: 10px; margin-bottom: 10px;
width: auto; width: auto;
&::placeholder {
color: var(--color-grey-6);
}
} }
} }
solid-display.nosub>nav { solid-display.nosub>nav {
text-align: center; text-align: center;
overflow: hidden; overflow: hidden;
display: grid; display: grid;
grid-template-columns: auto 50% auto; grid-template-columns: auto 50% auto;
grid-template-areas: "left middle right"; grid-template-areas: "left middle right";
>* { >* {
color: var(--color-grey-6); color: var(--color-white);
} }
>[data-id="prev"] { >[data-id="prev"] {
grid-area: left; grid-area: left;
} }
>[data-id="next"] { >[data-id="next"] {
grid-area: right; grid-area: right;
} }
>span { >span {
grid-area: middle; grid-area: middle;
} }
} }
hubl-menu-publicprivate { hubl-menu-publicprivate {
display: inline-block; display: inline-block;
text-align: center; text-align: center;
div { div {
font-family: simple-line-icons; font-family: simple-line-icons;
width: 20px; width: 20px;
@ -192,53 +217,66 @@
padding-top: 0.1em; padding-top: 0.1em;
} }
} }
>solid-display.nosub>div>solid-display>div { >solid-display.nosub>div>solid-display>div {
padding: 1rem 1rem 1rem 3rem; padding: 1rem 1rem 1rem 3rem;
} }
solid-display>div { solid-display>div {
.create { .create {
color: var(--color-white); color: var(--color-white);
margin: 1rem 1rem 2.2rem 3.2rem; margin: 1rem 1rem 2.2rem 3.2rem;
} }
&>solid-display { &>solid-display {
&:last-child>div { &:last-child>div {
margin-bottom: 2.2rem; margin-bottom: 2.2rem;
} }
>div { >div {
color: var(--color-grey-6); color: var(--color-white);
cursor: pointer; cursor: pointer;
>hubl-menu-fix-url-circle>solid-display>div,
>hubl-menu-fix-url-project>solid-display>div { >hubl-menu-fix-url-circle>solid-link>solid-display>div,
>hubl-menu-fix-url-project>solid-link>solid-display>div {
padding: 1rem 1rem 1rem 3rem; padding: 1rem 1rem 1rem 3rem;
} }
} }
&[fields="project(customer.name, name), badge"]>div { &[fields="project(customer.name, name), badge"]>div {
padding: 0; padding: 0;
} }
} }
&>solid-display[active]>div, &>solid-display[active]>div,
&>solid-display>div>hubl-menu-fix-url-circle>solid-display[active]>div, &>solid-display>div>hubl-menu-fix-url-circle>solid-link>solid-display[active]>div,
&>solid-display>div>hubl-menu-fix-url-project>solid-display[active]>div { &>solid-display>div>hubl-menu-fix-url-project>solid-link>solid-display[active]>div {
background-color: var(--color-menu-highlight-primary); background-color: var(--color-menu-highlight-primary);
color: var(--color-menu-text-active); color: var(--color-menu-text-active);
font-weight: bold; font-weight: bold;
} }
} }
&.menu-notification { &.menu-notification {
>solid-display>div>solid-display>div>hubl-menu-fix-url-circle, >solid-display>div>solid-display>div>hubl-menu-fix-url-circle,
>solid-display>div>solid-display>div>hubl-menu-fix-url-project { >solid-display>div>solid-display>div>hubl-menu-fix-url-project {
flex: 1; flex: 1;
} }
>solid-display>div>solid-display>div, >solid-display>div>solid-display>div,
>solid-display>div>solid-display>div>hubl-menu-fix-url-circle>solid-display>div, >solid-display>div>solid-display>div>hubl-menu-fix-url-circle>solid-link>solid-display>div,
>solid-display>div>solid-display>div>hubl-menu-fix-url-project>solid-display>div { >solid-display>div>solid-display>div>hubl-menu-fix-url-project>solid-link>solid-display>div {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
hubl-counter { hubl-counter {
height: 20px; height: 20px;
width: 20px; width: 20px;
margin-right: 1em; margin-right: 1em;
div.counter:not([data-nb-unread="0"]) { div.counter:not([data-nb-unread="0"]) {
text-align: center; text-align: center;
display: block; display: block;
@ -254,6 +292,7 @@
} }
} }
} }
.divider { .divider {
height: 1px; height: 1px;
background-color: var(--color-grey-11); background-color: var(--color-grey-11);

42
src/styles/base/table.scss
View File

@ -46,13 +46,17 @@
&>* { &>* {
border-bottom: 1px solid var(--color-table-border); border-bottom: 1px solid var(--color-table-border);
display: table-cell; display: table-cell;
text-align: center;
vertical-align: middle; vertical-align: middle;
} }
solid-multiple[name="user.communities"] {
text-align: left;
}
} }
} }
&>solid-multiple { /*&>solid-multiple {
display: contents; display: contents;*/
&>div { &>div {
display: contents; display: contents;
@ -68,7 +72,7 @@
} }
} }
} }
} /*}*/
} }
} }
} }
@ -117,6 +121,14 @@
width: 280px; width: 280px;
} }
.w450 {
width: 450px;
}
.w370 {
width: 370px;
}
.w230 { .w230 {
width: 230px; width: 230px;
} }
@ -152,6 +164,10 @@
.desktop-btn-margin__left; .desktop-btn-margin__left;
} }
} }
&.is-spaced {
padding: 0.8rem 2.2rem;
}
} }
.cell-with-name { .cell-with-name {
@ -163,23 +179,11 @@
/* Styles of elements inside cells */ /* Styles of elements inside cells */
.user-thumb>div, .table {
.user-thumb.is-spaced,
[name='user-thumb'] { [name='user-thumb'] {
vertical-align: middle; padding: 0.8rem 2.2rem;
text-align: left;
@extend %user-thumb__grid;
padding: 0 2.2rem;
>.user-thumb__picture {
@extend .user-thumb__picture;
}
>[name='sup'] {
@extend %user-thumb__grid-sup;
}
>[name='sub'] {
@extend %user-thumb__grid-inf;
} }
} }

55
src/styles/base/user-thumb.scss
View File

@ -35,6 +35,22 @@
color: var(--color-user-thumb-name); color: var(--color-user-thumb-name);
font-weight: 600; font-weight: 600;
margin-right: 1rem; margin-right: 1rem;
text-align: left;
}
.user-thumb__send {
position: relative;
bottom: 7px;
left: -5px;
solid-link {
@include icon('speech');
&::before {
display: inline-block;
color: var(--color-primary);
}
}
} }
.user-thumb__admin:not(:empty) { .user-thumb__admin:not(:empty) {
@ -50,8 +66,33 @@
content: '@'; content: '@';
} }
} }
solid-multiple[name="user.communities"] {
* {
display: contents;
}
solid-display-value {
&:after {
content: ",";
margin-right: 5px;
}
display: inline-block!important;
}
>solid-display>div>solid-display:last-child>div>solid-display-value:after {
display: none;
}
>solid-display {
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: calc(50% - 22px - 0.5rem);
line-height: 22px;
}
.user-thumb__city:not(:empty) {
@include mdi('atom'); @include mdi('atom');
align-items: center; align-items: center;
display: flex; display: flex;
@ -76,10 +117,16 @@
margin-right: 0.50rem; margin-right: 0.50rem;
} }
} }
.user-thumb[name="classGroup"] {
display: block;
margin-top: 15px;
}
/* Apply the grids to all user-thumbs */ /* Apply the grids to all user-thumbs */
.user-thumb>div, .user-thumb>div,
.user-thumb>[name='classGrid'],
[name='user-thumb'] { [name='user-thumb'] {
@extend %user-thumb__grid; @extend %user-thumb__grid;
>[name='sup'] { >[name='sup'] {
@ -90,9 +137,3 @@
@extend %user-thumb__grid-inf; @extend %user-thumb__grid-inf;
} }
} }
/* Add extra spaces to user-thumbs that are inside a table */
.user-thumb.is-spaced>div,
[name='user-thumb'] {
padding: 0.8rem 2.2rem;
}

6
src/styles/components/comment.scss
View File

@ -37,9 +37,9 @@
} }
} }
solid-conversation.conversation { sib-conversation.conversation {
.solid-conversation { .sib-conversation {
font-family: Open Sans; font-family: Open Sans;
[name='conversation-wrapper'] { [name='conversation-wrapper'] {
@ -74,7 +74,7 @@
solid-ac-checker { solid-ac-checker {
border-top: 1px solid $color-210-17-91; border-top: 1px solid $color-210-17-91;
solid-form-textarea { solid-form-textarea-label {
>label div { >label div {
color: $color-210-5-56; color: $color-210-5-56;

19
src/styles/components/sidebar.scss
View File

@ -8,6 +8,10 @@
&.with-padding { &.with-padding {
padding: 1.3rem; padding: 1.3rem;
@include breakpoint(lg) {
padding: 2.5rem;
}
} }
} }
@ -82,7 +86,8 @@
>solid-route { >solid-route {
&[name*='circle'], &[name*='circle'],
&[name*='project'] { &[name*='project'],
&[name*='communities'] {
>li::before { >li::before {
font-size: 4rem; font-size: 4rem;
@ -116,16 +121,8 @@
@include ci('file'); @include ci('file');
} }
&[name='admin-users']>li::before { &[name='admin-communities']>li {
background-color: var(--color-secondary); @include ci('networking');
content: '';
display: inline-block;
height: 40px;
mask: url('/images/add-user.svg') 1% 1% / 1px 1px no-repeat;
mask-size: cover;
-webkit-mask: url('/images/add-user.svg') 1% 1% / 1px 1px no-repeat;
-webkit-mask-size: cover;
width: 40px;
} }
&[name='admin-circles']>li { &[name='admin-circles']>li {

1
src/styles/index.scss
View File

@ -26,4 +26,3 @@
@import 'layout/dashboard/index'; @import 'layout/dashboard/index';
@import 'layout/polls/index'; @import 'layout/polls/index';
} }
@import '../../client.sample.etuc.scss';

61
src/styles/layout/events/events.scss
View File

@ -7,20 +7,20 @@ solid-event section {
width: 100%; width: 100%;
font-family: "Facit"; font-family: "Facit";
font-weight: 400; font-weight: 400;
color: #7A7F85; color: var(--color-main-text);
solid-event { solid-event {
sib-display div { solid-display div {
max-width: 1110px; max-width: 1110px;
sib-display { solid-display {
margin: 0 0 20px 40px; margin: 0 0 20px 40px;
} }
} }
.red-button, .red-button,
.event-type { .event-type {
background-color: #C4262E; background-color: var(--color-add-button-background);
} }
.black-button { .black-button {
background-color: #3A3A3A; background-color: var(--highlight-font-color);
margin-left: 10%; margin-left: 10%;
} }
.event-type, .event-type,
@ -30,23 +30,23 @@ solid-event section {
#listevents, #listevents,
#circle-listevents { #circle-listevents {
[name="name"], [name="name"],
solid-display-link-event .mdi::before { event-display-link-event .mdi::before {
color: #063B5C; color: var(--color-primary);
} }
} }
.event-place-name, .event-place-name,
.nextevent-startdate, .nextevent-startdate,
solid-display-link-event { event-display-link-event {
color: #3A3A3A; color: var(--highlight-font-color);
} }
.sib-event { .solid-event {
font-family: "Facit"; font-family: "Facit";
font-weight: 400; font-weight: 400;
.page-title { .page-title {
font-family: "RefrigeratorDelxW01Bold"; font-family: "RefrigeratorDelxW01Bold";
font-size: 3.2rem; font-size: 3.2rem;
line-height: 3.8rem; line-height: 3.8rem;
color: #063B5C; color: var(--color-primary);
} }
} }
#default-listevents, #default-listevents,
@ -56,21 +56,20 @@ solid-event section {
width: max-content; width: max-content;
height: max-content; height: max-content;
padding: 5px 20px; padding: 5px 20px;
color: #063B5C; color: var(--color-primary);
} }
sib-form { .headline h2 {
sib-form-dropdown { float: left;
margin-left: 15px; margin-top: 35px;
label div { color: var(--color-primary);
height: 2.5rem; text-transform: none;
}
&::before {
font-family: "RefrigeratorDelxW01Bold"; font-family: "RefrigeratorDelxW01Bold";
font-size: 2.4rem; font-size: 2.4rem;
line-height: 29px; }
color: #063B5C; solid-form {
top: -40px; solid-form-dropdown-label {
content: "Research an event"; label {
height: 2.5rem;
} }
} }
} }
@ -79,7 +78,7 @@ solid-event section {
font-size: 1.8rem; font-size: 1.8rem;
line-height: 2.6rem; line-height: 2.6rem;
letter-spacing: 0.32px; letter-spacing: 0.32px;
color: #063B5C; color: var(--color-primary);
padding: 5px; padding: 5px;
max-width: 250px; max-width: 250px;
margin: 5px auto; margin: 5px auto;
@ -90,12 +89,12 @@ solid-event section {
width: max-content; width: max-content;
height: max-content; height: max-content;
} }
solid-display-location-events { event-display-location-events {
padding: 5px; padding: 5px;
} }
} }
.eventdetail { .eventdetail {
sib-display div { solid-display div {
display: block; display: block;
} }
.mdi::before { .mdi::before {
@ -108,10 +107,10 @@ solid-event section {
font-family: "RefrigeratorDelxW01Bold"; font-family: "RefrigeratorDelxW01Bold";
font-size: 3.2rem; font-size: 3.2rem;
line-height: 3.8rem; line-height: 3.8rem;
color: #063B5C; color: var(--color-primary);
display: block; display: block;
} }
color: #063B5C; color: var(--color-primary);
.event-type { .event-type {
width: max-content; width: max-content;
padding: 5px 20px; padding: 5px 20px;
@ -124,12 +123,12 @@ solid-event section {
font-size: 1.6rem; font-size: 1.6rem;
line-height: 2.6rem; line-height: 2.6rem;
} }
solid-display-link-event a { event-display-link-event a {
font-size: 1.6rem; font-size: 1.6rem;
} }
} }
.newevent label div, .newevent label div,
.newevent sib-form-file div label { .newevent solid-form-file-label div label {
line-height: 2.2rem; line-height: 2.2rem;
text-transform: uppercase; text-transform: uppercase;
color: var(--form-title); color: var(--form-title);
@ -165,7 +164,7 @@ solid-event section {
background-color: #f0f3f6; background-color: #f0f3f6;
} }
#circle-events solid-event .events sib-form sib-form-dropdown select { #circle-events solid-event .events solid-form solid-form-dropdown-label select {
background-color: #f0f3f6; background-color: #f0f3f6;
} }

2
src/styles/layout/job-offers/job-offers.scss
View File

@ -180,7 +180,7 @@ solid-job-board {
} }
} }
.solid-conversation, .sib-conversation,
.conversation > div { .conversation > div {
display: flex; display: flex;
flex-direction: column-reverse; flex-direction: column-reverse;

2
src/styles/layout/polls/_index.scss
View File

@ -1 +1 @@
@import '_polls.scss'; @import 'polls.scss';

111
src/styles/layout/polls/_polls.scss → src/styles/layout/polls/polls.scss
View File

@ -12,27 +12,25 @@ solid-poll > div {
margin: auto; margin: auto;
.headline { .headline {
h2 { h2 {
margin: 0 40px;
font-family: "RefrigeratorDelxW01Bold"; font-family: "RefrigeratorDelxW01Bold";
font-size: 2.4rem; font-size: 2.4rem;
line-height: 3.8rem; color: var(--color-primary);
color: #063B5C; float: left;
margin-top: 5px;
} }
.add-poll {
solid-link { solid-link {
float: right; display:flex;
margin-top: 10px; justify-content: end;
display: initial; margin-top: 30px;
margin-right: 75px; margin-right: 70px;
position: relative;
z-index: 1; z-index: 1;
position: relative;
.add-poll {
background-color: var(--color-add-button-background);
color: var(--color-add-button);
box-shadow: 0px 0px 4px 1px #CACACA; box-shadow: 0px 0px 4px 1px #CACACA;
height: 2rem;
font-size: 1.4rem;
text-transform: uppercase; text-transform: uppercase;
font-weight: 700; font-weight: 700;
padding: 0.55rem 2.5rem;
width: max-content;
line-height: 20px; line-height: 20px;
&::before { &::before {
font-family: "material-design-icons"; font-family: "material-design-icons";
@ -52,9 +50,12 @@ solid-poll > div {
display: block; display: block;
border-bottom: solid 1px #cacaca; border-bottom: solid 1px #cacaca;
height: 90px; height: 90px;
width: 650px; margin: 30px 25px 25px;
margin: 16px 25px 25px;
max-width: 85%; max-width: 85%;
solid-form-dropdown-label label {
font-size: 1.4rem;
font-family: "Facit";
}
solid-form-placeholder-text { solid-form-placeholder-text {
margin-left: 15px; margin-left: 15px;
input { input {
@ -69,7 +70,7 @@ solid-poll > div {
height: 100%; height: 100%;
max-width: 1100px; max-width: 1100px;
margin: auto; margin: auto;
solid-display { > solid-display {
width: 320px; width: 320px;
height: 520px; height: 520px;
margin: 0 0 20px 40px; margin: 0 0 20px 40px;
@ -84,7 +85,7 @@ solid-poll > div {
*[name="body"] { *[name="body"] {
padding: 10px; padding: 10px;
/*size of tags of poll card*/ /*size of tags of poll card*/
etuc-display-votetags { poll-display-votetags {
>div { >div {
width: 64px; width: 64px;
height: 24px; height: 24px;
@ -101,7 +102,7 @@ solid-poll > div {
} }
[name="title"] { [name="title"] {
font-family: "RefrigeratorDelxW01Bold"; font-family: "RefrigeratorDelxW01Bold";
color: #063B5C; color: var(--color-primary);
font-size: 1.8rem; font-size: 1.8rem;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
@ -112,7 +113,7 @@ solid-poll > div {
} }
[name="hostingOrganisation"], [name="hostingOrganisation"],
[name="endDate"] { [name="endDate"] {
color: #3A3A3A; color: var(--highlight-font-color);
font-family: Facit; font-family: Facit;
font-size: 14px; font-size: 14px;
letter-spacing: 0; letter-spacing: 0;
@ -122,7 +123,7 @@ solid-poll > div {
&::before { &::before {
content: '\e037'; content: '\e037';
font-family: 'simple-line-icons'; font-family: 'simple-line-icons';
color: #C4262E; color: var(--color-secondary);
height: 22px; height: 22px;
width: 24px; width: 24px;
font-size: 16px; font-size: 16px;
@ -136,11 +137,11 @@ solid-poll > div {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
margin-top: 10px; margin-top: 10px;
solid-display-div [name="dateImage"]::before { div [name="dateImage"]::before {
display: inline-block; display: inline-block;
font: normal normal normal 24px/1 "Material Design Icons"; font: normal normal normal 24px/1 "Material Design Icons";
content: "\F6AF"; content: "\F6AF";
color: #C4262E; color: var(--color-secondary);
height: 22px; height: 22px;
width: 24px; width: 24px;
font-size: 20px; font-size: 20px;
@ -149,7 +150,7 @@ solid-poll > div {
} }
} }
[name="shortDescription"] { [name="shortDescription"] {
color: #7A7F85; color: var(--color-main-text);
font-family: Facit; font-family: Facit;
font-size: 14px; font-size: 14px;
letter-spacing: 0; letter-spacing: 0;
@ -174,6 +175,7 @@ solid-poll > div {
h1 { h1 {
font-size: 3.2rem; font-size: 3.2rem;
line-height: 3.8rem; line-height: 3.8rem;
margin: 20px auto;
} }
h2 { h2 {
font-size: 26px; font-size: 26px;
@ -186,7 +188,7 @@ solid-poll > div {
solid-display.topline { solid-display.topline {
>div:first-of-type { >div:first-of-type {
*[name="right"] { *[name="right"] {
etuc-display-votetags { poll-display-votetags {
>div { >div {
width: 64px; width: 64px;
height: 24px; height: 24px;
@ -200,7 +202,7 @@ solid-poll > div {
} }
[name="hostingOrganisation"], [name="hostingOrganisation"],
[name="dateLine"] { [name="dateLine"] {
color: #3A3A3A; color: var(--highlight-font-color);
font-family: Facit; font-family: Facit;
font-size: 16px; font-size: 16px;
font-weight: bold; font-weight: bold;
@ -208,7 +210,7 @@ solid-poll > div {
[name="dateLine"] solid-set-default { [name="dateLine"] solid-set-default {
display: flex; display: flex;
margin-top: 7px; margin-top: 7px;
solid-display-date { solid-display-value, solid-display-date-value {
margin-left: 7px; margin-left: 7px;
} }
} }
@ -216,24 +218,24 @@ solid-poll > div {
margin-left: 0; margin-left: 0;
[name="hostingOrganisation"]::before { [name="hostingOrganisation"]::before {
content: '\e037'; content: '\e037';
font-family: 'simple-line-icons'; font-family: "simple-line-icons";
font-weight: 400; font-weight: 400;
color: #C4262E; color: var(--color-secondary);
margin-right: 10px; margin-right: 10px;
font-size: 16px; font-size: 16px;
} }
} }
solid-display-div [name="dateImage"]::before { div [name="dateImage"]::before {
font-family: "Material Design Icons"; font-family: "Material Design Icons";
font-weight: 400; font-weight: 400;
content: "\F6AF"; content: "\F6AF";
color: #C4262E; color: var(--color-secondary);
font-size: 20px; font-size: 20px;
} }
[name="shortDescription"], [name="shortDescription"],
[name="longDescription"] { [name="longDescription"] {
margin: 20px 0; margin: 20px 0;
color: #7A7F85; color: var(--color-main-text);
font-family: Facit; font-family: Facit;
} }
[name="shortDescription"] { [name="shortDescription"] {
@ -255,7 +257,7 @@ solid-poll > div {
font-weight: 400; font-weight: 400;
font-size: 20px; font-size: 20px;
margin-right: 10px; margin-right: 10px;
color: #3A3A3A; color: var(--highlight-font-color);
} }
.vote-section > h3::before { .vote-section > h3::before {
content:"\F004"; content:"\F004";
@ -278,16 +280,15 @@ solid-poll > div {
div[name="progressBar"] div .progressBarValue { div[name="progressBar"] div .progressBarValue {
margin: 0; margin: 0;
} }
#poll-votes-form input[type="submit"] { .poll-votes-form input[type="submit"] {
height: 38px; height: 38px;
width: 149px;
border-radius: 19px; border-radius: 19px;
box-shadow: 0 0 7px 0 rgba(0,0,0,0.15); box-shadow: 0 0 7px 0 rgba(0,0,0,0.15);
} }
#poll-votes-form input[type="submit"]:disabled { .poll-votes-form input[type="submit"]:disabled {
opacity: 0.3; opacity: 0.3;
} }
#unavailablePoll { .unavailablePoll {
font-style: italic; font-style: italic;
} }
.progressBarValue { .progressBarValue {
@ -297,7 +298,7 @@ solid-poll > div {
} }
.send-share, .send-share,
.back-to-list { .back-to-list {
background-color: #3A3A3A; background-color: var(--highlight-font-color);
padding: 5px 25px; padding: 5px 25px;
font-size: 1.4rem; font-size: 1.4rem;
&::before { &::before {
@ -390,7 +391,7 @@ solid-poll > div {
} }
p { p {
margin-top: 10px; margin-top: 10px;
color: #7A7F85; color: var(--color-main-text);
font-family: Facit; font-family: Facit;
font-size: 16px; font-size: 16px;
} }
@ -406,12 +407,14 @@ solid-poll > div {
height: 110px; height: 110px;
} }
solid-form-label-text, solid-form-label-text,
solid-form-textarea { solid-form-textarea,
solid-form-label-textarea,
solid-form-textarea-label {
display: block; display: block;
margin: 15px 0; margin: 15px 0;
padding: 0; padding: 0;
} }
label > div, solid-form-file-image > div label, solid-form-auto-completion[name="tags"] > label::before { label > div, solid-form-file-image > div label, solid-form-dropdown-autocompletion[name="tags"] > label::before {
margin-bottom: 5px; margin-bottom: 5px;
margin-top: 20px; margin-top: 20px;
color: var(--form-title); color: var(--form-title);
@ -451,18 +454,18 @@ solid-poll > div {
display: flex; display: flex;
width: 100%; width: 100%;
justify-content: space-between; justify-content: space-between;
custom-choix { poll-custom-choice {
width: calc(100% - 45px); width: calc(100% - 45px);
solid-form-label-text[name="name"] { solid-form-label-text[name="name"] {
margin-bottom: 0; margin-bottom: 0;
} }
} }
button { button {
border: 1px solid var(--main-color); border: 1px solid var(--color-primary);
background-color: transparent; background-color: transparent;
border-radius: 15px; border-radius: 15px;
font-size: 24px; font-size: 24px;
color: var(--main-color); color: var(--color-primary);
padding: 0; padding: 0;
height: 30px; height: 30px;
width: 30px; width: 30px;
@ -480,7 +483,7 @@ solid-poll > div {
font-weight: bold; font-weight: bold;
font-size: 13px; font-size: 13px;
margin: 10px 0; margin: 10px 0;
color: var(--main-color); color: var(--color-primary);
&::before { &::before {
content: "\F419"; content: "\F419";
font-family: Material Design Icons; font-family: Material Design Icons;
@ -495,7 +498,7 @@ solid-poll > div {
margin-top: 10px; margin-top: 10px;
.ss-multi-selected .ss-values .ss-value { .ss-multi-selected .ss-values .ss-value {
border-radius: 14px; border-radius: 14px;
background-color: #C4262E; background-color: var(--color-secondary);
padding: 5px 10px; padding: 5px 10px;
font-size: 11px; font-size: 11px;
} }
@ -510,6 +513,24 @@ solid-poll > div {
text-transform: uppercase; text-transform: uppercase;
} }
} }
.poll-footer {
.back-to-list {
background-color: var(--highlight-font-color);
padding: 5px 25px;
font-size: 1.4rem;
margin-left: 10%;
border-radius: 15px;
color: white;
&::before {
font-family: "Material Design Icons";
font-weight: 400;
font-size: 20px;
vertical-align: middle;
color: white;
content: "\F04D";
}
}
}
} }
} }

53
src/styles/layout/resources/resources.scss
View File

@ -3,27 +3,27 @@
width: 100%; width: 100%;
font-family: "Facit"; font-family: "Facit";
font-weight: 400; font-weight: 400;
color: #7A7F85; color: var(--content-font-color);
solid-resource { solid-resource {
sib-display div { solid-display div {
max-width: 1110px; max-width: 1110px;
sib-display { solid-display {
margin: 0 0 20px 40px; margin: 0 0 20px 40px;
} }
} }
.sib-resource { .solid-resource {
font-family: "Facit"; font-family: "Facit";
.page-title { .page-title {
font-family: "RefrigeratorDelxW01Bold"; font-family: "RefrigeratorDelxW01Bold";
font-size: 3.2rem; font-size: 3.2rem;
line-height: 3.8rem; line-height: 3.8rem;
color: #063B5C; color: var(--color-primary);
} }
.red-button { .red-button {
background-color: #C4262E; background-color: var(--color-add-button-background);
} }
.black-button { .black-button {
background-color: #3A3A3A; background-color: var(--highlight-font-color);
margin-left: 10%; margin-left: 10%;
} }
.lnk-newresource { .lnk-newresource {
@ -33,23 +33,22 @@
position: relative; position: relative;
} }
.listresources .lnk-newkeyword { .listresources .lnk-newkeyword {
top: 133px; top: 155px;
left: 220px; left: 220px;
.button.thin-button.mdi { .button.thin-button.mdi {
padding: 5px 20px; padding: 5px 20px;
} }
} }
.resources { .listresources {
margin-top: -35px; .headline h2 {
sib-form { float: left;
&::before { margin-top: 5px;
content: "Research a resource"; color: var(--color-primary);
text-transform: none;
font-family: "RefrigeratorDelxW01Bold"; font-family: "RefrigeratorDelxW01Bold";
color: #063B5C;
font-size: 2.4rem; font-size: 2.4rem;
line-height: 3.8rem;
top: -10px;
} }
solid-form {
select { select {
width: 150px; width: 150px;
} }
@ -61,14 +60,16 @@
width: max-content; width: max-content;
height: max-content; height: max-content;
padding: 10px 30px; padding: 10px 30px;
color: #063B5C; color: var(--color-primary);
} }
sib-display sib-display { solid-display solid-display {
[name="name"] { [name="name"] {
font-family: "RefrigeratorDelxW01Bold"; font-family: "RefrigeratorDelxW01Bold";
color: #063B5C; color: var(--color-primary);
} }
[name="link"] a { [name="link"] a, [name="document"] a {
width: 75%;
margin-bottom: 10px;
padding-left: 35px; padding-left: 35px;
position: relative; position: relative;
&::before { &::before {
@ -84,7 +85,7 @@
font-family: "RefrigeratorDelxW01Bold"; font-family: "RefrigeratorDelxW01Bold";
font-size: 3.2rem; font-size: 3.2rem;
line-height: 3.8rem; line-height: 3.8rem;
color: #063B5C; color: var(--color-primary);
} }
[name="infotext"] { [name="infotext"] {
justify-content: flex-start; justify-content: flex-start;
@ -97,7 +98,7 @@
} }
} }
.newresource label div, .newresource label div,
.newresource sib-form-file div label { .newresource solid-form-file div label {
line-height: 2.2rem; line-height: 2.2rem;
text-transform: uppercase; text-transform: uppercase;
color: var(--form-title); color: var(--form-title);
@ -108,11 +109,11 @@
.newresource select, .newresource select,
.newresource textarea, .newresource textarea,
.newresource input, .newresource input,
.newresource sib-multiple-select .ss-main .ss-multi-selected { .newresource solid-multiple-select .ss-main .ss-multi-selected {
background-color: var(--form-inputs-background); background-color: var(--form-inputs-background);
} }
.newresource input[type="submit"] { .newresource input[type="submit"] {
background-color: #3C3F57; background-color: var(--form-submit-button);
} }
.newresource input[type="file"] { .newresource input[type="file"] {
background-color: transparent; background-color: transparent;
@ -124,7 +125,7 @@
} }
} }
@media (max-width: 991px) { @media (max-width: 991px) {
.sib-resource { .solid-resource {
margin-top: 65px; margin-top: 65px;
} }
} }
@ -134,7 +135,7 @@
background-color: #f0f3f6; background-color: #f0f3f6;
} }
#circle-resources .resources sib-form sib-form-dropdown select { #circle-resources .resources solid-form solid-form-dropdown select {
background-color: #f0f3f6; background-color: #f0f3f6;
} }

2
src/styles/layout/user/_index.scss
View File

@ -1 +1 @@
@import 'user-profile'; @import 'messages';

16
src/styles/layout/user/messages.scss Normal file
View File

@ -0,0 +1,16 @@
.avatar-container {
display: inline-block;
margin-right: 10px;
.avatar {
height: 40px;
width: 40px;
}
}
.avatar-text {
position: absolute;
top: 7.5rem;
@include breakpoint(lg) {
top: 2.8rem;
}
}

76
src/styles/layout/user/user-profile.scss
View File

@ -1,76 +0,0 @@
/*.user-profile__container {
.user-bio {
display: grid;
grid-gap: 1rem;
grid-template-areas: "avatar name"
"avatar information";
grid-template-columns: minmax(300px, 400px) 2fr;
.avatar-display {
grid-area: avatar;
overflow: hidden;
position: relative;
img {
border-radius: 50%;
height: 300px;
object-fit: cover;
overflow: hidden;
object-position: center;
width: 300px;
}
}
.name-diplay {
grid-area: name;
[name='user-name-groups'] {
align-items: baseline;
align-self: end;
display: flex;
solid-multiple {
display: flex;
padding-left: 1.4rem;
hubl-groups-name {
@extend %tag-role;
}
}
}
}
.info-form {
grid-area: information; */
/* ces styles disparaitront lorsque l'on aura la fonctionnalité pour uploader une photo */
/*[name="account.picture"] {
margin-bottom: 1rem;
}
hubl-instruction {
margin-left: 1rem;
span {
color: $color-233-18-29;
font-weight: bold;
}
p {
margin-left: 1rem;
}
}*/
/* Fin commentaire sur upload photos */
/*}
[name^="inline-"] {
display: flex;
justify-content: flex-start;
>*:not(:last-child) {
margin-right: 3rem;
}
}
}
}*/

113
src/sw.js Normal file
View File

@ -0,0 +1,113 @@
const CACHE_NAME = 'hubl-store';
self.addEventListener('install', function (e) {
self.skipWaiting();
e.waitUntil(
caches.open(CACHE_NAME).then(function (cache) {
return cache.addAll([
'/locales/es.json',
'/locales/fr.json',
'/scripts/index.js',
'/syles/index.css',
'/index.html',
'/'
]);
})
);
});
self.addEventListener('activate', function (e) {
// invalidate older versions
e.waitUntil(
caches.keys()
.then(function (keyList) {
return Promise.all(keyList.map(function (key) {
if (key !== CACHE_NAME && key !== (CACHE_NAME + "-cdn") && key !== (CACHE_NAME + "-api")) {
return caches.delete(key);
}
}));
}));
self.clients.claim();
});
self.addEventListener('fetch', function (event) {
let requestURL = new URL(event.request.url);
if (requestURL.origin == location.origin) {
// Static asset, cache then network
event.respondWith(
caches.open(CACHE_NAME).then(function (cache) {
return cache.match(event.request).then(function (response) {
var fetchPromise = fetch(event.request).then(function (networkResponse) {
cache.put(event.request, networkResponse.clone());
return networkResponse;
});
return response || fetchPromise;
});
}),
);
} else {
if (
event.request.method == 'POST' ||
event.request.method == 'PUT'
) {
// disabled: lead to cors errors
// // POST/PUT to api, rewrite the cache
// event.respondWith(
// caches.open(CACHE_NAME + '-api').then(function (cache) {
// return fetch(event.request).then(function (response) {
// cache.put(event.request, response.clone());
// return response;
// })
// }));
// api: no cache
event.respondWith(fetch(event.request));
} else if (
/matomo/.test(requestURL.origin) ||
/sentry/.test(requestURL.origin) ||
/jabber/.test(requestURL.origin) ||
/xmpp/.test(requestURL.origin)
) {
// analytics, always distant
event.respondWith(fetch(event.request));
} else {
if (
/unpkg/.test(requestURL.origin) ||
/skypack/.test(request.origin) ||
/jspm/.test(requestURL.origin) ||
/jsdeliver/.test(requestURL.origin) ||
/cdn/.test(requestURL.origin) ||
/googleapis/.test(requestURL.origin)
) {
// cdn: cache then network
event.respondWith(
caches.open(CACHE_NAME + '-cdn').then(function (cache) {
return cache.match(event.request).then(function (response) {
var fetchPromise = fetch(event.request).then(function (networkResponse) {
cache.put(event.request, networkResponse.clone());
return networkResponse;
});
return response || fetchPromise;
});
}),
);
} else {
// disabled: lead to cors errors
// // api: distant then cache
// event.respondWith(
// fetch(event.request)
// .then((response) => {
// caches.open(CACHE_NAME + '-api').then(function (cache) {
// cache.put(event.request, response.clone());
// return response;
// });
// })
// .catch(() => {
// return caches.match(event.request);
// })
// );
// api: no cache
event.respondWith(fetch(event.request));
}
}
}
});

3
src/templates/hubl-captain.pug
View File

@ -11,5 +11,6 @@ solid-widget(name='hubl-captain')
class-is_lead='user-thumb__lead' class-is_lead='user-thumb__lead'
widget-account.picture='hubl-user-avatar' widget-account.picture='hubl-user-avatar'
value-is_lead='Capitaine' value-is_lead=''
data-trans='value-is_lead=template-captain.isLead'
) )

20
src/templates/hubl-circle-team.pug
View File

@ -1,20 +0,0 @@
include hubl-user-avatar.pug
solid-widget(name='hubl-circle-team-template')
template
solid-display.user-thumb.is-spaced(
data-src='${await value.user}'
fields='account.picture, sup(name, isadmin), sub(profile.city)'
value-isadmin='${await value.is_admin}'
class-account.picture='avatar user-thumb__picture'
class-name='user-thumb__name'
class-isadmin='user-thumb__admin'
class-profile.city='user-thumb__city'
widget-account.picture='hubl-user-avatar'
widget-isadmin='hubl-circle-user-admin'
)
solid-widget(name='hubl-circle-user-admin')
template ${(await value) != "false" ? "Administrateur" : ""}

22
src/templates/hubl-project-team.pug
View File

@ -1,22 +0,0 @@
include hubl-user-avatar.pug
solid-widget(name='hubl-project-team')
template
solid-display.user-thumb.is-spaced(
data-src='${await value}'
fields='user.account.picture, sup(user.name, isadmin), sub(user.profile.city, name)'
value-isadmin='${await value.is_admin}'
class-user.account.picture='avatar user-thumb__picture'
class-user.name='user-thumb__name'
class-isadmin='user-thumb__admin'
class-user.profile.city='user-thumb__city'
class-name='user-thumb__lead'
widget-user.account.picture='hubl-user-avatar'
widget-isadmin='hubl-project-user-admin'
)
solid-widget(name='hubl-project-user-admin')
template ${(await value) == "false" ? "" : "Administrateur"}

17
src/views/admin/page-admin-circles-create.pug
View File

@ -1,7 +1,7 @@
div.content-box__info.flex div.content-box__info.flex
solid-link(class="backlink right", next='admin-circle-list') Retour solid-link(class="backlink right", next='admin-circle-list' data-trans='circle.create.backlink')
h1.centered Créer un cercle h1.centered(data-trans='circle.create.title')
div#loader-circles-create.loader.loader-top div#loader-circles-create.loader.loader-top
div div
@ -13,19 +13,24 @@ div.content-box__info.flex
data-src=`${endpoints.circles || endpoints.post.circles}` data-src=`${endpoints.circles || endpoints.post.circles}`
fields='status, name, description' fields='status, name, description'
required-status
required-name
required-description
loader-id='loader-circles-create' loader-id='loader-circles-create'
class-status='form-label is-light is-full-width color' class-status='form-label is-light is-full-width color'
class-name='form-label is-light is-full-width input-text-like' class-name='form-label is-light is-full-width input-text-like'
class-description='form-label is-light is-full-width input-text-like' class-description='form-label is-light is-full-width input-text-like'
label-status='Statut du cercle' label-status=''
label-name='Nom du cercle *' label-name=''
label-description='Sous-titre du cercle *' label-description=''
widget-status='hubl-status' widget-status='hubl-status'
next='circle' next='circle'
submit-button='Enregistrer' submit-button=''
data-trans='label-status=circle.create.labelStatus;label-name=circle.create.labelName;label-description=circle.create.labelDescription;submit-button=circle.create.buttonSubmit'
) )

31
src/views/admin/page-admin-circles.pug
View File

@ -5,17 +5,17 @@
solid-route(name='circle-left') solid-route(name='circle-left')
div.content-box__header.flex.space-between div.content-box__header.flex.space-between
h1.without-margin Administration h1.without-margin(data-trans='circle.list.title')
button.mobile-sidebar-button.jsMobileSidebarOpenButton.icon-arrow-left-circle MENU button.mobile-sidebar-button.jsMobileSidebarOpenButton.icon-arrow-left-circle(data-trans='circle.list.buttonMobile')
include ../circle/page-circle-left.pug include ../circle/page-circle-left.pug
#admin-circle-list.content-box__height(hidden) #admin-circle-list.content-box__height(hidden, data-view="admin-circle-list")
include ../../templates/hubl-user-avatar.pug include ../../templates/hubl-user-avatar.pug
solid-widget(name='hubl-circle-owner') solid-widget(name='hubl-circle-owner')
template template
solid-display.user-thumb.is-spaced( solid-display.user-thumb.block.is-spaced(
data-src='${await value}' data-src='${await value}'
fields='account.picture, sup(name), sub(username)' fields='account.picture, sup(name), sub(username)'
@ -31,27 +31,29 @@
div.admin-header.flex div.admin-header.flex
h3 Cercles h3(data-trans='circle.list.subTitle')
solid-ac-checker(data-src=`${endpoints.circles || (endpoints.post && endpoints.post.circles)}`, permission='acl:Append')
solid-link( solid-link(
class='button text-bold text-uppercase reversed button-primary bordered with-icon icon-plus' class='button text-bold text-uppercase reversed button-primary bordered with-icon icon-plus'
next='admin-circle-create' next='admin-circle-create' data-trans='circle.list.buttonCreate'
) Créer un cercle )
.table-wrapper .table-wrapper
.table .table
div.table-header.grey-color div.table-header.grey-color
div.w280 Nom div.w280(data-trans='circle.list.tableHeader1')
div.w280 Administrateurs div.w280(data-trans='circle.list.tableHeader2')
div.w280 Rejoindre div.w280(data-trans='circle.list.tableHeader3')
solid-widget(name='hubl-admin-circle-leave-button') solid-widget(name='hubl-admin-circle-leave-button')
template template
solid-delete( solid-delete(
class='circle-leave button text-bold text-uppercase reversed button-secondary bordered with-icon icon-close' class='circle-leave button text-bold text-uppercase reversed button-secondary bordered with-icon icon-close'
data-src="${src}" data-src="${src}"
data-label='Quitter' data-label=''
data-trans='data-label=circle.list.buttonQuit'
) )
hubl-reactivity(data-src=`${endpoints.circles || endpoints.get.circles}` target-src='${src}') hubl-reactivity(data-src=`${endpoints.circles || endpoints.get.circles}` target-src='${src}')
hubl-reactivity(data-src=`${endpoints.circles || endpoints.get.circles}joinable/` target-src='${src}') hubl-reactivity(data-src=`${endpoints.circles || endpoints.get.circles}joinable/` target-src='${src}')
@ -70,7 +72,7 @@
class-circle.name='w280 border cell-with-name' class-circle.name='w280 border cell-with-name'
class-circle.owner='w280 border cell-with-id-card' class-circle.owner='w280 border cell-with-id-card'
class-leaveButton='w280 border cell-with-buttons' class-leaveButton='w280 border cell-with-buttons is-spaced'
action-leaveButton="joinButton" action-leaveButton="joinButton"
widget-leaveButton="hubl-admin-circle-leave-button" widget-leaveButton="hubl-admin-circle-leave-button"
@ -89,6 +91,7 @@
widget-user.username='solid-form-hidden' widget-user.username='solid-form-hidden'
submit-button='Rejoindre' submit-button='Rejoindre'
data-trans='submit-button=circle.list.buttonJoin'
) )
hubl-reactivity(data-src=`${endpoints.circles || endpoints.get.circles}` target-src='${value}') hubl-reactivity(data-src=`${endpoints.circles || endpoints.get.circles}` target-src='${value}')
hubl-reactivity(data-src=`${endpoints.circles || endpoints.get.circles}joinable/` target-src='${value}') hubl-reactivity(data-src=`${endpoints.circles || endpoints.get.circles}joinable/` target-src='${value}')
@ -108,7 +111,7 @@
class-owner='w280 border cell-with-id-card' class-owner='w280 border cell-with-id-card'
widget-owner='hubl-circle-owner' widget-owner='hubl-circle-owner'
class-members='w280 border cell-with-buttons' class-members='w280 border cell-with-buttons is-spaced'
widget-members="hubl-admin-circle-join-button" widget-members="hubl-admin-circle-join-button"
order-by="name" order-by="name"
@ -120,5 +123,5 @@
div div
div div
#admin-circle-create.content-box__height(hidden) #admin-circle-create.content-box__height(hidden, data-view="admin-circle-create")
include page-admin-circles-create.pug include page-admin-circles-create.pug

54
src/views/admin/page-admin-communities.pug Normal file
View File

@ -0,0 +1,54 @@
.content-box.flex.full-width.with-form
solid-router(default-route='admin-communities-list', hidden)
solid-route(name='admin-communities-list')
solid-route(name='admin-users-create', use-id)
div.content-box__header.flex.space-between
h1.without-margin(data-trans='communities.title')
button.mobile-sidebar-button.jsMobileSidebarOpenButton.icon-arrow-left-circle(data-trans='communities.menuMobile')
solid-widget(name='hubl-action-community')
template
solid-ac-checker(data-src="${value}", nested-field="members", permission='acl:Append')
solid-link(
class='button text-bold text-uppercase reversed button-primary bordered with-icon icon-plus'
data-src="${value}"
next="admin-users-create"
data-trans='communities.linkInvite'
)
solid-ac-checker(data-src="${value}", nested-field="members", no-permission='acl:Append')
div.button.text-bold.text-uppercase.button-disabled(data-trans='communities.noPermission')
#admin-communities-list.content-box__height(hidden, data-view="admin-communities-list")
div.content-box__info.flex
div.admin-header.flex
h3(data-trans='communities.subTitle')
.table-wrapper
.table
div.table-header.grey-color
div.w450(data-trans='communities.tableHeader1')
div.w370(data-trans='communities.tableHeader2')
solid-display(
class='table-body'
bind-user
nested-field='communities'
fields='community.name, community'
loader-id='loader-admin-community'
class-community.name='w450 border cell-with-name'
class-community='w370 border cell-with-buttons is-spaced'
widget-community='hubl-action-community'
order-asc='community.name'
)
div#loader-admin-community.loader.loader-top
div
div
div
div
#admin-users-create.content-box__height(hidden, data-view="admin-users-create")
include page-admin-users-create.pug

33
src/views/admin/page-admin-projects-create.pug
View File

@ -1,18 +1,7 @@
div.content-box__info.flex div.content-box__info.flex
solid-link(class="backlink right" next='admin-project-list') Retour solid-link(class="backlink right" next='admin-project-list' data-trans='project.create.backlink')
solid-widget(name="hubl-admin-project-add-user") h1.centered(data-trans='project.create.title')
template
solid-form(
data-holder
fields='user, project'
range-user=`${endpoints.users || endpoints.get.users}`
value-project='${src}'
widget-project='solid-form-hidden'
naked
)
h1.centered Créer un nouveau projet
div#loader-projects-create.loader.loader-top div#loader-projects-create.loader.loader-top
div div
@ -24,27 +13,33 @@ div.content-box__info.flex
data-src=`${endpoints.projects || endpoints.post.projects}` data-src=`${endpoints.projects || endpoints.post.projects}`
fields='status, line-1(customer.name, name), line-2(captain)' fields='status, line-1(customer.name, name), line-2(captain)'
required-status
required-customer.name
required-name
required-captain
loader-id='loader-projects-create' loader-id='loader-projects-create'
label-status='Statut du cercle*' label-status=''
widget-status='solid-form-hidden' widget-status='solid-form-hidden'
class-status='form-label is-light is-full-width' class-status='form-label is-light is-full-width'
value-status="Private" value-status="Private"
label-customer.name='Nom du client*' label-customer.name=''
class-customer.name='form-label is-light is-half-width input-text-like' class-customer.name='form-label is-light is-half-width input-text-like'
label-name='Nom du projet*' label-name=''
class-name='form-label is-light is-half-width input-text-like' class-name='form-label is-light is-half-width input-text-like'
label-captain='Capitaine du projet*' label-captain=''
range-captain=`${endpoints.users || endpoints.get.users}` range-captain=`${endpoints.users || endpoints.get.users}`
class-captain='form-label is-light is-half-width' class-captain='form-label is-light is-half-width'
widget-captain='solid-form-auto-completion' widget-captain='solid-form-dropdown-autocompletion-label'
class='input-text-like' class='input-text-like'
next='project' next='project'
submit-button='Enregistrer' submit-button=''
data-trans='label-status=project.create.labelStatus;label-customer.name=project.create.labelCustomer;label-name=project.create.labelName;label-captain=project.create.labelCaptain;submit-button=project.create.buttonSubmit'
) )

39
src/views/admin/page-admin-projects.pug
View File

@ -5,37 +5,40 @@
solid-route(name='project-left') solid-route(name='project-left')
div.content-box__header.flex.space-between div.content-box__header.flex.space-between
h1.without-margin Administration h1.without-margin(data-trans='project.list.title')
button.mobile-sidebar-button.jsMobileSidebarOpenButton.icon-arrow-left-circle MENU button.mobile-sidebar-button.jsMobileSidebarOpenButton.icon-arrow-left-circle(data-trans='project.list.buttonMobile')
#project-left(hidden) #project-left(hidden, data-view="project-left")
include ../project/page-project-left.pug include ../project/page-project-left.pug
#admin-project-list.content-box__height(hidden) #admin-project-list.content-box__height(hidden, data-view="admin-project-list")
include ../../templates/hubl-user-avatar.pug include ../../templates/hubl-user-avatar.pug
div.content-box__info.flex div.content-box__info.flex
div.admin-header.flex div.admin-header.flex
h3 Projets h3(data-trans='project.list.subTitle')
solid-ac-checker(data-src=`${endpoints.projects || (endpoints.post && endpoints.post.projects)}`, permission='acl:Append')
solid-link( solid-link(
class='button text-bold text-uppercase reversed button-primary bordered with-icon icon-plus' class='button text-bold text-uppercase reversed button-primary bordered with-icon icon-plus'
next='admin-project-create' next='admin-project-create'
) Créer un nouveau projet data-trans='project.list.buttonCreate'
)
.table-wrapper .table-wrapper
.table .table
div.table-header.grey-color div.table-header.grey-color
div.w280 Nom div.w280(data-trans='project.list.tableHeader1')
div.w280 Administrateurs div.w280(data-trans='project.list.tableHeader2')
div.w280 Capitaines div.w280(data-trans='project.list.tableHeader3')
div.w230 Rejoindre div.w230(data-trans='project.list.tableHeader4')
solid-widget(name="hubl-admin-project-leave-button") solid-widget(name="hubl-admin-project-leave-button")
template template
solid-delete( solid-delete(
class='button text-bold text-uppercase reversed button-secondary bordered with-icon icon-close' class='button text-bold text-uppercase reversed button-secondary bordered with-icon icon-close'
data-src="${src}" data-src="${src}"
data-label='Quitter' data-label=''
data-trans='data-label=project.list.buttonQuit'
) )
hubl-reactivity(data-src=`${endpoints.projects || endpoints.get.projects}` target-src='${src}') hubl-reactivity(data-src=`${endpoints.projects || endpoints.get.projects}` target-src='${src}')
hubl-reactivity(data-src=`${endpoints.projects || endpoints.get.projects}joinable/` target-src='${src}') hubl-reactivity(data-src=`${endpoints.projects || endpoints.get.projects}joinable/` target-src='${src}')
@ -46,7 +49,7 @@
solid-widget(name='hubl-project-captain') solid-widget(name='hubl-project-captain')
template template
solid-display.user-thumb.is-spaced( solid-display.user-thumb.block.is-spaced(
data-src='${await value}' data-src='${await value}'
fields='account.picture, sup(name), sub(username)' fields='account.picture, sup(name), sub(username)'
@ -73,7 +76,8 @@
solid-delete( solid-delete(
class='button text-bold text-uppercase reversed button-secondary bordered with-icon icon-close' class='button text-bold text-uppercase reversed button-secondary bordered with-icon icon-close'
data-src="${src}" data-src="${src}"
data-label='Quitter' data-label=''
data-trans='data-label=project.list.buttonQuit'
) )
solid-display( solid-display(
@ -87,7 +91,7 @@
class-project.name='w280 cell border cell-with-name' class-project.name='w280 cell border cell-with-name'
class-project.members='w280 cell border cell-with-id-card' class-project.members='w280 cell border cell-with-id-card'
class-project.captain='w280 cell border cell-with-id-card' class-project.captain='w280 cell border cell-with-id-card'
class-leaveButton='w230 cell border cell-with-buttons' class-leaveButton='w230 cell border cell-with-buttons is-spaced'
action-leaveButton="joinButton" action-leaveButton="joinButton"
widget-leaveButton="hubl-admin-project-leave-button" widget-leaveButton="hubl-admin-project-leave-button"
@ -108,7 +112,8 @@
value-user.username='hubl-workaround-493' value-user.username='hubl-workaround-493'
widget-user.username='solid-form-hidden' widget-user.username='solid-form-hidden'
submit-button='Rejoindre' submit-button=''
data-trans='submit-button=project.list.buttonJoin'
) )
hubl-reactivity(data-src=`${endpoints.projects || endpoints.get.projects}` target-src='${src}') hubl-reactivity(data-src=`${endpoints.projects || endpoints.get.projects}` target-src='${src}')
hubl-reactivity(data-src=`${endpoints.projects || endpoints.get.projects}joinable/` target-src='${src}') hubl-reactivity(data-src=`${endpoints.projects || endpoints.get.projects}joinable/` target-src='${src}')
@ -127,7 +132,7 @@
class-name='w280 cell border cell-with-name' class-name='w280 cell border cell-with-name'
class-members='w280 cell border cell-with-id-card' class-members='w280 cell border cell-with-id-card'
class-captain='w280 cell border cell-with-id-card' class-captain='w280 cell border cell-with-id-card'
class-joinButton='w230 cell border cell-with-buttons' class-joinButton='w230 cell border cell-with-buttons is-spaced'
action-joinButton="joinButton" # Workaround: I need members two times action-joinButton="joinButton" # Workaround: I need members two times
widget-joinButton="hubl-admin-project-join-button" widget-joinButton="hubl-admin-project-join-button"
@ -144,5 +149,5 @@
div div
div div
#admin-project-create(hidden) #admin-project-create(hidden, data-view="admin-project-create")
include page-admin-projects-create.pug include page-admin-projects-create.pug

65
src/views/admin/page-admin-users-create.pug
View File

@ -1,7 +1,19 @@
div.content-box__info.flex div.content-box__info.flex
solid-link(class='backlink right', next='admin-users-list') Retour solid-link(class='backlink right', next='admin-communities-list' data-trans='user.create.backlink')
h1.centered Ajouter un utilisateur à la plateforme solid-display.h1-like.centered(
bind-resources
fields='text, name'
value-text=''
data-trans='value-text=user.create.title'
loader-id='loader-users-title'
)
div#loader-users-title.loader.loader
div
div
div
div
div#loader-users-create.loader.loader-top div#loader-users-create.loader.loader-top
div div
@ -9,26 +21,45 @@ div.content-box__info.flex
div div
div div
solid-form.form.button-register( solid-widget(name='hubl-username-field')
data-src=`${endpoints.users || endpoints.post.users}` template
label(data-trans='user.create.labelUsername')
input(type="text" title='' pattern="[a-zA-Z0-9]+" label="" data-trans='title=user.create.labelUsernameTitle;label=user.create.labelUsername' name="username" required value="\${value}" data-holder)
fields='line-1(first_name, last_name), line-2(username, email), line-3(password)' solid-widget(name='hubl-email-field')
template
label(data-trans='user.create.labelEmail')
input(type="email" label='' data-trans='label=user.create.labelEmail' name="email" required value="\${value}" data-holder)
solid-form.form.button-register#selected-community(
bind-resources
nested-field='members'
fields='line-1(user.first_name, user.last_name), line-2(user.username, user.email), user.password'
required-user.first_name
required-user.last_name
required-user.username
required-user.email
loader-id='loader-users-create' loader-id='loader-users-create'
class-first_name='form-label is-light is-half-width input-text-like' class-user.first_name='form-label is-light is-half-width input-text-like'
class-last_name='form-label is-light is-half-width input-text-like' class-user.last_name='form-label is-light is-half-width input-text-like'
class-username='form-label is-light is-half-width input-text-like' class-user.username='form-label is-light is-half-width input-text-like'
class-email='form-label is-light is-half-width input-text-like' class-user.email='form-label is-light is-half-width input-text-like'
label-first_name='Prénom *' label-user.first_name=''
label-last_name='Nom *' label-user.last_name=''
label-username='Nom d\'utilisateur *' label-user.username=''
label-email='E-mail *' label-user.email=''
value-password='' value-user.password=''
widget-password='solid-form-hidden' widget-user.password='solid-form-hidden'
next='admin-users-list' widget-user.username='hubl-username-field'
widget-user.email='hubl-email-field'
submit-button='Enregistrer' next='admin-communities-list'
submit-button=''
data-trans='label-user.first_name=user.create.labelFirstname;label-user.last_name=user.create.labelLastname;label-user.username=user.create.labelUsername;label-user.email=user.create.labelEmail;submit-button=user.create.buttonSubmit'
) )

36
src/views/admin/page-admin-users-edit.pug
View File

@ -1,36 +0,0 @@
div.content-box__info.flex
solid-link(class='backlink right', next='admin-users-list') Retour
h1.centered
span Modifier un utilisateur
div#loader-users-edit.loader.loader-top
div
div
div
div
solid-display(
bind-resources=''
fields='name'
loader-id='loader-users-edit'
)
solid-form.form.button-register(
bind-resources=''
fields='line-1(first_name, last_name), line-2(email)'
loader-id='loader-users-edit'
class-first_name='form-label is-light is-half-width input-text-like'
class-last_name='form-label is-light is-half-width input-text-like'
class-email='form-label is-light is-full-width input-text-like'
label-first_name='Prénom *'
label-last_name='Nom *'
label-email='E-mail *'
next='admin-user-list'
submit-button='Enregistrer'
)

67
src/views/admin/page-admin-users.pug
View File

@ -1,67 +0,0 @@
.content-box.flex.full-width.with-form
solid-router(default-route='admin-users-list', hidden)
solid-route(name='admin-users-list')
solid-route(name='admin-users-create')
solid-route(name='admin-users-edit')
div.content-box__header.flex.space-between
h1.without-margin Administration
button.mobile-sidebar-button.jsMobileSidebarOpenButton.icon-arrow-left-circle MENU
solid-widget(name='hubl-solid-action-custom')
template
solid-ac-checker(data-src="${src}", permission='acl:Write')
solid-link(
class='button rounded reversed button-primary bordered icon-pencil'
data-src="${src}"
next="${value}"
)
#admin-users-list.content-box__height(hidden)
div.content-box__info.flex
div.admin-header.flex
h3 Utilisateurs
solid-ac-checker(data-src=`${endpoints.users || endpoints.post.users}`, permission='acl:Append')
solid-link(
class='button text-bold text-uppercase reversed button-primary bordered with-icon icon-plus'
next='admin-users-create'
) Ajouter un utilisateur
.table-wrapper
.table
div.table-header.grey-color
div.w280 Nom
div.w70
solid-display(
class='table-body'
data-src=`${endpoints.users || endpoints.get.users}`
fields='cell-1(user-thumb(account.picture, sup(name), sub(username))), actions'
loader-id='loader-admin-users'
class-account.picture='avatar user-thumb__picture'
class-name='user-thumb__name'
class-username='user-thumb__username'
class-profile.city='user-thumb__city'
widget-account.picture='hubl-user-avatar'
label-actions='Edit'
action-actions='admin-users-edit'
class-actions='w70 border cell-with-buttons'
widget-actions='hubl-solid-action-custom'
order-by='username'
)
div#loader-admin-users.loader.loader-top
div
div
div
div
#admin-users-create.content-box__height(hidden)
include page-admin-users-create.pug
#admin-users-edit.content-box__height(hidden)
include page-admin-users-edit.pug

2
src/views/circle/page-circle-chat.pug
View File

@ -2,7 +2,7 @@
solid-xmpp-chat( solid-xmpp-chat(
data-authentication='login', data-authentication='login',
data-auto-login='true', data-auto-login='true',
data-bosh-service-url=`${xmpp}`, data-websocket-url=`${xmppWebsocket || 'wss://jabber.happy-dev.fr/xmpp-websocket'}`,
data-i18n='en', data-i18n='en',
bind-resources bind-resources
) )

Some files were not shown because too many files have changed in this diff Show More