PairDrop/app/elements/file-sharing/file-receiver.html
Robin Linus 78dd776426 Rename global variable 'Chat' to 'Snapdrop'
Initially a lot of code was copied from another project. This lead to confusing naming conventions.
2016-10-17 01:40:50 +02:00

100 lines
4.2 KiB
HTML

<link rel="import" href="../../bower_components/paper-dialog/paper-dialog.html">
<link rel="import" href="../../bower_components/paper-button/paper-button.html">
<link rel="import" href="../../bower_components/neon-animation/animations/scale-up-animation.html">
<link rel="import" href="../../bower_components/neon-animation/animations/fade-out-animation.html">
<link rel="import" href="../../bower_components/iron-pages/iron-pages.html">
<link rel="import" href="../../bower_components/paper-spinner/paper-spinner.html">
<link rel="import" href="../sound-notification/sound-notification-behavior.html">
<dom-module id="file-receiver">
<template>
<style>
:host {
display: block;
}
#dialog,
#download {
width: 324px;
z-index: 101;
margin: 16px;
}
.filename {
word-break: break-all;
word-break: break-word;
}
</style>
<paper-dialog id="dialog" entry-animation="scale-up-animation" exit-animation="fade-out-animation" with-backdrop modal>
<h2>Download File</h2>
<p><b class="filename">{{file.name}}</b></p>
<div class="buttons">
<paper-button dialog-dismiss on-tap="_decline">Ignore</paper-button>
<paper-button dialog-confirm on-tap="_accept" autofocus>Download</paper-button>
</div>
</paper-dialog>
<paper-dialog id="download" entry-animation="scale-up-animation" exit-animation="fade-out-animation" with-backdrop modal>
<h2>File Received</h2>
<p>Open File or Right Click and "Save as"...</p>
<div class="buttons">
<paper-button dialog-dismiss>Discard</paper-button>
<a href="{{dataUri}}" target="_blank">
<paper-button dialog-confirm autofocus>Open File</paper-button>
</a>
</div>
</paper-dialog>
</template>
<script>
'use strict';
(function() {
Polymer({
is: 'file-receiver',
behaviors: [Snapdrop.SoundNotificationBehavior],
attached: function() {
this.async(function() {
app.conn.addEventListener('file-offer', function(e) {
this.file = e.detail;
this.$.dialog.open();
this.playSound();
}.bind(this), false);
app.conn.addEventListener('file-received', function(e) {
this._fileReceived(e.detail);
}.bind(this), false);
app.conn.addEventListener('file-declined', function(e) {
app.displayToast('User declined file ' + e.detail.name);
}.bind(this), false);
app.conn.addEventListener('upload-complete', function(e) {
app.displayToast('User received file ' + e.detail.name);
}.bind(this), false);
app.conn.addEventListener('upload-error', function(e) {
app.displayToast('The other device did not respond. Please try again.');
}.bind(this), false);
}, 200);
},
_fileReceived: function(file) {
this.downloadURI(file);
},
_decline: function() {
app.conn.decline(this.file);
},
_accept: function() {
app.conn.accept(this.file);
},
downloadURI: function(file) {
var link = document.createElement('a');
var uri = (window.URL || window.webkitURL).createObjectURL(file.blob);
if (typeof link.download !== 'undefined') {
//download attribute is supported
link.href = uri;
link.download = file.name || 'blank';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
} else {
this.dataUri = uri;
this.$.download.open();
}
}
});
}());
</script>
</dom-module>