From 647e4945af59c71201da3bc0fcc28859362db681 Mon Sep 17 00:00:00 2001 From: seenazzz Date: Wed, 10 Jul 2019 20:52:36 -0700 Subject: [PATCH 1/5] Uploaded whole app --- img/app.png | Bin 0 -> 788 bytes img/app.svg | 43 +++++++ index.html | 233 +++++++++++++++++++++++++++++++++ readme.md | 84 ++---------- script.js | 269 ++++++++++++++++++++++++++++++++++++++ style.css | 362 ++++++++++++++++++++++++++++++++++++++++++++++++++++ 6 files changed, 921 insertions(+), 70 deletions(-) create mode 100644 img/app.png create mode 100644 img/app.svg create mode 100644 index.html create mode 100644 script.js create mode 100644 style.css diff --git a/img/app.png b/img/app.png new file mode 100644 index 0000000000000000000000000000000000000000..64a36e7007badff0c4e8352b2652a21977547b17 GIT binary patch literal 788 zcmeAS@N?(olHy`uVBq!ia0vp^4j|0I3?%1nZ+ru!n2Vh}LpV4%Za?&Y0OWEOctjR6 zFbGJ4Fk|2@fg3gcyqV(DCY@`?%7)1hn zLR|m<|IhHBfdND@gs%GkKQ#3J8Do`6p1Ip@-}dxWnD20Zzk|%G(85)ZABTqOEpmHx z)uCa@?c32HDTVm~8Vds}*ImCJ7uc}s{?$+~`NctM3w@N9`lu}MRaxY%yx6Z{^{wmC zUMdT`RTlfzt+{nQ(hEXh_H&&v$3NKAiWiTXpM3q}RK%-pY&o>Q~>s9_8Ht zBqP1+*MQh63w@Or`2a<(MS0b)x^+Fu3uJ7RC(wN5MZWLPdI1rT(Xi&$HK1KU21pj7 z#_Rn#5JDD#u;GG0jSy51)&&&*=Dtl17>E%iL4LsujEs!T%&hF}>>M1NoSfV|e0%}| z!otE55|YxYZtfmFK7M||!I6*1gBCUcGzw;lqbdpFaP5_0kX+;*5NrE{-7)hu>a3>Brl5exW`0Q}?PW-PYjn)ix_a$Z>P}{$LD~o^w10%}}tqYGEyEuQa*%WY3 zc-+|Yb>p1R2jmmkvYy6DU!rnfIzORrZrz{9{RR}sSGSMk7u^MlNt?I%xpnlrvpsCuZs*5XuD*ywZfx*+&&t;ucLK6TdV_w|= literal 0 HcmV?d00001 diff --git a/img/app.svg b/img/app.svg new file mode 100644 index 0000000..33ae5e9 --- /dev/null +++ b/img/app.svg @@ -0,0 +1,43 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/index.html b/index.html new file mode 100644 index 0000000..abd0084 --- /dev/null +++ b/index.html @@ -0,0 +1,233 @@ + + + + + + EveryApp : The Decentralized App Store + + + + + + + + + + + + + + +
+
+
+ +
+
+ Saturday, 15 July +
+
+ Today +
+
+ +
+
+
+
From the editors
+
+ Welcome to the
All-New App Store! +
+
+
+
+
+
World Premiere
+
+ The Art of the Impossible +
+
+
+
Inside the extraordinary world of Monument Valley 2
+
+
+ +
+
+
+
+
+
+ App of the day +
+
+
Hitlist
+
Cheap flights, airline tickets
+
+
+
+
Collection
+
+ The Perfect Coffee Break +
+
+
+
+
+
+
+
+
+
+ 14 July +
+
+ Friday +
+
+ +
+
+
+
Deep Dive
+
+ It All Changes on Level 201 +
+
+
+
+
Casuality bends space, time and your mind-- in a good way.
+
+
+
+
+
+
+
+ App of the day +
+
+
WaterMinder
+
Daily Water Reminder
+
+
+
+ +
+
+
+
+
+
+ Game of the day +
+
+
Splitter Crittters
+
Split Worlds and save critters
+
+
+
+
The daily list
+
+ Relax. Breathe.
Zen out Anywhere. +
+
+
+
+
+
+
+
All
+
Android
+
Chrome
+
Firefox
+
Upload
+
+ +
+ + +
+
+
+
+
Android
+
+ Facebook Messenger v3.1 +
+ +
+
+ +
+
+
+ +
+ Thanks for checking out this demo of upcoming App Store for iPad (which is in beta as of writing this demo. Thanks for checking out this demo of upcoming App Store for iPad (which is in beta as of writing this demo. Thanks for checking out this demo of upcoming App Store for iPad (which is in beta as of writing this demo. +
+ + + +
+ +
+ +
+
+
+ + +
+
+
+
+
App Store
+
+ Upload An App +
+
+
+ +
+
+
+
+
+
+
+
+
+
+ +
+
+ + +
+
+
+ + + + + + + + + + + + + + + + + + diff --git a/readme.md b/readme.md index cc3d3a1..59544d9 100644 --- a/readme.md +++ b/readme.md @@ -1,77 +1,21 @@ -# **Arweave’s Perpetual Open Web Hackathon** +## Project Name +EveryApp -## **Introduction** +**LIVE DEMO:** [https://everyapp.net](https://everyapp.net) -Welcome to the perpetual, open permaweb hackathon! +![screenshot](https://i.imgur.com/WndUkNC.png) -At Arweave we firmly believe that the future of the [new web should be open source](https://medium.com/@arweave/towards-an-open-source-web-9ffe201fc044) for the benefit of users and developers alike. We want to help make this a reality, so we’re rewarding developers like yourself for building open source dApps on the permaweb! +## Project Summary +EveryApp is a decentralized app store built on the Arweave Blockchain. It currently supports: -The Arweave itself is a global, permanent hard drive. The permaweb is a decentralised, immutable web built on top of the Arweave. Permaweb apps are built using normal web technologies — HTML, CSS, and Javascript — but are deployed to Arweave’s on-chain storage system, making them permanent and available in a fast, decentralised manner. You can get started and deploy a permaweb app in 2 minutes or less. +- Android apps +- Chromium apps +- FireFox apps -**Time investment:** One afternoon to one weekend. -**Rewards:** +## Project Team -**Basic:** $50 in ETH + 200 AR -A simple application with functional features and a basic UI and styling, hosted on the permaweb. - -**Advanced:** $250 in ETH + 500 AR -A dynamic and interactive web application that is hosted on the permaweb, along with ideas that contribute added functionality to the permaweb eco system. For examples: [Arweave API explorer](https://arweave.net/LHff4F45o7ipDqjoePG0PDG5BD2hLD8xf17OBg4FjRE) & [ArweaveID](https://arweave.net/fGUdNmXFmflBMGI2f9vD7KzsrAc1s1USQgQLgAVT0W0). Ideas that resemble or improve on popular web applications such as [AskWeave](https://arweave.net/HhIjOjxgHYXJU5RVjRYfAR017vbZdujbCSlaA8NQ20U) & [Scribe](https://arweave.net/VOKAC_SYiUzbJrEaIY5SEBh1pf0bGQOd8c7G68nzet4#/) are also encouraged, and all applications must include a UI with basic styling. - -**Store the UI for an existing dApp** on the permaweb: $100 in ETH + 300 AR - -If you’re unsure of which category your application fits into, [head over to our Discord server](https://discord.gg/VxJ3xsm) where both Arweave team members and the wider Arweave developer community can help guide you with your submission ideas! - -## **Resources** - -You can find the docs for getting started deploying your first permaweb app [here](https://docs.arweave.org/developers/tools/arweave-deploy). - -The docs for the JS library that allows you to read from and write to the permaweb are [here](https://github.com/ArweaveTeam/arweave-js). - -Check out some sample apps on ArweaveApps -- served right from the permaweb itself: [](https://arweave.net/35IFq9BcIgpSPti9YDYDiaQy4wMfMIKZ25t7hHZrhek) - -We’re providing some free tokens so you can get started building and deploying - grab your wallet [here](https://tokens.arweave.org/#/wallet). For guidance on how to use the Chrome web extension wallet, check out [this user guide](https://docs.arweave.org/info/wallets/arweave-web-extension-wallet). - -## **Rules** - -We want to let you get started building your app without delay, so ideas for submissions are automatically approved. However, **only submissions that meet the reward criteria outlined below will receive a reward** - so please make sure you review them carefully and make sure your app complies with them. - -If we notice that your submission is unlikely to meet the reward criteria, we will try and let you know in advance, and are happy to offer guidance on how to tweak your idea to fit this guidance. [Holla at us](https://discord.gg/VxJ3xsm) on Discord! - -### **Successful submissions will meet the following criteria:** - -- Submissions must be **your own original work**, and must be **unique or substantially different** from other permaweb applications or submissions to this hackathon. -- We are happy to accept forks of other applications, but the featureset must be substantially different or significantly expanded in the forked version. -- Apps must be **open source, with the full source code available on Github or another open code hosting repository**. Feel free to use whatever OSS licence you prefer. -- Applications should be **sufficiently complex**, as judged by the core Arweave team. For example, a simple ‘hello world’ app is not complex enough to receive a reward. Broken/non-functional submissions will also be rejected. You should aim for a minimal viable product that an end-user could reasonably start to use. -- Your submission must **include a link to a live, functioning, and running instance of the app itself, as well as a link to the repository** it is stored within. It must also be published to ArweaveApps (see the submission process below) -- All applicants must **[join our Discord Dev server](https://discord.gg/VxJ3xsm)** and share your submission in the #on-the-arweave channel upon completion -- All submissions must include a **brief description** of the application and functionality in the GitHub repo -- When you submit your work, please state whether you wish to be judged in the _Basic_ or _Advanced_ Category - -If you wish to submit **more than two** submissions, you are required to [get approval](https://discord.gg/VxJ3xsm) from us before you are eligible to start a 3rd submission. - -## **Reward details** - -- We are currently offering rewards for up to 500 successful submissions in this hackathon -- The value of ETH to USD will be pegged at the time of transfer, which follows successful submission and provision of recipients’ ETH and AR addresses. -- Only submissions which are judged by the core Arweave team to meet all of the submission criteria will receive the rewards - -## **The submission process** - -- Click ‘Start Work’, and you will be automatically accepted so you can start hacking right away. -- Please note, submissions will only receive a reward if they successfully meet the submission criteria listed above. If you have questions, please drop a comment below and we’ll be happy to help. -- Hack! Join us our tech Discord if you have any questions! -- Publish your app to [ArweaveApps](https://arweave.net/35IFq9BcIgpSPti9YDYDiaQy4wMfMIKZ25t7hHZrhek). Also, submit a comment to the GitHub issue for the hackathon campaign [here](https://github.com/ArweaveTeam/Bounties/issues/1), containing a link to your app’s repository, and a link to the live, running version of your app on the permaweb. You can generate a permaweb URL for the app by appending the transaction ID to this gateway link: [https://arweave.net/](https://arweave.net/) -- If you wish to submit more than one project, you will not be able to do so via GitCoin. In this case, you can submit an application by posting your build in the GitHub issue and provide a link to the live deployed app. We also recommend pitching your idea for additional submissions to arweave-sophie on [Discord](https://discord.gg/VxJ3xsm) before starting work. -- If your app meets the reward criteria defined above, we will release the reward! - -## **App ideas** - -This bounty allows you to build whatever app you like on top of the Arweave’s permaweb, but here are some ideas to get you started: - -- Weavelist: A public mailing list and discussion app, similar to weavemail.app except open and unencrypted. -- WeaveDirectory: An index of weavemail.app users allowing short bios to help people find community members to chat to. -- ShowerThoughts: Submit short, interesting ideas to the permaweb, never to be forgotten. - -Remember, we’d love you to join us on our developers’ [Discord server](https://discord.gg/VxJ3xsm) to chat, and get feedback and assistance with building! +* **Name:** Seena Zandipour +* **Email:** craze3@gmail.com +* **Ethereum Address:** 0x5A0f2C1d8E563db79Ee40F979F6bcD0d27f86f80 +* **Role:** CEO, Full-Stack Developer, Solidity Developer, Designer diff --git a/script.js b/script.js new file mode 100644 index 0000000..c7b101f --- /dev/null +++ b/script.js @@ -0,0 +1,269 @@ +$('.grid').click(() => { + $('#content-modal').addClass('active'); + $('.wrapper').addClass('blur'); + $("html, body").animate({ scrollTop: 0 }, "slow"); +}); + +$('.content-modal .icon').click(() => { + $('#content-modal').removeClass('active'); + $('#upload-modal').removeClass('active'); + $('.wrapper').removeClass('blur'); +}); + +$('.upload-button').click(() => { + $('#upload-modal').addClass('active'); + $('.wrapper').addClass('blur'); + $("html, body").animate({ scrollTop: 0 }, "slow"); +}); + +const arweave = Arweave.init({ + host: 'arweave.net',// Hostname or IP address for a Arweave node + port: 443, // Port, defaults to 1984 + protocol: 'https', // Network protocol http or https, defaults to http + timeout: 20000, // Network request timeouts in milliseconds + logging: false, // Enable network request logging +}); + +arweave.network.getInfo().then("Connected to Arweave Network:", console.log); + +var ipfs = window.IpfsHttpClient('ipfs.infura.io', '5001', {protocol: 'https'}); +console.log("Connected to IPFS via Infura (:5001)"); + +function upload(wallet) { + + // Read chosen wallet file (NOT UPLOADED!) + var reader = new FileReader(); + reader.onload = function(event) { + + // Parse JSON + var jsonObj = JSON.parse(event.target.result); + + // Fetch public key + arweave.wallets.jwkToAddress(jsonObj).then((address) => { + console.log("Logged in as: ", address); + + // Fetch balance + arweave.wallets.getBalance(address).then((balance) => { + var total = arweave.ar.winstonToAr(balance); + console.log("Balance: " + total + " AR"); + + // Check if we can upload + if(balance <= 0) + { + alert("Error: You must have AR in your wallet to upload an app!") + } else { + + // Create a transaction + arweave.createTransaction({ + data: 'Hello world!', + }, jsonObj).then((transaction) => { + transaction.addTag('Content-Type', 'text/html'); + transaction.addTag('appstore_filetype', 'ipa'); + //transaction.addTag('appstore_title', $('#title').val()); + + // PROCESS UPLOAD: + // Get selected image + var file = $('#appimage').prop('files')[0]; + + var reader = new FileReader(); + reader.readAsDataURL(file); + reader.onload = function () { + console.log("Got image contents: ", reader.result); + var fileString = reader.result; + + // Create new app object to store metadata + var newApp = { + title: $('#title').val(), + description: $('#description').val(), + image: fileString + }; + + // Upload app/metadata object to IPFS: + console.log("Upload to IPFS: ", newApp, JSON.stringify(newApp)); + var metadata = JSON.stringify(newApp); + + const Buffer = window.IpfsApi().Buffer; + var ifpsBuffer = Buffer.from(metadata); + ipfs.add([ifpsBuffer], {pin:false}) + .then(response => { + var hash = response[0].hash; + if(hash) { + + transaction.addTag('appstore_metadata', hash); + + // Sign the transaction + arweave.transactions.sign(transaction, jsonObj).then((info) => { + console.log("Signed transaction:", transaction) + + // Submit the transaction + arweave.transactions.post(transaction).then((response) => { + if(!response) { + alert("Error: Unable to submit transaction!"); + } + else { + var success = 0; + switch(response.status) { + case 200: + console.log("Success!"); + success = 1; + break; + case 400: + alert("Error: Invalid transaction!"); + break; + case 500: + alert("Error: Unknown error!"); + break; + } + + } + }); + + }); + } + }); + + }; + reader.onerror = function (error) { + console.log('Error: ', error); + }; + + }); + } + }); + }); + } + reader.readAsText(document.getElementById('walletUpload').files[0]); +} + + +function getApps() { + // Query for all appstore transactions/uploads + arweave.arql({ + op: "or", + expr1: { + op: "equals", + expr1: "appstore_filetype", + expr2: "ipa" + }, + expr2: { + op: "equals", + expr1: "appstore_filetype", + expr2: "apk" + } + }).then((txids) => { + console.log(txids); + // For each app... + txids.forEach(txn_id => { + arweave.transactions.get(txn_id).then(transaction => { + // Use the get method to get a specific transaction field. + console.log(transaction.get('signature')); + // NLiRQSci56KVNk-x86eLT1TyF1ST8pzE-s7jdCJbW-V... + console.log(transaction.get('data')); + //CjwhRE9DVFlQRSBodG1sPgo8aHRtbCBsYW5nPSJlbiI-C... + // Get the data base64 decoded as a Uint8Array byte array. + console.log(transaction.get('data', {decode: true})); + //Uint8Array[10,60,33,68,79,67,84,89,80,69... + // Get the data base64 decoded as a string. + console.log(transaction.get('data', {decode: true, string: true})); + // ARWEAVE / PEER EXPLORER + transaction.get('tags').forEach(tag => { + let key = tag.get('name', {decode: true, string: true}); + let value = tag.get('value', {decode: true, string: true}); + console.log(`${key} : ${value}`); + }); + // Content-Type : text/html // User-Agent : ArweaveDeploy/1.1.0 + }); + }); +}); +} + +getApps(); + + +// IPFS Stuff: + +function getBase64(file) { + var reader = new FileReader(); + reader.readAsDataURL(file); + reader.onload = function () { + console.log("Got image contents: ", reader.result); + }; + reader.onerror = function (error) { + console.log('Error: ', error); + }; +} + +async function ipfsUpload(data) { + const Buffer = window.IpfsApi().Buffer; + var ifpsBuffer = Buffer.from(data); + ipfs.add([ifpsBuffer], {pin:false}) + .then(response => { + var hash = response[0].hash; + if(hash) { + console.log("IPFS hash = ", hash); + //hash = web3.utils.asciiToHex(hash); + //hash = web3.utils.hexToBytes(hash); + + // Write to blockchain + console.log("HEXed Hash =", hash); + /* + //hash = web3.utils.asciiToHex(hash); //<-- Convert to hex so we can write to blockchain + contractInstance.methods.broadcast(hash).send({from: account}) + .on('transactionHash', function(hash){ + //alert("Transaction Pending. Hash = " + hash); + //alert("Transaction Pending. Hash = ", hash); + window.open("https://etherscan.io/tx/"+hash); + }) + .on('receipt', function(receipt){ + console.log("Transaction complete! TXN ID = ", receipt); + alert("Transaction complete!"); // TXN ID = " + receipt); + window.location.replace("verify#"+receipt.events.LogHash.returnValues.hash); + }) + .on('confirmation', function(confirmationNumber, receipt){ + if(confirmationNumber<20) + console.log("Confirmation #", confirmationNumber, receipt); + }) + .on('error', console.error); + */ + + } + }).catch((err) => { + console.log(err); + return false; + }); +} + +function fetchIPFS(hash) { + ipfs.get(hash, function (err, files) { + files.forEach((file) => { + //console.log(file.path) + console.log(file.content.toString('utf8')) + }) + }); +} + +function processUpload() { + // Get selected image + var file = $('#appimage').prop('files')[0]; + + var reader = new FileReader(); + reader.readAsDataURL(file); + reader.onload = function () { + console.log("Got image contents: ", reader.result); + var fileString = reader.result; + + // Create new app object to store metadata + var newApp = { + title: $('#title').val(), + description: $('#description').val(), + image: fileString + }; + + // Upload app/metadata object to IPFS: + console.log("Upload to IPFS: ", newApp, JSON.stringify(newApp)); + ipfsUpload(JSON.stringify(newApp)); + }; + reader.onerror = function (error) { + console.log('Error: ', error); + }; +} diff --git a/style.css b/style.css new file mode 100644 index 0000000..731bd26 --- /dev/null +++ b/style.css @@ -0,0 +1,362 @@ +@import url("https://fonts.googleapis.com/css?family=Open+Sans|Raleway"); +html { + box-sizing: border-box; +} + +*, *:before, *:after { + box-sizing: inherit; +} + +body { + background-color: #f4f4f4; + font-family: 'Open Sans', sans-serif; + position: relative; +} + +.wrapper { + margin: 0 auto; + min-width: 400px; + max-width: 920px; + position: relative; +} +.wrapper.blur { + -webkit-filter: blur(4px); + filter: blur(4px); +} + +.top-status-bar { + padding: 5px 8px; + position: fixed; + top: 0; + left: 0; + right: 0; + z-index: 10; + max-width: 920px; + margin: 0 auto; + display: flex; + justify-content: space-between; + background-color: #f4f4f4; + color: #555; + font-size: .65em; + font-weight: 900; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); +} +.top-status-bar .name::after { + content: '\f1eb'; + font-family: FontAwesome; + margin-left: 5px; +} +.top-status-bar .battery-status::before { + content: '\f124 \f294'; + font-family: FontAwesome; + margin-right: 5px; +} +.top-status-bar .battery-status::after { + content: '\f241'; + font-family: FontAwesome; + margin-left: 5px; + font-weight: 100; +} + +.content-wrapper:last-child { + margin-bottom: 100px; +} + +.date-indicators { + margin: 0 30px 0; + padding-top: 50px; + font-family: 'Raleway', sans-serif; +} +.date-indicators .date { + margin-bottom: 5px; + color: #aaa; + text-transform: uppercase; + font-size: .8em; +} +.date-indicators .day { + font-size: 1.8em; + font-weight: 900; +} + +.grid-container { + padding: 20px; +} +.grid-container .gc-1 { + display: grid; + grid-template-columns: 2fr 1fr; + grid-gap: 40px; +} +@media screen and (max-width: 550px) { + .grid-container .gc-1 { + grid-template-columns: 1fr; + } +} +@media screen and (min-width: 550px) and (max-width: 950px) { + .grid-container .gc-1 { + grid-template-columns: 1fr 1fr; + } +} +.grid-container .gc-2 { + margin-top: 40px; + display: grid; + grid-template-columns: 1fr 2fr; + grid-gap: 40px; +} +@media screen and (max-width: 550px) { + .grid-container .gc-2 { + grid-template-columns: 1fr; + } +} +@media screen and (min-width: 550px) and (max-width: 950px) { + .grid-container .gc-2 { + grid-template-columns: 1fr 1fr; + } +} +.grid-container .grid { + height: 300px; + padding: 20px; + border: 1px solid #f4f4f4; + border-radius: 15px; + box-shadow: 2px 2px 40px -12px #999; + cursor: pointer; + position: relative; +} +.grid-container .grid .upper-headline { + text-transform: uppercase; + font-size: .8em; + word-spacing: 2px; + color: #999; + margin-bottom: 5px; +} +.grid-container .grid .headline { + font-size: 1.5em; + font-weight: 900; + line-height: 1.3; + margin-bottom: 5px; +} +.grid-container .grid .content.atd { + margin-top: 30px; + text-transform: uppercase; + font-size: 3em; + font-weight: 900; +} +.grid-container .grid .footline { + font-size: .85em; + position: absolute; + bottom: 15px; + font-family: 'Raleway', sans-serif; +} +.grid-container .grid .footline .head { + font-weight: 900; + margin-bottom: 5px; +} + +.footer-menu { + max-width: 920px; + margin: 0 auto; + padding: 15px; + position: fixed; + bottom: 0; + left: 0; + right: 0; + display: flex; + justify-content: space-around; + align-items: center; + border-radius: 5px; + background-color: #f4f4f4; + color: #aaa; +} +@media screen and (max-width: 550px) { + .footer-menu { + font-size: 12px; + } +} +.footer-menu .menu { + display: flex; + justify-content: space-around; + align-items: center; + cursor: pointer; + font-size: .9em; +} +.footer-menu .menu:before { + font-family: FontAwesome; + margin-right: 8px; + font-size: 22px; + font-weight: 100; +} +.footer-menu .menu.active { + color: #007bff; +} +.footer-menu .today::before { + content: '\f03a'; +} +.footer-menu .game::before { + content: '\f17b'; +} +.footer-menu .apps::before { + content: '\f268'; +} +.footer-menu .updates::before { + content: '\f269'; +} +.footer-menu .search::before { + content: '\f002'; +} +.footer-menu .upload::before { + content: '\f0ee'; +} + +.upload-button { + border-left: 1px solid #cecece; + padding-left: 28px; + } + +.content-modal { + position: absolute; + top: 0; + left: 0; + z-index: 20; + width: 100vw; + height: 100%; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + box-shadow: 3px 2px 3px #444; + opacity: 0; + visibility: hidden; + transition: opacity .4s ease-in-out, -webkit-transform .5s ease-in-out .2s; + transition: opacity .4s ease-in-out, transform .5s ease-in-out .2s; + transition: opacity .4s ease-in-out, transform .5s ease-in-out .2s, -webkit-transform .5s ease-in-out .2s; + -webkit-transform: translate(-5px, -5px) scale(1.01); + transform: translate(-5px, -5px) scale(1.01); +} +.content-modal.active { + opacity: 1; + visibility: visible; + -webkit-transform: translate(0, 0) scale(1); + transform: translate(0, 0) scale(1); +} +.content-modal .modal-body { + background-color: #fff; + width: 700px; + height: 650px; + border-radius: 10px; + padding: 30px; + margin: 90px auto; +} +.content-modal .modal-body .header { + margin-bottom: 10px; + display: flex; + justify-content: space-between; + align-items: center; +} +.content-modal .modal-body .header .label { + font-weight: 900; +} +.content-modal .modal-body .header .icon { + padding: 8px; + cursor: pointer; + font-size: 1.2em; + color: #bbb; + align-self: flex-start; +} +.content-modal .modal-body .header .upper-headline { + text-transform: uppercase; + font-size: .8em; + word-spacing: 2px; + color: #999; + margin-bottom: 5px; +} +.content-modal .modal-body .header .headline { + font-size: 1.5em; + font-weight: 900; + line-height: 1.3; + margin-bottom: 5px; +} +.content-modal .modal-body .body-content { + overflow-y: scroll; + height: 550px; + line-height: 2; + word-spacing: 2px; + color: #777; + font-family: 'Raleway', sans-serif; +} +.content-modal .modal-body .body-content a { + color: #777; + text-decoration: none; +} +.content-modal .modal-body .body-content a:hover, .content-modal .modal-body .body-content a:focus, .content-modal .modal-body .body-content a:visited { + text-decoration: none; +} +.content-modal .modal-body .body-content a:hover { + color: #444; +} +.content-modal .modal-body .ajduke { + text-align: center; + font-weight: 900; +} +.content-modal .modal-body .ajduke .fa-heart { + color: tomato; + padding: 0 5px; +} +.content-modal .modal-body .ajduke a { + text-decoration: none; + border-bottom: 1px dotted; +} +.content-modal .modal-body .ajduke a:hover, .content-modal .modal-body .ajduke a:visited, .content-modal .modal-body .ajduke a.active { + color: inherit; +} + + + + +.download-button-wrapper { + margin: 20px auto; + max-width: 360px; +} +.download-button-wrapper .download-btn { + font-size: 20px; + background: #EC422B; + color: #fff; + padding: 10px 20px; + width: 100%; +height: 60px; +border-radius: 6px; +} +.download-button-wrapper .download-btn i { + font-size: 18px; +} +.download-button-wrapper .download-btn span { + padding-left: 10px; +} +.download-button-wrapper .download-btn:hover { + background: #CE2811; +} +.download-button-wrapper .download-btn:active { + background: #9F1401; +} + +.list-wrapper { + margin: 0 auto; + max-width: 150px; +} +.list-wrapper .list-download-btn { + background: #F7F7F7; + padding: 10px 20px; + margin-left: 20px; +} +.list-wrapper .list-download-btn i { + font-size: 14px; +} +.list-wrapper .list-download-btn span { + padding-left: 10px; +} +.list-wrapper .list-download-btn:hover { + background: #EDEDED; +} +.list-wrapper .list-download-btn:active { + background: #535353; + color: #fff; +} From 57143f1c1560d06882bd145cb1a0ea3f8e269021 Mon Sep 17 00:00:00 2001 From: seenazzz Date: Thu, 11 Jul 2019 00:07:51 -0700 Subject: [PATCH 2/5] Bugfix --- index.html | 48 +++++------------------------------------------- script.js | 44 +++++++++++++++++++++++++++++++++++++++++++- 2 files changed, 48 insertions(+), 44 deletions(-) diff --git a/index.html b/index.html index abd0084..427ca23 100644 --- a/index.html +++ b/index.html @@ -31,50 +31,12 @@ -
-
-
-
From the editors
-
- Welcome to the
All-New App Store! -
-
-
-
-
-
World Premiere
-
- The Art of the Impossible -
-
-
-
Inside the extraordinary world of Monument Valley 2
-
-
+
+ + + + -
-
-
-
-
-
- App of the day -
-
-
Hitlist
-
Cheap flights, airline tickets
-
-
-
-
Collection
-
- The Perfect Coffee Break -
-
-
-
-
-
diff --git a/script.js b/script.js index c7b101f..8c37ee4 100644 --- a/script.js +++ b/script.js @@ -153,10 +153,11 @@ function getApps() { }).then((txids) => { console.log(txids); // For each app... + var count = 0; txids.forEach(txn_id => { arweave.transactions.get(txn_id).then(transaction => { // Use the get method to get a specific transaction field. - console.log(transaction.get('signature')); + console.log(txn_id, transaction.get('signature')); // NLiRQSci56KVNk-x86eLT1TyF1ST8pzE-s7jdCJbW-V... console.log(transaction.get('data')); //CjwhRE9DVFlQRSBodG1sPgo8aHRtbCBsYW5nPSJlbiI-C... @@ -170,6 +171,47 @@ function getApps() { let key = tag.get('name', {decode: true, string: true}); let value = tag.get('value', {decode: true, string: true}); console.log(`${key} : ${value}`); + + if(key == 'appstore_metadata') { + ipfs.get(value, function (err, files) { + files.forEach((file) => { + console.log(file.path) + var payload = file.content.toString('utf8'); + + if(payload.substring(0,1) == '{') { + var metadata = JSON.parse(payload); + console.log("Metadata = ", metadata); + + // Set link + var link = 'https://arweave.net/'+txn_id; + var title = metadata.title; + var description = metadata.description; + var image = metadata.image; + + count++; + if(count == 1) { + $('#apps').append('
'+description+'
'+title+'
'); + } + if(count == 2) { + $('#apps').append('
World Premiere
The Art of the Impossible
Inside the extraordinary world of Monument Valley 2
'); + } + if(count == 3) { + $('#apps').append('
App of the day
Hitlist
Cheap flights, airline tickets
'); + } + if(count == 4) { + $('#apps').append('
Collection
The Perfect Coffee Break
'); + count = 0; + } + } + + }) + }); + + } + + if(key == 'appstore_filetype') { + // set file + } }); // Content-Type : text/html // User-Agent : ArweaveDeploy/1.1.0 }); From 7686396b1822d1065b04cea09df4654644c11380 Mon Sep 17 00:00:00 2001 From: seenazzz Date: Fri, 19 Jul 2019 18:37:36 -0700 Subject: [PATCH 3/5] ADDED: Filtering + Fixed layout bugs --- index.html | 78 +++++++----------------------------------------------- script.js | 67 +++++++++++++++++++++++++++++++++++----------- 2 files changed, 61 insertions(+), 84 deletions(-) diff --git a/index.html b/index.html index 427ca23..f985d06 100644 --- a/index.html +++ b/index.html @@ -24,10 +24,10 @@
- Saturday, 15 July + RECENTLY ADDED
-
- Today +
+ All Apps
@@ -38,71 +38,13 @@
-
-
-
- 14 July -
-
- Friday -
-
- -
-
-
-
Deep Dive
-
- It All Changes on Level 201 -
-
-
-
-
Casuality bends space, time and your mind-- in a good way.
-
-
-
-
-
-
-
- App of the day -
-
-
WaterMinder
-
Daily Water Reminder
-
-
-
- -
-
-
-
-
-
- Game of the day -
-
-
Splitter Crittters
-
Split Worlds and save critters
-
-
-
-
The daily list
-
- Relax. Breathe.
Zen out Anywhere. -
-
-
-
-
-
+ +
-
All
-
Android
-
Chrome
-
Firefox
+
All
+
Android
+
Chrome
+
Firefox
Upload
@@ -165,7 +107,7 @@


-
+

diff --git a/script.js b/script.js index 8c37ee4..85e2ade 100644 --- a/script.js +++ b/script.js @@ -12,10 +12,11 @@ $('.content-modal .icon').click(() => { $('.upload-button').click(() => { $('#upload-modal').addClass('active'); - $('.wrapper').addClass('blur'); + //$('.wrapper').addClass('blur'); $("html, body").animate({ scrollTop: 0 }, "slow"); }); +// Initialize Arweave blockchain connection... const arweave = Arweave.init({ host: 'arweave.net',// Hostname or IP address for a Arweave node port: 443, // Port, defaults to 1984 @@ -26,6 +27,7 @@ const arweave = Arweave.init({ arweave.network.getInfo().then("Connected to Arweave Network:", console.log); +// Connect to IPFS var ipfs = window.IpfsHttpClient('ipfs.infura.io', '5001', {protocol: 'https'}); console.log("Connected to IPFS via Infura (:5001)"); @@ -53,12 +55,18 @@ function upload(wallet) { alert("Error: You must have AR in your wallet to upload an app!") } else { + // Get app file + var app = $('#appfile').prop('files')[0]; + var arr = app.name.split("."); + var filetype = arr[arr.length-1]; + //console.log("appfile TYPE:", filetype); + // Create a transaction arweave.createTransaction({ data: 'Hello world!', }, jsonObj).then((transaction) => { transaction.addTag('Content-Type', 'text/html'); - transaction.addTag('appstore_filetype', 'ipa'); + transaction.addTag('appstore_filetype', filetype); //transaction.addTag('appstore_title', $('#title').val()); // PROCESS UPLOAD: @@ -136,21 +144,44 @@ function upload(wallet) { } -function getApps() { - // Query for all appstore transactions/uploads - arweave.arql({ - op: "or", - expr1: { - op: "equals", - expr1: "appstore_filetype", - expr2: "ipa" - }, - expr2: { +function getApps(filetype) { + // Create query + var query; + if(!filetype || filetype == "all") { + query = { + op: "or", + expr1: { + op: "equals", + expr1: "appstore_filetype", + expr2: "ipa" + }, + expr2: { + op: "equals", + expr1: "appstore_filetype", + expr2: "apk" + }, + expr3: { + op: "equals", + expr1: "appstore_filetype", + expr2: "crx" + }, + expr4: { + op: "equals", + expr1: "appstore_filetype", + expr2: "xpi" + } + }; + } else { + query = { op: "equals", expr1: "appstore_filetype", - expr2: "apk" - } - }).then((txids) => { + expr2: filetype + }; + } + + // Query for all appstore transactions/uploads + arweave.arql(query).then((txids) => { + $('#apps').html(''); console.log(txids); // For each app... var count = 0; @@ -202,6 +233,10 @@ function getApps() { $('#apps').append('
Collection
The Perfect Coffee Break
'); count = 0; } + if(count == 1 || count % 3 == 0) { + console.log("count = ", count); + $('#apps').append(''); + } } }) @@ -219,7 +254,7 @@ function getApps() { }); } -getApps(); +getApps("all"); // IPFS Stuff: From 95a672306e5efe45b3a2df91e3eb72d10227f492 Mon Sep 17 00:00:00 2001 From: seenazzz Date: Fri, 19 Jul 2019 18:40:42 -0700 Subject: [PATCH 4/5] Moving readme --- readme.md => README/readme.md | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename readme.md => README/readme.md (100%) diff --git a/readme.md b/README/readme.md similarity index 100% rename from readme.md rename to README/readme.md From ed528c8da8dc9b702fc510f9812329368051a3db Mon Sep 17 00:00:00 2001 From: seenazzz Date: Fri, 19 Jul 2019 18:41:54 -0700 Subject: [PATCH 5/5] Readme --- README/readme.md => readme.md | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename README/readme.md => readme.md (100%) diff --git a/README/readme.md b/readme.md similarity index 100% rename from README/readme.md rename to readme.md