1
0
mirror of https://github.com/bigchaindb/site.git synced 2024-12-24 02:16:10 +01:00

use a nyan cat gif and be done with it

This commit is contained in:
Matthias Kretschmann 2017-06-28 00:45:26 +02:00
parent 34fac3a543
commit 322fc2a71b
Signed by: m
GPG Key ID: 606EEEF3C479A91F
7 changed files with 28 additions and 146 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 38 KiB

View File

@ -1,97 +0,0 @@
// https://codepen.io/brunorcunha/pen/wikEI
// highly modified
// var posX = 100,
// posY = 100,
// px = 0,
// py = 0,
// an = false;
var nyan = $('.nyan');
var nyanToAppend = $('.nyan-container')
//var rainbow = null;
var altura = 800;
var largura = parseInt(nyanToAppend.width());
var tamanhoTela = parseInt(largura / 9);
var pilha = [];
function getRandomInt(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}
function criarEstrela() {
var rand = getRandomInt(3, 14);
var tempoDeVida = getRandomInt(5, 10);
var star = $('<div class="star"/>').css({
width: rand + 'px',
height: rand + 'px',
left: largura - 10 + 'px',
top: Math.floor((Math.random() * altura) + 1),
'-webkit-transition': 'all ' + tempoDeVida + 's linear',
'-webkit-transform': 'translate(0px, 0px)'
});
nyanToAppend.append(star);
window.setTimeout(function() {
star.css({
'-webkit-transform': 'translate(-' + largura + 'px, 0px)'
});
}, getRandomInt(5, 10) * 10);
window.setTimeout(function() {
star.remove();
}, tempoDeVida * 1000);
}
// function moveNyan() {
// var tamX = nyan.width() / 2,
// tamY = nyan.height() / 2;
// px += (posX - px - tamX) / 50;
// py += (posY - py - tamY) / 50;
//
// nyan.css({
// left: px + 'px',
// top: py + 'px'
// });
// }
// function peidaArcoIris() {
// var qnt = Math.floor(nyan.position().left / 9) + 2;
//
// if (pilha.length >= qnt)
// pilha.pop();
//
// pilha.unshift(py);
//
// rainbow.hide();
// for (var i = 0; i < qnt; i++) {
// var am = (i % 2);
// if (an)
// am = (i % 2)
// ? 0
// : 1;
//
// rainbow.eq(qnt - i).css({
// top: pilha[i] + am
// }).show();
// }
// }
// window.setInterval(function() {
// moveNyan();
// peidaArcoIris();
// }, 10);
window.setInterval(function() {
criarEstrela();
}, 300);
// window.setInterval(function() {
// an = !an;
// }, 500);
// var frame = 0;
// window.setInterval(function() {
// nyan.css({
// 'background-position': 34 *frame + 'px'
// });
// frame++;
// }, 100);

View File

@ -85,12 +85,14 @@ window.addEventListener('DOMContentLoaded', function domload(event) {
const waiting = document.getElementsByClassName('waiting')[0]
const responseArea = document.getElementsByClassName('response')[0]
const output = document.getElementsByClassName('output')[0]
const messageInitial = document.getElementsByClassName('message')[0]
const messageSuccess = document.getElementsByClassName('message--success')[0]
const messageFail = document.getElementsByClassName('message--fail')[0]
const transactionLink = document.getElementsByClassName('transaction-link')[0]
conn.postTransaction(txSigned).then((response) => {
waiting.classList.add('hide')
messageInitial.classList.add('hide')
responseArea.classList.remove('hide')
messageSuccess.classList.remove('hide')
@ -104,7 +106,7 @@ window.addEventListener('DOMContentLoaded', function domload(event) {
postButton.classList.add('disabled')
postButton.style.opacity = 0
//=include bigchain/nyan.js
responseArea.children[0].classList.add('nyan')
}, reason => { // Error!
console.log(reason)

View File

@ -59,7 +59,6 @@
pre {
min-height: 340px;
border: 1px solid $gray-dark;
background: none;
line-height: 1.3;
}

View File

@ -1,54 +1,33 @@
// https://codepen.io/brunorcunha/pen/wikEI
// highly modified
$red: #f80e1c;
$orange: #fc9729;
$yellow: #fffd38;
$green: #32fa2e;
$blue: #1998f3;
$violet: #6d2fee;
.nyan-container {
position: relative;
overflow: hidden;
}
.nyan {
z-index: 10;
position: absolute;
width: 34px;
height: 33px;
left: 50%;
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMwAAAAgCAYAAABepJcLAAACiUlEQVR4nO2Yi23DMAxEvVMW6Ghdwzt1p7Qp4sKhKIkUqVyUXtEHBIlsPZ9J+bN9fG4bIcQGXICQlYALELIScAFCVgIuQMhKwAUIWQnboG27RkmRpQc9wB4mievXHiYaCj3o8QoePomffzcJodCDHq/iYRepTXTZ9c+KTEog9KAH0MMm0pvI2MHhQOhBjwSP7f680vM4xo03TIdC5CzeEcn0KFwqHl4XeqxfH7ex+77/0spDjktvGFVE6dyaSPaJqbqIE+Nxocf69XHefysPOeahYQ7RA7PIqTOjIqFAxCW46aKcmLQCocf0+pA1GvU45jmj/V40jNw42rlekVAgk1wyV/aVPeTYjJV9JAtZp1kePdSG0ZpGFak8UEVF3IE0HuwyXMyF+uYecltZ5Mj68HqMOBR5yFVECnU791JeSoe71xOI4pEVSq1I0R6IPGRdIOtDa+BjzIjH7a/mJn8rGqbWNH8ijhVsRMQciOGVYaZLtXEBHsg8ZA6o+sisU20xOB9bt2G0YCz3hhki5kCe4KJtg/AIraiTzo37SjfJIeJxvaM1bNHAd6oNY74FUd48RESGA6m8EQqFUjnBSA/zQjbBY+jlwxPqI8NDZiw/mxvmQaRzucsQyfDIdJEFivCQY5B5vFt91BaiM2r2ZpHOJS8qkuUx0wXhcfyO9mjegQDrw+uhubQosjffDhmIiLhDAbjQQ7/6orI49jeah4VizpaIZTUYxdMsMz1GXJAe6DzO8yOzmOXRa1bzSdG+t2xr3c5aIJ79vaML2gE9P9qjusMz2ve9g6lt6ynQ1pwZLl6fV3BBO6Dnz9hP5BhcxUvIfwcuQMhKwAUIWQm4ACErARcgZCXgAoSsxDdoVHw2ca8RoAAAAABJRU5ErkJggg==');
position: relative;
background: rgba(#144f8d, .5);
// rainbow
&:before {
content: '';
position: absolute;
left: 0;
right: 0;
top: 50%;
margin-top: -9px;
margin-right: 34px;
width: 750%;
height: 18px;
background: linear-gradient(to bottom, $red 16%, $orange 16%, $orange 32%, $yellow 32%, $yellow 48%, $green 48%, $green 64%, $blue 64%, $blue 80%, $violet 80%);
top: 0;
bottom: 0;
background: url('../img/nyan2.gif') no-repeat left center;
background-size: 50%;
z-index: 0;
opacity: 0;
animation: nyan-fadein .6s ease-out forwards;
}
code {
position: relative;
z-index: 2;
}
}
@keyframes nyan-fadein {
0% {
opacity: 0;
}
100% {
opacity: .4;
z-index: -1;
}
animation: nyan .6s steps(6, end) infinite;
}
@keyframes nyan {
to {
background-position: -204px center;
}
}
.star {
width: 7px;
height: 7px;
position: absolute;
z-index: 1;
background-size: 100% 100%;
background-image: url('data:image/gif;base64,R0lGODlhBwAHAIABAP///////yH/C05FVFNDQVBFMi4wAwEAAAAh/wtYTVAgRGF0YVhNUDw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjU0NTY1ODg4RDlBODExRTI5MzZGQjVEN0ZDMUFENjhCIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjU0NTY1ODg5RDlBODExRTI5MzZGQjVEN0ZDMUFENjhCIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NTQ1NjU4ODZEOUE4MTFFMjkzNkZCNUQ3RkMxQUQ2OEIiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NTQ1NjU4ODdEOUE4MTFFMjkzNkZCNUQ3RkMxQUQ2OEIiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4B//79/Pv6+fj39vX08/Lx8O/u7ezr6uno5+bl5OPi4eDf3t3c29rZ2NfW1dTT0tHQz87NzMvKycjHxsXEw8LBwL++vby7urm4t7a1tLOysbCvrq2sq6qpqKempaSjoqGgn56dnJuamZiXlpWUk5KRkI+OjYyLiomIh4aFhIOCgYB/fn18e3p5eHd2dXRzcnFwb25tbGtqaWhnZmVkY2JhYF9eXVxbWllYV1ZVVFNSUVBPTk1MS0pJSEdGRURDQkFAPz49PDs6OTg3NjU0MzIxMC8uLSwrKikoJyYlJCMiISAfHh0cGxoZGBcWFRQTEhEQDw4NDAsKCQgHBgUEAwIBAAAh+QQJFAABACwAAAAABwAHAAACB4yPqQfrXwAAIfkEBRQAAQAsAAAAAAcABwAAAgmMj2mQzPiUNAUAIfkECRQAAQAsAQABAAUABQAAAgdMYGm4mlwAACH5BAkUAAEALAAAAAAHAAcAAAILjGEZqA0IWUuSpgIAIfkECRQAAQAsAAAAAAcABwAAAgqMYZeYzdscnKEAACH5BAUUAAEALAAAAAAHAAcAAAIJjGGpm6jO4kkFADs=');
}

View File

@ -52,8 +52,7 @@ redirect_from:
</div>
<div class="response highlight hide">
<pre class="nyan-container">
<div class="nyan"></div>
<pre>
<code class="output language-json">{
"asset": {
"data": {