use beefy ui
This commit is contained in:
parent
12c81a22e8
commit
32c5b414de
|
@ -1,38 +1,9 @@
|
||||||
import hash from 'string-hash';
|
import hash from 'string-hash';
|
||||||
|
|
||||||
const experiments = {
|
const experiments = {};
|
||||||
'5YHCzn2CQTmBwWwTmZupBA': {
|
|
||||||
id: '5YHCzn2CQTmBwWwTmZupBA',
|
|
||||||
run: function(variant, state, emitter) {
|
|
||||||
state.experiment = {
|
|
||||||
xid: this.id,
|
|
||||||
xvar: variant
|
|
||||||
};
|
|
||||||
// Beefy UI
|
|
||||||
if (variant === 1) {
|
|
||||||
state.config.uploadWindowStyle = 'upload-window upload-window-b';
|
|
||||||
state.config.uploadButtonStyle = 'btn browse browse-b';
|
|
||||||
} else {
|
|
||||||
state.config.uploadWindowStyle = 'upload-window';
|
|
||||||
state.config.uploadButtonStyle = 'btn browse';
|
|
||||||
}
|
|
||||||
emitter.emit('render');
|
|
||||||
},
|
|
||||||
eligible: function(state) {
|
|
||||||
return this.luckyNumber(state) >= 0.5;
|
|
||||||
},
|
|
||||||
variant: function(state) {
|
|
||||||
return this.luckyNumber(state) < 0.75 ? 0 : 1;
|
|
||||||
},
|
|
||||||
luckyNumber: function(state) {
|
|
||||||
return luckyNumber(
|
|
||||||
`${this.id}:${state.storage.get('testpilot_ga__cid')}`
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
//Returns a number between 0 and 1
|
//Returns a number between 0 and 1
|
||||||
|
// eslint-disable-next-line no-unused-vars
|
||||||
function luckyNumber(str) {
|
function luckyNumber(str) {
|
||||||
return hash(str) / 0xffffffff;
|
return hash(str) / 0xffffffff;
|
||||||
}
|
}
|
||||||
|
|
|
@ -20,10 +20,6 @@ app.use((state, emitter) => {
|
||||||
state.translate = locale.getTranslator();
|
state.translate = locale.getTranslator();
|
||||||
state.storage = storage;
|
state.storage = storage;
|
||||||
state.raven = Raven;
|
state.raven = Raven;
|
||||||
state.config = {
|
|
||||||
uploadWindowStyle: 'upload-window',
|
|
||||||
uploadButtonStyle: 'browse btn'
|
|
||||||
};
|
|
||||||
emitter.on('DOMContentLoaded', async () => {
|
emitter.on('DOMContentLoaded', async () => {
|
||||||
if (
|
if (
|
||||||
/firefox/i.test(navigator.userAgent) &&
|
/firefox/i.test(navigator.userAgent) &&
|
||||||
|
|
|
@ -13,8 +13,7 @@ module.exports = function(state, emit) {
|
||||||
'uploadPageLearnMore'
|
'uploadPageLearnMore'
|
||||||
)}</a>
|
)}</a>
|
||||||
</div>
|
</div>
|
||||||
<div class="${state.config
|
<div class="upload-window" ondragover=${dragover} ondragleave=${dragleave}>
|
||||||
.uploadWindowStyle}" ondragover=${dragover} ondragleave=${dragleave}>
|
|
||||||
<div id="upload-img"><img src="${assets.get(
|
<div id="upload-img"><img src="${assets.get(
|
||||||
'upload.svg'
|
'upload.svg'
|
||||||
)}" title="${state.translate('uploadSvgAlt')}"/></div>
|
)}" title="${state.translate('uploadSvgAlt')}"/></div>
|
||||||
|
@ -24,10 +23,9 @@ module.exports = function(state, emit) {
|
||||||
)}</em></span>
|
)}</em></span>
|
||||||
<form method="post" action="upload" enctype="multipart/form-data">
|
<form method="post" action="upload" enctype="multipart/form-data">
|
||||||
<input id="file-upload" type="file" name="fileUploaded" onchange=${upload} onfocus=${onfocus} onblur=${onblur} />
|
<input id="file-upload" type="file" name="fileUploaded" onchange=${upload} onfocus=${onfocus} onblur=${onblur} />
|
||||||
<label for="file-upload" id="browse" class="${state.config
|
<label for="file-upload" id="browse" class="btn browse" title="${state.translate(
|
||||||
.uploadButtonStyle}" title="${state.translate(
|
'uploadPageBrowseButton1'
|
||||||
'uploadPageBrowseButton1'
|
)}">${state.translate('uploadPageBrowseButton1')}</label>
|
||||||
)}">${state.translate('uploadPageBrowseButton1')}</label>
|
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
${fileList(state, emit)}
|
${fileList(state, emit)}
|
||||||
|
|
|
@ -205,7 +205,7 @@ a {
|
||||||
}
|
}
|
||||||
|
|
||||||
.upload-window {
|
.upload-window {
|
||||||
border: 1px dashed rgba(0, 148, 251, 0.5);
|
border: 3px dashed rgba(0, 148, 251, 0.5);
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
height: 255px;
|
height: 255px;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
|
@ -219,7 +219,7 @@ a {
|
||||||
}
|
}
|
||||||
|
|
||||||
.upload-window.ondrag {
|
.upload-window.ondrag {
|
||||||
border: 3px dashed rgba(0, 148, 251, 0.5);
|
border: 5px dashed rgba(0, 148, 251, 0.5);
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
height: 251px;
|
height: 251px;
|
||||||
transform: scale(1.04);
|
transform: scale(1.04);
|
||||||
|
@ -231,14 +231,6 @@ a {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.upload-window-b {
|
|
||||||
border: 3px dashed rgba(0, 148, 251, 0.5);
|
|
||||||
}
|
|
||||||
|
|
||||||
.upload-window-b.ondrag {
|
|
||||||
border: 5px dashed rgba(0, 148, 251, 0.5);
|
|
||||||
}
|
|
||||||
|
|
||||||
.link {
|
.link {
|
||||||
color: #0094fb;
|
color: #0094fb;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
@ -258,10 +250,10 @@ a {
|
||||||
.browse {
|
.browse {
|
||||||
background: #0297f8;
|
background: #0297f8;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
font-size: 15px;
|
font-size: 20px;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
min-width: 240px;
|
min-width: 240px;
|
||||||
height: 44px;
|
height: 60px;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
@ -273,11 +265,6 @@ a {
|
||||||
background-color: #0287e8;
|
background-color: #0287e8;
|
||||||
}
|
}
|
||||||
|
|
||||||
.browse-b {
|
|
||||||
height: 60px;
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
input[type='file'] {
|
input[type='file'] {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
|
@ -15,10 +15,6 @@ module.exports = function(req) {
|
||||||
storage: {
|
storage: {
|
||||||
files: []
|
files: []
|
||||||
},
|
},
|
||||||
config: {
|
|
||||||
uploadWindowStyle: 'upload-window',
|
|
||||||
uploadButtonStyle: 'browse btn'
|
|
||||||
},
|
|
||||||
fira: false,
|
fira: false,
|
||||||
fileInfo: {},
|
fileInfo: {},
|
||||||
layout
|
layout
|
||||||
|
|
Loading…
Reference in New Issue