ts.js/demo.html at master · TiddlySpace/ts.js · GitHub

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
<html>
<head>
  <title>demo of ts.js</title>
  <link rel="stylesheet" href="ts.css">
</head>
<body>
<h1>ts.js demo - how to use it</h1>
<h2>Registration</h2>
Note registration and logout are mutually exclusive.
<form class="ts-registration" action="" autocomplete="off">
	<input type="text" name="username" placeholder="username" />
	<input type="password" name="password" placeholder="password" />
	<input type="password" name="password_confirm" placeholder="and again" />
	<input type="hidden" name="redirect" value="/tiddlers.wiki" />
	<input type="submit" value="REGISTER" />
</form>
<h2>Logout</h2>
<div class="ts-logout"></div>

<h2>Logout with custom form</h2>
<div class="ts-logout">
	<form>
	<input type="hidden" name="tiddlyweb_redirect" value="http://ts.tiddlyspace.com/Goodbye" />
	<input type="submit" value="Log Out" />
	</form>
</div>

<h2>Logout without message</h2>
<form class="ts-logout">
	<input type="hidden" name="tiddlyweb_redirect" value="http://ts.tiddlyspace.com/Goodbye" />
	<input type="submit" value="Log Out" />
</form>

<h2>Login</h2>
<form class="ts-login" action="" autocomplete="off">
	<input type="text" name="username" placeholder="username" />
	<input type="password" name="password" placeholder="password" />
	<input type="hidden" name="redirect" value="/tiddlers.wiki" />
	<input type="submit" value="Log In" />
</form>

<h2>OpenID</h2>
<h3>Register</h3>
<form class="ts-openid">
  Register using openid
  <input type="text" name="openid" placeholder="your openid" />
	<input type="text" name="space" placeholder="space" />.tiddlyspace.com
  <input type="hidden" name="redirect" value="/tiddlers.wiki" />
	<input type="submit" value="Register" />
	<a href="http://openid.net/get-an-openid/">What is an open id?</a>
</form>

<h3>Login</h3>
<form class="ts-openid">
  Login using openid
  <input type="text" name="openid" placeholder="your openid" />
  <input type="hidden" name="redirect" value="/tiddlers.wiki" />
	<input type="submit" value="Login" />
	<a href="http://openid.net/get-an-openid/">What is an open id?</a>
</form>

<h3>Member form</h3>
<form class="ts-members">
  <input type="text" name="username">
  <input type="submit" value="Add Member" />
</form>

<h3>List members</h3>
<ul class="ts-members"></ul>

<h3>List includes</h3>
<ul class="ts-includes"></ul>

<h3>Include new space</h3>
<form class="ts-includes">
  <input type="text" name="spacename">
  <input type="submit" value="Include Space" />
</form>

<h3>Identities</h3>
<ul class="ts-identities"></ul>
<form class="ts-openid">
  Add an openid
  <input type="text" name="openid" placeholder="your openid" />
	<input type="submit" value="Register" />
	<a href="http://openid.net/get-an-openid/">What is an open id?</a>
</form>

<h3>Password</h3>
<form class="ts-password">
  <input type="password" name="password">
  <input type="password" name="new_password">
  <input type="password" name="new_password_confirm">
  <input type="submit" value="Change password" />
</form>

<h3>Spaces</h3>
<form class="ts-spaces">
  <input type="text" name="spacename">
  <input type="submit" value="Add Space" />
</form>
<div class='space_info'></div>

<script type='text/javascript' src='lib/jquery.min.js'></script>
<script type='text/javascript' src='lib/jquery-json.min.js'></script>
<script type='text/javascript' src='lib/chrjs.js'></script>
<script type='text/javascript' src='lib/chrjs-space.js'></script>
<script type='text/javascript' src='lib/chrjs-users.js'></script>
<script type='text/javascript' src='src/chrjs.identities.js'></script>
<script src="src/ts.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
  ts.init(function(ts) {
    ts.getSpaces(function(spaces) {
      $(".space_info").text("You have " + spaces.length + " spaces!");
    });
  });
</script>
</body>
</html>