mirror of
https://github.com/status-im/specs.git
synced 2025-02-17 16:37:01 +00:00
8 lines
20 KiB
HTML
8 lines
20 KiB
HTML
<!DOCTYPE html> <html lang="en-US"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=Edge"> <title>12/IPFS gateway for Sticker Pack - Status Specification</title> <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon"> <link rel="stylesheet" href="/assets/css/just-the-docs-default.css"> <script type="text/javascript" src="/assets/js/vendor/lunr.min.js"></script> <script type="text/javascript" src="/assets/js/just-the-docs.js"></script> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- Begin Jekyll SEO tag v2.7.1 --> <title>12/IPFS gateway for Sticker Pack | Status Specification</title> <meta name="generator" content="Jekyll v4.2.1" /> <meta property="og:title" content="12/IPFS gateway for Sticker Pack" /> <meta property="og:locale" content="en_US" /> <link rel="canonical" href="https://specs.status.im/draft/12" /> <meta property="og:url" content="https://specs.status.im/draft/12" /> <meta property="og:site_name" content="Status Specification" /> <meta name="twitter:card" content="summary" /> <meta property="twitter:title" content="12/IPFS gateway for Sticker Pack" /> <script type="application/ld+json"> {"@type":"WebPage","url":"https://specs.status.im/draft/12","headline":"12/IPFS gateway for Sticker Pack","@context":"https://schema.org"}</script> <!-- End Jekyll SEO tag --> </head> <body> <svg xmlns="http://www.w3.org/2000/svg" style="display: none;"> <symbol id="svg-link" viewBox="0 0 24 24"> <title>Link</title> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-link"> <path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path> </svg> </symbol> <symbol id="svg-search" viewBox="0 0 24 24"> <title>Search</title> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-search"> <circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line> </svg> </symbol> <symbol id="svg-menu" viewBox="0 0 24 24"> <title>Menu</title> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-menu"> <line x1="3" y1="12" x2="21" y2="12"></line><line x1="3" y1="6" x2="21" y2="6"></line><line x1="3" y1="18" x2="21" y2="18"></line> </svg> </symbol> <symbol id="svg-arrow-right" viewBox="0 0 24 24"> <title>Expand</title> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-right"> <polyline points="9 18 15 12 9 6"></polyline> </svg> </symbol> <symbol id="svg-doc" viewBox="0 0 24 24"> <title>Document</title> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-file"> <path d="M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z"></path><polyline points="13 2 13 9 20 9"></polyline> </svg> </symbol> </svg> <div class="side-bar"> <div class="site-header"> <a href="https://specs.status.im/" class="site-title lh-tight"> Status Specification </a> <a href="#" id="menu-button" class="site-button"> <svg viewBox="0 0 24 24" class="icon"><use xlink:href="#svg-menu"></use></svg> </a> </div> <nav role="navigation" aria-label="Main" id="site-nav" class="site-nav"> <ul class="nav-list"><li class="nav-list-item"><a href="#" class="nav-list-expander"><svg viewBox="0 0 24 24"><use xlink:href="#svg-arrow-right"></use></svg></a><a href="https://specs.status.im/spec/" class="nav-list-link">Stable specs</a><ul class="nav-list "><li class="nav-list-item "><a href="https://specs.status.im/spec/1" class="nav-list-link">1/CLIENT</a></li><li class="nav-list-item "><a href="https://specs.status.im/spec/10" class="nav-list-link">10/WAKU-USAGE</a></li><li class="nav-list-item "><a href="https://specs.status.im/spec/11" class="nav-list-link">11/WAKU-MAILSERVER</a></li><li class="nav-list-item "><a href="https://specs.status.im/draft/15" class="nav-list-link">15/NOTIFICATIONS</a></li><li class="nav-list-item "><a href="https://specs.status.im/spec/2" class="nav-list-link">2/ACCOUNT</a></li><li class="nav-list-item "><a href="https://specs.status.im/spec/3" class="nav-list-link">3/WHISPER-USAGE</a></li><li class="nav-list-item "><a href="https://specs.status.im/spec/4" class="nav-list-link">4/WHISPER-MAILSERVER</a></li><li class="nav-list-item "><a href="https://specs.status.im/spec/5" class="nav-list-link">5/SECURE-TRANSPORT</a></li><li class="nav-list-item "><a href="https://specs.status.im/spec/6" class="nav-list-link">6/PAYLOADS</a></li><li class="nav-list-item "><a href="https://specs.status.im/spec/8" class="nav-list-link">8/EIPS</a></li><li class="nav-list-item "><a href="https://specs.status.im/spec/9" class="nav-list-link">9/ETHEREUM-USAGE</a></li></ul></li><li class="nav-list-item active"><a href="#" class="nav-list-expander"><svg viewBox="0 0 24 24"><use xlink:href="#svg-arrow-right"></use></svg></a><a href="https://specs.status.im/draft/" class="nav-list-link">Draft specs</a><ul class="nav-list "><li class="nav-list-item active"><a href="https://specs.status.im/draft/12" class="nav-list-link active">12/IPFS gateway for Sticker Pack</a></li><li class="nav-list-item "><a href="https://specs.status.im/draft/13" class="nav-list-link">13/3RD-PARTY-USAGE</a></li><li class="nav-list-item "><a href="https://specs.status.im/draft/14" class="nav-list-link">14/Dapp browser API usage</a></li><li class="nav-list-item "><a href="https://specs.status.im/draft/16" class="nav-list-link">16/Keycard Usage for Wallet and Chat Keys</a></li><li class="nav-list-item "><a href="https://specs.status.im/draft/3" class="nav-list-link">3/WHISPER-USAGE</a></li><li class="nav-list-item "><a href="https://specs.status.im/draft/6" class="nav-list-link">6/PAYLOADS</a></li><li class="nav-list-item "><a href="https://specs.status.im/draft/7" class="nav-list-link">7/GROUP-CHAT</a></li></ul></li><li class="nav-list-item"><a href="#" class="nav-list-expander"><svg viewBox="0 0 24 24"><use xlink:href="#svg-arrow-right"></use></svg></a><a href="https://specs.status.im/raw/" class="nav-list-link">Raw specs</a><ul class="nav-list "><li class="nav-list-item "><a href="https://specs.status.im/raw/16" class="nav-list-link">16/PUSH-NOTIFICATION-SERVER</a></li></ul></li><li class="nav-list-item"><a href="https://specs.status.im/development" class="nav-list-link">DEVELOPMENT</a></li><li class="nav-list-item"><a href="https://specs.status.im/style-guideline" class="nav-list-link">STYLE-GUIDELINE</a></li></ul> </nav> <footer class="site-footer"> This site uses <a href="https://github.com/pmarsceill/just-the-docs">Just the Docs</a>, a documentation theme for Jekyll. </footer> </div> <div class="main" id="top"> <div id="main-header" class="main-header"> <div class="search"> <div class="search-input-wrap"> <input type="text" id="search-input" class="search-input" tabindex="0" placeholder="Search Status Specification" aria-label="Search Status Specification" autocomplete="off"> <label for="search-input" class="search-label"><svg viewBox="0 0 24 24" class="search-icon"><use xlink:href="#svg-search"></use></svg></label> </div> <div id="search-results" class="search-results"></div> </div> </div> <div id="main-content-wrap" class="main-content-wrap"> <nav aria-label="Breadcrumb" class="breadcrumb-nav"> <ol class="breadcrumb-nav-list"> <li class="breadcrumb-nav-list-item"><a href="https://specs.status.im/draft/">Draft specs</a></li> <li class="breadcrumb-nav-list-item"><span>12/IPFS gateway for Sticker Pack</span></li> </ol> </nav> <div id="main-content" class="main-content" role="main"> <h1 id="12ipfs-gateway-for-sticker-pack"> <a href="#12ipfs-gateway-for-sticker-pack" class="anchor-heading" aria-labelledby="12ipfs-gateway-for-sticker-pack"><svg viewBox="0 0 16 16" aria-hidden="true"><use xlink:href="#svg-link"></use></svg></a> 12/IPFS gateway for Sticker Pack </h1> <blockquote> <p>Version: 0.1.0</p> <p>Status: Draft</p> <p>Authors: Gheorghe Pinzaru <a href="mailto:gheorghe@status.im">gheorghe@status.im</a></p> </blockquote> <h2 id="table-of-contents"> <a href="#table-of-contents" class="anchor-heading" aria-labelledby="table-of-contents"><svg viewBox="0 0 16 16" aria-hidden="true"><use xlink:href="#svg-link"></use></svg></a> Table of Contents </h2> <ol> <li><a href="#abstract">Abstract</a></li> <li><a href="#specification">Specification</a></li> <li><a href="#copyright">Copyright</a></li> </ol> <h2 id="abstract"> <a href="#abstract" class="anchor-heading" aria-labelledby="abstract"><svg viewBox="0 0 16 16" aria-hidden="true"><use xlink:href="#svg-link"></use></svg></a> Abstract </h2> <p>This specification describes how Status uses the IPFS gateway to store stickers. The specification explores image format, how a user uploads stickers and how an end user can see them inside the Status app.</p> <h2 id="definition"> <a href="#definition" class="anchor-heading" aria-labelledby="definition"><svg viewBox="0 0 16 16" aria-hidden="true"><use xlink:href="#svg-link"></use></svg></a> Definition </h2> <div class="table-wrapper"><table> <thead> <tr> <th>Term</th> <th>Description</th> </tr> </thead> <tbody> <tr> <td><strong>Stickers</strong></td> <td>A set of images which can be used to express emotions</td> </tr> <tr> <td><strong>Sticker Pack</strong></td> <td>ERC721 token which includes the set of stickers</td> </tr> <tr> <td><strong>IPFS</strong></td> <td>P2P network used to store and share data, in this case, the images for the stickerpack</td> </tr> </tbody> </table></div> <h2 id="specification"> <a href="#specification" class="anchor-heading" aria-labelledby="specification"><svg viewBox="0 0 16 16" aria-hidden="true"><use xlink:href="#svg-link"></use></svg></a> Specification </h2> <h3 id="image-format"> <a href="#image-format" class="anchor-heading" aria-labelledby="image-format"><svg viewBox="0 0 16 16" aria-hidden="true"><use xlink:href="#svg-link"></use></svg></a> Image format </h3> <p>Accepted image file types are <code class="language-plaintext highlighter-rouge">PNG</code>, <code class="language-plaintext highlighter-rouge">JPG/JPEG</code> and <code class="language-plaintext highlighter-rouge">GIF</code>, with a maximum allowed size of 300kb. The minimum sticker image resolution is 512x512, and its background SHOULD be transparent.</p> <h3 id="distribution"> <a href="#distribution" class="anchor-heading" aria-labelledby="distribution"><svg viewBox="0 0 16 16" aria-hidden="true"><use xlink:href="#svg-link"></use></svg></a> Distribution </h3> <p>The node implements sticker packs as <a href="https://eips.ethereum.org/EIPS/eip-721">ERC721 token</a> and contain a set of stickers. The node stores these stickers inside the sticker pack as a set of hyperlinks pointing to IPFS storage. These hyperlinks are publicly available and can be accessed by any user inside the status chat. Stickers can be sent in chat only by accounts that own the sticker pack.</p> <h3 id="ipfs-gateway"> <a href="#ipfs-gateway" class="anchor-heading" aria-labelledby="ipfs-gateway"><svg viewBox="0 0 16 16" aria-hidden="true"><use xlink:href="#svg-link"></use></svg></a> IPFS gateway </h3> <p>At the moment of writing, the current main Status app uses the <a href="https://infura.io/">Infura</a> gateway. However, clients could choose a different gateway or to run own IPFS node. Infura gateway is an HTTPS gateway, which based on an HTTP GET request with the multihash block will return the stored content at that block address.</p> <p>The node requires the use of a gateway to enable easy access to the resources over HTTP. The node stores each image of a sticker inside IPFS using a unique address that is derived from the hash of the file. This ensures that a file can’t be overridden, and an end-user of the IPFS will receive the same file at a given address.</p> <h3 id="security"> <a href="#security" class="anchor-heading" aria-labelledby="security"><svg viewBox="0 0 16 16" aria-hidden="true"><use xlink:href="#svg-link"></use></svg></a> Security </h3> <p>The IPFS gateway acts as an end-user of the IPFS and allows users of the gateway to access IPFS without connection to the P2P network. Usage of a gateway introduces potential risk for the users of that gateway provider. In case of a compromise in the security of the provider, meta information such as IP address, User-Agent and other of its users can be leaked. If the provider servers are unavailable the node loses access through the gateway to the IPFS network.</p> <h3 id="status-sticker-usage"> <a href="#status-sticker-usage" class="anchor-heading" aria-labelledby="status-sticker-usage"><svg viewBox="0 0 16 16" aria-hidden="true"><use xlink:href="#svg-link"></use></svg></a> Status sticker usage </h3> <p>When the app shows a sticker, the Status app makes an HTTP GET request to IPFS gateway using the hyperlink.</p> <p>To send a sticker in chat, a user of Status should buy or install a sticker pack.</p> <p>To be available for installation a Sticker Pack should be submitted to Sticker market by an author.</p> <h4 id="submit-a-sticker"> <a href="#submit-a-sticker" class="anchor-heading" aria-labelledby="submit-a-sticker"><svg viewBox="0 0 16 16" aria-hidden="true"><use xlink:href="#svg-link"></use></svg></a> Submit a sticker </h4> <p>To submit a sticker pack, the author should upload all assets to IPFS. Then generate a payload including name, author, thumbnail, preview and a list of stickers in the <a href="https://github.com/edn-format/edn">EDN format</a>. Following this structure:</p> <div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>{meta {:name "Sticker pack name"
|
||
:author "Author Name"
|
||
:thumbnail "e30101701220602163b4f56c747333f43775fdcbe4e62d6a3e147b22aaf6097ce0143a6b2373"
|
||
:preview "e30101701220ef54a5354b78ef82e542bd468f58804de71c8ec268da7968a1422909357f2456"
|
||
:stickers [{:hash "e301017012207737b75367b8068e5bdd027d7b71a25138c83e155d1f0c9bc5c48ff158724495"}
|
||
{:hash "e301017012201a9cdea03f27cda1aede7315f79579e160c7b2b6a2eb51a66e47a96f47fe5284"}]}}
|
||
</code></pre></div></div> <p>All asset fields, are contenthash fields as per <a href="https://eips.ethereum.org/EIPS/eip-1577">EIP 1577</a>. The node also uploads this payload to IPFS, and the node uses the IPFS address in the content field of the Sticker Market contract. See <a href="https://github.com/status-im/sticker-market/blob/651e88e5f38c690e57ecaad47f46b9641b8b1e27/docs/specification.md">Sticker Market spec</a> for a detailed description of the contract.</p> <h4 id="install-a-sticker-pack"> <a href="#install-a-sticker-pack" class="anchor-heading" aria-labelledby="install-a-sticker-pack"><svg viewBox="0 0 16 16" aria-hidden="true"><use xlink:href="#svg-link"></use></svg></a> Install a sticker pack </h4> <p>To install a sticker pack, the node fetches all sticker packs available in Sticker Market. The node needs the following steps to fetch all sticker packs:</p> <h4 id="1-get-total-number-of-sticker-packs"> <a href="#1-get-total-number-of-sticker-packs" class="anchor-heading" aria-labelledby="1-get-total-number-of-sticker-packs"><svg viewBox="0 0 16 16" aria-hidden="true"><use xlink:href="#svg-link"></use></svg></a> 1. Get total number of sticker packs </h4> <p>Call <code class="language-plaintext highlighter-rouge">packCount()</code> on the sticker market contract, will return number of sticker pack registered as <code class="language-plaintext highlighter-rouge">uint256</code>.</p> <h4 id="2-get-sticker-pack-by-id"> <a href="#2-get-sticker-pack-by-id" class="anchor-heading" aria-labelledby="2-get-sticker-pack-by-id"><svg viewBox="0 0 16 16" aria-hidden="true"><use xlink:href="#svg-link"></use></svg></a> 2. Get sticker pack by id </h4> <p>ID’s are represented as <code class="language-plaintext highlighter-rouge">uint256</code> and are incremental from <code class="language-plaintext highlighter-rouge">0</code> to total number of sticker packs in the contract, received in the previous step. To get a sticker pack call <code class="language-plaintext highlighter-rouge">getPackData(sticker-pack-id)</code>, the return type is <code class="language-plaintext highlighter-rouge">["bytes4[]" "address" "bool" "uint256" "uint256" "bytes"]</code> which represents the following fields: <code class="language-plaintext highlighter-rouge">[category owner mintable timestamp price contenthash]</code>. Price is the SNT value in wei set by sticker pack owner. The contenthash is the IPFS address described in the <a href="#submit-a-sticker">submit description</a> above. Other fields specification could be found in <a href="https://github.com/status-im/sticker-market/blob/651e88e5f38c690e57ecaad47f46b9641b8b1e27/docs/specification.md">Sticker Market spec</a></p> <h5 id="3-get-owned-sticker-packs"> <a href="#3-get-owned-sticker-packs" class="anchor-heading" aria-labelledby="3-get-owned-sticker-packs"><svg viewBox="0 0 16 16" aria-hidden="true"><use xlink:href="#svg-link"></use></svg></a> 3. Get owned sticker packs </h5> <p>The current Status app fetches owned sticker packs during the open of any sticker view (a screen which shows a sticker pack, or the list of sticker packs). To get owned packs, get all owned tokens for the current account address, by calling <code class="language-plaintext highlighter-rouge">balanceOf(address)</code> where address is the address for the current account. This method returns a <code class="language-plaintext highlighter-rouge">uint256</code> representing the count of available tokens. Using <code class="language-plaintext highlighter-rouge">tokenOfOwnerByIndex(address,uint256)</code> method, with the address of the user and ID in form of a <code class="language-plaintext highlighter-rouge">uint256</code> which is an incremented int from 0 to the total number of tokens, gives the token id. To get the sticker pack id from a token call<code class="language-plaintext highlighter-rouge">tokenPackId(uint256)</code> where <code class="language-plaintext highlighter-rouge">uint256</code> is the token id. This method will return an <code class="language-plaintext highlighter-rouge">uint256</code> which is the id of the owned sticker pack.</p> <h5 id="4-buy-a-sticker-pack"> <a href="#4-buy-a-sticker-pack" class="anchor-heading" aria-labelledby="4-buy-a-sticker-pack"><svg viewBox="0 0 16 16" aria-hidden="true"><use xlink:href="#svg-link"></use></svg></a> 4. Buy a sticker pack </h5> <p>To buy a sticker pack call <code class="language-plaintext highlighter-rouge">approveAndCall(address,uint256,bytes)</code> where <code class="language-plaintext highlighter-rouge">address</code> is the address of buyer,<code class="language-plaintext highlighter-rouge">uint256</code> is the price and third parameters <code class="language-plaintext highlighter-rouge">bytes</code> is the callback called if approved. In the callback, call <code class="language-plaintext highlighter-rouge">buyToken(uint256,address,uint256)</code>, first parameter is sticker pack id, second buyers address, and the last is the price.</p> <h2 id="copyright"> <a href="#copyright" class="anchor-heading" aria-labelledby="copyright"><svg viewBox="0 0 16 16" aria-hidden="true"><use xlink:href="#svg-link"></use></svg></a> Copyright </h2> <p>Copyright and related rights waived via <a href="https://creativecommons.org/publicdomain/zero/1.0/">CC0</a>.</p> </div> </div> <div class="search-overlay"></div> </div> </body> </html>
|