Add tips page + edit readme

README.md

@@ -2,7 +2,7 @@
 
 ✨ Javascript example for cosmJs cosmos sdk
 
-![App Screenshot](https://i.imgur.com/WikPlI6.png)
+![CosmJs Examples](https://i.imgur.com/DANsWWJ.png)
 
 
 ## Installation

src/.vuepress/components/simpleConnect.vue

@@ -28,6 +28,7 @@ export default {
   },
   methods: {
     async getClientNow() {
+      this.loaded = false
       this.inLoading = true
       try {
         const mnemonic = await DirectSecp256k1HdWallet.generate(12) 

src/.vuepress/components/test.vue → src/.vuepress/components/simpleRpc.vue

@@ -30,6 +30,7 @@ export default {
   },
   methods: {
     async getBlockNow() {
+      this.loaded = false
       this.inLoading = true
       try {
         const client = await StargateClient.connect('https://rpc.cosmos.directory/cosmoshub')

src/.vuepress/components/simpleSign.vue

@@ -31,6 +31,7 @@ export default {
   },
   methods: {
     async getSignNow() {
+      this.loaded = false
       this.inLoading = true
       const mnemonic = await DirectSecp256k1HdWallet.generate(12) 
       const wallet = await DirectSecp256k1HdWallet.fromMnemonic(mnemonic.secret.data)

src/.vuepress/components/stargate/getBalance.vue

@@ -0,0 +1,82 @@
+<template> 
+  <div> 
+    <button class="button" @click="getBalanceNow()">
+      <i v-if="!inLoading" class="fa fa-play" aria-hidden="true"></i> 
+      <span v-if="!inLoading"> Try it</span>
+      <i v-if="inLoading" class="fa fa-spinner fa-spin" style="font-size:24px"></i>
+    </button>
+  </div>  
+  <div v-if="loaded" class="language-javascript" data-ext="json">
+    <pre class="language-javascript"><code>{{ getBalance }}</code></pre>   
+  </div>
+  <button v-if="loaded" class="buttonColse" @click="closeResulte()">
+    <i class="fa fa-times" aria-hidden="true"></i> Close result
+  </button>
+</template>
+
+<script> 
+import { StargateClient } from "@cosmjs/stargate"
+
+export default {
+  data() {
+    return {
+      getBalance: '',
+      loaded: false,
+      inLoading: false
+    }
+  },
+  async mounted() {
+ 
+  },
+  methods: {
+    async getBalanceNow() {
+      this.inLoading = true
+      this.loaded = false
+      try {
+        const client = await StargateClient.connect('https://rpc.cosmos.directory/cosmoshub')
+        const getBalance = await client.getBalance('cosmos13jawsn574rf3f0u5rhu7e8n6sayx5gkwjvqrkr', 'uatom')
+        
+        this.getBalance = getBalance
+        this.loaded = true
+        this.inLoading = false
+        client.disconnect()
+      } catch (error) {
+        this.getBalance = "Error! Try again" + error
+        this.loaded = true
+        this.inLoading = false
+      }
+ 
+    },
+    closeResulte() {
+      this.loaded = false
+    }
+  }
+}
+</script> 
+
+<style>
+.button {
+  display: block;
+  width: 100%;
+  border: none;
+  background-color: #343E51;
+  padding: 14px 28px;
+  font-size: 16px;
+  cursor: pointer;
+  text-align: center;
+  border-radius: 4px;
+}
+.buttonColse {
+  display: block;
+  width: 100%;
+  border: none;
+  background-color: #343E51;
+  padding: 14px 28px;
+  font-size: 16px;
+  cursor: pointer;
+  text-align: center;
+  border-radius: 4px;
+}
+  
+</style>
+

src/.vuepress/components/stargate/getBlock.vue

@@ -0,0 +1,76 @@
+<template> 
+  <div> 
+    <button class="button" @click="getBlockNow()">
+      <i v-if="!inLoading" class="fa fa-play" aria-hidden="true"></i> 
+      <span v-if="!inLoading"> Try it</span>
+      <i v-if="inLoading" class="fa fa-spinner fa-spin" style="font-size:24px"></i>
+    </button>
+  </div>  
+  <div v-if="loaded" class="language-javascript" data-ext="json">
+    <pre class="language-javascript"><code>{{ getBlock }}</code></pre>   
+  </div>
+  <button v-if="loaded" class="buttonColse" @click="closeResulte()">
+    <i class="fa fa-times" aria-hidden="true"></i> Close result
+  </button>
+</template>
+
+<script> 
+import { StargateClient } from "@cosmjs/stargate"
+
+export default {
+  data() {
+    return {
+      getBlock: '',
+      loaded: false,
+      inLoading: false
+    }
+  },
+  async mounted() {
+ 
+  },
+  methods: {
+    async getBlockNow() {
+      this.inLoading = true
+      this.loaded = false
+      const client = await StargateClient.connect('https://rpc.cosmos.directory/cosmoshub')
+      const getBlock = await client.getBlock()
+      console.log(getBlock.header)
+
+      this.getBlock = getBlock.header
+      this.loaded = true
+      this.inLoading = false
+      client.disconnect()
+    },
+    closeResulte() {
+      this.loaded = false
+    }
+  }
+}
+</script> 
+
+<style>
+.button {
+  display: block;
+  width: 100%;
+  border: none;
+  background-color: #343E51;
+  padding: 14px 28px;
+  font-size: 16px;
+  cursor: pointer;
+  text-align: center;
+  border-radius: 4px;
+}
+.buttonColse {
+  display: block;
+  width: 100%;
+  border: none;
+  background-color: #343E51;
+  padding: 14px 28px;
+  font-size: 16px;
+  cursor: pointer;
+  text-align: center;
+  border-radius: 4px;
+}
+  
+</style>
+

src/.vuepress/config.ts

@@ -15,9 +15,11 @@ export default defineUserConfig({
   plugins: [
     registerComponentsPlugin({
       components: {
-        test: path.resolve(__dirname, './components/test.vue'),
+        simpleRpc: path.resolve(__dirname, './components/simpleRpc.vue'),
         simpleSign: path.resolve(__dirname, './components/simpleSign.vue'),
         simpleConnect: path.resolve(__dirname, './components/simpleConnect.vue'),
+        getBlock: path.resolve(__dirname, './components/stargate/getBlock.vue'),
+        getBalance: path.resolve(__dirname, './components/stargate/getBalance.vue'),
       },
     }),
   ]

src/.vuepress/navbar.ts

@@ -4,5 +4,6 @@ export default navbar([
   "/",
   "/stargate/",
   "/query/",
-  "/broadcast/" 
+  "/broadcast/",
+  "/tips/" 
 ]);

src/.vuepress/sidebar.ts

@@ -23,6 +23,13 @@ export default sidebar({
       prefix: "broadcast/",
       link: "broadcast/",
       children: "structure",
+    },
+    {
+      text: "Tips and tricks",
+      icon: "book",
+      prefix: "tips/",
+      link: "tips/",
+      children: "structure",
     }
   ],
 });

src/README.md

@@ -42,7 +42,7 @@ try {
   console.log("Error! Try again")
 }
 ```
-<test />
+<simpleRpc />
 
 ### Simple get signer
 

src/broadcast/README.md

@@ -9,4 +9,7 @@ index: false
 copyright: false 
 ---
 
-
+
+::: info
+This page will be completed soon
+:::

src/broadcast/authz.md

@@ -1,10 +1,12 @@
 ---
 title: Authz tx
 icon: file
-order: 3
+order: 2
 copyright: false 
 ---
 
 # Authz tx 
-
+::: info
+This page will be completed soon
+:::
 

src/broadcast/bank.md

@@ -3,8 +3,11 @@ title: Bank tx
 icon: file
 author: atmon3r
 copyright: false 
+order: 1
 ---
 
 # Bank tx 
 
-
+::: info
+This page will be completed soon
+:::

src/broadcast/feegrant.md

@@ -6,4 +6,7 @@ copyright: false
 ---
 
 # Feegrant tx 
-
+
+::: info
+This page will be completed soon
+:::

src/broadcast/gov.md

@@ -4,5 +4,8 @@ icon: file
 author: atmon3r
 copyright: false 
 ---
-# Bank tx 
-
+# Gov tx 
+
+::: info
+This page will be completed soon
+:::

src/broadcast/staking.md

@@ -4,5 +4,8 @@ icon: file
 author: atmon3r
 copyright: false 
 ---
-# Bank tx 
-
+# Staking tx 
+
+::: info
+This page will be completed soon
+:::

src/stargate/README.md

@@ -40,24 +40,27 @@ const client = await StargateClient.connect('https://rpc.cosmos.directory/cosmos
 const getBlock = await client.getBlock()
 console.log(getBlock.header)
 ```
+<getBlock />
 
 ### getBalance() 
 
 ```js
-const getBalance = await client.getBalance('your_address', 'uatom')
+const getBalance = await client.getBalance('cosmos13jawsn574rf3f0u5rhu7e8n6sayx5gkwjvqrkr', 'uatom')
 console.log(getBalance)
 ```
+<getBalance />
+
 
 ### getAllBalances() 
 
 ```js
-const getAllBalances = await client.getAllBalances('your_address')
+const getAllBalances = await client.getAllBalances('cosmos13jawsn574rf3f0u5rhu7e8n6sayx5gkwjvqrkr')
 console.log(getAllBalances)
 ```
 
 ### getBalanceStaked() 
 
 ```js
-const getBalanceStaked = await client.getBalanceStaked('your_address')
+const getBalanceStaked = await client.getBalanceStaked('cosmos13jawsn574rf3f0u5rhu7e8n6sayx5gkwjvqrkr')
 console.log(getBalanceStaked)
 ```

src/tips/README.md

@@ -0,0 +1,10 @@
+---
+home: false
+title: Tips and trick  
+author: atmon3r
+copyright: false
+---
+
+::: info
+This page will be completed soon
+:::