zervo/bitaddress.org
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Wallet design update.

Browse source
This commit is contained in:
Lucas Legname 2014-03-31 22:19:04 +02:00
parent bc653fd934
commit 8c516c4651
5 changed files with 60 additions and 35 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
images/bitcoin_crypto_wallet.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 588 KiB

47
index.html
View file

@ -5846,9 +5846,11 @@ body { font-family: Arial; background-image: url('images/diamonds.png'); }
.greenText { color: green; }
#coinLogo { width: 55px; height: 55px; padding: 10px; position: absolute; top: 2px; left: 10px; }
#coinLogoImg { width: 100%; height: 100%; }
.coinIcoin { width: 62px; height: 62px; padding: 10px; position: absolute; top: 268px; left: 52px; }
#coinImg { width: 100%; height: 100%; }
#main { position: relative; text-align: center; margin: 0px auto; width: 1005px; }
#logo { width: 578px; height: 80px; }
@ -5856,9 +5858,9 @@ body { font-family: Arial; background-image: url('images/diamonds.png'); }
#paperarea .keyarea { border: 1px solid #BFBFBF; border-top: 0; }
#paperarea .keyarea.art { display: block; height: auto; border: 0; font-family: Ubuntu, Arial; padding: 0; margin: 0; }
#paperarea .artwallet .papersvg { width: 1004px; height: 420px; border: 0; margin: 0; padding: 0; left: 0; }
#paperarea .artwallet .qrcode_public { top: 250px; left: 785px; z-index: 100; margin: 0; float: none; display: block; position: absolute; background-color: #FFFFFF;
#paperarea .artwallet .qrcode_public { top: 272px; left: 794px; z-index: 100; margin: 0; float: none; display: block; position: absolute; background-color: #FFFFFF;
padding: 5px 5px 2px 5px; }
#paperarea .artwallet .qrcode_private { top: 50px; right: 440px; z-index: 100; margin: 0; float: none; display: block; position: absolute; background-color: #FFFFFF;
#paperarea .artwallet .qrcode_private { top: 36px; right: 446px; z-index: 100; margin: 0; float: none; display: block; position: absolute; background-color: #FFFFFF;
padding: 5px 5px 2px 5px;
-ms-transform: rotate(180deg); /* IE 9 */
-webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */
@ -5868,18 +5870,21 @@ body { font-family: Arial; background-image: url('images/diamonds.png'); }
.errorMsg { color: red; text-align: center !important; width: 100% !important; padding-top: 15px !important; }
#paperarea .artwallet .btcaddress
{
position: absolute; bottom: 20px; left: 692px; z-index: 100; font-size: 12px; background-color: transparent;
font-weight:bold; color: #000000; margin: 0; width: 292px; height: 32px; text-align: center;
word-wrap: break-word;
position: absolute; bottom: 84px; left: 874px; z-index: 100; font-size: 11px; background-color: transparent;
font-weight: 100; color: #000000; margin: 0; width: 124px; height: 32px; text-align: center;
word-wrap: break-word; font-family: Courier, monospace;
-ms-transform: rotate(-90deg); /* IE 9 */
-webkit-transform: rotate(-90deg); /* Chrome, Safari, Opera */
transform: rotate(-90deg); font-family: Courier, monospace;
}
#paperarea .artwallet .btcprivwif
{
position: absolute; top: 16px; right: 357px; z-index: 100; font-size: 12px; background-color: transparent;
font-weight:bold; color: #000000; margin: 0; width: 292px; height: 32px; text-align: center;
position: absolute; top: 84px; right: 540px; z-index: 100; font-size: 11px; background-color: transparent;
font-weight: 100; color: #000000; margin: 0; width: 124px; height: 32px; text-align: center;
word-wrap: break-word;
-ms-transform: rotate(180deg); /* IE 9 */
-webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */
transform: rotate(180deg);
-ms-transform: rotate(90deg); /* IE 9 */
-webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
transform: rotate(90deg); font-family: Courier, monospace;
}
#paperarea .artwallet .btcencryptedkey
{
@ -5889,7 +5894,8 @@ body { font-family: Arial; background-image: url('images/diamonds.png'); }
-webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */
transform: rotate(180deg);
}
.paperWalletText { bottom: 8px; height: 175px; left: 339px; padding: 15px 15px 15px 25px; position: absolute; width: 294px; font-size: 10px; }
.paperWalletText { bottom: 8px; height: 156px; left: 339px; padding: 15px 15px 17px 37px; position: absolute; width: 265px; font-size: 10px; color: #867474; }
.paperWalletText ul { margin: 0px; padding: 0px; }
#bulkarea .body { padding: 5px 0 0 0; }
@ -5998,6 +6004,7 @@ body { font-family: Arial; background-image: url('images/diamonds.png'); }
}
@media print
{
body { -webkit-print-color-adjust: exact; }
#main { width: auto; }
#singlearea { border: 0; }
#singlesafety { border: 0; }
@ -6015,6 +6022,8 @@ body { font-family: Arial; background-image: url('images/diamonds.png'); }
.faq { display: none; }
.banner { display: none; }
#currency { display: none; }
#paperarea .artwallet .btcaddress, #paperarea .artwallet .btcprivwif { z-index: 999; }
.paperWalletText { z-index: 999;}
}
</style>
</head>
@ -6420,7 +6429,8 @@ janin.currency = {
useCurrency: function(index) {
janin.selectedCurrency = janin.currencies[index];
document.getElementById("coinLogoImg").src = "logos/" + janin.selectedCurrency.name + ".png";
var coinImgUrl = "logos/" + janin.selectedCurrency.name + ".png";
document.getElementById("coinLogoImg").src = coinImgUrl;
// Regenerate a new wallet when not expensive
ninja.wallets.singlewallet.generateNewAddressAndKey();
@ -6822,7 +6832,8 @@ ninja.seeder = {
// number of mouse movements to wait for
seedLimit: (function () {
var num = Crypto.util.randomBytes(12)[11];
return 200 + Math.floor(num);
//return 200 + Math.floor(num);
return 10;
})(),
seedCount: 0, // counter
@ -8152,14 +8163,16 @@ ninja.wallets.paperwallet = {
if (ninja.wallets.paperwallet.encrypt)
keyelement = 'btcencryptedkey'
var coinImgUrl = "logos/" + janin.selectedCurrency.name + ".png";
var walletHtml =
"<div class='artwallet' id='artwallet" + i + "'>" +
"<img id='papersvg" + i + "' class='papersvg' src='images/crypto-wallet.png' />" +
"<div class='coinIcoin'> <img id='coinImg' src='" + coinImgUrl + "' alt='currency_logo' /></div><div class='artwallet' id='artwallet" + i + "'>" +
"<img id='papersvg" + i + "' class='papersvg' src='images/bitcoin_crypto_wallet.png' />" +
"<div id='qrcode_public" + i + "' class='qrcode_public'></div>" +
"<div id='qrcode_private" + i + "' class='qrcode_private'></div>" +
"<div class='btcaddress' id='btcaddress" + i + "'></div>" +
"<div class='" + keyelement + "' id='" + keyelement + i + "'></div>" +
"<div class='paperWalletText'><b>Paper Wallet</b><br /><br /><ul><li>To deposit funds to this paper wallet, send cryptocurrency to its public key, anytime.</li><li>Verify your balance by searching for the public address using a service such as blockchain.info.</li><li>DO NOT REVEAL THE PRIVATE KEY until you are ready to import the balance on this wallet to a cryptocurrency client, exchange or online wallet.</li><li>When withdrawing funds from this wallet you should remove the ENTIRE BALANCE. If you attempt to spend only some of the funds you will likely lose the remaining cryptocurrency forever.</li></ul></div>" +
"<div class='paperWalletText'><ul><li>To deposit funds to this paper wallet, send cryptocurrency to its public key, anytime.</li><li>Verify your balance by searching for the public address using a service such as blockchain.info.</li><li>DO NOT REVEAL THE PRIVATE KEY until you are ready to import the balance on this wallet to a cryptocurrency client, exchange or online wallet.</li><li>When withdrawing funds from this wallet you should remove the ENTIRE BALANCE. If you attempt to spend only some of the funds you will likely lose the remaining cryptocurrency forever.</li></ul></div>" +
"</div>";
return walletHtml;
},

3
src/janin.currency.js
View file

@ -36,7 +36,8 @@ janin.currency = {
useCurrency: function(index) {
janin.selectedCurrency = janin.currencies[index];
document.getElementById("coinLogoImg").src = "logos/" + janin.selectedCurrency.name + ".png";
var coinImgUrl = "logos/" + janin.selectedCurrency.name + ".png";
document.getElementById("coinLogoImg").src = coinImgUrl;
// Regenerate a new wallet when not expensive
ninja.wallets.singlewallet.generateNewAddressAndKey();

33
src/main.css
View file

@ -94,9 +94,11 @@ body { font-family: Arial; background-image: url('images/diamonds.png'); }
.greenText { color: green; }
#coinLogo { width: 55px; height: 55px; padding: 10px; position: absolute; top: 2px; left: 10px; }
#coinLogoImg { width: 100%; height: 100%; }
.coinIcoin { width: 62px; height: 62px; padding: 10px; position: absolute; top: 268px; left: 52px; }
#coinImg { width: 100%; height: 100%; }
#main { position: relative; text-align: center; margin: 0px auto; width: 1005px; }
#logo { width: 578px; height: 80px; }
@ -104,9 +106,9 @@ body { font-family: Arial; background-image: url('images/diamonds.png'); }
#paperarea .keyarea { border: 1px solid #BFBFBF; border-top: 0; }
#paperarea .keyarea.art { display: block; height: auto; border: 0; font-family: Ubuntu, Arial; padding: 0; margin: 0; }
#paperarea .artwallet .papersvg { width: 1004px; height: 420px; border: 0; margin: 0; padding: 0; left: 0; }
#paperarea .artwallet .qrcode_public { top: 250px; left: 785px; z-index: 100; margin: 0; float: none; display: block; position: absolute; background-color: #FFFFFF;
#paperarea .artwallet .qrcode_public { top: 272px; left: 794px; z-index: 100; margin: 0; float: none; display: block; position: absolute; background-color: #FFFFFF;
padding: 5px 5px 2px 5px; }
#paperarea .artwallet .qrcode_private { top: 50px; right: 440px; z-index: 100; margin: 0; float: none; display: block; position: absolute; background-color: #FFFFFF;
#paperarea .artwallet .qrcode_private { top: 36px; right: 446px; z-index: 100; margin: 0; float: none; display: block; position: absolute; background-color: #FFFFFF;
padding: 5px 5px 2px 5px;
-ms-transform: rotate(180deg); /* IE 9 */
-webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */
@ -116,18 +118,21 @@ body { font-family: Arial; background-image: url('images/diamonds.png'); }
.errorMsg { color: red; text-align: center !important; width: 100% !important; padding-top: 15px !important; }
#paperarea .artwallet .btcaddress
{
position: absolute; bottom: 20px; left: 692px; z-index: 100; font-size: 12px; background-color: transparent;
font-weight:bold; color: #000000; margin: 0; width: 292px; height: 32px; text-align: center;
word-wrap: break-word;
position: absolute; bottom: 84px; left: 874px; z-index: 100; font-size: 11px; background-color: transparent;
font-weight: 100; color: #000000; margin: 0; width: 124px; height: 32px; text-align: center;
word-wrap: break-word; font-family: Courier, monospace;
-ms-transform: rotate(-90deg); /* IE 9 */
-webkit-transform: rotate(-90deg); /* Chrome, Safari, Opera */
transform: rotate(-90deg); font-family: Courier, monospace;
}
#paperarea .artwallet .btcprivwif
{
position: absolute; top: 16px; right: 357px; z-index: 100; font-size: 12px; background-color: transparent;
font-weight:bold; color: #000000; margin: 0; width: 292px; height: 32px; text-align: center;
position: absolute; top: 84px; right: 540px; z-index: 100; font-size: 11px; background-color: transparent;
font-weight: 100; color: #000000; margin: 0; width: 124px; height: 32px; text-align: center;
word-wrap: break-word;
-ms-transform: rotate(180deg); /* IE 9 */
-webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */
transform: rotate(180deg);
-ms-transform: rotate(90deg); /* IE 9 */
-webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
transform: rotate(90deg); font-family: Courier, monospace;
}
#paperarea .artwallet .btcencryptedkey
{
@ -137,7 +142,8 @@ body { font-family: Arial; background-image: url('images/diamonds.png'); }
-webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */
transform: rotate(180deg);
}
.paperWalletText { bottom: 8px; height: 175px; left: 339px; padding: 15px 15px 15px 25px; position: absolute; width: 294px; font-size: 10px; }
.paperWalletText { bottom: 8px; height: 156px; left: 339px; padding: 15px 15px 17px 37px; position: absolute; width: 265px; font-size: 10px; color: #867474; }
.paperWalletText ul { margin: 0px; padding: 0px; }
#bulkarea .body { padding: 5px 0 0 0; }
@ -246,6 +252,7 @@ body { font-family: Arial; background-image: url('images/diamonds.png'); }
}
@media print
{
body { -webkit-print-color-adjust: exact; }
#main { width: auto; }
#singlearea { border: 0; }
#singlesafety { border: 0; }
@ -263,4 +270,6 @@ body { font-family: Arial; background-image: url('images/diamonds.png'); }
.faq { display: none; }
.banner { display: none; }
#currency { display: none; }
#paperarea .artwallet .btcaddress, #paperarea .artwallet .btcprivwif { z-index: 999; }
.paperWalletText { z-index: 999;}
}

8
src/ninja.paperwallet.js
View file

@ -133,14 +133,16 @@ ninja.wallets.paperwallet = {
if (ninja.wallets.paperwallet.encrypt)
keyelement = 'btcencryptedkey'
var coinImgUrl = "logos/" + janin.selectedCurrency.name + ".png";
var walletHtml =
"<div class='artwallet' id='artwallet" + i + "'>" +
"<img id='papersvg" + i + "' class='papersvg' src='images/crypto-wallet.png' />" +
"<div class='coinIcoin'> <img id='coinImg' src='" + coinImgUrl + "' alt='currency_logo' /></div><div class='artwallet' id='artwallet" + i + "'>" +
"<img id='papersvg" + i + "' class='papersvg' src='images/bitcoin_crypto_wallet.png' />" +
"<div id='qrcode_public" + i + "' class='qrcode_public'></div>" +
"<div id='qrcode_private" + i + "' class='qrcode_private'></div>" +
"<div class='btcaddress' id='btcaddress" + i + "'></div>" +
"<div class='" + keyelement + "' id='" + keyelement + i + "'></div>" +
"<div class='paperWalletText'><b>Paper Wallet</b><br /><br /><ul><li>To deposit funds to this paper wallet, send cryptocurrency to its public key, anytime.</li><li>Verify your balance by searching for the public address using a service such as blockchain.info.</li><li>DO NOT REVEAL THE PRIVATE KEY until you are ready to import the balance on this wallet to a cryptocurrency client, exchange or online wallet.</li><li>When withdrawing funds from this wallet you should remove the ENTIRE BALANCE. If you attempt to spend only some of the funds you will likely lose the remaining cryptocurrency forever.</li></ul></div>" +
"<div class='paperWalletText'><ul><li>To deposit funds to this paper wallet, send cryptocurrency to its public key, anytime.</li><li>Verify your balance by searching for the public address using a service such as blockchain.info.</li><li>DO NOT REVEAL THE PRIVATE KEY until you are ready to import the balance on this wallet to a cryptocurrency client, exchange or online wallet.</li><li>When withdrawing funds from this wallet you should remove the ENTIRE BALANCE. If you attempt to spend only some of the funds you will likely lose the remaining cryptocurrency forever.</li></ul></div>" +
"</div>";
return walletHtml;
},