mirror of
https://github.com/schlagmichdoch/PairDrop.git
synced 2025-04-24 00:36:17 -04:00
Squashed commit of the following:
commit 5b7ac6f0f56f3888c01049f08b6b47dbeb3bcfb0 Author: Robin Linus <robin_woll@capira.de> Date: Wed Dec 30 18:06:48 2015 +0100 Clean up about and social links commit 9c7da37d1e8f58f1c45626289fbab336fc982a0f Author: Robin Linus <robin_woll@capira.de> Date: Wed Dec 30 18:06:35 2015 +0100 Change Slogan commit fcea5cfb5c6928acabce44caacc1d75fafdab447 Author: Robin Linus <robin_woll@capira.de> Date: Wed Dec 30 18:06:22 2015 +0100 Add shorturl commit f09e9e42c30aa7b26df2a5fb00bec653f3ad68e1 Author: Robin Linus <robin_woll@capira.de> Date: Wed Dec 30 16:56:55 2015 +0100 initial
This commit is contained in:
parent
1bce467a7c
commit
e756a3fd0c
11 changed files with 278 additions and 128 deletions
|
@ -41,9 +41,18 @@
|
|||
|
||||
.explanation {
|
||||
@apply(--paper-font-headline);
|
||||
color: #4285f4;
|
||||
color: #4E4E4E;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.short {
|
||||
@apply(--paper-font-body1);
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.url {
|
||||
color: #4285f4;
|
||||
}
|
||||
</style>
|
||||
<div class="buddies">
|
||||
<template is="dom-repeat" items="{{buddies}}">
|
||||
|
@ -53,7 +62,8 @@
|
|||
</template>
|
||||
</div>
|
||||
<div hidden$="{{buddies.0}}" class="explanation">
|
||||
Open this page on other devices<br> to send files.
|
||||
Open <span class="url">dropc.at</span> on other devices
|
||||
<br> to send files.
|
||||
</div>
|
||||
<personal-avatar class="me"></personal-avatar>
|
||||
</template>
|
||||
|
|
|
@ -26,7 +26,7 @@
|
|||
</style>
|
||||
<iron-icon icon="chat:wifi-tethering"></iron-icon>
|
||||
<div class="paper-font-body1">
|
||||
Snapdrop lets you share instantly with people near by.
|
||||
The easiest way to transfer files across devices.
|
||||
</div>
|
||||
<div class="paper-font-body1 discover">
|
||||
Allow me to be discovered by: Everyone in this network.
|
||||
|
|
|
@ -8,7 +8,7 @@
|
|||
-->
|
||||
<!-- Add your elements here -->
|
||||
<link rel="import" href="../styles/app-theme.html">
|
||||
<link rel="import" href="x-cards/x-card.html">
|
||||
<link rel="import" href="x-cards/about-page.html">
|
||||
<link rel="import" href="x-cards/x-cards.html">
|
||||
<link rel="import" href="buddy-finder/buddy-finder.html">
|
||||
<link rel="import" href="p2p-network/connection-wrapper.html">
|
||||
|
|
45
app/elements/invitation-link/invitation-link-behavior.html
Normal file
45
app/elements/invitation-link/invitation-link-behavior.html
Normal file
|
@ -0,0 +1,45 @@
|
|||
<script>
|
||||
'use strict';
|
||||
window.Chat = window.Chat || {};
|
||||
Chat.InvitationLinkBehavior = {
|
||||
properties: {
|
||||
contact: {
|
||||
type: String
|
||||
}
|
||||
},
|
||||
_copy: function(e) {
|
||||
if (e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
}
|
||||
Polymer.Base.create('textarea');
|
||||
var copyTextarea = this.textarea;
|
||||
copyTextarea.value = this.link;
|
||||
copyTextarea.select();
|
||||
try {
|
||||
var successful = document.execCommand('copy');
|
||||
if (successful) {
|
||||
app.displayToast('Copied invitation link to clipboard. Share it to send files to friends!');
|
||||
}
|
||||
} catch (err) {
|
||||
console.log('Oops, unable to copy', err);
|
||||
}
|
||||
copyTextarea.blur();
|
||||
},
|
||||
get link() {
|
||||
return 'http://' + window.location.host + '/' + this.contact;
|
||||
},
|
||||
get textarea() {
|
||||
var textarea = document.querySelector('#copytextarea');
|
||||
if (!textarea) {
|
||||
textarea = Polymer.Base.create('textarea');
|
||||
textarea.id = 'copytextarea';
|
||||
var style = textarea.style;
|
||||
style.position = 'absolute';
|
||||
style.top = '-10000px';
|
||||
document.body.appendChild(textarea);
|
||||
}
|
||||
return textarea;
|
||||
}
|
||||
};
|
||||
</script>
|
29
app/elements/invitation-link/invitation-link.html
Normal file
29
app/elements/invitation-link/invitation-link.html
Normal file
|
@ -0,0 +1,29 @@
|
|||
<link rel="import" href="invitation-link-behavior.html">
|
||||
<link rel="import" href="../../bower_components/paper-tooltip/paper-tooltip.html">
|
||||
<dom-module id="invitation-link">
|
||||
<template>
|
||||
<style>
|
||||
:host {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 16px;
|
||||
left: 16px;
|
||||
z-index: 3;
|
||||
}
|
||||
</style>
|
||||
<paper-icon-button icon="chat:share" on-tap="_copy" id="btn"></paper-icon-button>
|
||||
<paper-tooltip
|
||||
for="btn"
|
||||
position="bottom"
|
||||
offset="14">
|
||||
Get an Invitation Link to send files accross different networks.
|
||||
</paper-tooltip>
|
||||
</template>
|
||||
<script>
|
||||
'use strict';
|
||||
Polymer({
|
||||
is: 'invitation-link',
|
||||
behaviors: [Chat.InvitationLinkBehavior]
|
||||
});
|
||||
</script>
|
||||
</dom-module>
|
|
@ -23,47 +23,49 @@
|
|||
}.bind(this);
|
||||
},
|
||||
initialize: function() {
|
||||
var options;
|
||||
if (window.debug) {
|
||||
options = {
|
||||
host: window.location.hostname,
|
||||
port: 3002,
|
||||
path: 'peerjs'
|
||||
};
|
||||
} else {
|
||||
options = {
|
||||
host: 'snapdrop.net',
|
||||
port: 443,
|
||||
path: 'peerjs',
|
||||
secure: true
|
||||
};
|
||||
}
|
||||
this._peer = new Peer(this.me, options);
|
||||
this._peer.on('open', function(id) {
|
||||
console.log('My peer ID is: ' + id);
|
||||
this.set('me', id);
|
||||
this._peerOpen = true;
|
||||
this._initCallbacks.forEach(function(cb) {
|
||||
cb();
|
||||
});
|
||||
}.bind(this));
|
||||
if (window.isActive) {
|
||||
clearInterval(this.reconnectTimer);
|
||||
this.reconnectTimer = undefined;
|
||||
var options;
|
||||
if (window.debug) {
|
||||
options = {
|
||||
host: window.location.hostname,
|
||||
port: 3002,
|
||||
path: 'peerjs'
|
||||
};
|
||||
} else {
|
||||
options = {
|
||||
host: 'snapdrop.net',
|
||||
port: 443,
|
||||
path: 'peerjs',
|
||||
secure: true
|
||||
};
|
||||
}
|
||||
this._peer = new Peer(this.me, options);
|
||||
this._peer.on('open', function(id) {
|
||||
console.log('My peer ID is: ' + id);
|
||||
this.set('me', id);
|
||||
this._peerOpen = true;
|
||||
this._initCallbacks.forEach(function(cb) {
|
||||
cb();
|
||||
});
|
||||
}.bind(this));
|
||||
|
||||
this._peer.on('connection', this.connect.bind(this));
|
||||
this._peer.on('error', function(err) {
|
||||
console.error(err);
|
||||
//ugly hack to find out error type
|
||||
if (err.message.indexOf('Could not connect to peer') > -1) {
|
||||
delete this._connectedPeers[this.peer];
|
||||
this.set('peer', 'error');
|
||||
return;
|
||||
}
|
||||
if (err.message.indexOf('Lost connection to server') > -1) {
|
||||
this._peer.destroy();
|
||||
this.set('me', this.me);
|
||||
this.async(this._initialize, 3000);
|
||||
return;
|
||||
}
|
||||
}.bind(this));
|
||||
this._peer.on('connection', this.connect.bind(this));
|
||||
this._peer.on('error', function(err) {
|
||||
console.error(err);
|
||||
//ugly hack to find out error type
|
||||
if (err.message.indexOf('Could not connect to peer') > -1) {
|
||||
delete this._connectedPeers[this.peer];
|
||||
return;
|
||||
}
|
||||
if (err.message.indexOf('Lost connection to server') > -1) {
|
||||
this._peer.destroy();
|
||||
this._reconnect();
|
||||
return;
|
||||
}
|
||||
}.bind(this));
|
||||
}
|
||||
},
|
||||
|
||||
connect: function(c) {
|
||||
|
@ -145,7 +147,7 @@
|
|||
conns.forEach(function(conn) {
|
||||
if (conn.label === 'file') {
|
||||
conn.send(file);
|
||||
console.log('file send via WebRTC');
|
||||
console.log('send file via WebRTC');
|
||||
}
|
||||
}.bind(this));
|
||||
}
|
||||
|
@ -159,6 +161,12 @@
|
|||
}
|
||||
}.bind(this));
|
||||
}
|
||||
},
|
||||
_reconnect: function(e) {
|
||||
//try to reconnect after 3s
|
||||
if (!this.reconnectTimer) {
|
||||
this.reconnectTimer = setInterval(this.initialize.bind(this), 3000);
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
|
25
app/elements/p2p-network/tab-active.html
Normal file
25
app/elements/p2p-network/tab-active.html
Normal file
|
@ -0,0 +1,25 @@
|
|||
<script>
|
||||
'use strict';
|
||||
var vis = (function() {
|
||||
var stateKey,
|
||||
eventKey,
|
||||
keys = {
|
||||
hidden: "visibilitychange",
|
||||
webkitHidden: "webkitvisibilitychange",
|
||||
mozHidden: "mozvisibilitychange",
|
||||
msHidden: "msvisibilitychange"
|
||||
};
|
||||
for (stateKey in keys) {
|
||||
if (stateKey in document) {
|
||||
eventKey = keys[stateKey];
|
||||
break;
|
||||
}
|
||||
}
|
||||
return function(c) {
|
||||
if (c) {
|
||||
document.addEventListener(eventKey, c);
|
||||
}
|
||||
return !document[stateKey];
|
||||
};
|
||||
})();
|
||||
</script>
|
|
@ -9,55 +9,68 @@
|
|||
</template>
|
||||
<script>
|
||||
'use strict';
|
||||
window.isActive = true;
|
||||
|
||||
window.onfocus = function() {
|
||||
window.isActive = true;
|
||||
};
|
||||
|
||||
window.onblur = function() {
|
||||
window.isActive = false;
|
||||
};
|
||||
|
||||
Polymer({
|
||||
is: 'web-socket',
|
||||
attached: function() {
|
||||
this.init();
|
||||
},
|
||||
init: function() {
|
||||
var websocketUrl = (window.debug ? 'ws://' + window.location.hostname + ':3002' : 'wss://snapdrop.net') + '/binary';
|
||||
this.client = new BinaryClient(websocketUrl);
|
||||
this.client.on('stream', function(stream, meta) {
|
||||
// collect stream data
|
||||
var parts = [];
|
||||
stream.on('data', function(data) {
|
||||
//console.log('part received', meta, data);
|
||||
if (data.isSystemEvent) {
|
||||
if (meta) {
|
||||
data.from = meta.from;
|
||||
if (window.isActive) {
|
||||
clearInterval(this.reconnectTimer);
|
||||
this.reconnectTimer = undefined;
|
||||
var websocketUrl = (window.debug ? 'ws://' + window.location.hostname + ':3002' : 'wss://snapdrop.net') + '/binary';
|
||||
this.client = new BinaryClient(websocketUrl);
|
||||
this.client.on('stream', function(stream, meta) {
|
||||
// collect stream data
|
||||
var parts = [];
|
||||
stream.on('data', function(data) {
|
||||
//console.log('part received', meta, data);
|
||||
if (data.isSystemEvent) {
|
||||
if (meta) {
|
||||
data.from = meta.from;
|
||||
}
|
||||
this.fire('system-event', data);
|
||||
} else {
|
||||
parts.push(data);
|
||||
}
|
||||
this.fire('system-event', data);
|
||||
} else {
|
||||
parts.push(data);
|
||||
}
|
||||
}.bind(this));
|
||||
// when finished, set it as the background image
|
||||
stream.on('end', function() {
|
||||
var blob = new Blob(parts, {
|
||||
type: meta.type
|
||||
});
|
||||
console.log('file received', blob, meta);
|
||||
this.fire('file-received', {
|
||||
blob: blob,
|
||||
name: meta.name,
|
||||
from: meta.from
|
||||
});
|
||||
}.bind(this));
|
||||
}.bind(this));
|
||||
// when finished, set it as the background image
|
||||
stream.on('end', function() {
|
||||
var blob = new Blob(parts, {
|
||||
type: meta.type
|
||||
});
|
||||
console.log('file received', blob, meta);
|
||||
this.fire('file-received', {
|
||||
blob: blob,
|
||||
name: meta.name,
|
||||
from: meta.from
|
||||
this.client.on('open', function(e) {
|
||||
console.log(e);
|
||||
this.client.send({}, {
|
||||
serverMsg: 'rtc-support',
|
||||
rtc: window.webRTCSupported
|
||||
});
|
||||
}.bind(this));
|
||||
}.bind(this));
|
||||
this.client.on('open', function(e) {
|
||||
this.cancelAsync(this.reconnectTimer);
|
||||
console.log(e);
|
||||
this.client.send({}, {
|
||||
serverMsg: 'rtc-support',
|
||||
rtc: window.webRTCSupported
|
||||
});
|
||||
}.bind(this));
|
||||
this.client.on('error', function(e) {
|
||||
this._reconnect(e);
|
||||
}.bind(this));
|
||||
this.client.on('close', function(e) {
|
||||
this._reconnect(e);
|
||||
}.bind(this));
|
||||
this.client.on('error', function(e) {
|
||||
this._reconnect(e);
|
||||
}.bind(this));
|
||||
this.client.on('close', function(e) {
|
||||
this._reconnect(e);
|
||||
}.bind(this));
|
||||
}
|
||||
},
|
||||
_sendFile: function(toPeer, file) {
|
||||
console.log('send file via WebSocket', file);
|
||||
|
@ -80,7 +93,9 @@
|
|||
_reconnect: function(e) {
|
||||
console.log('disconnected', e);
|
||||
//try to reconnect after 3s
|
||||
this.reconnectTimer = this.async(this.init, 3000);
|
||||
if (!this.reconnectTimer) {
|
||||
this.reconnectTimer = setInterval(this.init.bind(this), 3000);
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
<link rel="import" href="../../bower_components/neon-animation/neon-animations.html">
|
||||
<link rel="import" href="../../bower_components/paper-styles/paper-styles-classes.html">
|
||||
<link rel="import" href="../../bower_components/iron-icon/iron-icon.html">
|
||||
<dom-module id="x-card">
|
||||
<dom-module id="about-page">
|
||||
<template>
|
||||
<style>
|
||||
:host {
|
||||
|
@ -18,13 +18,12 @@
|
|||
background-color: #4285f4;
|
||||
@apply(--layout-fit);
|
||||
}
|
||||
|
||||
paper-icon-button {
|
||||
/* paper-icon-button {
|
||||
position: absolute;
|
||||
top: 16px;
|
||||
right: 16px;
|
||||
z-index: 2;
|
||||
}
|
||||
}*/
|
||||
|
||||
#container {
|
||||
@apply(--layout-fit);
|
||||
|
@ -34,17 +33,16 @@
|
|||
padding: 64px 32px 64px 32px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
|
||||
.logo {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
.slogan{
|
||||
.slogan {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
.paper-font-headline {
|
||||
margin-bottom: 8px;
|
||||
font-size: 32px;
|
||||
|
@ -87,24 +85,74 @@
|
|||
a.paper-font-subhead {
|
||||
padding-top: 32px;
|
||||
}
|
||||
|
||||
.share {
|
||||
position: absolute;
|
||||
top: 16px;
|
||||
right: 16px;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
#btn,
|
||||
.share a {
|
||||
color: #52524F;
|
||||
}
|
||||
|
||||
.share a {
|
||||
text-decoration: none;
|
||||
padding-left: 8px;
|
||||
padding-right: 8px;
|
||||
}
|
||||
|
||||
.share a:hover,
|
||||
#btn:hover {
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
<paper-icon-button id="btn" icon="chat:close" on-tap="_switch"></paper-icon-button>
|
||||
<div id="placeholder"></div>
|
||||
<div id="container">
|
||||
<div class="share">
|
||||
<a href="https://twitter.com/snapdrop42" target="_blank">
|
||||
<iron-icon icon="chat:twitter"></iron-icon>
|
||||
<paper-tooltip for="" position="bottom" offset="14">
|
||||
Contact us on Twitter!
|
||||
</paper-tooltip>
|
||||
</a>
|
||||
<a href="https://www.facebook.com/snapdrop.net/" target="_blank">
|
||||
<iron-icon icon="chat:facebook"></iron-icon>
|
||||
<paper-tooltip for="" position="bottom" offset="14">
|
||||
Contact us on Facebook!
|
||||
</paper-tooltip>
|
||||
</a>
|
||||
<a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=FDAHZJH3228D6" target="_blank">
|
||||
<iron-icon icon="chat:local-cafe"></iron-icon>
|
||||
<paper-tooltip for="" position="bottom" offset="14">
|
||||
You like Snapdrop?
|
||||
<br> Buy me a cup of coffee!
|
||||
</paper-tooltip>
|
||||
</a>
|
||||
<a href="https://github.com/capira12/snapdrop" target="_blank" class="github">
|
||||
<iron-icon icon="chat:github"></iron-icon>
|
||||
<paper-tooltip for="" position="bottom" offset="14">
|
||||
Get involved!
|
||||
</paper-tooltip>
|
||||
</a>
|
||||
<paper-icon-button id="btn" icon="chat:close" on-tap="_switch"></paper-icon-button>
|
||||
</div>
|
||||
<div class="center">
|
||||
<iron-icon icon="chat:wifi-tethering" class="logo"></iron-icon>
|
||||
<div class="paper-font-headline">Snapdrop</div>
|
||||
<div class="slogan">The easiest way to transfer files accross devices.</div>
|
||||
<div class="slogan">The easiest way to transfer files across devices.</div>
|
||||
<a class="paper-font-subhead" href="https://github.com/capira12/snapdrop/blob/master/faq.md" target="_blank">Frequently Asked Questions</a>
|
||||
</div>
|
||||
<span id="footer">Built with ♥ by <a href="https://twitter.com/snapdrop42" target="_blank">Robin Linus</a></span>
|
||||
<span id="footer">Built with ♥ by <a href="https://twitter.com/capira42" target="_blank">Robin Linus</a></span>
|
||||
</div>
|
||||
</template>
|
||||
</dom-module>
|
||||
<script>
|
||||
(function() {
|
||||
Polymer({
|
||||
is: 'x-card',
|
||||
is: 'about-page',
|
||||
behaviors: [
|
||||
Polymer.NeonSharedElementAnimatableBehavior
|
||||
],
|
|
@ -47,40 +47,10 @@
|
|||
color: #4285f4;
|
||||
}
|
||||
|
||||
@media all and (max-height: 640px) {
|
||||
.github {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<div id="placeholder"></div>
|
||||
<div id="container">
|
||||
<div class="share">
|
||||
<a href="https://twitter.com/snapdrop42" target="_blank">
|
||||
<iron-icon icon="chat:twitter"></iron-icon>
|
||||
<paper-tooltip for="" position="bottom" offset="14">
|
||||
Contact us on Twitter!
|
||||
</paper-tooltip>
|
||||
</a>
|
||||
<a href="https://www.facebook.com/snapdrop.net/" target="_blank">
|
||||
<iron-icon icon="chat:facebook"></iron-icon>
|
||||
<paper-tooltip for="" position="bottom" offset="14">
|
||||
Like us on Facebook!
|
||||
</paper-tooltip>
|
||||
</a>
|
||||
<a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=FDAHZJH3228D6" target="_blank">
|
||||
<iron-icon icon="chat:local-cafe"></iron-icon>
|
||||
<paper-tooltip for="" position="bottom" offset="14">
|
||||
You like Snapdrop?
|
||||
<br> Buy me a cup of coffee!
|
||||
</paper-tooltip>
|
||||
</a>
|
||||
<a href="https://github.com/capira12/snapdrop" target="_blank" class="github">
|
||||
<iron-icon icon="chat:github" ></iron-icon>
|
||||
<paper-tooltip for="" position="bottom" offset="14">
|
||||
Get involved!
|
||||
</paper-tooltip>
|
||||
</a>
|
||||
<paper-icon-button id="btn" icon="chat:info-outline" on-tap="_switch"></paper-icon-button>
|
||||
</div>
|
||||
<content select="div"></content>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue