Skip to content
This repository was archived by the owner on Mar 5, 2025. It is now read-only.

Commit 28d9bb9

Browse files
weeman1337mgcm
weeman1337
and
mgcm
authored
Add open desk module examples (#154)
* Add open desk module example Signed-off-by: Michael Weimann <[email protected]> * Extend local example for the widget toggle module Signed-off-by: Michael Weimann <[email protected]> * Tweak nav example colours Signed-off-by: Michael Weimann <[email protected]> * Update opendesk module README with additional info about --cpd-color-bg-action-primary-rest Signed-off-by: Milton Moura <[email protected]> --------- Signed-off-by: Michael Weimann <[email protected]> Signed-off-by: Milton Moura <[email protected]> Co-authored-by: Milton Moura <[email protected]>
1 parent 91d19ff commit 28d9bb9

File tree

7 files changed

+150
-7
lines changed

7 files changed

+150
-7
lines changed

‎packages/element-web-opendesk-module/README.md

+39-5
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,10 @@ For the navigation bar and launcher, the following variables are relevant:
4343

4444
- `--cpd-color-text-action-accent` sets the background of the launcher icon when expanded and the top border of the menu
4545
- `--cpd-color-icon-on-solid-primary` sets the color of the launcher icon when expanded
46-
- `
46+
47+
To have the primary button background color consistent with your menu color, use the following variable:
48+
49+
- `--cpd-color-bg-action-primary-rest`
4750

4851
Example configuration:
4952

@@ -60,15 +63,16 @@ Example configuration:
6063
6164
// ... add more optional configurations
6265
"custom_css_variables": {
63-
"--cpd-color-text-action-accent": "#dadada",
64-
"--cpd-color-icon-on-solid-primary": "#aa0000"
66+
"--cpd-color-bg-action-primary-rest": "#5e27dd",
67+
"--cpd-color-text-action-accent": "#5e27dd",
68+
"--cpd-color-icon-on-solid-primary": "#000000"
6569
}
6670
}
6771
}
6872
}
6973
```
7074

71-
## Running the Element Module Locally
75+
## Running the Element Web module locally
7276

7377
1. Run `yarn build` in this repository.
7478

@@ -100,6 +104,36 @@ Example configuration:
100104
- 'file:../element-web-modules/packages/element-web-opendesk-module'
101105
```
102106

103-
4. (In the `element-web` folder) Run `yarn start` and access it at `http://localhost:8080`
107+
4. Add the following example configuration to the Element Web `config.json`
108+
109+
```json
110+
"net.nordeck.element_web.module.opendesk": {
111+
"config": {
112+
"banner": {
113+
"ics_navigation_json_url": "http://localhost:8080/open-desk/navigation.json",
114+
"ics_silent_url": "http://localhost:8080/open-desk/silent-login.html",
115+
"portal_logo_svg_url": "http://localhost:8080/open-desk/Nordeck-Logo_RGB.svg",
116+
"portal_url": "https://example.com/portal"
117+
},
118+
"custom_css_variables": {
119+
"--cpd-color-bg-action-primary-rest": "#5e27dd",
120+
"--cpd-color-text-action-accent": "#5e27dd"
121+
}
122+
}
123+
}
124+
125+
```
126+
127+
5. (In the `element-web` folder) Link the open desk module example files
128+
129+
```
130+
ln -s ../element-web-modules/packages/element-web-opendesk-module/example webapp/open-desk
131+
```
132+
133+
6. (In the `element-web` folder) Run `yarn start` and access it at `http://localhost:8080`
134+
135+
7. There should now be purple buttons and a header with the Nordeck logo plus some example application links
136+
137+
![](./docs/demo.png)
104138
105139
> **Important**: You must run `yarn build` in this repo and restart Element after each change in the module.

‎packages/element-web-opendesk-module/docs/demo.png

172 KB
Loading

‎packages/element-web-opendesk-module/example/Nordeck-Logo_RGB.svg

+36
Loading

‎packages/element-web-opendesk-module/example/app.png

1.55 KB
Loading

‎packages/element-web-opendesk-module/example/navigation.json

+44
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
{
2+
"categories": [
3+
{
4+
"identifier": "category1",
5+
"display_name": "Category 1",
6+
"entries": [
7+
{
8+
"identifier": "app1",
9+
"display_name": "App 1",
10+
"icon_url": "http://localhost:8080/open-desk/app.png",
11+
"link": "https://example.com/app1",
12+
"target": "_blank"
13+
},
14+
{
15+
"identifier": "app2",
16+
"display_name": "App 2",
17+
"icon_url": "http://localhost:8080/open-desk/app.png",
18+
"link": "https://example.com/app2",
19+
"target": "_blank"
20+
}
21+
]
22+
},
23+
{
24+
"identifier": "category2",
25+
"display_name": "Category 2",
26+
"entries": [
27+
{
28+
"identifier": "app3",
29+
"display_name": "App 3",
30+
"icon_url": "http://localhost:8080/open-desk/app.png",
31+
"link": "https://example.com/app3",
32+
"target": "_blank"
33+
},
34+
{
35+
"identifier": "app4",
36+
"display_name": "App 4",
37+
"icon_url": "http://localhost:8080/open-desk/app.png",
38+
"link": "https://example.com/app4",
39+
"target": "_blank"
40+
}
41+
]
42+
}
43+
]
44+
}

‎packages/element-web-opendesk-module/example/silent-login.html

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<title>Open Desk Silent Login</title>
7+
</head>
8+
<body>
9+
<script>
10+
window.parent.postMessage({
11+
loggedIn: true,
12+
});
13+
</script>
14+
</body>
15+
</html>

‎packages/element-web-widget-toggles-module/README.md

+16-2
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,19 @@ Example configuration:
5151

5252
2. Checkout Element and set up the development environment according to [their documentation](https://github.com/vector-im/element-web/#building-from-source).
5353

54-
3. (In the `element-web` folder) Create a `build_config.yaml` with the following content:
54+
3. (In the `element-web` folder) Add the following to the `config.json`:
55+
56+
```json
57+
"net.nordeck.element_web.module.widget_toggles": {
58+
"config": {
59+
"types": ["jitsi", "net.nordeck"]
60+
}
61+
},
62+
```
63+
64+
This will show toggles for the Jitsi and Nordeck widget
65+
66+
4. (In the `element-web` folder) Create a `build_config.yaml` with the following content:
5567

5668
```yaml
5769
# Directory structure:
@@ -77,6 +89,8 @@ Example configuration:
7789
- 'file:../element-web-modules/packages/element-web-widget-toggles-module'
7890
```
7991

80-
4. (In the `element-web` folder) Run `yarn start` and access it at `http://localhost:8080`
92+
5. (In the `element-web` folder) Run `yarn start` and access it at `http://localhost:8080`
93+
94+
6. Add a Jitsi and e.g. [NeoBoard](https://github.com/nordeck/matrix-neoboard?tab=readme-ov-file#demo) widget to a room
8195

8296
> **Important**: You must run `yarn build` in this repo and restart Element after each change in the module.

0 commit comments

Comments
 (0)