First post. ¯\_(ツ)_/¯

master
Ryan Rix 2016-06-13 01:46:12 +00:00
commit 2751ce4486
5 changed files with 148 additions and 0 deletions

8
browser-matrix-0.5.3.min.js vendored Normal file

File diff suppressed because one or more lines are too long

15
index.html Normal file
View File

@ -0,0 +1,15 @@
<html xmlns:svg="http://www.w3.org/2000/svg">
<head>
<title>Nervewire Image Deck</title>
<link href="nervewire.css" rel="stylesheet" type="text/css">
</head>
<body id="body">
<div id="nervewire"
display="block"
style="width:100%;height:100%">
</div>
<script src="./browser-matrix-0.5.3.min.js"></script>
<script src="./token.js"></script>
<script src="./nervewire.js"></script>
</body>
</html>

19
nervewire.css Normal file
View File

@ -0,0 +1,19 @@
.image {
animation-duration: 3s;
animation-name: image-appear;
position: absolute;
filter: grayscale(0) blur(0) opacity(1);
-webkit-filter: grayscale(0) blur(0) opacity(1);
}
body {
background-color: #2a2a2a;
overflow: hidden;
}
@keyframes image-appear {
0% {
-webkit-filter: grayscale(0.5) blur(10px) opacity(0);
filter: grayscale(0.5) blur(10px) opacity(0);
}
}

103
nervewire.js Normal file
View File

@ -0,0 +1,103 @@
var elements = [];
var maxElements = 50;
var appendElement = function appendElement(element) {
elements.push({
el:element,
haveDrawn: false
});
while (elements.length > maxElements) {
delete elements.shift();
}
setTimeout(function() {
drawElement(elements[0]);
}, 0);
}
var canvas = document.getElementById('nervewire');
var canvasW = canvas.scrollWidth;
var canvasH = canvas.scrollHeight;
var drawElement = function drawElement(element) {
try {
var dw = Math.floor(Math.random() * canvasW) - 200;
var dh = Math.floor(Math.random() * canvasH) - 200;
var e = element.el;
e.style = "transform: translate(" + dw + "px, " + dh + "px);";
element.haveDrawn = true;
canvas.appendChild(e);
}
catch (e) {
animListener()
console.log(e)
}
}
var animListener = function animListener(e) {
// find next undrawn element
for (element in elements) {
if (elements[element].haveDrawn == false ) {
setTimeout(function() {
drawElement(elements[element]);
}, 0);
break;
}
}
}
var mxcToUrl = function mxcToUrl(mxc) {
var parts = mxc.split("/");
var finalString = homeserverURL + "/_matrix/media/v1/download/" + parts[2] + "/" + parts[3]
return finalString;
}
var handleEvent = function handleEvent(event) {
// event is https://matrix-org.github.io/matrix-js-sdk/0.5.3/module-models_event.MatrixEvent.html
console.log(event.event);
var m_event = event.event;
var element = null;
if (m_event.type === "m.room.message") {
if(m_event.content.msgtype === "m.image") {
element = mkImageElement(m_event);
}
else if (m_event.content.msgtype === "m.text") {
element = mkTextElement(m_event);
}
}
if (element) {
appendElement(element);
}
}
var mkImageElement = function mkImageElement(event) {
var imageUrl = mxcToUrl(event.content.url);
var aTag = document.createElement('a');
aTag.setAttribute('href', imageUrl);
aTag.setAttribute('class', 'image');
aTag.setAttribute('target', '_blank');
aTag.addEventListener("animationend", animListener, false);
var image = new Image()
image.src = imageUrl;
aTag.appendChild(image);
return aTag;
}
var mkTextElement = function mkTextElement(event) {
return {};
}
var client = matrixcs.createClient({
baseUrl: homeserverURL,
accessToken: accessToken,
userId: userId
});
client.on("event", handleEvent);
client.startClient({
initialSyncLimit: 100
});

3
token.js Normal file
View File

@ -0,0 +1,3 @@
var userId = "@test:example.com";
var accessToken = "fblasfkjdsofidsof";
var homeserverURL = "https://matrix.org/"