diff options
author | Phil Hughes <me@iamphill.com> | 2018-06-13 17:06:35 +0100 |
---|---|---|
committer | Phil Hughes <me@iamphill.com> | 2018-08-07 14:45:55 +0100 |
commit | 7b4b9e1cc453c2620502daceb94d3e2248b58dcb (patch) | |
tree | 96f79cdace962466a0a27d31c91dbdbc82d4bd88 /app/views/admin/application_settings/show.html.haml | |
parent | f3b36ac1171f6d170d008c52a0a324a438f3e886 (diff) | |
download | gitlab-ce-7b4b9e1cc453c2620502daceb94d3e2248b58dcb.tar.gz |
Web IDE & CodeSandbox
This enables JavaScripts projects to have live previews straight in the
browser without requiring any local configuration. This uses the
CodeSandbox package `sandpack` to compile it all inside of an iframe.
This feature is off by default and can be toggled on in the admin
settings. Only projects with a `package.json` and a `main` key are
supported.
Updates happen in real-time with hot-reloading. We just watch for
changes to files and then send them to `sandpack` to allow it to reload
the iframe. The iframe includes a very simple navigation bar, the text
bar is `readonly` to stop users navigating away from the preview and
the back and forward buttons just pop/splice the navigation stack
which is tracked by a listener on `sandpack`
There is a button inside the iframe which allows the user to open the
projects inside of CodeSandbox. This button is only visible on
**public** projects. On private or internal projects this button
get hidden to protect private code being leaked into an external
public URL.
Closes #47268
Diffstat (limited to 'app/views/admin/application_settings/show.html.haml')
-rw-r--r-- | app/views/admin/application_settings/show.html.haml | 23 |
1 files changed, 23 insertions, 0 deletions
diff --git a/app/views/admin/application_settings/show.html.haml b/app/views/admin/application_settings/show.html.haml index 1c8801566d4..258d50ad676 100644 --- a/app/views/admin/application_settings/show.html.haml +++ b/app/views/admin/application_settings/show.html.haml @@ -338,4 +338,27 @@ = render_if_exists 'admin/application_settings/custom_templates_form', expanded: expanded +%section.settings.no-animate#js-web-ide-settings{ class: ('expanded' if expanded) } + .settings-header + %h4 + = _('Web IDE') + %button.btn.btn-default.js-settings-toggle{ type: 'button' } + = expanded ? _('Collapse') : _('Expand') + %p + = _('Manage Web IDE features') + .settings-content + = form_for @application_setting, url: admin_application_settings_path(anchor: "#js-web-ide-settings"), html: { class: 'fieldset-form' } do |f| + = form_errors(@application_setting) + + %fieldset + .form-group + .form-check + = f.check_box :web_ide_clientside_preview_enabled, class: 'form-check-input' + = f.label :web_ide_clientside_preview_enabled, class: 'form-check-label' do + = s_('IDE|Client side evaluation') + %span.form-text.text-muted + = s_('IDE|Allow live previews of JavaScript projects in the Web IDE using CodeSandbox client side evaluation.') + + = f.submit _('Save changes'), class: "btn btn-success" + = render_if_exists 'admin/application_settings/pseudonymizer_settings', expanded: expanded |