fix: layout and weibosave

loo-y · Nov 2, 2023 · 67bc046 · 67bc046
1 parent d07e684
commit 67bc046
Show file tree

Hide file tree

Showing 4 changed files with 35 additions and 18 deletions.
diff --git a/app/scripts/reactVirtual/modules/SavingWeiboPopup.tsx b/app/scripts/reactVirtual/modules/SavingWeiboPopup.tsx
@@ -137,7 +137,7 @@ const SavingWeiboPopup = () => {
                                     handleSelectSaveingType(1)
                                 }}
                             ></input>
-                            <label htmlFor="saving_type_bydate" className="ml- cursor-pointer">
+                            <label htmlFor="saving_type_bydate" className="ml-1 cursor-pointer">
                                 按日期
                             </label>
                         </div>

diff --git a/app/scripts/utils/tools.ts b/app/scripts/utils/tools.ts
@@ -92,11 +92,12 @@ export const saveBlogToZip = async ({ myBlog, start, isMyFav, attachedName, each
     ])
     const container = zip.folder(zipFileName) as JSZip
     container.file('index.html', indexHtmlText)
-    const scriptsFolder = container.folder('scripts')
+    const assetsFolder = container.folder('assets')
+    const scriptsFolder = assetsFolder?.folder('scripts')
     scriptsFolder?.file(weibosaveJsName, weibosaveJsText)
-    const styleFolder = container.folder('style')
+    const styleFolder = assetsFolder?.folder('style')
     styleFolder?.file(weibosaveCssName, weibosaveCssText)
-    await convertBlogList({ myBlog: myBlog, zipContainer: container, eachCallback })
+    await convertBlogList({ isMyFav, myBlog: myBlog, zipContainer: assetsFolder, eachCallback })
 
     zip.generateAsync({ type: 'blob' }).then(function (content) {
         // see FileSaver.js
@@ -113,10 +114,11 @@ const fetchFileStringFromExtension = async (fileUrl: string): Promise<any> => {
 const convertBlogList = async ({
     myBlog,
     zipContainer,
+    isMyFav,
     eachCallback,
-}: ISaveBlogToZipProps & { zipContainer: JSZip; eachCallback?: (info: any) => void }): Promise<void> => {
-    const imageFolder = zipContainer.folder('image')
-    const videoFolder = zipContainer.folder('video')
+}: ISaveBlogToZipProps & { zipContainer: JSZip | null; eachCallback?: (info: any) => void }): Promise<void> => {
+    const imageFolder = zipContainer?.folder('image')
+    const videoFolder = zipContainer?.folder('video')
     const userInfo = myBlog?.[0]?.user || {}
     let totalPicShowList: { picName: string; url: string }[] = []
     let finalList: typeof myBlog = []
@@ -148,6 +150,7 @@ const convertBlogList = async ({
             reposts_count,
             mix_media_info,
             title,
+            user,
         } = blogItem || {}
 
         if (!_.isEmpty(page_info?.media_info)) {
@@ -349,6 +352,15 @@ const convertBlogList = async ({
             retweetedBlog,
             mediaInfoList,
             title: title?.text ? { text: title.text } : undefined,
+            user: {
+                avatar_hd: user?.avatar_hd,
+                avatar_large: user?.avatar_large,
+                idstr: user?.idstr,
+                id: user?.idstr,
+                profile_image_url: user?.profile_image_url,
+                profile_url: user?.profile_url,
+                screen_name: user?.screen_name,
+            },
         })
     }
 
@@ -361,13 +373,16 @@ const convertBlogList = async ({
             imageFolder?.file(userInfo.picShow, picBlob)
         }
     }
-    zipContainer.file(
-        'myblog.js',
-        `window.myblog={"user": ${JSON.stringify(userInfo)},"list": ${JSON.stringify(finalList)}}`
-    )
+    const myBlogJson: Record<string, any> = {
+        list: finalList,
+    }
+    if (userInfo && !isMyFav) {
+        myBlogJson.user = userInfo
+    }
+    zipContainer?.file('myblog.js', `window.myblog=${JSON.stringify(myBlogJson)}`)
 
     // if (!_.isEmpty(totalPicShowList)) {
-    //     const imageFolder = zipContainer.folder('image')
+    //     const imageFolder = zipContainer?.folder('image')
     //     // 不能使用Promise.all 会被封调用
     //     for (let picShow of totalPicShowList) {
     //         const picBlob = await fetchToGetImageBlob({ imageUrl: picShow?.url })

diff --git a/weiboSave/index.html b/weiboSave/index.html
@@ -5,9 +5,9 @@
         <meta name="viewport" content="width=device-width, initial-scale=1" />
         <title>weibo-extend</title>
         <meta name="description" content="weibo-extend" />
-        <script src="./myblog.js"></script>
-        <link href="./style/weibosave.css" rel="stylesheet" type="text/css" />
-        <script src="./scripts/weibosave.js" defer="defer"></script>
+        <script src="./assets/myblog.js"></script>
+        <link href="./assets/style/weibosave.css" rel="stylesheet" type="text/css" />
+        <script src="./assets/scripts/weibosave.js" defer="defer"></script>
     </head>
     <body class=" " id="weibo-extend-weibosave">
         <div class="bg-gray-100">

diff --git a/weiboSave/scripts/weibosave.ts b/weiboSave/scripts/weibosave.ts
@@ -26,6 +26,8 @@ const userProfileContainerClass = `flex flex-col text-black`
 
 const weiboBaseUrl = `https://weibo.com`
 
+const assetsPath = "./assets"
+
 const start=async ()=>{
     console.log(`start`, start)
     console.log(myblog)
@@ -58,7 +60,7 @@ const appendUserInfo = ({$container, userInfo}: Record<string, any>)=>{
     const { picShow, screen_name, profile_url, idstr } = userInfo || {}
     const $userInfoContainer = $("<div>").addClass(userInfoContainerClass);
     const $userImageContainerDiv = $("<div>").addClass(userImageContainerClass)
-    const $userImage = $("<img>").addClass(userImageClass).attr("src", `./image/${picShow}`)
+    const $userImage = $("<img>").addClass(userImageClass).attr("src", `${assetsPath}/image/${picShow}`)
     $userImageContainerDiv.append($userImage)
 
     const $userProfileContainer = $("<div>").addClass(userProfileContainerClass);
@@ -116,7 +118,7 @@ const appendBlog = ({$container, blogItem, postClass}: Record<string, any>)=>{
     if(!_.isEmpty(picShows)){
         let $imageContainer = $('<div>').addClass(imageContainerClass);
         _.map(picShows, picItem=>{
-            const srcUrl = `./image/${picItem.picName}`
+            const srcUrl = `${assetsPath}/image/${picItem.picName}`
             let $image = $('<img>').attr('src', srcUrl);
             $image.addClass(imageClass);
             $image.click(function() {
@@ -142,7 +144,7 @@ const appendBlog = ({$container, blogItem, postClass}: Record<string, any>)=>{
         let $videoContainer = $('<div>').addClass(videoContainerClass);
         _.map(mediaInfoList, mediaItem=>{
             const { format, media_id} = mediaItem
-            const srcUrl = `./video/${media_id}.${format}`
+            const srcUrl = `${assetsPath}/video/${media_id}.${format}`
             let $video = $('<video>').attr('src', srcUrl);
             $video.attr("controls", true)
             $video.addClass(videoClass);