Skip to content

Commit 297fec6

Browse files
glynnbirdglynnbird
committed
Merge pull request #2 from vabarbosa/master
additional info updates
2 parents 416478a + 27a1013 commit 297fec6

File tree

4 files changed

+247
-108
lines changed

4 files changed

+247
-108
lines changed

‎.gitignore‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,4 +5,5 @@ start.sh
55
*.csv
66
.settings
77
.jshintrc
8-
.project
8+
.project
9+
.vscode

‎public/autocomplete.html‎

Lines changed: 135 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,135 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width, initial-scale=1">
7+
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
8+
<title>IBM Cloud Data Services | Simple Autocomplete Service</title>
9+
10+
<link href="css/master.css" rel="stylesheet">
11+
<link href="css/sas.css" rel="stylesheet">
12+
</head>
13+
14+
<body class="capped-layout">
15+
<header class="capped-layout_cap app-banner">
16+
<a class="app-banner_title" rel="home" href="https://developer.ibm.com/clouddataservices">IBM Cloud Data Services // Dev</a>
17+
</header>
18+
19+
<div class="capped-layout_body bookend-layout">
20+
<nav class="bookend-layout_bookend theme_dark">
21+
<ul class="tree-nav">
22+
<li class="tree-nav_item">
23+
<a class="tree-nav_link" href="/">Simple Autocomplete Service</a>
24+
<ul class="tree-nav">
25+
<li class="tree-nav_item"><a class="tree-nav_link" href="/autocomplete.html">Autocomplete Indexes</a></li>
26+
<li class="tree-nav_item"><a class="tree-nav_link" href="#indexadd">Create an Index</a></li>
27+
</ul>
28+
</li>
29+
<li class="tree-nav_item">
30+
<a class="tree-nav_link" href="/doc.html">Documentation</a>
31+
<ul class="tree-nav">
32+
<li class="tree-nav_item"><a class="tree-nav_link" href="/doc.html#apilist">API</a></li>
33+
<li class="tree-nav_item"><a class="tree-nav_link" href="/doc.html#lockdown">Lockdown Mode</a></li>
34+
<li class="tree-nav_item"><a class="tree-nav_link" href="/doc.html#codesamples">Code Samples</a></li>
35+
</ul>
36+
</li>
37+
</ul>
38+
</nav>
39+
40+
<div class="bookend-layout_body theme_light bg_white">
41+
<header class="layout_section theme_light">
42+
<h1 class="type_heading">Autocomplete Indexes</h1>
43+
<p class="type_copy">
44+
A Node.js app that uses an attached Redis database to provide an autocomplete API for
45+
data uploaded as text files. Multiple separate autocomplete indexes are supported.
46+
</p>
47+
</header>
48+
49+
<!-- start index listing -->
50+
<section class="layout_section">
51+
<div id="indexlist"></div>
52+
<h2 class="type_heading type_mark">Current Indexes</h2>
53+
<p class="type_copy">The following indexes are currently available</p>
54+
<div id="thetable" class="table_basic-container">
55+
<!-- table of indexes goes here -->
56+
</div>
57+
</section>
58+
<!-- end index listing -->
59+
60+
<!-- start create index -->
61+
<section class="layout_section">
62+
<hr>
63+
<div id="indexadd"></div>
64+
<h2 class="type_heading type_mark">Create an Index</h2>
65+
<p class="type_copy">Indexes can be created by uploading a local file or adding a remote URL</p>
66+
67+
<div class="tabbed-panel">
68+
<ul class="tabbed-panel_tab-group">
69+
<li class="tabbed-panel_tab"><a href="#indexfromfileupload">Local File</a></li>
70+
<li class="tabbed-panel_tab"><a href="#indexfromfileurl">Remote File</a></li>
71+
</ul>
72+
<!-- start upload file panel -->
73+
<div id="indexfromfileupload" class="tabbed-panel_panel bg_light-tint">
74+
<form id="uploadform" class="form" action="/api/upload" method="post" enctype="multipart/form-data">
75+
<fieldset class="form_field">
76+
<label class="form_label" for="name">Index name</label>
77+
<input id="name" class="input_text" type=text name="name" value="test" required>
78+
</fieldset>
79+
<fieldset class="form_field">
80+
<label class="form_label" for="file">File</label>
81+
<input id="file" class="input_file" type="file" name="file" required>
82+
<label class="input_file-handle" for="file">Select a File</label>
83+
</fieldset>
84+
<div class="button_group">
85+
<button id="submitbutton" type="submit" class="button_primary">Upload</button>
86+
</div>
87+
</form>
88+
</div>
89+
<!-- end upload file panel -->
90+
<!-- start add url panel -->
91+
<div id="indexfromfileurl" class="tabbed-panel_panel bg_light-tint">
92+
<p class="type_copy">
93+
No data. No problem. <button class="type_link" onclick="toggle('.remote-files')">We got you covered.</button>
94+
</p>
95+
<div class="button_group remote-files hidden">
96+
<button type="button" class="button_secondary btn-shortcut"
97+
data-url="https://raw.githubusercontent.com/glynnbird/simple-autocomplete-service/master/data/countries.txt"
98+
data-name="countries">Countries (194)</button>
99+
<button type="button" class="button_secondary btn-shortcut"
100+
data-url="https://raw.githubusercontent.com/glynnbird/simple-autocomplete-service/master/data/uktowns.txt"
101+
data-name="towns">UK Towns (992)</button>
102+
<button type="button" class="button_secondary btn-shortcut"
103+
data-url="https://raw.githubusercontent.com/glynnbird/simple-autocomplete-service/master/data/uspresidents.txt"
104+
data-name="presidents">US Presidents (43)</button>
105+
<button type="button" class="button_secondary btn-shortcut"
106+
data-url="https://raw.githubusercontent.com/glynnbird/simple-autocomplete-service/master/data/names.txt"
107+
data-name="names">Names (4995)</button>
108+
</div>
109+
<form id="submiturlform" class="form" action="/api/uploadurl" method="post" enctype="multipart/form-data">
110+
<fieldset class="form_field">
111+
<label class="form_label" for="urlname">Index name</label>
112+
<input id="urlname" class="input_text" type=text name="name" value="test" required>
113+
</fieldset>
114+
<fieldset class="form_field">
115+
<label class="form_label" for="url">URL</label>
116+
<input id="url" class="input_text" type="url" name="url" placeholder="Enter a URL" required>
117+
</fieldset>
118+
<div class="button_group">
119+
<button id="submiturlbutton" type="submit" class="button_primary">Add</button>
120+
</div>
121+
</form>
122+
</div>
123+
<!-- end add url panel -->
124+
</div>
125+
</section>
126+
<!-- end create index -->
127+
128+
</div>
129+
</div>
130+
131+
<script src="https://code.jquery.com/jquery-2.2.2.min.js"></script>
132+
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
133+
<script src="js/sas.js"></script>
134+
</body>
135+
</html>

‎public/doc.html‎

Lines changed: 36 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -22,14 +22,15 @@
2222
<li class="tree-nav_item">
2323
<a class="tree-nav_link" href="/">Simple Autocomplete Service</a>
2424
<ul class="tree-nav">
25-
<li class="tree-nav_item"><a class="tree-nav_link" href="/index.html#indexlist">Autocomplete Indexes</a></li>
26-
<li class="tree-nav_item"><a class="tree-nav_link" href="/index.html#indexadd">Create an Index</a></li>
25+
<li class="tree-nav_item"><a class="tree-nav_link" href="/autocomplete.html">Autocomplete Indexes</a></li>
26+
<li class="tree-nav_item"><a class="tree-nav_link" href="/autocomplete.html#indexadd">Create an Index</a></li>
2727
</ul>
2828
</li>
2929
<li class="tree-nav_item">
3030
<a class="tree-nav_link" href="/doc.html">Documentation</a>
3131
<ul class="tree-nav">
3232
<li class="tree-nav_item"><a class="tree-nav_link" href="#apilist">API</a></li>
33+
<li class="tree-nav_item"><a class="tree-nav_link" href="#lockdown">Lockdown Mode</a></li>
3334
<li class="tree-nav_item"><a class="tree-nav_link" href="#codesamples">Code Samples</a></li>
3435
</ul>
3536
</li>
@@ -89,24 +90,40 @@ <h2 class="type_subhead">DELETE /api/:name</h2>
8990
<li><code>name</code> - the name of the index to delete</li>
9091
</ul>
9192
</figure>
92-
93-
<h2 class="type_subhead">Lockdown mode</h2>
94-
<p>To make your auto-complete indexes read-only, simply set an environment variable "LOCKDOWN" to be "true".
95-
This will leave only the "GET /api/:name" endpoint working e.g.</p>
96-
<figure class="guide-example theme_light bg_light-tint">
97-
<p class="type_copy">LOCKDOWN=true node app.js</p>
98-
</figure>
99-
<p>or in Bluemix:</p>
100-
<ul>
101-
<li>Go to "Environment Variables"</li>
102-
<li>Open the "User-Defined" tab</li>
103-
<li>Click "Add" and add a "LOCKDOWN" variable with a value of "true"</li>
104-
<li>Click "Save" and after a restart, your autocomplete service will be locked down</li>
105-
</ul>
106-
10793
</section>
10894
<!-- end API -->
10995

96+
<!-- start lockdown -->
97+
<section class="layout_section">
98+
<hr>
99+
<div id="lockdown"></div>
100+
<h2 class="type_heading type_mark">Lockdown Mode</h2>
101+
<p class="type_copy">
102+
To make your auto-complete indexes read-only, simply set an environment variable <code>LOCKDOWN</code> to be <code>true</code>.
103+
This will leave only the <code>GET /api/:name</code> endpoint working e.g.
104+
</p>
105+
<code class="type_codeblock">
106+
export LOCKDOWN=true
107+
node app.js
108+
</code>
109+
<p class="type_copy">
110+
or in IBM Bluemix:
111+
</p>
112+
<figure class="guide-example theme_light bg_light-tint">
113+
<ul class="list_unordered">
114+
<li>Go to <code>Environment Variables</code></li>
115+
<li>Open the <code>User-Defined</code> tab</li>
116+
<li>Click <code>Add</code></li>
117+
<li>Add a <code>LOCKDOWN</code> variable with a value of <code>true</code></li>
118+
<li>Click <code>Save</code></li>
119+
</ul>
120+
<p class="type_copy">
121+
After a restart, your autocomplete service will be locked down.
122+
</p>
123+
</figure>
124+
</section>
125+
<!-- end lockdown -->
126+
110127
<!-- start code samples -->
111128
<section class="layout_section">
112129
<hr>
@@ -120,15 +137,13 @@ <h2 class="type_heading type_mark">Code Samples</h2>
120137
</p>
121138

122139
<h2 class="type_subhead">jQuery</h2>
123-
<figure class="theme_light bg_light-tint">
124-
<code class="type_codeblock">
140+
<code class="type_codeblock">
125141
$("#inputFieldId").autocomplete({
126142
source: "/api/" + encodeURIComponent(indexName),
127143
minLength: 1,
128144
delay:0
129145
});
130-
</code>
131-
</figure>
146+
</code>
132147
</section>
133148
<!-- end code samples -->
134149
</div>

0 commit comments

Comments
 (0)