Skip to content

Commit

Permalink
Merge pull request #22 from hollow-leaf/feat/frontend
Browse files Browse the repository at this point in the history
feat: integration and UIUX improvement
  • Loading branch information
LinXJ1204 authored May 18, 2024
2 parents 16f034a + a0bd4a4 commit 5824747
Show file tree
Hide file tree
Showing 32 changed files with 487 additions and 193 deletions.
72 changes: 72 additions & 0 deletions apps/backend/celestiaHandler/dataSubmithandler.go
Original file line number Diff line number Diff line change
@@ -0,0 +1,72 @@
package main

import (
"bytes"
"encoding/json"
"fmt"
"io/ioutil"
"log"
"net/http"
"strconv"
)

type Metadata struct {
Description string `json:"description"`
External_url string `json:"external_url"`
Image string `json:"image"`
Name string `json:"name"`
Attributes []Attribute `json:"attributes"`
}

type Attribute struct {
Trait_type string `json:"trait_type"`
Value string `json:"value"`
}

type Res struct {
Id int `json:"id"`
Res string `json:"res"`
}

const HOST = "https://psyduck-app.wayneies1206.workers.dev"

func main() {
const file_count = 540
for i := 0; i <= file_count; i++ {
fmt.Println(i)
content, err := ioutil.ReadFile(`/Users/zhengweilin/Downloads/outputsss/` + strconv.FormatUint(uint64(i), 10) + `.json`)
if err != nil {
log.Fatal("Error when opening file: ", err)
}

var payload Metadata
err = json.Unmarshal(content, &payload)
if err != nil {
log.Fatal("Error during Unmarshal(): ", err)
}

if payload.Image != "" {
fmt.Println("UPLOAD")
uploadResult(i, payload.Image)
}
}
}

func uploadResult(id int, uri string) {
jsonString := fmt.Sprintf("{\"URI\":\"%s\",\"id\":%d}", uri, id)
_, err := http.Post(HOST+"/nftURIById", "application/json", bytes.NewReader([]byte(jsonString)))
if err != nil {
fmt.Println("Upload fail: %d", id)
}
}

func getResult(id int) {
jsonString := fmt.Sprintf("{\"id\":%d}", id)
res, err := http.Post(HOST+"/getNftURIById", "application/json", bytes.NewReader([]byte(jsonString)))
if err != nil {
fmt.Println("Upload fail: %d", id)
} else {
fmt.Println(res.Body)

}
}
1 change: 1 addition & 0 deletions apps/backend/go.mod
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ toolchain go1.22.3
require (
github.com/CryptoKass/blobstreamx-example v0.0.0-00010101000000-000000000000
github.com/ethereum/go-ethereum v1.14.0
github.com/joho/godotenv v1.5.1
)

require (
Expand Down
2 changes: 2 additions & 0 deletions apps/backend/go.sum
Original file line number Diff line number Diff line change
Expand Up @@ -173,6 +173,8 @@ github.com/jackpal/go-nat-pmp v1.0.2 h1:KzKSgb7qkJvOUTqYl9/Hg/me3pWgBmERKrTGD7Bd
github.com/jackpal/go-nat-pmp v1.0.2/go.mod h1:QPH045xvCAeXUZOxsnwmrtiCoxIr9eob+4orBN1SBKc=
github.com/jmhodges/levigo v1.0.0 h1:q5EC36kV79HWeTBWsod3mG11EgStG3qArTKcvlksN1U=
github.com/jmhodges/levigo v1.0.0/go.mod h1:Q6Qx+uH3RAqyK4rFQroq9RL7mdkABMcfhEI+nNuzMJQ=
github.com/joho/godotenv v1.5.1 h1:7eLL/+HRGLY0ldzfGMeQkb7vMd0as4CfYvUVzLqw0N0=
github.com/joho/godotenv v1.5.1/go.mod h1:f4LDr5Voq0i2e/R5DDNOoa2zzDfwtkZa6DnEwAbqwq4=
github.com/kisielk/errcheck v1.5.0/go.mod h1:pFxgyoBC7bSaBwPgfKdkLd5X25qrDl4LWUI2bnpBCr8=
github.com/kisielk/gotool v1.0.0/go.mod h1:XhKaO+MFFWcvkIS/tQcRk01m1F5IRFswLeQ+oQHNcck=
github.com/klauspost/compress v1.17.3 h1:qkRjuerhUU1EmXLYGkSH6EZL+vPSxIrYjLNAK4slzwA=
Expand Down
51 changes: 29 additions & 22 deletions apps/backend/main.go
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import (
"context"
"fmt"
"math/big"
"time"

"github.com/LinXJ1204/celestia-da-prover/drawableNft721"
"github.com/ethereum/go-ethereum/accounts/abi/bind"
Expand All @@ -28,31 +29,37 @@ func main() {
fmt.Println(err)
}

start := uint64(GetUpdatedBlock()) + 1
if start == 0 {
return
}
for {

bh := start
fmt.Println(start)
start := uint64(GetUpdatedBlock()) + 1
if start == 0 {
return
}

pp, err := contract.FilterTransfer(&bind.FilterOpts{
Start: start,
Context: ctx,
}, []common.Address{}, []common.Address{}, []*big.Int{})
if err != nil {
fmt.Println(err)
return
}
bh := start
fmt.Println(start)

pp, err := contract.FilterTransfer(&bind.FilterOpts{
Start: start,
Context: ctx,
}, []common.Address{}, []common.Address{}, []*big.Int{})
if err != nil {
fmt.Println(err)
return
}

for pp.Next() {
event := pp.Event
// Print out all caller addresses
fmt.Printf(event.TokenId.String())
bh = event.Raw.BlockNumber
UpdateNftOwnByAddress(event.To.Hex(), uint(event.TokenId.Int64()))
fmt.Println("\n")
}

UpdateBlock(uint(bh))

for pp.Next() {
event := pp.Event
// Print out all caller addresses
fmt.Printf(event.TokenId.String())
bh = event.Raw.BlockNumber
UpdateNftOwnByAddress(event.To.Hex(), uint(event.TokenId.Int64()))
fmt.Println("\n")
time.Sleep(time.Duration(5) * time.Second)
}

UpdateBlock(uint(bh))
}
37 changes: 37 additions & 0 deletions apps/serverless/src/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,43 @@ app.get('/', async (c) => {
return c.text("Hello Hono")
})

app.post('/daSubmitted', async (c) => {
const reqData = await c.req.json()

var namespace = reqData['namespace']
var height = reqData['height']
var id = reqData['id']
if( id == null) {
return c.json({res: "Data Error"})
}
//string
await c.env.psyduck.put(id+"-daSubmitted", namespace + ":" + height)
return c.json({res: "good"})
})

app.post('/nftURIById', async (c) => {
const reqData = await c.req.json()
var uri = reqData['URI']
var id = reqData['id']
if( id == null) {
return c.json({res: "Data Error"})
}
//string
await c.env.psyduck.put(id+"-nftURI", uri)
return c.json({res: "good"})
})

app.post('/getNftURIById', async (c) => {
const reqData = await c.req.json()
var id = reqData['id']
if( id == null) {
return c.json({res: "Data Error"})
}
//string
const res = await c.env.psyduck.get(id+"-nftURI")
return c.json({id: id, uri: res})
})

app.post('/nftOwnByAddress', async (c) => {
const reqData = await c.req.json()

Expand Down
13 changes: 13 additions & 0 deletions apps/serverless/src/model.ts
Original file line number Diff line number Diff line change
Expand Up @@ -25,4 +25,17 @@ export type account = {
export type nftStatus = {
background: string
glasses: string
}

export type nftMeatadata = {
description: string
external_url: string
image: string
name: string
attributes: nftAttributes[]
}

export type nftAttributes = {
trait_type: string
value: string
}
2 changes: 0 additions & 2 deletions apps/web/.env.example

This file was deleted.

Binary file removed apps/web/public/bg.png
Binary file not shown.
Binary file added apps/web/public/bg4_main6_combined.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added apps/web/public/bg7_main9_combined.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed apps/web/public/konan-hero.png
Binary file not shown.
Binary file removed apps/web/public/konan-hero.webp
Binary file not shown.
Binary file removed apps/web/public/konan-nav-logo.webp
Binary file not shown.
Binary file removed apps/web/public/konan_logo.webp
Binary file not shown.
Binary file added apps/web/public/main2_bg.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 1 addition & 1 deletion apps/web/public/sw.js

Large diffs are not rendered by default.

5 changes: 5 additions & 0 deletions apps/web/src/app/globals.css
Original file line number Diff line number Diff line change
Expand Up @@ -87,3 +87,8 @@
font-style: normal;
}

.poetsen-one-regular {
font-family: "Poetsen One", sans-serif;
font-weight: 1600;
font-style: normal;
}
38 changes: 38 additions & 0 deletions apps/web/src/components/MintNftButton.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
import { blackstoneABI } from '@/contracts/blackstone'
import { useAccount, useWriteContract } from 'wagmi'
import { Message } from './message'

export function MintNftButton(props: {price: number}) {
const { address, isConnected, isDisconnected } = useAccount()

const { writeContract, isError, isSuccess, error, isPending } = useWriteContract()

async function mintHandler () {
console.log(123)
writeContract({
abi: blackstoneABI,
address: '0x585a1DDaB9116F483d367bCa6eb64797252051c8',
functionName: 'publicSaleMint',
args: [
1
],
value: BigInt(1000000000000)
})
}

return (
<div>
<div className="flex flex-col justify-center items-center">
{isConnected?
<button onClick={mintHandler} type="button" className="text-white bg-gradient-to-r from-purple-500 to-pink-500 hover:bg-gradient-to-l focus:ring-4 focus:outline-none focus:ring-purple-200 dark:focus:ring-purple-800 font-medium rounded-full text-xl px-10 py-6 text-center me-2 mb-2">Mint Now!</button>
:
<button type="button" className="text-white bg-gray-200 hover:bg-gradient-to-l focus:ring-4 focus:outline-none focus:ring-purple-200 dark:focus:ring-purple-800 font-medium rounded-full text-xl px-10 py-6 text-center me-2 mb-2" disabled>Mint Now!</button>
}
{isConnected?<></>
:
<p className='text-gray-400'>Connect wallet and mint!</p>
}
</div>
</div>
)
}
86 changes: 24 additions & 62 deletions apps/web/src/components/Mint_nft.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
"use client";
import { Box, Button, IconButton, Typography } from "@mui/material";
import { Avatar, Box, Button, IconButton, Typography } from "@mui/material";
import React, { Suspense, useState, useEffect } from "react";
import {
Flag as FlagIcon,
Expand All @@ -8,70 +8,32 @@ import {
} from "@mui/icons-material";
import { useAccount } from "wagmi";
import { Loading } from "@/components";
import { MintNftButton } from "./MintNftButton";

export function Mint_nft() {
const [isClient, setIsClient] = useState(false);

const { address, isConnecting, isDisconnected, isConnected } = useAccount();
useEffect(() => {
if (isConnected === true) {
setIsClient(true);
} else {
setIsClient(false);
}
}, [isConnected]);

return (
<>
{isClient ? (
<Suspense fallback={<Loading />}>
<Box className="flex w-full overflow-hidden justify-center items-center mx-auto">
<Box className="flex flex-col w-full gap-10">
<Box className="w-full flex flex-col xl:flex-row gap-5 justify-center items-center px-16">
<Box className="xl:w-1/2 flex justify-center">
<Box className="mx-10 flex min-w-80 min-h-80 xl:min-w-120 xl:min-h-28 rounded-lg bg-center bg-cover bg-[url('/konan-hero.webp')] object-contain py-64" />
</Box>
<Box className="xl:w-1/2 gap-5 flex flex-col px-10 xl:px-0">
<Typography className="text-4xl text-black font-bold">
NFT Mint
</Typography>
<Typography className="text-xl text-black ">
You can also use variant modifiers to target media queries
like responsive breakpoints, dark mode,
prefers-reduced-motion, and more. For example, use
md:scroll-m-0 to apply the scroll-m-0 utility at only medium
screen sizes and above.
</Typography>
<Typography className="text-xl text-black font-bold">
Price:
</Typography>
<Typography className="text-xl text-black font-bold">
Date:
</Typography>
<Box className="flex flex-row gap-2 mt-5">
<IconButton className="border bg-gray-500 rounded-full">
<SmsIcon className="text-white hover:text-black" />
</IconButton>
<IconButton className="border bg-gray-500 rounded-full">
<DirectionsIcon className="text-white hover:text-black" />
</IconButton>
<IconButton className="border bg-gray-500 rounded-full">
<FlagIcon className="text-white hover:text-black" />
</IconButton>
<Button className="bg-gray-500 w-20 rounded-3xl text-white hover:bg-gray-500 hover:shadow-lg">
Mint
</Button>
</Box>
</Box>
</Box>
</Box>
</Box>
</Suspense>
) : (
<Box className="flex flex-col justify-center items-center h-screen">
<Loading />
<Typography variant="h5">Connect wallet to mint nft</Typography>
</Box>
)}
</>
<div className="w-full flex flex-col items-center bg-white rounded-3xl m-4 bg-opacity-30 text-black">
<div className="flex w-full px-5">
<div className="m-2">
<div className="rounded-full border-2 border-orage-200 overflow-hidden">
<Avatar
src={"/main1.png"}
alt="Konan logo"
sx={{ width: 80, height: 80 }}
/>
</div>
</div>
<div className="m-2 content-center">
<Typography className="text-3xl font-bold">#Dinosaur</Typography>
<Typography className="text-xl">@By Sophia</Typography>
</div>
</div>
<div className="w-full flex flex-col items-center mb-10">
<img className="object-contain w-7/12 rounded-xl" src={"https://gateway.pinata.cloud/ipfs/QmeobMV4X8WZNfQJhmUgMFh3gZ6rAsWD63wVuENazZM24Z"} alt="image description" />
</div>
<MintNftButton price={1000000000000}/>
</div>
);
}
1 change: 0 additions & 1 deletion apps/web/src/components/Team.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,6 @@ export function Team() {
<LinkedIn className="text-2xl hover:text-gray-500" />
</Link>
</div>

</div>
</Box>
))}
Expand Down
Loading

0 comments on commit 5824747

Please sign in to comment.