diff --git a/Resources/doc/customization.rst b/Resources/doc/customization.rst index 66d77fb..80d3370 100644 --- a/Resources/doc/customization.rst +++ b/Resources/doc/customization.rst @@ -3,12 +3,11 @@ Customization The look and feel of the Swagger UI can be customized. - Overwrite Twig Template ----------------------- If you want to customize parts of the template, you can create your own Twig template. -This allows to change the title, the header, add additional or replace existing styles or scripts. +This allows to change Swagger UI configuration, page title, page header, add additional or replace existing styles or scripts. Take a look at the Twig documentation `how to extend templates `_. @@ -25,11 +24,27 @@ Just create a file ``templates/bundles/NelmioApiDocBundle/SwaggerUi/index.html.t #} {% extends '@!NelmioApiDoc/SwaggerUi/index.html.twig' %} + {# + Change swagger UI configuration + All parameters are explained on Swagger UI website: + https://swagger.io/docs/open-source-tools/swagger-ui/usage/configuration/ + #} + {% block swagger_initialization %} + + {% endblock %} + + {# Import your own stylesheet #} {% block stylesheets %} {{ parent() }} {% endblock stylesheets %} + {# Import your own script #} {% block javascripts %} {{ parent() }} diff --git a/Resources/public/init-swagger-ui.js b/Resources/public/init-swagger-ui.js index 892a2b6..bb06f3f 100644 --- a/Resources/public/init-swagger-ui.js +++ b/Resources/public/init-swagger-ui.js @@ -5,9 +5,9 @@ // For the full copyright and license information, please view the LICENSE // file that was distributed with this source code. -window.onload = function() { +function loadSwaggerUI(userOptions = {}) { const data = JSON.parse(document.getElementById('swagger-data').innerText); - const ui = SwaggerUIBundle({ + const defaultOptions = { spec: data.spec, dom_id: '#swagger-ui', validatorUrl: null, @@ -19,7 +19,9 @@ window.onload = function() { SwaggerUIBundle.plugins.DownloadUrl ], layout: 'StandaloneLayout' - }); + }; + const options = Object.assign({}, defaultOptions, userOptions); + const ui = SwaggerUIBundle(options); const storageKey = 'nelmio_api_auth'; @@ -47,4 +49,4 @@ window.onload = function() { }; window.ui = ui; -}; +} diff --git a/Resources/views/SwaggerUi/index.html.twig b/Resources/views/SwaggerUi/index.html.twig index ec7efa6..82e1332 100644 --- a/Resources/views/SwaggerUi/index.html.twig +++ b/Resources/views/SwaggerUi/index.html.twig @@ -66,8 +66,11 @@ file that was distributed with this source code. #} {% endblock javascripts %} + {% block swagger_initialization %} - + {% endblock swagger_initialization %}