Skip to content

Commit 4c4e28b

Browse files
LooLoo
Loo
authored and
Loo
committed
feat: add userInfo, add saveing completed
1 parent 8ce264d commit 4c4e28b

File tree

6 files changed

+107
-16
lines changed

6 files changed

+107
-16
lines changed

‎app/scripts/reactVirtual/interface.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,4 +17,5 @@ export enum WeiboPopType {
1717
typeSelect = `typeSelect`,
1818
saving = `saving`,
1919
stop = `stop`,
20+
completed = `completed`,
2021
}

‎app/scripts/reactVirtual/modules/SavingWeiboPopup.tsx‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,8 @@ const SavingWeiboPopup = () => {
2929
dispatch(
3030
updateState({
3131
stopSaving: true,
32+
totalCountSaveingWeibo: 0,
33+
currentSavingWeiboCount: 0,
3234
showWeiboPop: WeiboPopType.hidden,
3335
})
3436
)
@@ -47,6 +49,8 @@ const SavingWeiboPopup = () => {
4749
dispatch(
4850
updateState({
4951
stopSaving: true,
52+
totalCountSaveingWeibo: 0,
53+
currentSavingWeiboCount: 0,
5054
showWeiboPop: WeiboPopType.hidden,
5155
})
5256
)
@@ -183,6 +187,36 @@ const SavingWeiboPopup = () => {
183187
)
184188
}
185189

190+
if (showWeiboPop == WeiboPopType.completed) {
191+
return (
192+
<div className="flex fixed p-4 inset-0 bg-black bg-opacity-30 z-[9999]">
193+
<div className="bg-white absolute right-[5rem] top-[5rem] rounded-xl h-[14rem] w-[28rem] py-4 pl-8 pr-6 flex flex-col text-gray-500 gap-2">
194+
<div className="title flex w-full text-lg font-bold flex-row gap-2 mt-2">
195+
<span className="">{`已备份完成`}</span>
196+
</div>
197+
<div className="flex ml-1 mt-1 subtitle flex-row w-full text-xs text-gray-800 text-opacity-70 gap-2">
198+
<div className="">
199+
<span>
200+
{currentSavingWeiboCount
201+
? `共备份${currentSavingWeiboCount}条微博`
202+
: `备份微博总数：未知`}
203+
</span>
204+
</div>
205+
</div>
206+
<div className="absolute bottom-6 right-6 flex mt-3 w-full item-center justify-end">
207+
<div className="flex flex-row gap-6">
208+
<button
209+
className="relative cursor-pointer rounded-lg bg-orange-500 px-3 py-1 text-gray-50 shadow-lg shadow-orange-500/50 hover:shadow-orange-600/50 hover:bg-orange-600 active:top-[0.5px] active:left-[0.5px]"
210+
onClick={handleClose}
211+
>
212+
好的
213+
</button>
214+
</div>
215+
</div>
216+
</div>
217+
</div>
218+
)
219+
}
186220
if (showWeiboPop == WeiboPopType.saving) {
187221
return (
188222
<div className="flex fixed p-4 inset-0 bg-black bg-opacity-30 z-[9999]">

‎app/scripts/reactVirtual/slice.ts‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -270,6 +270,7 @@ export const saveWeiboQueue = createAsyncThunk(
270270
updateState({
271271
stopSaving: false,
272272
showWeiboPop: WeiboPopType.saving,
273+
currentSavingWeiboCount: 0,
273274
totalCountSaveingWeibo: 0,
274275
})
275276
)
@@ -306,8 +307,8 @@ export const saveWeiboQueue = createAsyncThunk(
306307
if (_.isEmpty(onePageList)) {
307308
dispatch(
308309
updateState({
309-
showWeiboPop: WeiboPopType.hidden,
310-
currentSavingWeiboCount: 0,
310+
showWeiboPop: WeiboPopType.completed,
311+
// currentSavingWeiboCount: 0,
311312
currentSavingWeiboPicCount: 0,
312313
currentSavingWeiboVideoCount: 0,
313314
})
@@ -342,8 +343,8 @@ export const saveWeiboQueue = createAsyncThunk(
342343
if (isEnd || stopSaving) {
343344
dispatch(
344345
updateState({
345-
showWeiboPop: WeiboPopType.hidden,
346-
currentSavingWeiboCount: 0,
346+
showWeiboPop: WeiboPopType.completed,
347+
// currentSavingWeiboCount: 0,
347348
currentSavingWeiboPicCount: 0,
348349
currentSavingWeiboVideoCount: 0,
349350
})

‎app/scripts/utils/tools.ts‎

Lines changed: 22 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -116,6 +116,7 @@ const convertBlogList = async ({
116116
}: ISaveBlogToZipProps & { zipContainer: JSZip; eachCallback?: (info: any) => void }): Promise<void> => {
117117
const imageFolder = zipContainer.folder('image')
118118
const videoFolder = zipContainer.folder('video')
119+
const userInfo = myBlog?.[0]?.user || {}
119120
let totalPicShowList: { picName: string; url: string }[] = []
120121
let finalList: typeof myBlog = []
121122
let _count = 0
@@ -160,7 +161,7 @@ const convertBlogList = async ({
160161
const url = picInfo?.large?.url || undefined
161162
if (!url) return undefined
162163
return {
163-
picName: url.match(/\/([\da-zA-Z]+\.[a-z]{3,4})$/)?.[1] || `${picKey}.jpg`,
164+
picName: matchImageFromUrl(url) || `${picKey}.jpg`,
164165
url,
165166
}
166167
})
@@ -171,7 +172,7 @@ const convertBlogList = async ({
171172
if (type == `pic`) {
172173
const url = data?.large?.url || undefined
173174
picShows.push({
174-
picName: url.match(/\/([\da-zA-Z]+\.[a-z]{3,4})$/)?.[1] || `${data?.pic_id}.jpg`,
175+
picName: matchImageFromUrl(url) || `${data?.pic_id}.jpg`,
175176
url,
176177
})
177178
}
@@ -215,7 +216,7 @@ const convertBlogList = async ({
215216
const url = picInfo?.large?.url || undefined
216217
if (!url) return undefined
217218
return {
218-
picName: url.match(/\/([\da-zA-Z]+\.[a-z]{3,4})$/)?.[1] || `${picKey}.jpg`,
219+
picName: matchImageFromUrl(url) || `${picKey}.jpg`,
219220
url,
220221
}
221222
})
@@ -226,7 +227,7 @@ const convertBlogList = async ({
226227
if (type == `pic`) {
227228
const url = data?.large?.url || undefined
228229
retweeted_status_picShows.push({
229-
picName: url.match(/\/([\da-zA-Z]+\.[a-z]{3,4})$/)?.[1] || `${data?.pic_id}.jpg`,
230+
picName: matchImageFromUrl(url) || `${data?.pic_id}.jpg`,
230231
url,
231232
})
232233
}
@@ -350,7 +351,19 @@ const convertBlogList = async ({
350351
})
351352
}
352353

353-
zipContainer.file('myblog.js', `window.myblog={"list": ${JSON.stringify(finalList)}}`)
354+
// 下载用户头像
355+
const userPicUrl = userInfo?.avatar_hd || userInfo?.profile_image_url || userInfo?.avatar_large || undefined
356+
if (userPicUrl) {
357+
userInfo.picShow = matchImageFromUrl(userPicUrl)
358+
const picBlob = await fetchToGetImageBlob({ imageUrl: userPicUrl })
359+
if (picBlob) {
360+
imageFolder?.file(userInfo.picShow, picBlob)
361+
}
362+
}
363+
zipContainer.file(
364+
'myblog.js',
365+
`window.myblog={"user": ${JSON.stringify(userInfo)},"list": ${JSON.stringify(finalList)}}`
366+
)
354367

355368
// if (!_.isEmpty(totalPicShowList)) {
356369
// const imageFolder = zipContainer.folder('image')
@@ -393,3 +406,7 @@ const getFileStringFromExtension = async (): Promise<Blob> => {
393406
})
394407
})
395408
}
409+
410+
const matchImageFromUrl = (url: string) => {
411+
return url?.match(/\/([\da-zA-Z]+\.[a-z]{3,4})(\?|$)/)?.[1] || ''
412+
}

‎weiboSave/index.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,11 +13,11 @@
1313
<div class="bg-gray-100">
1414
<div id="weibo-extend-posts" class=" mx-auto my-0 w-[50rem] px-8 flex flex-col gap-6 break-words pb-10">
1515
</div>
16-
<div id="imagePopup" class="hidden fixed p-4 inset-0 items-center justify-center bg-black bg-opacity-50">
16+
<div id="imagePopup" class="hidden fixed p-4 inset-0 items-center justify-center bg-black bg-opacity-50 z-[99]">
1717
<img src="" alt="Popup Image" class="max-w-full max-h-full rounded-xl">
1818
</div>
1919
</div>
2020

21-
<div class=" border-b border-dashed border-gray-100 overflow-scroll text-xs text-gray-500 rounded text-base"></div>
21+
<div class=" border-b border-dashed border-gray-100 overflow-scroll text-gray-500 rounded text-base "></div>
2222
</body>
2323
</html>

‎weiboSave/scripts/weibosave.ts‎

Lines changed: 43 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import $ from 'jquery'
55
import myblog from './myblog.json'
66
import dayjs from 'dayjs'
77

8-
8+
const postContainerClass = `w-full flex flex-col gap-6 break-words pb-10`
99
const postClass = `weibopost bg-white flex-col pt-5 pb-8 px-8 rounded-md flex-col`
1010
const postInsideClass = ` flex flex-col gap-3 w-full max-h-[50rem] overflow-y-scroll`
1111
const textClass = ``
@@ -17,17 +17,30 @@ const videoContainerClass = `video flex flex-col items-center flex-wrap gap-2 mb
1717
const videoClass = `cursor-pointer object-cover rounded-xl max-h-[38rem] w-fit`
1818
const titleClass = `flex flex-col text-gray-500 text-sm italic`
1919

20+
const userInfoContainerClass = ` w-full h-32`
21+
const userInfoInsideClass = `py-4 fixed flex flex-row justify-start items-center gap-6 bg-gray-100 z-10 w-[46rem]`
22+
const userImageContainerClass = `flex w-24 h-24`
23+
const userImageClass = `rounded-full w-24 h-24`
24+
25+
const userProfileContainerClass = `flex flex-col text-black`
26+
27+
const weiboBaseUrl = `https://weibo.com`
28+
2029
const start=async ()=>{
2130
console.log(`start`, start)
2231
console.log(myblog)
23-
const list = myblog.list
32+
const user = myblog.user || {}
33+
const list = myblog.list || []
2434

2535
let isLoaded = false;
2636
$(document).ready(function(){
2737
if(isLoaded) return;
2838
isLoaded = true;
2939
const $body = $(document.body);
30-
const $postsContainer = $body.find("#weibo-extend-posts")
40+
const $weiboExtendPosts = $body.find("#weibo-extend-posts")
41+
const $postsContainer = $("<div>").attr("id", "#weibo-extend-post-container").addClass(postContainerClass)
42+
appendUserInfo({$container: $weiboExtendPosts, userInfo: user})
43+
$weiboExtendPosts.append($postsContainer)
3144
_.each(list, item=>{
3245
const { text, text_raw, picShows, region_name, source, created_at, retweetedBlog} = item || {}
3346
const $post = appendBlog({$container: $postsContainer, blogItem: item, postClass: postClass})
@@ -40,6 +53,31 @@ const start=async ()=>{
4053

4154
start()
4255

56+
const appendUserInfo = ({$container, userInfo}: Record<string, any>)=>{
57+
if(_.isEmpty(userInfo)) return;
58+
const { picShow, screen_name, profile_url, idstr } = userInfo || {}
59+
const $userInfoContainer = $("<div>").addClass(userInfoContainerClass);
60+
const $userImageContainerDiv = $("<div>").addClass(userImageContainerClass)
61+
const $userImage = $("<img>").addClass(userImageClass).attr("src", `./image/${picShow}`)
62+
$userImageContainerDiv.append($userImage)
63+
64+
const $userProfileContainer = $("<div>").addClass(userProfileContainerClass);
65+
const $userNameDiv = $("<div>").addClass(`flex text-xl font-bold cursor-pointer`).append($("<span>").text(screen_name))
66+
$userNameDiv.click(function(){
67+
const userUrl = profile_url ? `${weiboBaseUrl}${profile_url}` : (idstr ? `${weiboBaseUrl}/u/${idstr}` : '')
68+
if(userUrl){
69+
window.open(userUrl, "_blank")
70+
}
71+
})
72+
$userProfileContainer.append($userNameDiv)
73+
74+
const $userInfoInside = $("<div>").addClass(userInfoInsideClass);
75+
$userInfoInside.append($userImageContainerDiv)
76+
$userInfoInside.append($userProfileContainer)
77+
$userInfoContainer.append($userInfoInside)
78+
$container.append($userInfoContainer)
79+
}
80+
4381
const appendBlog = ({$container, blogItem, postClass}: Record<string, any>)=>{
4482
const { text, text_raw, picShows, region_name, source, created_at, user, mediaInfoList, title } = blogItem || {}
4583

@@ -56,9 +94,9 @@ const appendBlog = ({$container, blogItem, postClass}: Record<string, any>)=>{
5694
const userInfoText = `@${user_screen_name}`
5795
let $userInfoDiv = $("<div>").addClass(`flex text-base font-bold text-gray-700 hover:text-orange-500 cursor-pointer`).append($("<span>").html(userInfoText))
5896
$userInfoDiv.click(function(){
59-
const jumpUrl = user_profile_url ? `https://weibo.com${user_profile_url}` : (user_idstr ? `https://weibo.com/u/${user_idstr}` : '')
97+
const jumpUrl = user_profile_url ? `${weiboBaseUrl}${user_profile_url}` : (user_idstr ? `${weiboBaseUrl}/u/${user_idstr}` : '')
6098
if(jumpUrl){
61-
window.open(`https://weibo.com/u/${user_idstr}`, "_blank");
99+
window.open(`${weiboBaseUrl}/u/${user_idstr}`, "_blank");
62100
}
63101
})
64102
$postInside.append($userInfoDiv)

0 commit comments

Comments
 (0)