Add a view only mode?

[teknolog2000]

Since Swagger Editor today renders better than Swagger UI, I would like to use Swagger Editor as a rendering engine for our API docs. For example, it renders securityDefinitions and lists all the models at the bottom.

Has this been discussed before? Seems quite simple to add a config flag to make this happen.

[fehguy]

many like it more. many hate it. right now, it's a separate project, and I believe you can disable the editor portion.

[teknolog2000]

That would be great, but I can't find a setting for that in the config file: https://github.com/swagger-api/swagger-editor/blob/master/app/config/defaults.json

What might it be? Should I just dig through the code to figure it out?

[fehguy]

yes, the primary author is on soma holiday right now so if you'd like to dig in yourself that'd be best.

[chrisdudley]

You can hide the editor pane in CSS, or I have had some success with modifying the router to simply not load the editor or header panes at all. But that was a nasty hack and not something that could be merged in.

[yewton]

Hi,

FYI, I want view-only mode too, so I made a sample project to achieve it: https://github.com/yewton/swagger-top-down-playground
This can render a local spec file and preview it.

This uses Backend as storage and modifies the view to disable editor pain.

[yewton]

may be #664 is a related issue.

[fehguy]

This is indeed a duplicate. Let's track in the other issue.

[marklagendijk]

You can customize the index.html and add custom javascript or css (either inline or externaly).
With the following css you can hide the editor and make the viewer full screen:

.pane.editor, .ui-splitbar{
    display: none;
}

.pane.preview{
    left: 0 !important;
    width: 100% !important;
}

With the following javascript you can start with the editor closed, but still have the ability to open it:

SwaggerEditor.run(function($timeout){
     $timeout(function(){
         document.getElementsByClassName('ui-splitbar-icon-left')[0].click();
     });
});

[himanshupareek]

Its already mentioned there in swagger-editor.css file, so you can get this css code and override within your local html page.

/**

• Styling for printing out of the editor
  */

.Pane1,
.topbar {
display: none;
}
.SplitPane {
position: relative !important;
display: block !important;
}
.Pane2 {
overflow-y: auto;
width: 100% !important;
}

[LionH]

Isn't the purpose of swagger-ui to only show the API Docs?