Skip to content
Permalink
Browse files

☔ Add noscript tag

If the user's browser has JS disabled, we should tell them instead of
displaying a non functional UI.

As suggested in https://community.octoprint.org/t/i-forgot-my-octoprint-password-how-can-i-reset-it/215/8?u=foosel
  • Loading branch information
foosel committed Nov 15, 2019
1 parent 6d7721f commit 148505023451a4ed067ca8746c5f1c30c64f6c1a

Large diffs are not rendered by default.

@@ -1604,3 +1604,38 @@ input[type="number"].input-nospin {
}

}

// noscript
#page-container-noscript {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #ffffff;
z-index: 12310;

.wrapper {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;

.outer {
display: table;
width: 100%;
height: 100%;

.inner {
display: table-cell;
vertical-align: middle;

.content {
text-align: center;
}
}
}
}

}
@@ -17,6 +17,28 @@
{% include 'initscript.jinja2' %}
</head>
<body>
<noscript>
<style type="text/css">
#page-container-main,
#page-container-loading,
#page-container-needlogin {
display:none;
}
</style>
<div id="page-container-noscript">
<div class="wrapper">
<div class="outer">
<div class="inner">
<div class="content">
<h1 class="text-error">{{ _('You don\'t seem to have JavaScript enabled') }}</h1>
{{ _('OctoPrint\'s UI requires JavaScript to work. Please enable JavaScript and reload.') }}
</div>
</div>
</div>
</div>
</div>
</noscript>

<div class="page-container" id="page-container-main" {% if enableLoadAnimation -%}style="display: none"{%- endif %} data-bind="visible: visible">
<!-- ko allowBindings: false -->
<div id="navbar" class="navbar navbar-static-top">
@@ -160,7 +182,7 @@
<div class="outer">
<div class="inner">
<div class="content">
<h1 id="page-container-loading-header">Loading OctoPrint's UI, please wait...</h1>
<h1 id="page-container-loading-header">{{ _('Loading OctoPrint\'s UI, please wait...') }}</h1>
<i id="page-container-loading-spinner" class="fa fa-spinner fa-spin fa-4x"></i>
<p id="page-container-loading-error" style="display: none"></p>
</div>

1 comment on commit 1485050

@GitIssueBot

This comment has been minimized.

Copy link
Collaborator

GitIssueBot commented on 1485050 Nov 15, 2019

This commit has been mentioned on OctoPrint Community Forum. There might be relevant details there:

https://community.octoprint.org/t/i-forgot-my-octoprint-password-how-can-i-reset-it/215/10

Please sign in to comment.
You can’t perform that action at this time.