Skip to content

Commit 4f29019

Browse files
committed
Customizations for Swagger-UI
1 parent 4aaaf47 commit 4f29019

File tree

4 files changed

+407
-35
lines changed

4 files changed

+407
-35
lines changed

Diff for: arrow.svg

+4
Loading

Diff for: emby-custom.css

+109
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,109 @@
1+
.swagger-ui .opblock-tag div {
2+
overflow: hidden;
3+
text-overflow: ellipsis;
4+
white-space: nowrap;
5+
}
6+
7+
.swagger-ui .opblock-tag small {
8+
display: grid;
9+
margin-bottom: 2px;
10+
margin-left: auto;
11+
margin-right: 5px;
12+
margin-top: -2px;
13+
text-overflow: ellipsis;
14+
white-space: normal;
15+
}
16+
17+
.swagger-ui .opblock-tag small a {
18+
overflow: hidden;
19+
text-overflow: ellipsis;
20+
white-space: nowrap;
21+
}
22+
23+
.swagger-ui .model-toggle {
24+
-webkit-transform: rotate(90deg);
25+
-webkit-transform-origin: 50% 50%;
26+
-webkit-transition: -webkit-transform .15s ease-in;
27+
cursor: pointer;
28+
display: inline-block;
29+
font-size: 10px;
30+
margin: auto .3em auto .1em;
31+
position: relative;
32+
top: 1px;
33+
transform: rotate(90deg);
34+
transform-origin: 50% 50%;
35+
transition: -webkit-transform .15s ease-in;
36+
transition: transform .15s ease-in;
37+
transition: transform .15s ease-in, -webkit-transform .15s ease-in;
38+
}
39+
40+
.swagger-ui table.model tbody tr td:first-of-type {
41+
padding: 0 0 2px 2em;
42+
width: 120px;
43+
}
44+
45+
.swagger-ui .model-toggle:after {
46+
background: url("arrow.svg") no-repeat;
47+
/*background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z'/%3E%3C/svg%3E") 50% no-repeat;*/
48+
background-size: 100%;
49+
content: "";
50+
display: block;
51+
height: 10px;
52+
width: 10px;
53+
}
54+
55+
.swagger-ui .model {
56+
color: #3b4151;
57+
font-family: Source Code Pro, monospace;
58+
font-size: 12px;
59+
font-weight: 600;
60+
}
61+
62+
.swagger-ui .model-title {
63+
color: #3f86d2;
64+
font-size: 12px;
65+
font-family: Source Code Pro, monospace;
66+
font-weight: 700;
67+
margin-right: .3em;
68+
}
69+
70+
.swagger-ui div > .model-box { width: 100%; }
71+
72+
.swagger-ui .model-box {
73+
background: rgba(0, 0, 0, .1);
74+
border-radius: 4px;
75+
display: inline-block;
76+
padding: 10px;
77+
}
78+
79+
.swagger-ui table.model tbody tr td:first-of-type { padding-top: 3px; }
80+
81+
.swagger-ui table.model tbody tr td {
82+
padding-left: 12px;
83+
padding-top: 3px;
84+
}
85+
86+
.swagger-ui .prop-type { color: #b456b5; }
87+
88+
.swagger-ui .prop-format {
89+
color: #a38d00;
90+
font-weight: 600;
91+
}
92+
93+
.swagger-ui .prop-details {
94+
color: #6B6B6B;
95+
font-style: italic;
96+
font-weight: 500;
97+
}
98+
99+
.swagger-ui .prop-enumvalues {
100+
color: #1b9d38;
101+
/*font-style: italic;*/
102+
display: inline-block;
103+
font-weight: 500;
104+
}
105+
106+
.swagger-ui .prop > .prop-enum {
107+
color: #a38d00;
108+
display: inline;
109+
}

Diff for: emby-custom.js

+239
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,239 @@
1+

2+
var _extends =
3+
Object.assign ||
4+
function(target) {
5+
for (let i = 1; i < arguments.length; i++) {
6+
const source = arguments[i];
7+
for (let key in source) {
8+
if (Object.prototype.hasOwnProperty.call(source, key)) {
9+
target[key] = source[key];
10+
}
11+
}
12+
}
13+
return target;
14+
};
15+
16+
17+
function caseInsensitivePhraseFilter() {
18+
return {
19+
fn: {
20+
opsFilter: (taggedOps, phrase) => {
21+
const phrases = phrase.toUpperCase().split(' ');
22+
23+
return taggedOps.filter((val, key) => {
24+
return phrases.find((text) => key.toUpperCase().indexOf(text.trim()) !== -1);
25+
});
26+
}
27+
}
28+
};
29+
}
30+
31+
function renderEnum() {
32+
return {
33+
wrapComponents: {
34+
EnumModel: (OriginalComponent, system) => (props) => {
35+
36+
var values = system.React.createElement('span',
37+
{ className: 'prop-enumvalues' },
38+
`(${props.value.join(', ')})`);
39+
return system.React.createElement('span', { className: 'prop-enum' }, '($enum)', values);
40+
}
41+
}
42+
};
43+
};
44+
45+
function renderArray() {
46+
return {
47+
wrapComponents: {
48+
ArrayModel: (OriginalComponent, system) => (props) => {
49+
50+
const { getComponent, getConfigs, schema, depth, expandDepth, name, displayName, specPath } = props;
51+
52+
const description = schema.get('description');
53+
const items = schema.get('items');
54+
const title = schema.get('title') || displayName || name;
55+
const properties = schema.filter(
56+
(v, key) => ['type', 'items', 'description', '$$ref'].indexOf(key) === -1
57+
);
58+
59+
const Markdown = getComponent('Markdown');
60+
const ModelCollapse = getComponent('ModelCollapse');
61+
const Model = getComponent('Model');
62+
const Property = getComponent('Property');
63+
64+
const titleEl =
65+
title &&
66+
system.React.createElement(
67+
'span',
68+
{ className: 'model-title' },
69+
system.React.createElement('span', { className: 'model-title__text' }, title)
70+
);
71+
72+
return system.React.createElement(
73+
'span',
74+
{ className: 'model' },
75+
'[',
76+
system.React.createElement(
77+
'span',
78+
null,
79+
system.React.createElement(
80+
Model,
81+
_extends({},
82+
props,
83+
{
84+
getConfigs: getConfigs,
85+
specPath: specPath.push('items'),
86+
name: null,
87+
schema: items,
88+
required: false,
89+
depth: depth
90+
})
91+
)
92+
),
93+
properties.size
94+
? properties
95+
.entrySeq()
96+
.map(([key, v]) =>
97+
system.React.createElement(Property,
98+
{
99+
key: `${key}-${v}`,
100+
propKey: key,
101+
propVal: v,
102+
propStyle: propStyle
103+
})
104+
)
105+
: null,
106+
!description
107+
? properties.size
108+
? system.React.createElement('div', { className: 'markdown' })
109+
: null
110+
: system.React.createElement(Markdown, { source: description }),
111+
']'
112+
);
113+
}
114+
}
115+
};
116+
};
117+
118+
function renderPrimitive() {
119+
return {
120+
wrapComponents: {
121+
PrimitiveModel: (OriginalComponent, system) => (props) => {
122+
123+
const { schema, getComponent, getConfigs, name, displayName, depth } = props;
124+
125+
const { showExtensions } = getConfigs();
126+
127+
if (!schema || !schema.get) {
128+
// don't render if schema isn't correctly formed
129+
return system.React.createElement('div', null);
130+
}
131+
132+
const type = schema.get('type');
133+
let format = schema.get('format');
134+
const nullable = schema.get('nullable');
135+
const xml = schema.get('xml');
136+
const enumArray = schema.get('enum');
137+
const title = schema.get('title') || displayName || name;
138+
const description = schema.get('description');
139+
//let extensions = getExtensions(schema);
140+
const properties = schema
141+
.filter((v, key) => ['enum', 'type', 'format', 'description', 'nullable', '$$ref'].indexOf(key) ===
142+
-1)
143+
.filterNot((v, key) => extensions.has(key));
144+
const Markdown = getComponent('Markdown');
145+
const EnumModel = getComponent('EnumModel');
146+
const Property = getComponent('Property');
147+
148+
if (format && format.length > 0) {
149+
150+
format = `$${format}`;
151+
152+
if (nullable === true) {
153+
format += ', nullable';
154+
}
155+
} else if (nullable === true) {
156+
format = 'nullable';
157+
}
158+
159+
return system.React.createElement('span',
160+
{ className: 'model' },
161+
system.React.createElement('span',
162+
{ className: 'prop' },
163+
name &&
164+
system.React.createElement('span',
165+
{ className: `${depth === 1 && 'model-title'} prop-name` },
166+
title),
167+
system.React.createElement('span', { className: 'prop-type' }, type),
168+
format && system.React.createElement('span', { className: 'prop-format' }, '(', format, ')'),
169+
properties.size
170+
? properties.entrySeq().map(([key, v]) =>
171+
system.React.createElement(Property,
172+
{
173+
key: `${key}-${v}`,
174+
propKey: key,
175+
propVal: v,
176+
className: 'prop-details'
177+
})
178+
)
179+
: null,
180+
showExtensions && extensions.size
181+
? extensions.entrySeq().map(([key, v]) =>
182+
system.React.createElement(Property,
183+
{
184+
key: `${key}-${v}`,
185+
propKey: key,
186+
propVal: v,
187+
className: 'prop-details'
188+
})
189+
)
190+
: null,
191+
!description ? null : system.React.createElement(Markdown, { source: description }),
192+
xml && xml.size
193+
? system.React.createElement('span',
194+
null,
195+
system.React.createElement('br', null),
196+
system.React.createElement('span', { className: 'prop-details' }, 'xml:'),
197+
xml.entrySeq().map(([key, v]) =>
198+
system.React.createElement(
199+
'span',
200+
{ key: `${key}-${v}`, className: 'prop-details' },
201+
system.React.createElement('br', null),
202+
'&nbsp;&nbsp;&nbsp;',
203+
key,
204+
': ',
205+
String(v)
206+
)
207+
).toArray()
208+
)
209+
: null,
210+
enumArray &&
211+
system.React.createElement(EnumModel, { value: enumArray, getComponent: getComponent })
212+
)
213+
);
214+
215+
}
216+
}
217+
};
218+
};
219+
220+
221+
function disableAuthorizePlugin() {
222+
return {
223+
wrapComponents: {
224+
authorizeBtn: () => () => null,
225+
ServersContainer: () => () => null,
226+
SchemesContainer: () => () => null
227+
}
228+
};
229+
};
230+
231+
function hideTopbarPlugin() {
232+
// this plugin overrides the Topbar component to return nothing
233+
return {
234+
components: {
235+
Topbar: function() { return null }
236+
}
237+
};
238+
}
239+

0 commit comments

Comments
 (0)