Skip to content
This repository was archived by the owner on Sep 29, 2023. It is now read-only.

Commit 9f331ed

Browse files
TorstenDittmannTorstenDittmann
authored
Merge pull request #54 from appwrite/feat-realtime
feat(realtime): add docs
2 parents 823fe46 + 32d6da2 commit 9f331ed

11 files changed

+2629
-48
lines changed

‎.gitignore‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
vendor/

‎app/views/docs/functions.phtml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -139,7 +139,7 @@ $image = new View(__DIR__.'/../general/image.phtml');
139139
<li>
140140
<h3>Web</h3>
141141
<div class="ide margin-bottom" data-lang="javascript" data-lang-label="Web SDK">
142-
<pre class="line-numbers"><code class="prism language-javascript" data-prism>let sdk = new Appwrite();
142+
<pre class="line-numbers"><code class="prism language-javascript" data-prism>const sdk = new Appwrite();
143143

144144
sdk
145145
.setEndpoint('https://[HOSTNAME_OR_IP]/v1') // Your API Endpoint

‎app/views/docs/getting-started-for-android.phtml‎

Lines changed: 31 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -68,8 +68,7 @@ import io.appwrite.services.Account
6868
val client = Client(context)
6969
.setEndpoint("https://[HOSTNAME_OR_IP]/v1") // Your API Endpoint
7070
.setProject("5df5acd0d48c2") // Your project ID
71-
.setKey("919c2d18fb5d4...a2ae413da83346ad2") // Your secret API key
72-
.setSelfSigned(true) // For self signed certificates only use for development</code></pre>
71+
.setSelfSigned(true) // For self signed certificates, only use for development</code></pre>
7372
</div>
7473

7574
<p>Before starting to send any API calls to your new Appwrite instance, make sure your Android emulators has network access to the Appwrite server hostname or IP address.</p>
@@ -87,6 +86,23 @@ val response = account.create("[email protected]", "password")
8786
val json = response.body?.string()</code></pre>
8887
</div>
8988

89+
<h2><a href="/docs/getting-started-for-android#listenToChanges" id="listenToChanges">Listen to changes</a></h2>
90+
91+
<p>If you want to listen to changes in realtime from Appwrite, you can subscribe to a variety of channels and receive updates within milliseconds. Full documentation for Realtime can be found <a href="/docs/realtime">here</a>.</p>
92+
93+
<div class="ide" data-lang="android" data-lang-label="Android SDK">
94+
<pre class="line-numbers"><code class="prism language-kotlin" data-prism>// Subscribe to files channel
95+
val realtime = Realtime(client)
96+
97+
realtime.subscribe("files", callback = { response ->
98+
if(response.event === 'storage.files.create') {
99+
// Log when a new file is uploaded
100+
print(response.payload.toString());
101+
}
102+
})
103+
</code></pre>
104+
</div>
105+
90106
<h2><a href="/docs/getting-started-for-android#fullExample" id="fullExample">Full Example</a></h2>
91107
<div class="ide" data-lang="android" data-lang-label="Android SDK">
92108
<pre class="line-numbers"><code class="prism language-kotlin" data-prism>import io.appwrite.Client
@@ -95,12 +111,22 @@ import io.appwrite.services.Account
95111
val client = Client(context)
96112
.setEndpoint("https://[HOSTNAME_OR_IP]/v1") // Your API Endpoint
97113
.setProject("5df5acd0d48c2") // Your project ID
98-
.setKey("919c2d18fb5d4...a2ae413da83346ad2") // Your secret API key
99-
.setSelfSigned(true) // For self signed certificates only use for development
114+
.setSelfSigned(true) // For self signed certificates, only use for development
100115

116+
// Register User
101117
val account = Account(client)
102118
val response = account.create("[email protected]", "password")
103-
val json = response.body?.string()</code></pre>
119+
val json = response.body?.string()
120+
121+
// Subscribe to files channel
122+
val realtime = Realtime(client)
123+
124+
realtime.subscribe("files", callback = { response ->
125+
if(response.event === 'storage.files.create') {
126+
// Log when a new file is uploaded
127+
print(response.payload.toString());
128+
}
129+
})</code></pre>
104130
</div>
105131

106132
<h2><a href="/docs/getting-started-for-android#nextSteps" id="nextSteps">Next Steps</a></h2>

‎app/views/docs/getting-started-for-flutter.phtml‎

Lines changed: 31 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -116,7 +116,7 @@ Client client = Client();
116116
client
117117
.setEndpoint('https://localhost/v1') // Your Appwrite Endpoint
118118
.setProject('5e8cf4f46b5e8') // Your project ID
119-
.setSelfSigned() // Remove in production
119+
.setSelfSigned(true) // For self signed certificates, only use for development
120120
;
121121
</code></pre>
122122
</div>
@@ -142,6 +142,24 @@ Response user = await account
142142
</code></pre>
143143
</div>
144144

145+
<h2><a href="/docs/getting-started-for-flutter#listenToChanges" id="listenToChanges">Listen to changes</a></h2>
146+
147+
<p>If you want to listen to changes in realtime from Appwrite, you can subscribe to a variety of channels and receive updates within milliseconds. Full documentation for Realtime can be found <a href="/docs/realtime">here</a>.</p>
148+
149+
<div class="ide" data-lang="dart" data-lang-label="Flutter SDK">
150+
<pre class="line-numbers"><code class="prism language-dart" data-prism>// Subscribe to files channel
151+
final realtime = Realtime(client);
152+
final subscription = realtime.subscribe(['files']);
153+
154+
subscription.stream.listen((response) {
155+
if(response.event === 'storage.files.create') {
156+
// Log when a new file is uploaded
157+
print(response.payload);
158+
}
159+
})
160+
</code></pre>
161+
</div>
162+
145163
<h2><a href="/docs/getting-started-for-flutter#fullExample" id="fullExample">Full Example</a></h2>
146164
<div class="ide" data-lang="dart" data-lang-label="Flutter SDK">
147165
<pre class="line-numbers"><code class="prism language-dart" data-prism>import 'package:appwrite/appwrite.dart';
@@ -151,7 +169,7 @@ Client client = Client();
151169
client
152170
.setEndpoint('https://localhost/v1') // Your Appwrite Endpoint
153171
.setProject('5e8cf4f46b5e8') // Your project ID
154-
.setSelfSigned() // Remove in production
172+
.setSelfSigned(true) // For self signed certificates, only use for development
155173
;
156174

157175
// Register User
@@ -163,6 +181,17 @@ Response user = await account
163181
password: 'password',
164182
name: 'My Name'
165183
);
184+
185+
// Subscribe to files channel
186+
final realtime = Realtime(client);
187+
final subscription = realtime.subscribe(['files']);
188+
189+
subscription.stream.listen((response) {
190+
if(response.event === 'storage.files.create') {
191+
// Log when a new file is uploaded
192+
print(response.payload);
193+
}
194+
})
166195
</code></pre>
167196
</div>
168197

‎app/views/docs/getting-started-for-server.phtml‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -100,7 +100,7 @@ $kotlinVersion = $versions['kotlin'] ?? '';
100100
<div class="ide margin-top-small" data-lang="nodejs" data-lang-label="Node.js SDK">
101101
<pre class="line-numbers"><code class="prism language-javascript" data-prism>const sdk = require('node-appwrite');
102102

103-
let client = new sdk.Client();
103+
const client = new sdk.Client();
104104

105105
client
106106
.setEndpoint('https://[HOSTNAME_OR_IP]/v1') // Your API Endpoint
@@ -154,7 +154,7 @@ client
154154
<li>
155155
<h3>Deno</h3>
156156
<div class="ide margin-top-small" data-lang="typescript" data-lang-label="Deno SDK">
157-
<pre class="line-numbers"><code class="prism language-typescript" data-prism>let client = new sdk.Client();
157+
<pre class="line-numbers"><code class="prism language-typescript" data-prism>const client = new sdk.Client();
158158

159159
client
160160
.setEndpoint('https://[HOSTNAME_OR_IP]/v1') // Your API Endpoint
@@ -246,7 +246,7 @@ val response = account
246246
<div class="ide margin-top-small" data-lang="nodejs" data-lang-label="Node.js SDK">
247247
<pre class="line-numbers"><code class="prism language-javascript" data-prism>const sdk = require('node-appwrite');
248248

249-
let client = new sdk.Client();
249+
const client = new sdk.Client();
250250

251251
client
252252
.setEndpoint('https://[HOSTNAME_OR_IP]/v1') // Your API Endpoint
@@ -300,7 +300,7 @@ client
300300
<li>
301301
<h3>Deno</h3>
302302
<div class="ide margin-top-small" data-lang="typescript" data-lang-label="Deno SDK">
303-
<pre class="line-numbers"><code class="prism language-typescript" data-prism>let client = new sdk.Client();
303+
<pre class="line-numbers"><code class="prism language-typescript" data-prism>const client = new sdk.Client();
304304

305305
client
306306
.setEndpoint('https://[HOSTNAME_OR_IP]/v1') // Your API Endpoint
@@ -344,7 +344,7 @@ client
344344
<li>
345345
<h3>Node.js</h3>
346346
<div class="ide margin-top-small" data-lang="nodejs" data-lang-label="Node.js SDK">
347-
<pre class="line-numbers"><code class="prism language-javascript" data-prism>let users = new sdk.Users(client);
347+
<pre class="line-numbers"><code class="prism language-javascript" data-prism>const users = new sdk.Users(client);
348348

349349
let promise = users.create('[email protected]', 'password');
350350

@@ -385,7 +385,7 @@ puts response</code></pre>
385385
<li>
386386
<h3>Deno</h3>
387387
<div class="ide margin-top-small" data-lang="typescript" data-lang-label="Deno SDK">
388-
<pre class="line-numbers"><code class="prism language-typescript" data-prism>let users = new sdk.Users(client);
388+
<pre class="line-numbers"><code class="prism language-typescript" data-prism>const users = new sdk.Users(client);
389389

390390
let promise = users.create('[email protected]', 'password');
391391

@@ -431,15 +431,15 @@ println(res.body?.string())</code></pre>
431431
<div class="ide margin-top-small" data-lang="nodejs" data-lang-label="Node.js SDK">
432432
<pre class="line-numbers"><code class="prism language-javascript" data-prism>const sdk = require('node-appwrite');
433433

434-
let client = new sdk.Client();
434+
const client = new sdk.Client();
435435

436436
client
437437
.setEndpoint('https://[HOSTNAME_OR_IP]/v1') // Your API Endpoint
438438
.setProject('5df5acd0d48c2') // Your project ID
439439
.setKey('919c2d18fb5d4...a2ae413da83346ad2') // Your secret API key
440440
;
441441

442-
let users = new sdk.Users(client);
442+
const users = new sdk.Users(client);
443443
let promise = users.create('[email protected]', 'password');
444444

445445
promise.then(function (response) {
@@ -513,8 +513,8 @@ puts response</code></pre>
513513
<div class="ide margin-top-small" data-lang="typescript" data-lang-label="Deno SDK">
514514
<pre class="line-numbers"><code class="prism language-typescript" data-prism>import * as sdk from "https://deno.land/x/appwrite/mod.ts";
515515

516-
let client = new sdk.Client();
517-
let users = new sdk.Users(client);
516+
const client = new sdk.Client();
517+
const users = new sdk.Users(client);
518518

519519
client
520520
.setEndpoint('https://[HOSTNAME_OR_IP]/v1') // Your API Endpoint

‎app/views/docs/getting-started-for-web.phtml‎

Lines changed: 32 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ $platform = [];
55
foreach($platforms['client']['languages'] ?? [] as $lang) {
66

77
$key = $lang['key'] ?? '';
8-
8+
99
if($key === 'web') {
1010
$platform = $lang;
1111
break;
@@ -64,8 +64,8 @@ $demos = $platform['demos'] ?? [];
6464
const appwrite = new Appwrite();
6565

6666
appwrite
67-
.setEndpoint('http://localhost/v1') // Set only when using self-hosted solution
68-
.setProject('455x34dfkj')
67+
.setEndpoint('http://localhost/v1') // Your Appwrite Endpoint
68+
.setProject('455x34dfkj') // Your project ID
6969
;
7070

7171
</code></pre>
@@ -85,30 +85,54 @@ appwrite
8585
<pre class="line-numbers"><code class="prism language-javascript" data-prism>// Register User
8686
appwrite
8787
.account.create('[email protected]', 'password', 'Jane Doe')
88-
.then(function (response) {
88+
.then(response => {
8989
console.log(response);
90-
}, function (error) {
90+
}, error => {
9191
console.log(error);
9292
});
9393
</code></pre>
9494
</div>
9595

96+
<h2><a href="/docs/getting-started-for-web#listenToChanges" id="listenToChanges">Listen to changes</a></h2>
97+
98+
<p>If you want to listen to changes in realtime from Appwrite, you can subscribe to a variety of channels and receive updates within milliseconds. Full documentation for Realtime can be found <a href="/docs/realtime">here</a>.</p>
99+
100+
<div class="ide" data-lang="javascript" data-lang-label="Web SDK">
101+
<pre class="line-numbers"><code class="prism language-javascript" data-prism>// Subscribe to files channel
102+
appwrite.subscribe('files', response => {
103+
if(response.event === 'storage.files.create') {
104+
// Log when a new file is uploaded
105+
console.log(response.payload);
106+
}
107+
});
108+
</code></pre>
109+
</div>
110+
96111
<h2><a href="/docs/getting-started-for-web#fullExample" id="fullExample">Full Example</a></h2>
97112
<div class="ide" data-lang="javascript" data-lang-label="Web SDK">
98113
<pre class="line-numbers"><code class="prism language-javascript" data-prism>// Init your Web SDK
99114
const appwrite = new Appwrite();
100115

101116
appwrite
102-
.setProject('455x34dfkj');
117+
.setEndpoint('http://localhost/v1') // Your Appwrite Endpoint
118+
.setProject('455x34dfkj') // Your project ID
103119

104120
// Register User
105121
appwrite
106122
.account.create('[email protected]', 'password', 'Jane Doe')
107-
.then(function (response) {
123+
.then(response => {
108124
console.log(response);
109-
}, function (error) {
125+
}, error => {
110126
console.log(error);
111127
});
128+
129+
// Subscribe to files channel
130+
appwrite.subscribe('files', response => {
131+
if(response.event === 'storage.files.create') {
132+
// Log when a new file is uploaded
133+
console.log(response.payload);
134+
}
135+
});
112136
</code></pre>
113137
</div>
114138

‎app/views/docs/index.phtml‎

Lines changed: 17 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,12 @@ $family = $this->getParam('family', '');
55
$title = $this->getParam('title', '');
66
$subtitle = $this->getParam('subtitle', '');
77

8-
$clientSDK = ($family === APP_PLATFORM_CLIENT && !empty($sdk)) ? '?sdk='.$sdk : '';
9-
$serverSDK = ($family === APP_PLATFORM_SERVER && !empty($sdk)) ? '?sdk='.$sdk : '';
8+
$clientSDK = ($family === APP_PLATFORM_CLIENT && !empty($sdk)) ? '?sdk=' . $sdk : '';
9+
$serverSDK = ($family === APP_PLATFORM_SERVER && !empty($sdk)) ? '?sdk=' . $sdk : '';
1010

1111
$cols = [
12-
'xxl' => ['nav' => 'span-3', 'main' => 'span-9'],
13-
'xxxl' => ['nav' => 'span-2', 'main' => 'span-10'],
12+
'xxl' => ['nav' => 'span-3', 'main' => 'span-9'],
13+
'xxxl' => ['nav' => 'span-2', 'main' => 'span-10'],
1414
]
1515
?>
1616
<div class="zone <?php echo $layout; ?> docs" data-general-strech-value="<?php echo $layout; ?>">
@@ -67,14 +67,15 @@ $cols = [
6767
<div class="margin-bottom-small">
6868
<b class="text-size-small">Learn More</b>
6969
</div>
70-
70+
7171
<ul class="margin-bottom">
72+
<li><a href="/docs/realtime">Realtime</a></li>
7273
<li><a href="/docs/functions">Functions</a></li>
7374
<li><a href="/docs/keys">API Keys</a></li>
7475
<li><a href="/docs/webhooks">Webhooks</a></li>
7576
<li><a href="/docs/tasks">Tasks</a></li>
7677
</ul>
77-
78+
7879
<div class="margin-bottom-small">
7980
<b class="text-size-small">Advanced</b>
8081
</div>
@@ -88,19 +89,19 @@ $cols = [
8889
</nav>
8990
</div>
9091
<div class="col <?php echo $cols[$layout]['main']; ?>">
91-
<article>
92-
<a href="/docs" class="back"><i class="icon-left-open"></i> Docs</a>
92+
<article>
93+
<a href="/docs" class="back"><i class="icon-left-open"></i> Docs</a>
9394

94-
<h1 class="margin-top-small margin-bottom">
95-
<?php echo $this->escape($title); ?>
95+
<h1 class="margin-top-small margin-bottom">
96+
<?php echo $this->escape($title); ?>
9697

97-
<?php if(!empty($subtitle)): ?>
98-
&nbsp;<span class="text-fade text-size-normal">| <?php echo $this->escape($subtitle); ?></span>
99-
<?php endif; ?>
100-
</h1>
98+
<?php if (!empty($subtitle)) : ?>
99+
&nbsp;<span class="text-fade text-size-normal">| <?php echo $this->escape($subtitle); ?></span>
100+
<?php endif; ?>
101+
</h1>
101102

102-
<?php echo $this->exec($this->getParam('page', [])); ?>
103-
</article>&nbsp;
103+
<?php echo $this->exec($this->getParam('page', [])); ?>
104+
</article>&nbsp;
104105
</div>
105106
</div>
106107
</div>

‎app/views/docs/permissions.phtml‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -102,7 +102,7 @@
102102
<p>In the following example, we are creating a document that can be read by everyone and only be edited, or deleted by a user with a UID <span class="tag">user:5c1f88b42259e</span>.</p>
103103

104104
<div class="ide" data-lang="javascript" data-lang-label="Web SDK">
105-
<pre class="line-numbers"><code class="prism language-javascript" data-prism>let sdk = new Appwrite();
105+
<pre class="line-numbers"><code class="prism language-javascript" data-prism>const sdk = new Appwrite();
106106

107107
sdk
108108
.setProject('')
@@ -129,7 +129,7 @@ promise.then(function (response) {
129129
<p>In the following example, we are creating a document that can be read-only by members of <span class="tag">team:5c1f88b87435e</span> and can only be edited, or deleted by members of the same team that possesses the role <span class="tag">owner</span>.</p>
130130

131131
<div class="ide" data-lang="javascript" data-lang-label="Web SDK">
132-
<pre class="line-numbers"><code class="prism language-javascript" data-prism>let sdk = new Appwrite();
132+
<pre class="line-numbers"><code class="prism language-javascript" data-prism>const sdk = new Appwrite();
133133

134134
sdk
135135
.setProject('')

0 commit comments

Comments
 (0)