use beefy ui

This commit is contained in:
Danny Coates 2017-10-10 10:20:49 -07:00
parent 12c81a22e8
commit 32c5b414de
No known key found for this signature in database
GPG Key ID: 4C442633C62E00CB
5 changed files with 10 additions and 62 deletions

View File

@ -1,38 +1,9 @@
import hash from 'string-hash';
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')}`
);
}
}
};
const experiments = {};
//Returns a number between 0 and 1
// eslint-disable-next-line no-unused-vars
function luckyNumber(str) {
return hash(str) / 0xffffffff;
}

View File

@ -20,10 +20,6 @@ app.use((state, emitter) => {
state.translate = locale.getTranslator();
state.storage = storage;
state.raven = Raven;
state.config = {
uploadWindowStyle: 'upload-window',
uploadButtonStyle: 'browse btn'
};
emitter.on('DOMContentLoaded', async () => {
if (
/firefox/i.test(navigator.userAgent) &&

View File

@ -13,8 +13,7 @@ module.exports = function(state, emit) {
'uploadPageLearnMore'
)}</a>
</div>
<div class="${state.config
.uploadWindowStyle}" ondragover=${dragover} ondragleave=${dragleave}>
<div class="upload-window" ondragover=${dragover} ondragleave=${dragleave}>
<div id="upload-img"><img src="${assets.get(
'upload.svg'
)}" title="${state.translate('uploadSvgAlt')}"/></div>
@ -24,10 +23,9 @@ module.exports = function(state, emit) {
)}</em></span>
<form method="post" action="upload" enctype="multipart/form-data">
<input id="file-upload" type="file" name="fileUploaded" onchange=${upload} onfocus=${onfocus} onblur=${onblur} />
<label for="file-upload" id="browse" class="${state.config
.uploadButtonStyle}" title="${state.translate(
'uploadPageBrowseButton1'
)}">${state.translate('uploadPageBrowseButton1')}</label>
<label for="file-upload" id="browse" class="btn browse" title="${state.translate(
'uploadPageBrowseButton1'
)}">${state.translate('uploadPageBrowseButton1')}</label>
</form>
</div>
${fileList(state, emit)}

View File

@ -205,7 +205,7 @@ a {
}
.upload-window {
border: 1px dashed rgba(0, 148, 251, 0.5);
border: 3px dashed rgba(0, 148, 251, 0.5);
margin: 0 auto;
height: 255px;
border-radius: 4px;
@ -219,7 +219,7 @@ a {
}
.upload-window.ondrag {
border: 3px dashed rgba(0, 148, 251, 0.5);
border: 5px dashed rgba(0, 148, 251, 0.5);
margin: 0 auto;
height: 251px;
transform: scale(1.04);
@ -231,14 +231,6 @@ a {
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 {
color: #0094fb;
text-decoration: none;
@ -258,10 +250,10 @@ a {
.browse {
background: #0297f8;
border-radius: 5px;
font-size: 15px;
font-size: 20px;
color: #fff;
min-width: 240px;
height: 44px;
height: 60px;
display: flex;
justify-content: center;
align-items: center;
@ -273,11 +265,6 @@ a {
background-color: #0287e8;
}
.browse-b {
height: 60px;
font-size: 20px;
}
input[type='file'] {
opacity: 0;
overflow: hidden;

View File

@ -15,10 +15,6 @@ module.exports = function(req) {
storage: {
files: []
},
config: {
uploadWindowStyle: 'upload-window',
uploadButtonStyle: 'browse btn'
},
fira: false,
fileInfo: {},
layout