The screens for domain owners

2 years ago · b61609444e
9 changed files with 134 additions and 19 deletions
--- a/.idea/workspace.xml
+++ b/.idea/workspace.xml
@ -1,12 +1,16 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <project version="4">
  <component name="ChangeListManager">
-    <list default="true" id="ddb8afd5-d3ba-47b1-b6d0-227403f1abf7" name="Changes" comment="Add (almost) monochrome logo + loading QR on checkout">
+    <list default="true" id="ddb8afd5-d3ba-47b1-b6d0-227403f1abf7" name="Changes" comment="Back button + stuff for deploy">
+      <change afterPath="$PROJECT_DIR$/src/views/IHave.vue" afterDir="false" />
      <change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/api.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/api.ts" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/assets/main.css" beforeDir="false" afterPath="$PROJECT_DIR$/src/assets/main.css" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/components/ZoneTable.vue" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/ZoneTable.vue" afterDir="false" />
      <change beforePath="$PROJECT_DIR$/src/result.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/result.ts" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/router/index.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/router/index.ts" afterDir="false" />
      <change beforePath="$PROJECT_DIR$/src/views/Checkout.vue" beforeDir="false" afterPath="$PROJECT_DIR$/src/views/Checkout.vue" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/tsconfig.json" beforeDir="false" afterPath="$PROJECT_DIR$/tsconfig.json" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/views/IKnow.vue" beforeDir="false" afterPath="$PROJECT_DIR$/src/views/IKnow.vue" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/zone.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/zone.ts" afterDir="false" />
    </list>
    <option name="SHOW_DIALOG" value="false" />
    <option name="HIGHLIGHT_CONFLICTS" value="true" />
@ -74,7 +78,11 @@
      <workItem from="1670927344373" duration="29000" />
      <workItem from="1670927391338" duration="2277000" />
      <workItem from="1671024025708" duration="19806000" />
-      <workItem from="1671204365793" duration="22162000" />
+      <workItem from="1671204365793" duration="23468000" />
+      <workItem from="1671490155427" duration="1029000" />
+      <workItem from="1671554049942" duration="6375000" />
+      <workItem from="1671797380442" duration="603000" />
+      <workItem from="1671887059754" duration="3759000" />
    </task>
    <task id="LOCAL-00001" summary="Wrote the landing">
      <created>1670844191163</created>
@ -167,7 +175,14 @@
      <option name="project" value="LOCAL" />
      <updated>1671302856594</updated>
    </task>
-    <option name="localTasksCounter" value="14" />
+    <task id="LOCAL-00014" summary="Back button + stuff for deploy">
+      <created>1671398124125</created>
+      <option name="number" value="00014" />
+      <option name="presentableId" value="LOCAL-00014" />
+      <option name="project" value="LOCAL" />
+      <updated>1671398124125</updated>
+    </task>
+    <option name="localTasksCounter" value="15" />
    <servers />
  </component>
  <component name="TypeScriptGeneratedFilesManager">
@ -198,6 +213,7 @@
    <MESSAGE value="&quot;All zones&quot; button + some other stuff" />
    <MESSAGE value="Awesome QR at checkout" />
    <MESSAGE value="Add (almost) monochrome logo + loading QR on checkout" />
-    <option name="LAST_COMMIT_MESSAGE" value="Add (almost) monochrome logo + loading QR on checkout" />
+    <MESSAGE value="Back button + stuff for deploy" />
+    <option name="LAST_COMMIT_MESSAGE" value="Back button + stuff for deploy" />
  </component>
 </project>
--- a/src/assets/main.css
+++ b/src/assets/main.css
@ -13,7 +13,7 @@
 a,
 .green {
    text-decoration: none;
-    color: hsla(160, 100%, 37%, 1);
+    color: hsl(201, 100%, 37%);
    transition: 0.4s;
 }

@ -87,7 +87,10 @@ a,
    border-radius: 2rem;
    padding: 2.5rem 32px;
    text-align: center;
-    display: inline-block;
+    display: flex;
+    align-items: center;
+    place-content: center;
+    justify-content: center;
    font-size: 1.6rem;
    font-weight: bold;
    color: #282e46;
--- a/src/components/ZoneTable.vue
+++ b/src/components/ZoneTable.vue
@ -33,7 +33,7 @@ export default {
  props: {
    zones: {
      type: Array[Zone],
-      default: [new Zone("example.ton", 3, 5), new Zone("agorata.ton", 3, 5)]
+      default: [new Zone("example.ton", 3, 5), new Zone("agorata.ton", 3, 5), new Zone("testtesttest.ton", 1, 1)]
    }
  }
 }
--- a/src/result.ts
+++ b/src/result.ts
@ -70,7 +70,8 @@ export class TonLink {
    }

    getLink(): string {
-        let link = `ton://${this.address}/transfer?message=${this.message}`;
+        // todo: use tonapi to run dnsresolve on the address (or move the task to the backend) - domains don't work well in links
+        let link = `ton://transfer/${this.address}?message=${this.message}`;
        if (this.sum !== undefined) {
            link += `&amount=${this.sum}`;
        }
--- a/src/router/index.ts
+++ b/src/router/index.ts
@ -26,6 +26,11 @@ const router = createRouter({
            name: 'IKnow',
            component: () => import('../views/IKnow.vue')
        },
+        {
+            path: '/i-have',
+            name: 'IHave',
+            component: () => import('../views/IHave.vue')
+        },
        {
            path: '/tondns',
            name: 'tondns',
--- a/src/views/Checkout.vue
+++ b/src/views/Checkout.vue
@ -84,7 +84,7 @@ export default {
        imageOptions: {
          hideBackgroundDots: true,
          imageSize: 0.4,
-          margin: 5,
+          margin: 3,
          crossOrigin: 'anonymous',
        },
        dotsOptions: {
--- a/src/views/IHave.vue
+++ b/src/views/IHave.vue
@ -0,0 +1,70 @@
+<template>
+  <WhiteLayout next="">
+    <template v-slot:header>
+      <img src="@/assets/headers/i-know.svg" style="max-height: 100%; max-width: 90%" alt="TON DNS"/>
+    </template>
+    <template v-slot:content>
+      <div class="cont2">
+        <div class="columns-3" style="display: flex; columns: 3; justify-content: center; align-items: center">
+          <div>
+          </div>
+          <div id="great">
+            <p>
+              Very good!<br/>We can help you host a website there or sell subdomains.<br/>
+              For now, you will have to <a href="https://t.me/ennucore">contact us on Telegram</a>. <br/>
+              We are especially interested in partnering with different projects and communities which are interested in distributing domains to their users.<br/>
+              Also, you can always <router-link :to="{name: 'Find'}">buy another domain</router-link>.
+            </p>
+          </div>
+        </div>
+      </div>
+    </template>
+    <template v-slot:buttons>
+      <a href="https://t.me/ennucore">
+        <button class="b blue wide">
+          <span>Contact us</span>
+        </button>
+      </a>
+      <router-link :to="{name: 'Find'}">
+        <button class="b blue wide">
+          <span>Buy a domain</span>
+        </button>
+      </router-link>
+    </template>
+  </WhiteLayout>
+</template>
+
+<script>
+import WhiteLayout from "../components/WhiteLayout.vue";
+
+export default {
+  name: "IHave",
+  components: {WhiteLayout}
+}
+</script>
+
+<style scoped>
+#great {
+  font-size: 3rem;
+}
+
+/* narrow buttons on mobile */
+@media only screen and (max-width: 800px) {
+  .b.blue.wide {
+    max-width: 35vw;
+    min-width: revert;
+  }
+
+  #great {
+    font-size: 1.5rem;
+  }
+}
+.cont2 {
+  /* vertical centering */
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  height: 100%;
+}
+</style>
--- a/src/views/IKnow.vue
+++ b/src/views/IKnow.vue
@ -4,22 +4,24 @@
      <img src="@/assets/headers/i-know.svg" style="max-height: 100%; max-width: 90%" alt="TON DNS"/>
    </template>
    <template v-slot:content>
-      <div class="columns-3" style="display: flex; columns: 3; justify-content: center; align-items: center">
-        <div>
-        </div>
-        <div>
-          <p>That's great!<br/>Maybe, you even have a domain already?</p>
+      <div class="cont2">
+        <div class="columns-3" style="display: flex; columns: 3; justify-content: center; align-items: center">
+          <div>
+          </div>
+          <div id="great">
+            <p>That's great!<br/>Maybe, you even have a domain already?</p>
+          </div>
        </div>
      </div>
    </template>
    <template v-slot:buttons>
-      <router-link to="tondns">
+      <router-link :to="{name: 'IHave'}">
        <button class="b blue wide">
          <img src="@/assets/icons/ton_top.svg" alt="Next"/>
          <span>Yes</span>
        </button>
      </router-link>
-      <router-link to="tondns">
+      <router-link :to="{name: 'tondns'}">
        <button class="b blue wide">
          <img src="@/assets/icons/ton_bottom.svg" alt="Next"/>
          <span>No</span>
@ -39,11 +41,27 @@ export default {
 </script>

 <style scoped>
+#great {
+  font-size: 4rem;
+}
+
 /* narrow buttons on mobile */
@media only screen and (max-width: 800px) {
  .b.blue.wide {
    max-width: 35vw;
    min-width: revert;
  }
+
+  #great {
+    font-size: 2rem;
+  }
+}
+.cont2 {
+  /* vertical centering */
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  height: 100%;
 }
 </style>
--- a/src/zone.ts
+++ b/src/zone.ts
@ -7,10 +7,11 @@ export class Zone {
    price_buy_2?: number;
    price_auction_1?: number;
    price_auction_2?: number;
+	address?: string;

    constructor(zone: string,
                price_buy_1?: number, price_buy_2?: number, price_auction_1?: number, price_auction_2?: number,
-                min_length: number = 2, length_1: number = 3, length_2: number = 8
+                min_length: number = 2, length_1: number = 3, length_2: number = 8, address?: string
                ) {
        this.zone = zone;
        this.min_length = min_length;
@ -20,6 +21,7 @@ export class Zone {
        this.price_buy_2 = price_buy_2;
        this.price_auction_1 = price_auction_1;
        this.price_auction_2 = price_auction_2;
+		this.address = address;
    }

    canBuy(): boolean {