Skip to content

Instantly share code, notes, and snippets.

@flavioribeiro
Created July 27, 2016 20:41
Show Gist options
  • Select an option

  • Save flavioribeiro/1524c95067f1c8dd05f98a01c2888fdb to your computer and use it in GitHub Desktop.

Select an option

Save flavioribeiro/1524c95067f1c8dd05f98a01c2888fdb to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head>
<title>Evaporate Example</title>
<style>
#progressbar {
margin: 20px;
width: 400px;
height: 8px;
position: relative;
}
</style>
<script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script language="javascript" type="text/javascript" src="evaporate.js"></script>
<script language="javascript" type="text/javascript" src="progressbar.js"></script>
</head>
<body>
<div>
<input type="file" id="files" multiple />
</div>
<div id="progressbar"></div>
<script language="javascript">
var files;
var percentage = 0;
var bar = new ProgressBar.Line(progressbar, {
strokeWidth: 4,
easing: 'easeInOut',
duration: 1400,
color: '#FFEA82',
trailColor: '#eee',
trailWidth: 1,
svgStyle: {width: '100%', height: '100%'},
text: {
style: {
// Text color.
// Default: same as stroke color (options.color)
color: '#999',
position: 'absolute',
right: '0',
top: '30px',
padding: 0,
margin: 0,
transform: null
},
autoStyleContainer: false
},
from: {color: '#FFEA82'},
to: {color: '#ED6A5A'},
step: (state, bar) => {
bar.setText(Math.round(bar.value() * 100) + ' %');
}
});
var _e_ = new Evaporate({
signerUrl: 'http://internal-video-acquisition-api-dev-822433461.us-east-1.elb.amazonaws.com/s3sign',
aws_key: 'AKIAI77EV6XS2D35NR6Q',
bucket: 'nyt-video-acquisition-api-dev'
});
$('#files').change(function(evt){
files = evt.target.files;
for (var i = 0; i < files.length; i++){
console.log(files[i]);
// _e_.add({
// name: "output_" + files[i].name,
// file: files[i],
// complete: function(){
// console.warn('complete................yay!');
// },
// progress: function(progress){
// now = new Date()
// new_percentage = Math.trunc(progress*100)
// if (new_percentage != percentage) {
// console.warn(String(now) + 'Progress: ' + percentage + "%");
// percentage = new_percentage
// bar.animate(progress);
// }
// }
// });
}
$(evt.target).val('');
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment