Skip to content

Commit 987733c

Browse files
committed
docs: update API documentation with curl
1 parent 38c18f0 commit 987733c

File tree

2 files changed

+177
-65
lines changed

2 files changed

+177
-65
lines changed

README.api.md

+152-65
Original file line numberDiff line numberDiff line change
@@ -1,68 +1,5 @@
11
# API
22

3-
Using [`httpie`](https://httpie.io/):
4-
```shell
5-
# You can also pass as many HTML content as you want
6-
# Response will be of 'application/json' content type
7-
http -vf :8080/convert \
8-
extension='.js' \
9-
contents[]='<hr/>' \
10-
contents[]='<button disabled>click me, please :sob:</button>'
11-
12-
HTTP/1.1 200
13-
Content-Type: application/json
14-
15-
{
16-
"status": "SUCCESS"
17-
"content": [
18-
{
19-
"content": "let targetElement_001 = document.querySelector(`:root > body`);\r\n\r\n\r\nlet hr_001 = document.createElement('hr');\r\ntargetElement_001.appendChild(hr_001);\r\n",
20-
"filename": "inline.0.js"
21-
},
22-
{
23-
"content": "let targetElement_001 = document.querySelector(`:root > body`);\r\n\r\n\r\nconst button_000 = document.createElement('button');\r\nbutton_000.setAttribute(`disabled`, `true`);\r\nconst text_000 = document.createTextNode(`click me, please :sob:`);\r\nbutton_000.appendChild(text_000);\r\ntargetElement_001.appendChild(button_000);\r\n",
24-
"filename": "inline.1.js"
25-
}
26-
]
27-
}
28-
```
29-
30-
Or, give the following two files contents:
31-
> ```json
32-
> { "extension": ".js" } // ./multipart-options.json
33-
> ```
34-
>
35-
> ```html
36-
> <!DOCTYPE html>
37-
> <!-- ./sample.html -->
38-
> <html>
39-
> <head>
40-
> ...
41-
> ...
42-
> ...
43-
> ```
44-
45-
```shell
46-
# You can call the API with multiple **files** and at most one **options**
47-
# Response will be of 'multipart/form-data' content type
48-
http -vf :8080/convert/files \
49-
'files@./sample.html;type=multipart/form-data' \
50-
'[email protected];type=application/json'
51-
52-
HTTP/1.1 200
53-
Content-Type: multipart/form-data;boundary=3N0wqEqnb7AC3WD8M1cYYG-vLfHDND_JdE90
54-
55-
--3N0wqEqnb7AC3WD8M1cYYG-vLfHDND_JdE90
56-
Content-Disposition: form-data; name="0.sample.html.js"
57-
Content-Type: application/octet-stream
58-
Content-Length: 4156
59-
60-
const targetElement_000 = document.querySelector(`:root > body`);
61-
[... truncated for brievity]
62-
```
63-
64-
---
65-
663
After starting the `jsgenerator-api` as described in the [README.md](./README.md), you can read:
674

685
+ OpenAPI spec. at: [http://localhost:8080/openapi.yaml](http://localhost:8080/openapi.yaml)
@@ -79,10 +16,160 @@ Both accept options as follow:
7916
"pattern": "inline-filename-pattern",
8017
"variableNameStrategy": "TYPE_BASED",
8118
"variableDeclaration": "LET",
82-
"extension": ".extension",
19+
"extension": ".jsgenerator.js",
20+
"commentConversionModeActivated": true,
21+
"querySelectorAdded": true,
8322
"contents": [
8423
"string"
8524
]
8625
}
8726
```
88-
> **NOTE:** The `"content"` field is mandatory for `POST /convert` and forbidden for `POST /convert/files`
27+
> **NOTE:** The `"contents"` field is mandatory for `POST /convert` and forbidden for `POST /convert/files`
28+
29+
30+
---
31+
32+
Using [`curl`](https://curl.se/):
33+
34+
+ `POST /convert`
35+
```shell
36+
# You can also pass as many HTML content as you want
37+
# Response will be of 'application/json' content type
38+
curl -H 'content-type: application/json' -X POST --data '{"contents": ["<div>js-jsgenerator</div>"]}' http://localhost:8080/convert
39+
40+
#Response
41+
{"content":[{"filename":"inline.0.jsgenerator.js","content":"let targetElement_001 = document.querySelector(`:root > body`);\r\n\r\n\r\nlet div_001 = document.createElement('div');\r\nlet text_001 = document.createTextNode(`js-generator`);\r\ndiv_001.appendChild(text_001);\r\ntargetElement_001.appendChild(div_001);\r\n"}],"status":"SUCCESS"}
42+
```
43+
44+
+ `POST /convert/files`
45+
```shell
46+
# You can call the API with multiple **files** and at most one **options**
47+
# Response will be of 'multipart/form-data' content type
48+
curl -s -X POST -H 'content-type: multipart/form-data' -F files=@illustrations/sample.html -F "options={ \"querySelectorAdded\": true, \"variableDeclaration\": \"VAR\" }; type=application/json" http://localhost:8080/convert/files
49+
50+
# -s flag is added in order to prevent curl to mix response and progress meter
51+
#if not added, this will happen: 100 5280 100 4275 100 1005 117k 28194 --:--:-- --:--:-- --:--:-- 147kment.createTextNode(` `);
52+
53+
#Response
54+
55+
--d2a-7NlH3rlmcFC3loiJxDxom6iojCunhkzzH
56+
Content-Disposition: form-data; name="inline.0.jsgenerator.js"
57+
Content-Type: application/octet-stream
58+
Content-Length: 4069
59+
60+
var targetElement_001 = document.querySelector(`:root > body`);
61+
62+
63+
var html_001 = document.createElement('html');
64+
var text_001 = document.createTextNode(` `);
65+
html_001.appendChild(text_001);
66+
67+
var head_001 = document.createElement('head');
68+
var text_002 = document.createTextNode(` `);
69+
head_001.appendChild(text_002);
70+
71+
var meta_001 = document.createElement('meta');
72+
meta_001.setAttribute(`charset`, `utf-8`);
73+
head_001.appendChild(meta_001);
74+
var text_003 = document.createTextNode(` `);
75+
head_001.appendChild(text_003);
76+
77+
var title_001 = document.createElement('title');
78+
var text_004 = document.createTextNode(`Sample`);
79+
title_001.appendChild(text_004);
80+
head_001.appendChild(title_001);
81+
var text_005 = document.createTextNode(` `);
82+
head_001.appendChild(text_005);
83+
84+
var link_001 = document.createElement('link');
85+
link_001.setAttribute(`rel`, `stylesheet`);
86+
link_001.setAttribute(`href`, ``);
87+
head_001.appendChild(link_001);
88+
var text_006 = document.createTextNode(` `);
89+
head_001.appendChild(text_006);
90+
html_001.appendChild(head_001);
91+
var text_007 = document.createTextNode(` `);
92+
html_001.appendChild(text_007);
93+
94+
var body_001 = document.createElement('body');
95+
var text_008 = document.createTextNode(` `);
96+
body_001.appendChild(text_008);
97+
98+
var div_001 = document.createElement('div');
99+
div_001.setAttribute(`id`, `container`);
100+
var text_009 = document.createTextNode(` `);
101+
div_001.appendChild(text_009);
102+
103+
var div_002 = document.createElement('div');
104+
div_002.setAttribute(`id`, `header`);
105+
var text_010 = document.createTextNode(` `);
106+
div_002.appendChild(text_010);
107+
108+
var h1_001 = document.createElement('h1');
109+
var text_011 = document.createTextNode(`Sample`);
110+
h1_001.appendChild(text_011);
111+
div_002.appendChild(h1_001);
112+
var text_012 = document.createTextNode(` `);
113+
div_002.appendChild(text_012);
114+
115+
var img_001 = document.createElement('img');
116+
img_001.setAttribute(`src`, `kanye.jpg`);
117+
img_001.setAttribute(`alt`, `kanye`);
118+
div_002.appendChild(img_001);
119+
var text_013 = document.createTextNode(` `);
120+
div_002.appendChild(text_013);
121+
div_001.appendChild(div_002);
122+
var text_014 = document.createTextNode(` `);
123+
div_001.appendChild(text_014);
124+
125+
var div_003 = document.createElement('div');
126+
div_003.setAttribute(`id`, `main`);
127+
var text_015 = document.createTextNode(` `);
128+
div_003.appendChild(text_015);
129+
130+
var h2_001 = document.createElement('h2');
131+
var text_016 = document.createTextNode(`Main`);
132+
h2_001.appendChild(text_016);
133+
div_003.appendChild(h2_001);
134+
var text_017 = document.createTextNode(` `);
135+
div_003.appendChild(text_017);
136+
137+
var p_001 = document.createElement('p');
138+
var text_018 = document.createTextNode(`This is the main content.`);
139+
p_001.appendChild(text_018);
140+
div_003.appendChild(p_001);
141+
var text_019 = document.createTextNode(` `);
142+
div_003.appendChild(text_019);
143+
144+
var img_002 = document.createElement('img');
145+
img_002.setAttribute(`src`, ``);
146+
img_002.setAttribute(`alt`, ``);
147+
div_003.appendChild(img_002);
148+
var text_020 = document.createTextNode(` `);
149+
div_003.appendChild(text_020);
150+
div_001.appendChild(div_003);
151+
var text_021 = document.createTextNode(` `);
152+
div_001.appendChild(text_021);
153+
154+
var div_004 = document.createElement('div');
155+
div_004.setAttribute(`id`, `footer`);
156+
var text_022 = document.createTextNode(` `);
157+
div_004.appendChild(text_022);
158+
159+
var p_002 = document.createElement('p');
160+
var text_023 = document.createTextNode(`Copyright - 2019`);
161+
p_002.appendChild(text_023);
162+
div_004.appendChild(p_002);
163+
var text_024 = document.createTextNode(` `);
164+
div_004.appendChild(text_024);
165+
div_001.appendChild(div_004);
166+
var text_025 = document.createTextNode(` `);
167+
div_001.appendChild(text_025);
168+
body_001.appendChild(div_001);
169+
var text_026 = document.createTextNode(` `);
170+
body_001.appendChild(text_026);
171+
html_001.appendChild(body_001);
172+
targetElement_001.appendChild(html_001);
173+
174+
--d2a-7NlH3rlmcFC3loiJxDxom6iojCunhkzzH--
175+
```

illustrations/sample.html

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<!DOCTYPE html>
2+
3+
<html>
4+
<head>
5+
<meta charset="utf-8">
6+
<title>Sample</title>
7+
<link rel="stylesheet" href="">
8+
</head>
9+
<body>
10+
<div id="container">
11+
<div id="header">
12+
<h1>Sample</h1>
13+
<img src="kanye.jpg" alt="kanye">
14+
</div>
15+
<div id="main">
16+
<h2>Main</h2>
17+
<p>This is the main content.</p>
18+
<img src="" alt="">
19+
</div>
20+
<div id="footer">
21+
<p>Copyright - 2019</p>
22+
</div>
23+
</div>
24+
</body>
25+
</html>

0 commit comments

Comments
 (0)