[MM-16677] New unsupported browser page (#11858)
* Added OSVersion to unsupported browser template (and some test code) * [MM-17569] Working prototype (not functional) of unsupported browser page * WIP * WIP * [MM-17571] Unsupported browser page template logic * WIP * [MM-17572][MM-17573] Added browsers and tested for unsupported under IE and Safari * Clean-up * Added missing license header * Fixed a test * Blank commit to force CI update * PR feedback * oops
Этот коммит содержится в:
Devin Binnie
коммит произвёл
GitHub
GitHub
родитель
e71b99d9f6
Коммит
9562917734
96
i18n/en.json
96
i18n/en.json
@@ -7323,12 +7323,100 @@
|
||||
"translation": "Unable to parse incoming data"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.message",
|
||||
"translation": "Your current browser is not supported. Please upgrade to one of the following browsers:"
|
||||
"id": "web.error.unsupported_browser.browser_get_latest.chrome",
|
||||
"translation": "Get the latest Chrome browser"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.title",
|
||||
"translation": "Unsupported Browser"
|
||||
"id": "web.error.unsupported_browser.browser_get_latest.firefox",
|
||||
"translation": "Get the latest Firefox browser"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.browser_get_latest.safari",
|
||||
"translation": "Get the latest Safari browser"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.browser_title.chrome",
|
||||
"translation": "Google Chrome"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.browser_title.edge",
|
||||
"translation": "Microsoft Edge"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.browser_title.firefox",
|
||||
"translation": "Firefox"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.browser_title.safari",
|
||||
"translation": "Safari"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.download",
|
||||
"translation": "Download the App"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.download_app_or_upgrade_browser",
|
||||
"translation": "Download the Mattermost app or use a supported browser for a better experience."
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.download_the_app",
|
||||
"translation": "Download the App"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.install_guide.mac",
|
||||
"translation": "Install Guide"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.install_guide.windows",
|
||||
"translation": "Install Guide"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.learn_more",
|
||||
"translation": "Learn more about supported browsers."
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.min_browser_version.chrome",
|
||||
"translation": "Version 61+"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.min_browser_version.edge",
|
||||
"translation": "Version 44+"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.min_browser_version.firefox",
|
||||
"translation": "Version 60+"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.min_browser_version.safari",
|
||||
"translation": "Version 12+"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.min_os_version.mac",
|
||||
"translation": "macOS 10.9+"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.min_os_version.windows",
|
||||
"translation": "Windows 7+"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.no_longer_support",
|
||||
"translation": "We no longer support this browser"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.no_longer_support_version",
|
||||
"translation": "We no longer support this version of your browser"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.open_system_browser.edge",
|
||||
"translation": "Open Edge"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.system_browser_make_default",
|
||||
"translation": "Make default"
|
||||
},
|
||||
{
|
||||
"id": "web.error.unsupported_browser.system_browser_or",
|
||||
"translation": "or"
|
||||
},
|
||||
{
|
||||
"id": "web.get_access_token.internal_saving.app_error",
|
||||
|
||||
@@ -1,178 +1,301 @@
|
||||
{{define "unsupported_browser"}}
|
||||
<head>
|
||||
<style>
|
||||
body {
|
||||
margin-top: 0px;
|
||||
margin-right: 0px;
|
||||
margin-bottom: 0px;
|
||||
margin-left: 0px;
|
||||
font-family: "Open Sans", sans-serif;
|
||||
font-size: 14px;
|
||||
line-height: 1.42857;
|
||||
color: rgb(51, 51, 51);
|
||||
background-color: whitesmoke;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
background-image: initial;
|
||||
background-position-x: initial;
|
||||
background-position-y: initial;
|
||||
background-size: initial;
|
||||
background-repeat-x: initial;
|
||||
background-repeat-y: initial;
|
||||
background-attachment: initial;
|
||||
background-origin: initial;
|
||||
background-clip: initial;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
}
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
html, body {
|
||||
height: 100%;
|
||||
}
|
||||
.sticky {
|
||||
background-image: initial;
|
||||
background-position-x: initial;
|
||||
background-position-y: initial;
|
||||
background-size: initial;
|
||||
background-repeat-x: initial;
|
||||
background-repeat-y: initial;
|
||||
background-attachment: initial;
|
||||
background-origin: initial;
|
||||
background-clip: initial;
|
||||
background-color: white;
|
||||
}
|
||||
.container-fluid {
|
||||
padding-right: 15px;
|
||||
padding-left: 15px;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
}
|
||||
.container-fluid::after {
|
||||
content: " ";
|
||||
display: block;
|
||||
height: 0px;
|
||||
clear: both;
|
||||
overflow-x: hidden;
|
||||
overflow-y: hidden;
|
||||
visibility: hidden;
|
||||
}
|
||||
.exclamation-triangle {
|
||||
width: 22px;
|
||||
opacity: 0.6;
|
||||
}
|
||||
body.error .container-fluid {
|
||||
display: table;
|
||||
height: 90%;
|
||||
}
|
||||
body.error .error__container {
|
||||
color: rgb(85, 85, 85);
|
||||
display: table-cell;
|
||||
margin-top: 0px;
|
||||
margin-right: auto;
|
||||
margin-bottom: 0px;
|
||||
margin-left: auto;
|
||||
max-width: 800px;
|
||||
padding-top: 5em;
|
||||
padding-right: 0px;
|
||||
padding-bottom: 5em;
|
||||
padding-left: 0px;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
}
|
||||
body.error .error__icon {
|
||||
color: rgb(204, 204, 204);
|
||||
font-size: 4em;
|
||||
}
|
||||
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
|
||||
font-family: inherit;
|
||||
font-weight: 500;
|
||||
line-height: 1.1;
|
||||
color: inherit;
|
||||
}
|
||||
h1, .h1, h2, .h2, h3, .h3 {
|
||||
margin-top: 20px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
h2, .h2 {
|
||||
font-size: 30px;
|
||||
}
|
||||
body.error h2 {
|
||||
font-size: 1.5em;
|
||||
font-weight: 600;
|
||||
margin-top: 0.8em;
|
||||
margin-right: 0px;
|
||||
margin-bottom: 0.5em;
|
||||
margin-left: 0px;
|
||||
}
|
||||
h2 {
|
||||
font-size: 25px;
|
||||
}
|
||||
ul, ol {
|
||||
margin-top: 0px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
a {
|
||||
background-color: transparent;
|
||||
color: rgb(35, 137, 215);
|
||||
text-decoration-line: none;
|
||||
text-decoration-style: initial;
|
||||
text-decoration-color: initial;
|
||||
cursor: pointer;
|
||||
word-break: break-word;
|
||||
}
|
||||
a:focus {
|
||||
outline-color: -webkit-focus-ring-color;
|
||||
outline-style: auto;
|
||||
outline-width: 5px;
|
||||
outline-offset: -2px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body class="sticky error">
|
||||
<div data-reactroot="" class="container-fluid" >
|
||||
<div class="error__container" >
|
||||
<div class="error__icon" >
|
||||
<img src="/static/images/warning.png" alt="warning" class="exclamation-triangle" ></img>
|
||||
</div>
|
||||
<h2 >
|
||||
<span>{{.Props.Title}}</span>
|
||||
</h2>
|
||||
<div>
|
||||
<span>{{.Props.Message}}</span>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="https://www.google.com/chrome/browser/desktop/index.html" target="_blank" rel="noopener noreferrer">
|
||||
<span>Google Chrome 43+</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://www.mozilla.org/en-US/firefox/new/" target="_blank" rel="noopener noreferrer">
|
||||
<span>Mozilla Firefox 52+</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://www.microsoft.com/en-ca/download/internet-explorer.aspx" target="_blank" rel="noopener noreferrer">
|
||||
<span>Microsoft Internet Explorer 11+</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://www.microsoft.com/en-ca/download/details.aspx?id=48126" target="_blank" rel="noopener noreferrer">
|
||||
<span>Microsoft Edge 40+</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://support.apple.com/en-us/HT204416" target="_blank" rel="noopener noreferrer">
|
||||
<span>Apple Safari 9+</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
{{define "unsupported_browser-browser"}}
|
||||
<div
|
||||
class='browser-container'
|
||||
data-mattermost-hover='browser'
|
||||
>
|
||||
<div class='browser'>
|
||||
<img
|
||||
class='browser-image'
|
||||
src='{{.LogoSrc}}'
|
||||
/>
|
||||
<div class='browser-top-text'>{{.Title}}</div>
|
||||
<div class='browser-bottom-text'>{{.SupportedVersionString}}</div>
|
||||
</div>
|
||||
<div
|
||||
class='browser browser-hover hidden'
|
||||
data-mattermost-click='{{.Src}}'
|
||||
>
|
||||
<img
|
||||
class='browser-image'
|
||||
src='{{.LogoSrc}}'
|
||||
/>
|
||||
<div class='browser-top-text'>{{.GetLatestString}}</div>
|
||||
</div>
|
||||
</div>
|
||||
{{end}}
|
||||
{{define "unsupported_browser-system_browser"}}
|
||||
<div
|
||||
class='browser-container'
|
||||
data-mattermost-hover='browser'
|
||||
>
|
||||
<div class='browser'>
|
||||
<img
|
||||
class='browser-image'
|
||||
src='{{.LogoSrc}}'
|
||||
/>
|
||||
<div class='browser-top-text'>{{.Title}}</div>
|
||||
<div class='browser-bottom-text'>{{.SupportedVersionString}}</div>
|
||||
</div>
|
||||
<div class='browser browser-hover no-pointer hidden'>
|
||||
<img
|
||||
class='browser-image'
|
||||
src='{{.LogoSrc}}'
|
||||
/>
|
||||
<div
|
||||
class='browser-top-text pointer'
|
||||
data-mattermost-click='{{.LinkOpen}}'
|
||||
>
|
||||
<p>{{.LabelOpen}}</p>
|
||||
</div>
|
||||
<div class='browser-bottom-text'>{{.OrString}}</div>
|
||||
<div
|
||||
class='browser-top-text pointer'
|
||||
data-mattermost-click='{{.LinkMakeDefault}}'
|
||||
>
|
||||
<p>{{.MakeDefaultString}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{end}}
|
||||
{{define "unsupported_browser-app"}}
|
||||
<div
|
||||
class='mattermost-app-container'
|
||||
data-mattermost-hover='mattermost-app'
|
||||
>
|
||||
<div class='mattermost-app'>
|
||||
<img
|
||||
class='mattermost-app-image'
|
||||
src='{{.LogoSrc}}'
|
||||
/>
|
||||
<div class='browser-top-text'>{{.Title}}</div>
|
||||
<div class='browser-bottom-text'>{{.SupportedVersionString}}</div>
|
||||
</div>
|
||||
<div class='mattermost-app mattermost-app-hover hidden'>
|
||||
<img
|
||||
class='mattermost-app-image'
|
||||
src='{{.LogoSrc}}'
|
||||
/>
|
||||
<button
|
||||
class='mattermost-app-button'
|
||||
data-mattermost-click='{{.Link}}'
|
||||
>
|
||||
{{.Label}}
|
||||
</button>
|
||||
<div class='mattermost-app-hover-alt'>
|
||||
<a href='{{.InstallGuideLink}}' target='_blank'>{{.InstallGuide}}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{end}}
|
||||
{{define "unsupported_browser"}}
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
body {
|
||||
overflow: hidden;
|
||||
}
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
.content {
|
||||
height: 540px;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
margin-top: -270px;
|
||||
}
|
||||
.we-no-longer-support {
|
||||
height: 55px;
|
||||
color: #3D3C40;
|
||||
font-family: "Open Sans";
|
||||
font-size: 40px;
|
||||
font-weight: 600;
|
||||
letter-spacing: -0.2px;
|
||||
line-height: 55px;
|
||||
text-align: center;
|
||||
}
|
||||
.download-the-matterm {
|
||||
height: 26px;
|
||||
color: #3D3C40;
|
||||
font-family: "Open Sans";
|
||||
font-size: 20px;
|
||||
line-height: 26px;
|
||||
text-align: center;
|
||||
padding-top: 24px;
|
||||
}
|
||||
.downloads {
|
||||
height: 212px;
|
||||
width: 100%;
|
||||
padding-top: 40px;
|
||||
text-align: center;
|
||||
font-size: 0;
|
||||
}
|
||||
.learn-more-about-sup {
|
||||
height: 22px;
|
||||
width: 100%;
|
||||
line-height: 22px;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
}
|
||||
.learn-more-about-sup a {
|
||||
color: #145DBF;
|
||||
text-decoration: none;
|
||||
font-family: "Open Sans";
|
||||
font-size: 14px;
|
||||
}
|
||||
.learn-more-about-sup a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.vr {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
margin-left: 32px;
|
||||
margin-right: 30px;
|
||||
width: 1px;
|
||||
background-color: #D8D8D8;
|
||||
height: 164px;
|
||||
position: relative;
|
||||
top: 24px;
|
||||
}
|
||||
.mattermost-app {
|
||||
height: 148px;
|
||||
width: 188px;
|
||||
padding: 32px 30px;
|
||||
}
|
||||
.mattermost-app-container {
|
||||
height: 212px;
|
||||
width: 248px;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
}
|
||||
.browser {
|
||||
height: 212px;
|
||||
width: 164px;
|
||||
padding-left: 14px;
|
||||
padding-right: 14px;
|
||||
}
|
||||
.browser-container {
|
||||
height: 212px;
|
||||
width: 192px;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
padding: 0 2px;
|
||||
}
|
||||
.browser-image {
|
||||
height: 80px;
|
||||
padding: 32px 42px 24px 42px;
|
||||
}
|
||||
.mattermost-app-image {
|
||||
height: 80px;
|
||||
padding: 0px 54px 24px 54px;
|
||||
}
|
||||
.browser-bottom-text {
|
||||
font-family: "Open Sans";
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
text-align: center;
|
||||
color: rgba(61,60,64,0.7);
|
||||
}
|
||||
.browser-top-text {
|
||||
color: #145DBF;
|
||||
font-family: "Open Sans";
|
||||
font-size: 16px;
|
||||
letter-spacing: -0.2px;
|
||||
line-height: 22px;
|
||||
text-align: center;
|
||||
}
|
||||
.browser-top-text p {
|
||||
margin: 0;
|
||||
}
|
||||
.browser-top-text p:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.container-hover {
|
||||
background-color: #EDF2FA;
|
||||
border-radius: 4px;
|
||||
border: 0;
|
||||
}
|
||||
.browser-hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
.browser-hover .browser-top-text {
|
||||
font-weight: 600;
|
||||
width: 128px;
|
||||
padding: 0 18px;
|
||||
}
|
||||
.mattermost-app-button {
|
||||
height: 36px;
|
||||
width: 156px;
|
||||
border: 0;
|
||||
border-radius: 4px;
|
||||
background-color: #145DBF;
|
||||
padding: 8px 16px;
|
||||
color: #FFFFFF;
|
||||
font-family: "Open Sans";
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.mattermost-app.mattermost-app-hover {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
.no-pointer {
|
||||
cursor: auto;
|
||||
}
|
||||
.pointer {
|
||||
cursor: pointer;
|
||||
}
|
||||
.mattermost-app-hover-alt {
|
||||
height: 18px;
|
||||
font-family: "Open Sans";
|
||||
font-size: 12px;
|
||||
line-height: 18px;
|
||||
text-align: center;
|
||||
padding-top: 10px;
|
||||
}
|
||||
.mattermost-app-hover-alt a {
|
||||
text-decoration: none;
|
||||
color: #145DBF;
|
||||
}
|
||||
.mattermost-app-hover-alt a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
</style>
|
||||
<link
|
||||
href='https://fonts.googleapis.com/css?family=Open+Sans&display=swap'
|
||||
rel='stylesheet'
|
||||
/>
|
||||
<script
|
||||
type='text/javascript'
|
||||
src='/unsupported_browser.js'
|
||||
>
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div class='content'>
|
||||
<div class='we-no-longer-support'>
|
||||
{{.Props.NoLongerSupportString}}
|
||||
</div>
|
||||
<div class='download-the-matterm'>
|
||||
{{.Props.DownloadAppOrUpgradeBrowserString}}
|
||||
</div>
|
||||
<div class='downloads'>
|
||||
{{template "unsupported_browser-app" .Props.App}}
|
||||
<div class='vr'></div>
|
||||
{{range .Props.Browsers}}
|
||||
{{template "unsupported_browser-browser" .}}
|
||||
{{end}}
|
||||
{{if .Props.SystemBrowser}}
|
||||
{{template "unsupported_browser-system_browser" .Props.SystemBrowser}}
|
||||
{{end}}
|
||||
<div class='learn-more-about-sup'>
|
||||
<a href='https://docs.mattermost.com/install/requirements.html#pc-web' target='_blank'>{{.Props.LearnMoreString}}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
{{end}}
|
||||
|
||||
38
templates/unsupported_browser.js
Обычный файл
38
templates/unsupported_browser.js
Обычный файл
@@ -0,0 +1,38 @@
|
||||
function onHover(element, prefix) {
|
||||
element.className += " container-hover";
|
||||
var unHoverElement = element.querySelector('.' + prefix + ':not(.hidden)');
|
||||
var hoverElement = element.querySelector('.' + prefix + '-hover.hidden');
|
||||
if (unHoverElement && hoverElement) {
|
||||
unHoverElement.className += " hidden";
|
||||
hoverElement.className = hoverElement.className.replace(/\bhidden\b/g, "");
|
||||
}
|
||||
}
|
||||
function onUnHover(element, prefix) {
|
||||
element.className = element.className.replace(/\bcontainer-hover\b/g, "");
|
||||
var unHoverElement = element.querySelector('.' + prefix + '.hidden');
|
||||
var hoverElement = element.querySelector('.' + prefix + '-hover:not(.hidden)');
|
||||
if (unHoverElement && hoverElement) {
|
||||
hoverElement.className += " hidden";
|
||||
unHoverElement.className = unHoverElement.className.replace(/\bhidden\b/g, "");
|
||||
}
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
var hovers = document.querySelectorAll("div[data-mattermost-hover]");
|
||||
for (var i = 0; i < hovers.length; i++) {
|
||||
var element = hovers[i];
|
||||
element.addEventListener("mouseover", function(e) {
|
||||
onHover(e.currentTarget, e.currentTarget.getAttribute("data-mattermost-hover"));
|
||||
});
|
||||
element.addEventListener("mouseout", function(e) {
|
||||
onUnHover(e.currentTarget, e.currentTarget.getAttribute("data-mattermost-hover"))
|
||||
});
|
||||
}
|
||||
var clicks = document.querySelectorAll("div[data-mattermost-click], button[data-mattermost-click]");
|
||||
for (var i = 0; i < clicks.length; i++) {
|
||||
var element = clicks[i];
|
||||
element.addEventListener("click", function(e) {
|
||||
window.open(e.currentTarget.getAttribute('data-mattermost-click'), '_blank');
|
||||
});
|
||||
};
|
||||
});
|
||||
@@ -45,6 +45,7 @@ func (w *Web) InitStatic() {
|
||||
w.MainRouter.PathPrefix("/static/plugins/").Handler(pluginHandler)
|
||||
w.MainRouter.PathPrefix("/static/").Handler(staticHandler)
|
||||
w.MainRouter.Handle("/robots.txt", http.HandlerFunc(robotsHandler))
|
||||
w.MainRouter.Handle("/unsupported_browser.js", http.HandlerFunc(unsupportedBrowserScriptHandler))
|
||||
w.MainRouter.Handle("/{anything:.*}", w.NewStaticHandler(root)).Methods("GET")
|
||||
|
||||
// When a subpath is defined, it's necessary to handle redirects without a
|
||||
@@ -60,11 +61,7 @@ func (w *Web) InitStatic() {
|
||||
func root(c *Context, w http.ResponseWriter, r *http.Request) {
|
||||
|
||||
if !CheckClientCompatability(r.UserAgent()) {
|
||||
w.Header().Set("Cache-Control", "no-store")
|
||||
page := utils.NewHTMLTemplate(c.App.HTMLTemplates(), "unsupported_browser")
|
||||
page.Props["Title"] = c.App.T("web.error.unsupported_browser.title")
|
||||
page.Props["Message"] = c.App.T("web.error.unsupported_browser.message")
|
||||
page.RenderToWriter(w)
|
||||
renderUnsuppportedBrowser(c.App, w, r)
|
||||
return
|
||||
}
|
||||
|
||||
@@ -97,3 +94,13 @@ func robotsHandler(w http.ResponseWriter, r *http.Request) {
|
||||
}
|
||||
w.Write(robotsTxt)
|
||||
}
|
||||
|
||||
func unsupportedBrowserScriptHandler(w http.ResponseWriter, r *http.Request) {
|
||||
if strings.HasSuffix(r.URL.Path, "/") {
|
||||
http.NotFound(w, r)
|
||||
return
|
||||
}
|
||||
|
||||
templatesDir, _ := fileutils.FindDir("templates")
|
||||
http.ServeFile(w, r, filepath.Join(templatesDir, "unsupported_browser.js"))
|
||||
}
|
||||
|
||||
156
web/unsupported_browser.go
Обычный файл
156
web/unsupported_browser.go
Обычный файл
@@ -0,0 +1,156 @@
|
||||
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
|
||||
// See License.txt for license information.
|
||||
|
||||
package web
|
||||
|
||||
import (
|
||||
"net/http"
|
||||
|
||||
"github.com/avct/uasurfer"
|
||||
|
||||
"github.com/mattermost/mattermost-server/app"
|
||||
"github.com/mattermost/mattermost-server/utils"
|
||||
)
|
||||
|
||||
// MattermostApp describes downloads for the Mattermost App
|
||||
type MattermostApp struct {
|
||||
LogoSrc string
|
||||
Title string
|
||||
SupportedVersionString string
|
||||
Label string
|
||||
Link string
|
||||
InstallGuide string
|
||||
InstallGuideLink string
|
||||
}
|
||||
|
||||
// Browser describes a browser with a download link
|
||||
type Browser struct {
|
||||
LogoSrc string
|
||||
Title string
|
||||
SupportedVersionString string
|
||||
Src string
|
||||
GetLatestString string
|
||||
}
|
||||
|
||||
// SystemBrowser describes a browser but includes 2 links: one to open the local browser, and one to make it default
|
||||
type SystemBrowser struct {
|
||||
LogoSrc string
|
||||
Title string
|
||||
SupportedVersionString string
|
||||
LabelOpen string
|
||||
LinkOpen string
|
||||
LinkMakeDefault string
|
||||
OrString string
|
||||
MakeDefaultString string
|
||||
}
|
||||
|
||||
func renderUnsuppportedBrowser(app *app.App, w http.ResponseWriter, r *http.Request) {
|
||||
w.Header().Set("Cache-Control", "no-store")
|
||||
page := utils.NewHTMLTemplate(app.HTMLTemplates(), "unsupported_browser")
|
||||
|
||||
// User Agent info
|
||||
ua := uasurfer.Parse(r.UserAgent())
|
||||
isWindows := ua.OS.Platform.String() == "PlatformWindows"
|
||||
isWindows10 := isWindows && ua.OS.Version.Major == 10
|
||||
isMacOSX := ua.OS.Name.String() == "OSMacOSX" && ua.OS.Version.Major == 10
|
||||
isSafari := ua.Browser.Name.String() == "BrowserSafari"
|
||||
|
||||
// Basic heading translations
|
||||
if isSafari {
|
||||
page.Props["NoLongerSupportString"] = app.T("web.error.unsupported_browser.no_longer_support_version")
|
||||
} else {
|
||||
page.Props["NoLongerSupportString"] = app.T("web.error.unsupported_browser.no_longer_support")
|
||||
}
|
||||
page.Props["DownloadAppOrUpgradeBrowserString"] = app.T("web.error.unsupported_browser.download_app_or_upgrade_browser")
|
||||
page.Props["LearnMoreString"] = app.T("web.error.unsupported_browser.learn_more")
|
||||
|
||||
// Mattermost app version
|
||||
if isWindows {
|
||||
page.Props["App"] = renderMattermostAppWindows(app)
|
||||
} else if isMacOSX {
|
||||
page.Props["App"] = renderMattermostAppMac(app)
|
||||
}
|
||||
|
||||
// Browsers to download
|
||||
// Show a link to Safari if you're using safari and it's outdated
|
||||
// Can't show on Mac all the time because there's no way to open it via URI
|
||||
browsers := []Browser{renderBrowserChrome(app), renderBrowserFirefox(app)}
|
||||
if isSafari {
|
||||
browsers = append(browsers, renderBrowserSafari(app))
|
||||
}
|
||||
page.Props["Browsers"] = browsers
|
||||
|
||||
// If on Windows 10, show link to Edge
|
||||
if isWindows10 {
|
||||
page.Props["SystemBrowser"] = renderSystemBrowserEdge(app, r)
|
||||
}
|
||||
|
||||
page.RenderToWriter(w)
|
||||
}
|
||||
|
||||
func renderMattermostAppMac(app *app.App) MattermostApp {
|
||||
return MattermostApp{
|
||||
"/static/images/browser-icons/mac.png",
|
||||
app.T("web.error.unsupported_browser.download_the_app"),
|
||||
app.T("web.error.unsupported_browser.min_os_version.mac"),
|
||||
app.T("web.error.unsupported_browser.download"),
|
||||
"https://mattermost.com/download/#mattermostApps",
|
||||
app.T("web.error.unsupported_browser.install_guide.mac"),
|
||||
"https://docs.mattermost.com/install/desktop.html#mac-os-x-10-9",
|
||||
}
|
||||
}
|
||||
|
||||
func renderMattermostAppWindows(app *app.App) MattermostApp {
|
||||
return MattermostApp{
|
||||
"/static/images/browser-icons/windows.svg",
|
||||
app.T("web.error.unsupported_browser.download_the_app"),
|
||||
app.T("web.error.unsupported_browser.min_os_version.windows"),
|
||||
app.T("web.error.unsupported_browser.download"),
|
||||
"https://mattermost.com/download/#mattermostApps",
|
||||
app.T("web.error.unsupported_browser.install_guide.windows"),
|
||||
"https://docs.mattermost.com/install/desktop.html#windows-10-windows-8-1-windows-7",
|
||||
}
|
||||
}
|
||||
|
||||
func renderBrowserChrome(app *app.App) Browser {
|
||||
return Browser{
|
||||
"/static/images/browser-icons/chrome.svg",
|
||||
app.T("web.error.unsupported_browser.browser_title.chrome"),
|
||||
app.T("web.error.unsupported_browser.min_browser_version.chrome"),
|
||||
"http://www.google.com/chrome",
|
||||
app.T("web.error.unsupported_browser.browser_get_latest.chrome"),
|
||||
}
|
||||
}
|
||||
|
||||
func renderBrowserFirefox(app *app.App) Browser {
|
||||
return Browser{
|
||||
"/static/images/browser-icons/firefox.svg",
|
||||
app.T("web.error.unsupported_browser.browser_title.firefox"),
|
||||
app.T("web.error.unsupported_browser.min_browser_version.firefox"),
|
||||
"https://www.mozilla.org/en-CA/firefox/new/",
|
||||
app.T("web.error.unsupported_browser.browser_get_latest.firefox"),
|
||||
}
|
||||
}
|
||||
|
||||
func renderBrowserSafari(app *app.App) Browser {
|
||||
return Browser{
|
||||
"/static/images/browser-icons/safari.svg",
|
||||
app.T("web.error.unsupported_browser.browser_title.safari"),
|
||||
app.T("web.error.unsupported_browser.min_browser_version.safari"),
|
||||
"macappstore://showUpdatesPage",
|
||||
app.T("web.error.unsupported_browser.browser_get_latest.safari"),
|
||||
}
|
||||
}
|
||||
|
||||
func renderSystemBrowserEdge(app *app.App, r *http.Request) SystemBrowser {
|
||||
return SystemBrowser{
|
||||
"/static/images/browser-icons/edge.svg",
|
||||
app.T("web.error.unsupported_browser.browser_title.edge"),
|
||||
app.T("web.error.unsupported_browser.min_browser_version.edge"),
|
||||
app.T("web.error.unsupported_browser.open_system_browser.edge"),
|
||||
"microsoft-edge:http://" + r.Host + r.RequestURI, //TODO: Can we get HTTP or HTTPS? If someone's server doesn't have a redirect this won't work
|
||||
"ms-settings:defaultapps",
|
||||
app.T("web.error.unsupported_browser.system_browser_or"),
|
||||
app.T("web.error.unsupported_browser.system_browser_make_default"),
|
||||
}
|
||||
}
|
||||
@@ -44,15 +44,16 @@ func New(config configservice.ConfigService, globalOptions app.AppOptionCreator,
|
||||
// Due to the complexities of UA detection and the ramifications of a misdetection
|
||||
// only older Safari and IE browsers throw incompatibility errors.
|
||||
// Map should be of minimum required browser version.
|
||||
// -1 means that the browser is not supported in any version.
|
||||
var browserMinimumSupported = map[string]int{
|
||||
"BrowserIE": 11,
|
||||
"BrowserIE": 12,
|
||||
"BrowserSafari": 9,
|
||||
}
|
||||
|
||||
func CheckClientCompatability(agentString string) bool {
|
||||
ua := uasurfer.Parse(agentString)
|
||||
|
||||
if version, exist := browserMinimumSupported[ua.Browser.Name.String()]; exist && ua.Browser.Version.Major < version {
|
||||
if version, exist := browserMinimumSupported[ua.Browser.Name.String()]; exist && (ua.Browser.Version.Major < version || version < 0) {
|
||||
return false
|
||||
}
|
||||
|
||||
|
||||
@@ -244,8 +244,8 @@ func TestCheckClientCompatability(t *testing.T) {
|
||||
{"Franz 4.0.4", "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/537.36 (KHTML, like Gecko) Franz/4.0.4 Chrome/52.0.2743.82 Electron/1.3.1 Safari/537.36", true},
|
||||
{"Edge 14", "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/51.0.2704.79 Safari/537.36 Edge/14.14393", true},
|
||||
{"Internet Explorer 9", "Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 7.1; Trident/5.0", false},
|
||||
{"Internet Explorer 11", "Mozilla/5.0 (Windows NT 10.0; WOW64; Trident/7.0; rv:11.0) like Gecko", true},
|
||||
{"Internet Explorer 11 2", "Mozilla/5.0 (Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729; Zoom 3.6.0; rv:11.0) like Gecko", true},
|
||||
{"Internet Explorer 11", "Mozilla/5.0 (Windows NT 10.0; WOW64; Trident/7.0; rv:11.0) like Gecko", false},
|
||||
{"Internet Explorer 11 2", "Mozilla/5.0 (Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729; Zoom 3.6.0; rv:11.0) like Gecko", false},
|
||||
{"Internet Explorer 11 (Compatibility Mode) 1", "Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729; .NET CLR 1.1.4322; InfoPath.3; Zoom 3.6.0)", false},
|
||||
{"Internet Explorer 11 (Compatibility Mode) 2", "Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729; Zoom 3.6.0)", false},
|
||||
{"Safari 9", "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Safari/604.1.38", true},
|
||||
|
||||
Ссылка в новой задаче
Block a user