Hugging Face's logo

Spaces:
imseldrith
/
Imagine
Running

App Files Community
imseldrith commited on
Commit
c3fb706
·
1 Parent(s): 3ab0a79

Update templates/api_docs.html

Browse files
Files changed (1) hide show
  1. templates/api_docs.html +80 -16
templates/api_docs.html CHANGED
@@ -12,38 +12,96 @@
12
  margin-bottom: 20px;
13
  }
14
 
15
- code {
 
 
 
 
 
 
 
 
 
 
 
 
 
 
16
  background-color: #f4f4f4;
17
- padding: 5px;
18
  font-family: monospace;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
19
  }
20
  </style>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
21
  </head>
22
  <body>
23
  <h1>API Documentation</h1>
24
- <h2>Generate Image</h2>
25
- <p>Endpoint: <code>/api/generate</code></p>
26
- <p>Method: <code>POST</code></p>
27
- <p>Request Payload:</p>
28
- <pre>
 
 
 
 
29
  {
30
  "prompt": "Woman sitting on a table, looking at the sky, seen from behind",
31
  "style": "ANIME_V2",
32
  "ratio": "RATIO_16X9",
33
  "model": "REALISTIC"
34
  }
35
- </pre>
36
- <p>Response:</p>
37
- <pre>
 
 
38
  {
39
  "error": "An error occurred while generating the image."
40
  }
41
- </pre>
42
- <p>Sample Code:</p>
43
- <pre>
 
 
44
  import requests
45
 
46
- url = 'https://imseldrith-imagine.hf.space/api/generate'
47
 
48
  headers = {'Content-Type':'application/json'}
49
  payload = {
@@ -65,6 +123,12 @@ else:
65
  error_data = response.json()
66
  error_message = error_data.get('error', 'Unknown error')
67
  print(f'Failed to generate image: {error_message}')
68
- </pre>
 
 
 
 
 
69
  </body>
70
- </html>
 
 
12
  margin-bottom: 20px;
13
  }
14
 
15
+ .endpoint {
16
+ margin-bottom: 30px;
17
+ }
18
+
19
+ .endpoint h3 {
20
+ margin-top: 0;
21
+ font-size: 1.2em;
22
+ font-weight: bold;
23
+ }
24
+
25
+ .method {
26
+ margin-bottom: 10px;
27
+ }
28
+
29
+ .code-block {
30
  background-color: #f4f4f4;
31
+ padding: 10px;
32
  font-family: monospace;
33
+ margin-bottom: 20px;
34
+ }
35
+
36
+ .code-block pre {
37
+ margin: 0;
38
+ }
39
+
40
+ .sample-code {
41
+ background-color: #f4f4f4;
42
+ padding: 10px;
43
+ margin-bottom: 20px;
44
+ }
45
+
46
+ .sample-code pre {
47
+ margin: 0;
48
+ overflow-x: auto;
49
  }
50
  </style>
51
+ <script>
52
+ document.addEventListener("DOMContentLoaded", function() {
53
+ const endpoints = document.querySelectorAll(".endpoint");
54
+
55
+ endpoints.forEach(function(endpoint) {
56
+ const codeBlock = endpoint.querySelector(".code-block");
57
+ const sampleCode = endpoint.querySelector(".sample-code");
58
+ const showButton = document.createElement("button");
59
+ showButton.textContent = "Show Example Code";
60
+
61
+ showButton.addEventListener("click", function() {
62
+ codeBlock.style.display = "block";
63
+ sampleCode.style.display = "block";
64
+ showButton.style.display = "none";
65
+ });
66
+
67
+ endpoint.appendChild(showButton);
68
+ });
69
+ });
70
+ </script>
71
  </head>
72
  <body>
73
  <h1>API Documentation</h1>
74
+
75
+ <div class="endpoint">
76
+ <h3>Generate Image</h3>
77
+ <p class="method">Endpoint: <code>/api/generate</code></p>
78
+ <p class="method">Method: <code>POST</code></p>
79
+ <p class="method">Description: Generate an image based on the provided parameters.</p>
80
+ <div class="code-block" style="display: none;">
81
+ <p>Request Payload:</p>
82
+ <pre>
83
  {
84
  "prompt": "Woman sitting on a table, looking at the sky, seen from behind",
85
  "style": "ANIME_V2",
86
  "ratio": "RATIO_16X9",
87
  "model": "REALISTIC"
88
  }
89
+ </pre>
90
+ </div>
91
+ <div class="code-block" style="display: none;">
92
+ <p>Response:</p>
93
+ <pre>
94
  {
95
  "error": "An error occurred while generating the image."
96
  }
97
+ </pre>
98
+ </div>
99
+ <div class="sample-code" style="display: none;">
100
+ <p>Sample Code:</p>
101
+ <pre>
102
  import requests
103
 
104
+ url = 'https://imseldrith-imagine.hf.space/api/generate'
105
 
106
  headers = {'Content-Type':'application/json'}
107
  payload = {
 
123
  error_data = response.json()
124
  error_message = error_data.get('error', 'Unknown error')
125
  print(f'Failed to generate image: {error_message}')
126
+ </pre>
127
+ </div>
128
+ </div>
129
+
130
+ <!-- Add more endpoints and documentation as needed -->
131
+
132
  </body>
133
+ </html>
134
+