YEW Template
This commit is contained in:
itzelot01
parent
2a926397ff
commit
35bc3d5ed4
|
|
@ -0,0 +1,19 @@
|
|||
[package]
|
||||
name = "trunk-template"
|
||||
version = "0.1.0"
|
||||
edition = "2021"
|
||||
description = "Template for starting a Yew project using Trunk"
|
||||
readme = "README.md"
|
||||
repository = "https://github.com/yewstack/yew-trunk-minimal-template"
|
||||
license = "MIT OR Apache-2.0"
|
||||
keywords = ["yew", "trunk"]
|
||||
categories = ["gui", "wasm", "web-programming"]
|
||||
|
||||
# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
|
||||
[dependencies]
|
||||
ipfs-car = "1.1.0"
|
||||
js-sys = "0.3.66"
|
||||
once_cell = "1.18.0"
|
||||
wasm-bindgen = "0.2.89"
|
||||
wasm-bindgen-futures = "0.4.39"
|
||||
yew = { version="0.20", features=["csr"] }
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>DECA NFTs</title>
|
||||
<script scr="/js/script.js"></script>
|
||||
<link data-trunk rel="sass" href="index.scss" />
|
||||
</head>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
align-items: left;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
background: linear-gradient(#cfb0da 42.44%, #a530e4);
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
main {
|
||||
color: #340034;
|
||||
font-family: TimesNewRoman;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
h1 + .subtitle {
|
||||
display: block;
|
||||
margin-top: -1em;
|
||||
}
|
||||
|
|
@ -0,0 +1,47 @@
|
|||
/* eslint-env browser */
|
||||
import varint from 'varint'
|
||||
import { encode as cborEncode } from '@ipld/dag-cbor'
|
||||
|
||||
/**
|
||||
* @param {import('multiformats').UnknownLink[]} roots
|
||||
* @returns {Uint8Array}
|
||||
*/
|
||||
function encodeHeader (roots) {
|
||||
const headerBytes = cborEncode({ version: 1, roots })
|
||||
const varintBytes = varint.encode(headerBytes.length)
|
||||
const header = new Uint8Array(varintBytes.length + headerBytes.length)
|
||||
header.set(varintBytes, 0)
|
||||
header.set(headerBytes, varintBytes.length)
|
||||
return header
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {import('@ipld/unixfs').Block} block
|
||||
* @returns {Uint8Array}
|
||||
*/
|
||||
function encodeBlock (block) {
|
||||
const varintBytes = varint.encode(block.cid.bytes.length + block.bytes.length)
|
||||
const bytes = new Uint8Array(varintBytes.length + block.cid.bytes.length + block.bytes.length)
|
||||
bytes.set(varintBytes)
|
||||
bytes.set(block.cid.bytes, varintBytes.length)
|
||||
bytes.set(block.bytes, varintBytes.length + block.cid.bytes.length)
|
||||
return bytes
|
||||
}
|
||||
|
||||
/**
|
||||
* @extends {TransformStream<import('@ipld/unixfs').Block, Uint8Array>}
|
||||
*/
|
||||
export class CAREncoderStream extends TransformStream {
|
||||
/** @param {import('multiformats').UnknownLink[]} roots */
|
||||
constructor (roots = []) {
|
||||
super({
|
||||
start: (controller) => controller.enqueue(encodeHeader(roots)),
|
||||
transform: (block, controller) => {
|
||||
controller.enqueue(encodeBlock(block))
|
||||
this.finalBlock = block
|
||||
}
|
||||
})
|
||||
/** @type {import('@ipld/unixfs').Block?} */
|
||||
this.finalBlock = null
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
export function get_now_date() {
|
||||
console.log("get_now_date called!");
|
||||
var curr_date = new Date();
|
||||
return curr_date.toDateString();
|
||||
}
|
||||
|
|
@ -0,0 +1,35 @@
|
|||
export async function getObj(i) {
|
||||
let url = 'https://gateway.decentralizedscience.org/ipfs/bafybeiai4g5mluuwr4ds34jkqi4kojsrqxrcetntkp5tf76jhx6mccrybu/'+i+'.json';
|
||||
let obj = await (await fetch(url)).json();
|
||||
|
||||
//console.log(obj);
|
||||
return obj;
|
||||
}
|
||||
|
||||
var tags;
|
||||
export async function createDiv() {
|
||||
for (var i=1; i<=68; i++) {
|
||||
tags = await get(i);
|
||||
var divTag = document.createElement("div");
|
||||
divTag.id = "div"+i;
|
||||
divTag.className = "responsive";
|
||||
divTag.innerHTML = "<div class='gallery'>"+
|
||||
"<a target='_blank' href='"+tags.image+"'>"+
|
||||
"<img src='"+tags.image+"' alt='"+tags.name+"' width='256' height='256'>"+
|
||||
"</a>"+
|
||||
"<div class='name'>"+tags.name+"</div>"+
|
||||
"<div class='desc'>"+tags.description+"</div>"+
|
||||
"<div class='properties'>"+
|
||||
"<details class='details-example'>"+
|
||||
"<summary>Properties</summary>"+
|
||||
"<ul>"+
|
||||
"<li>"+tags.attributes[0].trait_type+": <b>"+tags.attributes[0].value+"</b></li>"+
|
||||
"<li>"+tags.attributes[1].trait_type+": <b>"+tags.attributes[1].value+"</b></li>"+
|
||||
"<li>"+tags.attributes[2].trait_type+": <b>"+tags.attributes[2].value+"</b></li>"+
|
||||
"</ul>"+
|
||||
"</details>"+
|
||||
"</div>"+
|
||||
"</div>";
|
||||
document.body.appendChild(divTag);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
{
|
||||
"dependencies": {
|
||||
"helia": "^3.0.1",
|
||||
"ipfs-car": "^1.1.0"
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
use wasm_bindgen::prelude::*;
|
||||
|
||||
#[wasm_bindgen(module = "/js/script.js")]
|
||||
extern "C" {
|
||||
#[wasm_bindgen]
|
||||
pub fn get_now_date() -> String;
|
||||
}
|
||||
|
||||
#[wasm_bindgen(module = "/js/index.js")]
|
||||
extern "C"{
|
||||
}
|
||||
|
|
@ -0,0 +1,34 @@
|
|||
use yew::prelude::*;
|
||||
|
||||
mod bindings;
|
||||
|
||||
struct App;
|
||||
|
||||
impl Component for App {
|
||||
type Message = ();
|
||||
type Properties = ();
|
||||
|
||||
fn create(_ctx: &Context<Self>) -> Self {
|
||||
Self
|
||||
}
|
||||
|
||||
fn view(&self, _ctx: &Context<Self>) -> Html {
|
||||
//let get_obj = bindings::getObj();
|
||||
//let obj = use_memo((), get_obj);
|
||||
html! {
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<main>
|
||||
<h1 class="title">{"DECA NFTs"}</h1>
|
||||
<h4>{"These are the DECA NFTs available for giveaway"}</h4>
|
||||
<h2 class="subtitle">{bindings::get_now_date()}</h2>
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
fn main() {
|
||||
yew::Renderer::<App>::new().render();
|
||||
}
|
||||
Loading…
Reference in New Issue