share

src/entry/content.js

@@ -8,6 +8,7 @@ import {
     showIframeHandler,
     hideIframeHandler,
     showTwitterPublishDialogHandler,
+    twitterPublishHandler,
     showPinTips,
     init,
     initExecuteScript,
@@ -95,6 +96,9 @@ chrome.runtime.onMessage.addListener((req, sender, sendResponse) => {
         case 'IFRAME_NFT_SHOW_SALE':
             showNFTSale()
             break
+        case "IFRAME_TWITTER_PUBLISH":
+            twitterPublishHandler(req.publishRes);
+            break;
     }
 })
 

src/logic/content/twitter.js

@@ -1,5 +1,5 @@
 import { getChromeStorage, setChromeStorage } from '@/uilts/chromeExtension.js'
-import { throttle, getQueryString, getCookie } from '@/uilts/help'
+import { throttle, getQueryString, getCookie, nextTick } from '@/uilts/help'
 import { discordAuthRedirectUri } from '@/http/configAPI'
 import { reportSrcPublishEvent } from '@/http/publishApi'
 import Report from "@/log-center/log"
@@ -95,6 +95,23 @@ export function showTwitterPublishDialogHandler(publishRes) {
     _publishTweetEvent(publishRes, bindTwitterArtMethod);
 }
 
+export function twitterPublishHandler(res) {
+    let bigBtn = document.querySelector('a[data-testid="SideNav_NewTweet_Button"]');
+    if (bigBtn) {
+        bigBtn.click();
+    } else {
+        let smallBtn = document.querySelector('a[href="/compose/tweet"]')
+        smallBtn && smallBtn.click();
+    }
+
+    nextTick(() => {
+        document.execCommand('selectAll');
+    }, 100).then(() => {
+        document.execCommand('delete');
+        _setPublishContent(res.srcContent);
+    })
+}
+
 export function showPinTips() {
     getChromeStorage('pinData', (res) => {
         if (!res || res.show) {
@@ -1186,7 +1203,7 @@ export const showNFTCard = () => {
             nftElement.innerHTML = `
                 ${iframe.outerHTML}
                 <style>
-                    #de-nft-node {user-select:none; height:297px; margin-bottom:17px; display:none;}
+                    #de-nft-node {height:297px; margin-bottom:17px; display:none;}
                 </style>
             `;
 
@@ -1197,6 +1214,5 @@ export const showNFTCard = () => {
 }
 
 export const showNFTSale = () => {
-    debugger
     document.querySelector('div[id="de-nft-node"]').style.display = 'block';
 }

src/uilts/help.js

@@ -100,4 +100,13 @@ export function getCookie(name){
       }
   }
   return "";
+}
+
+export function nextTick(fn, time = 50) {
+    return new Promise((resolve, reject) => {
+        setTimeout(() => {
+            if (fn) fn();
+            resolve();
+        }, time)
+    })
 }

src/view/nft/card.vue

@@ -2,11 +2,11 @@
     <div class="nft">
         <div class="title">
             <div class="tag">
-                <img class="logo" :src="saleData.nftProjectImg" />
+                <img class="logo" :src="saleData.nftProjectAvatar" />
                 <font class="text">{{saleData.nftProjectName}}</font>
                 <img class="tagImg" :src=" require('@/assets/img/icon-nft.png') " />
             </div>
-            <div class="share">
+            <div class="share" @click="share">
                 <img :src=" require('@/assets/img/icon-ntf-share.png') " />
             </div>
         </div>
@@ -22,6 +22,7 @@
 <script setup>
 import { onBeforeMount, ref } from 'vue'
 import { getTwitterSaleNftProjectInfo } from '@/http/nft'
+import { pageUrl } from "@/http/configAPI.js"
 
 const saleData = ref({});
 
@@ -57,6 +58,13 @@ const getSaleProjectInfo = (account) => {
     })
 }
 
+const share = () => {
+    let url = pageUrl + `/nft/${saleData.value.nftProjectId}`
+    chrome.tabs.getCurrent((tab) => {
+        chrome.tabs.sendMessage(tab.id, { actionType: "IFRAME_TWITTER_PUBLISH", publishRes: { srcContent: url }  });
+    })
+}
+
 onBeforeMount(() => {
     getSaleInfo()
 })
@@ -70,6 +78,7 @@ body {
 .nft {
     width: 100%;
     height:297px;
+    user-select:none;
     border-radius:20px;
     background:#F7F9F9;
     .title {
@@ -99,6 +108,7 @@ body {
             }
         }
         .share {
+            cursor: pointer;
             padding-right:15px;
             img{
                 width:19px;
@@ -121,6 +131,7 @@ body {
         button {
             width:310px;
             height:34px;
+            cursor: pointer;
             color:#ffffff;
             font-size:15px;
             font-weight:bold;