-
Notifications
You must be signed in to change notification settings - Fork 119
/
view-gallery.html
127 lines (127 loc) · 5.04 KB
/
view-gallery.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="css/main.css">
<link rel="stylesheet" type="text/css" href="css/themes/element/theme.css">
</head>
<body class="not-ie11">
<script type="text/javascript">
function vm(o) {
// fake EventEmitter
o.on = () => {};
o.off = () => {};
o.i18n = (parts, ...expr) => {
let result = "";
for (let i = 0; i < parts.length; ++i) {
result = result + parts[i];
if (i < expr.length) {
result = result + expr[i];
}
}
return result;
};
return o;
}
</script>
<h1>View Gallery</h1>
<h2 name="session-status">Session Status Bar</h2>
<div id="session-status" class="hydrogen"></div>
<script id="main" type="module">
import {SessionStatusView} from "./session/SessionStatusView.js";
const view = new SessionStatusView(vm({
isShown: true,
statusLabel: "Doing something something",
isWaiting: true,
isConnectNowShown: true,
connectNow: () => alert("connecting now")
}));
document.getElementById("session-status").appendChild(view.mount());
</script>
<h2 name="login">Login</h2>
<div id="login" class="hydrogen"></div>
<script id="main" type="module">
import {LoginView} from "./login/LoginView.js";
const view = new LoginView(vm({
defaultHomeserver: "https://hs.tld",
login: () => alert("Logging in!"),
cancelUrl: "#/session"
}));
document.getElementById("login").appendChild(view.mount());
</script>
<h2 name="login-loading">Login Loading</h2>
<div id="login-loading" class="hydrogen"></div>
<script id="main" type="module">
import {LoginView} from "./login/LoginView.js";
const view = new LoginView(vm({
isBusy: true,
loadViewModel: vm({
loadLabel: "Doing something important...",
loading: true,
}),
cancelUrl: "#/session",
defaultHomeserver: "https://hs.tld",
}));
document.getElementById("login-loading").appendChild(view.mount());
</script>
<h2 name="session-loading">Session Loading</h2>
<div id="session-loading" class="hydrogen"></div>
<script id="main" type="module">
import {SessionLoadView} from "./login/SessionLoadView.js";
const view = new SessionLoadView(vm({
loading: true,
loadLabel: "Getting on with loading your session..."
}));
document.getElementById("session-loading").appendChild(view.mount());
</script>
<h2 name="invite-dm-view">Invite DM view</h2>
<div id="invite-dm-view" style="height: 600px" class="hydrogen"></div>
<script id="main" type="module">
import {InviteView} from "./session/room/InviteView.js";
const view = new InviteView(vm({
busy: false,
name: "Alice",
avatarTitle: "Alice",
avatarColorNumber: 5,
avatarLetter: "A",
error: "",
inviter: {
id: "@alice:hs.tld",
displayName: "Alice",
name: "Alice",
avatarTitle: "Alice",
avatarColorNumber: 5,
avatarLetter: "A",
},
isDirectMessage: true,
showDMProfile: true,
}));
document.getElementById("invite-dm-view").appendChild(view.mount());
</script>
<h2 name="invite-room-view">Invite Room view</h2>
<div id="invite-room-view" style="height: 600px" class="hydrogen"></div>
<script id="main" type="module">
import {InviteView} from "./session/room/InviteView.js";
const view = new InviteView(vm({
busy: false,
name: "Some Room",
avatarTitle: "Some Room",
avatarColorNumber: 2,
avatarLetter: "S",
error: "",
inviter: {
id: "@alice:hs.tld",
displayName: "Alice",
name: "Alice",
avatarTitle: "Alice",
avatarColorNumber: 5,
avatarLetter: "A",
},
roomDescription: "#some-room:hs.tld - public room",
isDirectMessage: false,
showDMProfile: false,
}));
document.getElementById("invite-room-view").appendChild(view.mount());
</script>
</body>
</html>