forked from TransparentLC/WechatMomentScreenshot
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
1 lines (1 loc) · 32 KB
/
index.html
1
<!doctype html><html><head><title>朋友圈转发截图生成工具</title><meta charset="utf-8"><meta content="width=device-width,initial-scale=1,user-scalable=no" name="viewport"><meta content="TransparentLC" name="author"><meta content="telephone=no" name="format-detection"><meta content="no-referrer-when-downgrade" name="referrer"><meta content="no-siteapp" http-equiv="Cache-Control"><meta content="no-transform" http-equiv="Cache-Control"><link href="https://cdn.jsdelivr.net/npm/mdui@1/dist/css/mdui.min.css" rel="stylesheet"><link href="https://cdn.jsdelivr.net/gh/TransparentLC/WechatMomentScreenshot@5153ab08ffb7c9bdce15bd5ae1f1f15e57e3f927/style.min.css" rel="stylesheet"><script>new URL(location.href).searchParams.has("debug")&&document.write(atob("PHNjcmlwdCBzcmM9Imh0dHBzOi8vY2RuLmpzZGVsaXZyLm5ldC9ucG0vZXJ1ZGEiPjwvc2NyaXB0PjxzY3JpcHQ+ZXJ1ZGEuaW5pdCgpPC9zY3JpcHQ+"))</script></head><body class="mdui-appbar-with-toolbar mdui-theme-accent-pink mdui-theme-primary-indigo"><header class="mdui-appbar mdui-appbar-fixed"><div class="mdui-color-theme mdui-toolbar"><span class="mdui-typo-title">朋友圈转发截图生成工具</span><div class="mdui-toolbar-spacer"></div><a class="mdui-btn mdui-btn-icon" mdui-tooltip="{content:'关于'}" mdui-dialog="{target:'#about'}"><i class="mdui-icon material-icons">info_outline</i></a> <a href="https://github.com/TransparentLC/WechatMomentScreenshot" class="mdui-btn mdui-ripple mdui-btn-icon mdui-ripple-white" id="sourceRepo" mdui-tooltip="{content:'查看 GitHub'}"><svg style="width:24px;height:24px" viewBox="0 0 36 36" class="mdui-icon"><path d="M18,1.4C9,1.4,1.7,8.7,1.7,17.7c0,7.2,4.7,13.3,11.1,15.5c0.8,0.1,1.1-0.4,1.1-0.8c0-0.4,0-1.4,0-2.8c-4.5,1-5.5-2.2-5.5-2.2c-0.7-1.9-1.8-2.4-1.8-2.4c-1.5-1,0.1-1,0.1-1c1.6,0.1,2.5,1.7,2.5,1.7c1.5,2.5,3.8,1.8,4.7,1.4c0.1-1.1,0.6-1.8,1-2.2c-3.6-0.4-7.4-1.8-7.4-8.1c0-1.8,0.6-3.2,1.7-4.4c-0.2-0.4-0.7-2.1,0.2-4.3c0,0,1.4-0.4,4.5,1.7c1.3-0.4,2.7-0.5,4.1-0.5c1.4,0,2.8,0.2,4.1,0.5c3.1-2.1,4.5-1.7,4.5-1.7c0.9,2.2,0.3,3.9,0.2,4.3c1,1.1,1.7,2.6,1.7,4.4c0,6.3-3.8,7.6-7.4,8c0.6,0.5,1.1,1.5,1.1,3c0,2.2,0,3.9,0,4.5c0,0.4,0.3,0.9,1.1,0.8c6.5-2.2,11.1-8.3,11.1-15.5C34.3,8.7,27,1.4,18,1.4z" clip-rule="evenodd" fill="#fff" fill-rule="evenodd"/></svg></a></div></header><div class="mdui-container"><div class="mdui-row"><div class="mdui-col-sm-10 mdui-col-xs-8"><div class="mdui-textfield"><label class="mdui-textfield-label">用户名</label> <input id="configName" type="text" class="mdui-textfield-input"></div></div><div class="mdui-col-xs-4 mdui-col-sm-2"><div class="mdui-textfield"><label class="mdui-textfield-label"> </label> <button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent" onclick="document.getElementById("configAvatar").click()">选择头像</button> <input id="configAvatar" type="file" style="display:none"></div></div></div><div class="mdui-textfield"><label class="mdui-textfield-label">正文</label> <textarea class="mdui-textfield-input" id="configText"></textarea></div><div class="mdui-textfield"><label class="mdui-textfield-label">截图类型</label></div><div class="mdui-row"><div class="mdui-col-xs-6"><label class="mdui-radio"><input id="configTypeText" type="radio" name="group" checked> <i class="mdui-radio-icon"></i>纯文字</label></div><div class="mdui-col-xs-6"><label class="mdui-radio"><input id="configTypeWebsite" type="radio" name="group"> <i class="mdui-radio-icon"></i>分享网页/公众号文章</label></div><div class="mdui-col-xs-6"><label class="mdui-radio"><input id="configTypeSingleImage" type="radio" name="group"> <i class="mdui-radio-icon"></i>图片（单张）</label></div><div class="mdui-col-xs-6"><label class="mdui-radio"><input id="configTypeMultiImage" type="radio" name="group"> <i class="mdui-radio-icon"></i>图片（九宫格）</label></div></div><div id="configWebsite" style="display:none"><div class="mdui-textfield"><label class="mdui-textfield-label">网页标题</label> <input id="configArticleTitle" type="text" class="mdui-textfield-input" value="还不会用Google的你，就要被时代淘汰了"></div><div class="mdui-row"><div class="mdui-col-xs-6"><button class="mdui-btn mdui-btn-block mdui-text-color-theme-accent mdui-ripplet" onclick="document.getElementById("configArticleIcon").click()">上传网页图标</button> <input id="configArticleIcon" type="file" style="display:none"></div><div class="mdui-col-xs-6"><button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent" onclick="getArticleInfo()">自动获取公众号文章标题/封面图</button></div></div></div><div id="configSingleImage" style="display:none"><div class="mdui-row"><div class="mdui-col-xs-6"><button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent" onclick="document.getElementById("configSetSingleImage").click()">上传图片</button></div><div class="mdui-col-xs-6"><button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent" onclick="addPlayIcon()">添加视频播放图标</button></div></div><input id="configSetSingleImage" type="file" style="display:none"></div><div id="configMultiImage" style="display:none"><div class="mdui-m-y-1">请按图片 1 - 9 的顺序添加图片～<br>如果只需要显示一张图片，建议选择“图片（单张）”。</div><div class="mdui-row"><div class="mdui-col-xs-4"><button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent" onclick="document.getElementById("configSetMultiImage1").click()">上传图片 1</button> <input id="configSetMultiImage1" type="file" style="display:none"></div><div class="mdui-col-xs-4"><button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent" onclick="document.getElementById("configSetMultiImage2").click()">上传图片 2</button> <input id="configSetMultiImage2" type="file" style="display:none"></div><div class="mdui-col-xs-4"><button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent" onclick="document.getElementById("configSetMultiImage3").click()">上传图片 3</button> <input id="configSetMultiImage3" type="file" style="display:none"></div><div class="mdui-col-xs-4"><button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent" onclick="document.getElementById("configSetMultiImage4").click()">上传图片 4</button> <input id="configSetMultiImage4" type="file" style="display:none"></div><div class="mdui-col-xs-4"><button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent" onclick="document.getElementById("configSetMultiImage5").click()">上传图片 5</button> <input id="configSetMultiImage5" type="file" style="display:none"></div><div class="mdui-col-xs-4"><button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent" onclick="document.getElementById("configSetMultiImage6").click()">上传图片 6</button> <input id="configSetMultiImage6" type="file" style="display:none"></div><div class="mdui-col-xs-4"><button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent" onclick="document.getElementById("configSetMultiImage7").click()">上传图片 7</button> <input id="configSetMultiImage7" type="file" style="display:none"></div><div class="mdui-col-xs-4"><button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent" onclick="document.getElementById("configSetMultiImage8").click()">上传图片 8</button> <input id="configSetMultiImage8" type="file" style="display:none"></div><div class="mdui-col-xs-4"><button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent" onclick="document.getElementById("configSetMultiImage9").click()">上传图片 9</button> <input id="configSetMultiImage9" type="file" style="display:none"></div><div class="mdui-col-xs-12"><button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent" onclick="clearMultiImage()">清空所有图片</button></div></div></div><div class="mdui-textfield"><label class="mdui-textfield-label">定位</label> <input id="configLocation" type="text" class="mdui-textfield-input" value=""></div><div class="mdui-textfield"><label class="mdui-textfield-label">转发出处</label> <input id="configApp" type="text" class="mdui-textfield-input" value=""><div class="mdui-textfield-helper">设置为“视频号 · ○○○”时将以链接的浅蓝色显示</div></div><div class="mdui-row"><div class="mdui-textfield mdui-col-xs-6"><label class="mdui-textfield-label">发表日期</label> <input id="configPostDate" type="date" class="mdui-textfield-input"></div><div class="mdui-textfield mdui-col-xs-3"><label class="mdui-textfield-label">发表时间</label> <input id="configPostTimeHour" type="number" class="mdui-textfield-input" min="0" max="23"></div><div class="mdui-textfield mdui-col-xs-3"><label class="mdui-textfield-label"> </label> <input id="configPostTimeMinute" type="number" class="mdui-textfield-input" min="0" max="59"></div><div class="mdui-textfield mdui-col-xs-6"><label class="mdui-textfield-label">截图日期</label> <input id="configScreenshotDate" type="date" class="mdui-textfield-input"></div><div class="mdui-textfield mdui-col-xs-3"><label class="mdui-textfield-label">截图时间</label> <input id="configScreenshotTimeHour" type="number" class="mdui-textfield-input" min="0" max="23"></div><div class="mdui-textfield mdui-col-xs-3"><label class="mdui-textfield-label"> </label> <input id="configScreenshotTimeMinute" type="number" class="mdui-textfield-input" min="0" max="59"></div><div class="mdui-textfield mdui-col-sm-6 mdui-col-xs-4"><label class="mdui-textfield-label">点赞数</label> <input id="configLike" type="number" class="mdui-textfield-input" min="0"></div><div class="mdui-col-xs-4 mdui-col-sm-3"><div class="mdui-textfield"><label class="mdui-textfield-label">图片长度</label> <input id="configHeight" type="number" class="mdui-textfield-input" min="1920" value="1920"></div></div><div class="mdui-col-xs-4 mdui-col-sm-3"><div class="mdui-textfield"><label class="mdui-textfield-label"> </label> <button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent" onclick="document.getElementById("configHeight").value=Math.round(document.body.clientHeight/document.body.clientWidth*1080)" mdui-tooltip="{content:'图片宽度默认为 1080 像素，长度根据设备长宽比确定计算，可能和实际存在偏差'}">自动设定</button></div></div><div class="mdui-textfield mdui-col-sm-10 mdui-col-xs-8"><label class="mdui-textfield-label">自定义头像库</label> <input id="configAvatarSet" type="text" class="mdui-textfield-input" list="presetAvatarSet"><datalist id="presetAvatarSet"><option value="https://i.akarin.dev/wms-avatar/avatar-stable.txt"></option><option value="https://i.akarin.dev/wms-avatar/avatar-fast.txt"></option></datalist><div class="mdui-textfield-helper">高级功能，点击<a href="https://github.com/TransparentLC/WechatMomentScreenshot/issues/77" target="_blank" class="mdui-text-color-theme-accent">这里</a>查看详细说明</div></div><div class="mdui-col-xs-4 mdui-col-sm-2"><div class="mdui-textfield"><label class="mdui-textfield-label"> </label> <button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent" onclick="xhrGet(document.getElementById("configAvatarSet").value||"https://i.akarin.dev/wms-avatar/avatar-stable.txt",function(t){loadAvatarSet(t,!0),config.avatarSet=document.getElementById("configAvatarSet").value})">应用</button></div></div></div><div class="mdui-textfield"><label class="mdui-textfield-label">评论区</label></div><div class="mdui-row"><div class="mdui-col-xs-12"><label class="mdui-checkbox"><input id="configShowComment" type="checkbox" name="configShowComment" onclick="document.getElementById("configCommentPreview").classList[this.checked?"remove":"add"]("mdui-hidden")"> <i class="mdui-checkbox-icon"></i> 显示评论区</label></div><div class="mdui-col-xs-12 mdui-hidden" id="configCommentPreview"><div class="mdui-m-y-2 mdui-table-fluid"><table class="mdui-table"><thead><tr><th>#</th><th>用户名</th><th>评论内容</th><th>时间</th></tr></thead><tbody id="configCommentList"></tbody></table></div><div class="mdui-row"><div class="mdui-col-xs-6"><button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent" onclick="document.getElementById("configCommentName").value=randomName(),document.getElementById("configCommentAvatar").value=null" mdui-dialog="{target:'#addComment'}">添加评论</button></div><div class="mdui-col-xs-6"><button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent" onclick="removeComment()">删除评论</button></div></div></div></div><div class="mdui-textfield"><label class="mdui-textfield-label">通知栏</label></div><div class="mdui-row"><div class="mdui-col-xs-6 mdui-col-sm-4"><label class="mdui-checkbox"><input id="configTopBarAppIcons" type="checkbox" name="configTopBarAppIcons"> <i class="mdui-checkbox-icon"></i> 显示 APP 图标</label></div><div class="mdui-col-xs-6 mdui-col-sm-4"><label class="mdui-checkbox"><input id="configTopBarStatusIcons" type="checkbox" name="configTopBarStatusIcons"> <i class="mdui-checkbox-icon"></i> 随机信号和电量</label></div><div class="mdui-col-xs-12 mdui-col-sm-4"><label class="mdui-checkbox"><input id="configTopBarIos" type="checkbox" name="configTopBarIos"> <i class="mdui-checkbox-icon"></i> 使用 iOS 的样式（以上两项不可用）</label></div><div class="mdui-col-sm-10 mdui-col-xs-8"><label class="mdui-checkbox"><input id="configTopBarCustom" type="checkbox" name="configTopBarCustom"> <i class="mdui-checkbox-icon"></i> 使用自定义通知栏图片</label></div><div class="mdui-col-xs-4 mdui-col-sm-2"><button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent" onclick="document.getElementById("configTopBarCustomImage").click()">选择图片</button> <input id="configTopBarCustomImage" type="file" style="display:none"></div></div><div class="mdui-textfield"><label class="mdui-textfield-label">其他</label></div><div class="mdui-row"><div class="mdui-col-xs-6"><label class="mdui-checkbox"><input id="configUIWhite" type="checkbox" name="configUIWhite"> <i class="mdui-checkbox-icon"></i>使用 7.0 以上版本白色界面</label></div><div class="mdui-col-xs-6"><label class="mdui-checkbox"><input id="configFirstAvatar" type="checkbox" name="configFirstAvatar"> <i class="mdui-checkbox-icon"></i>第一个头像固定为自己</label></div></div><button class="mdui-btn mdui-ripple mdui-btn-block mdui-color-theme-accent mdui-m-t-2" id="generate">生成</button> <button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent mdui-m-t-1" onclick="window.open("https://i.akarin.dev/donate/")">请小透明喝一瓶肥宅快乐水～(*´∀`)</button> <button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent mdui-m-t-1" onclick="window.open("https://i.akarin.dev/wms-archive/")">公众号资源分享</button> <button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent mdui-m-t-1" onclick="copyGitLink()">复制本工具的链接，分享给有需要的人(`ヮ´ )</button> <button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent mdui-m-t-1" onclick="localStorage.removeItem("config"),localStorage.removeItem("avatar"),mdui.snackbar({message:"已清除～刷新后将使用默认设置"})">清除保存的设置信息</button><div id="gitLink" style="display:none">https://git.io/WMS</div><div id="fakeWechatMoment"><div class="topBar" id="topBar"><div id="topBarAppIcons"></div><div style="flex-grow:1"></div><img id="topBarIconWifi" class="topBarIcon"> <img id="topBarIconSignal" class="topBarIcon"> <img id="topBarIconBattery" class="topBarIcon"> <span id="topBarTime"></span></div><div class="topBarIos" id="topBarIos"><span id="topBarTimeIos"></span><div style="flex-grow:1"></div><img id="topBarIconIos" class="topBarIcon"></div><div id="topBarCustom"><img id="topBarCustomImage" style="width:100%"></div><div class="header" id="header"><img style="width:28px;height:48px"><div style="flex-grow:1;text-align:center">详情</div><div style="width:28px;transform:scaleX(-100%)">···</div></div><div class="main" id="main"><div style="height:30px"></div><div class="avatarOut"><div class="squareImage avatarIn" id="avatar"></div></div><div class="content"><div class="name" id="name"></div><div style="height:11px"></div><div class="text" id="text"></div><div class="article" id="article" style="display:none"><div class="squareImage articleIcon" id="articleIcon" style="background-image:url(data:image/png;base64,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)"></div><div class="articleTitle" id="articleTitle"></div></div><div class="singleImage" id="singleImage" style="display:none"><img id="image" class="image" src="https://cc-im-kefu-cos.7moor-fs1.com/im/4d2c3f00-7d4c-11e5-af15-41bf63ae4ea0/S9rwwjJo.jpg"></div><div class="multiImage" id="multiImage" style="display:none"><div class="squareImage multiImageBox" id="image1"></div><div class="squareImage multiImageBox" id="image2"></div><div class="squareImage multiImageBox" id="image3"></div><div class="squareImage multiImageBox" id="image4"></div><div class="squareImage multiImageBox" id="image5"></div><div class="squareImage multiImageBox" id="image6"></div><div class="squareImage multiImageBox" id="image7"></div><div class="squareImage multiImageBox" id="image8"></div><div class="squareImage multiImageBox" id="image9"></div></div><div style="height:20px"></div><div class="info"><span id="location" style="color:#576b95"></span><div style="height:20px"></div><span id="time"></span> <svg style="width:40px;height:40px;transform:translateY(4px)" viewBox="0 0 24 24" fill="#576b95"><path d="M15.4117646,4.50000215 L14.6107386,18.117444 C14.5485547,19.1745693 13.6731425,20 12.6141898,20 L5.38581016,20 C4.32685754,20 3.45144525,19.1745693 3.38926141,18.117444 L2.58823542,4.50000215 L0.5,4.50000215 L0.5,3.5 C0.5,3.22385763 0.723857625,3 1,3 L17,3 C17.2761424,3 17.5,3.22385763 17.5,3.5 L17.5,4.50000215 L15.4117646,4.50000215 Z M7,0.500034106 L11,0.500034106 C11.2761424,0.500034106 11.5,0.723891731 11.5,1.00003411 L11.5,2 L6.5,2 L6.5,1.00003411 C6.5,0.723891731 6.72385763,0.500034106 7,0.500034106 Z M6,6.99998133 L6.5,15.9999943 L8,15.9999943 L7.60000038,6.99998133 L6,6.99998133 Z M10.5,6.99998133 L10,15.9999943 L11.5,15.9999943 L12,6.99998133 L10.5,6.99998133 Z"/></svg></div><img style="position:relative;display:inline-block;width:auto;height:42px;top:9px"></div><div style="height:50px"></div><div class="like" id="like"><img style="position:relative;left:30px;top:43px;display:inline-block;vertical-align:top" height="32" src="like.svg" width="32"><div class="likeAvatarList" id="likeAvatarList"></div><div style="height:17px"></div></div><div class="like" id="comment" style="margin-top:1px"><img style="position:relative;left:30px;top:45px;display:inline-block;vertical-align:top" height="32" src="commentlist.svg" width="32"><div class="likeAvatarList" id="commentList"></div></div></div><div class="footer" id="footer"><div class="commentInput">评论</div><div style="width:22px;display:inline-block"></div><img style="width:88px!important;height:88px!important"><div style="width:40px;display:inline-block"></div><div class="commentSend">发送</div></div></div><div class="mdui-m-y-2" id="aboutFooter" style="text-align:center;line-height:1.5em"><a href="https://github.com/TransparentLC/WechatMomentScreenshot" target="_blank" id="aboutFooterBadge" style="text-decoration:none"><img src="https://img.shields.io/github/stars/TransparentLC/WechatMomentScreenshot.svg?style=social"></a><br><span class="mdui-typo-caption-opacity">© 2023 ✨小透明・宸✨</span></div><div class="mdui-dialog" id="addComment"><div class="mdui-dialog-title">添加评论</div><div class="mdui-dialog-content mdui-typo"><div class="mdui-row"><div class="mdui-col-sm-10 mdui-col-xs-8"><div class="mdui-textfield"><label class="mdui-textfield-label">用户名</label> <input id="configCommentName" type="text" class="mdui-textfield-input" value=""><div class="mdui-textfield-helper">默认的名字是随机生成的，未选择头像则会随机抽取一个头像。</div></div></div><div class="mdui-col-xs-4 mdui-col-sm-2"><div class="mdui-textfield"><label class="mdui-textfield-label"> </label> <button class="mdui-btn mdui-ripple mdui-btn-block mdui-text-color-theme-accent" onclick="document.getElementById("configCommentAvatar").click()">上传头像</button> <input id="configCommentAvatar" type="file" style="display:none"></div></div><div class="mdui-col-xs-12"><div class="mdui-textfield"><label class="mdui-textfield-label">评论内容</label> <textarea class="mdui-textfield-input" id="configCommentText"></textarea></div></div><div class="mdui-textfield mdui-col-xs-6"><label class="mdui-textfield-label">评论日期</label> <input id="configCommentDate" type="date" class="mdui-textfield-input"></div><div class="mdui-textfield mdui-col-xs-3"><label class="mdui-textfield-label">评论时间</label> <input id="configCommentTimeHour" type="number" class="mdui-textfield-input" min="0" max="23"></div><div class="mdui-textfield mdui-col-xs-3"><label class="mdui-textfield-label"> </label> <input id="configCommentTimeMinute" type="number" class="mdui-textfield-input" min="0" max="59"></div><div class="mdui-col-xs-12"><div class="mdui-textfield"><label class="mdui-textfield-label">回复给……（可选）</label> <textarea class="mdui-textfield-input" id="configCommentReply"></textarea></div></div></div></div><div class="mdui-dialog-actions"><button class="mdui-btn mdui-ripple" mdui-dialog-close>CANCEL</button> <button class="mdui-btn mdui-ripple" onclick="var avatarSrc=document.getElementById("configCommentAvatar").files[0]?window.URL.createObjectURL(document.getElementById("configCommentAvatar").files[0]):avatarURL[Math.floor(Math.random()*avatarURL.length)],configCommentDate=document.getElementById("configCommentDate").valueAsDate;configCommentDate.setHours(document.getElementById("configCommentTimeHour").value),configCommentDate.setMinutes(document.getElementById("configCommentTimeMinute").value),addComment(avatarSrc,document.getElementById("configCommentName").value,document.getElementById("configCommentText").value,configCommentDate,document.getElementById("configCommentReply").value)" mdui-dialog-close>OK</button></div></div><div class="mdui-dialog" id="generatedPopup"><div class="mdui-dialog-title">生成完毕| ω・`)</div><div class="mdui-dialog-content"><img id="generated"><div class="mdui-text-center mdui-typo-caption-opacity"><p>如果点击“保存”没有反应<br>请尝试长按/右键图片进行另存为操作 ( ﾟ 3ﾟ)</p></div><div class="mdui-typo"><p class="mdui-m-b-1 mdui-text-center">如果这个工具帮到了你，请推荐给更多的人～</p></div></div><div class="mdui-dialog-actions"><a class="mdui-btn mdui-ripple" id="save">保存</a> <button class="mdui-btn mdui-ripple" mdui-dialog-close>关闭</button></div></div><div class="mdui-dialog" id="shareResourcePopup"><div class="mdui-dialog-title">公众号资源共享</div><div class="mdui-dialog-content"><div class="mdui-typo"><p class="mdui-m-b-1">每天都有数十人在使用朋友圈转发截图工具生成截图，从各个公众号<strong>获取 PPT 模板、设计素材、考研/考公/学习资料、数据集等在线资源</strong>，而无需转发朋友圈进行推广集赞，或是购买这些公众号的“VIP 会员”。</p><p class="mdui-m-b-1">如果你愿意<strong>将获取的在线资源分享出来</strong>，或许就可以<strong>帮到其他有类似需求的人</strong>，为他们节省从公众号获取资源的时间～</p><p class="mdui-m-b-1">你可以通过填写<a href="https://wj.qq.com/s2/12913387/8254/" target="_blank" rel="noopener noreferrer">这个问卷</a>来分享你获取的资源，也可以在<a href="https://i.akarin.dev/wms-archive/" target="_blank">“公众号资源分享”</a>查看其他人分享的资源。</p></div></div><div class="mdui-dialog-actions"><button class="mdui-btn mdui-ripple" mdui-dialog-close>下次一定</button> <button class="mdui-btn mdui-ripple" mdui-dialog-close id="shareResourceCopy">我知道了！（复制问卷链接）</button></div></div><div class="mdui-dialog" id="about"><div class="mdui-dialog-title">关于</div><div class="mdui-dialog-content mdui-typo"><h4>这个小工具是什么？</h4>一个因为不喜欢也不想往朋友圈发某些不得不发的废文而做出来的摸鱼产物。<h4>为什么生成的截图和我在手机上截的不一样？能不能做出 iOS 的样式？</h4>不同手机的界面总是有那么一点区别的，要和真正的截图完全一样……我也很难办啊！（摊手）<br>如果实在是很在意通知栏的样式的话，可以从自己的手机上截一个通知栏的图然后覆盖上去……<br>2023.5.8 更新：iOS 的样式已经添加了，不过因为我并没有 iOS 设备，所以只能参考网上找到的截图来写样式，<strong>不一定能做到和实机一样</strong>。<br>2023.6.14 更新：已经添加了使用自定义通知栏图片的选项。可以自行在手机上截图并裁剪出通知栏部分，然后使它出现在生成的截图上。<h4>能不能生成纯文字/转发图片的截图？</h4><del>懒得写样式，心情好的时候再加上～(*´ω`*)</del><br>已经可以生成啦～<h4>生成图片后点击“保存”没有反应？</h4>也可以试试长按图片手动另存为呢( ﾟ 3ﾟ)<h4>开源就是好</h4><ul><li><a href="https://html2canvas.hertzen.com">html2canvas</a> 开源许可：<a href="https://github.com/niklasvh/html2canvas/blob/master/LICENSE">The MIT License</a></li><li><a href="https://www.mdui.org">MDUI</a> 开源许可：<a href="https://github.com/zdhxiong/mdui/blob/master/LICENSE">The MIT License</a></li><li><a href="https://github.com/google/material-design-icons">Material Design icons</a> 开源许可：<a href="https://github.com/google/material-design-icons/blob/master/LICENSE">Apache License 2.0</a></li><li><a href="https://www.iconfont.cn">Iconfont 阿里巴巴矢量图标库</a></li></ul></div><div class="mdui-dialog-actions"><button class="mdui-btn mdui-ripple" mdui-dialog-close>OK</button></div></div><div class="mdui-dialog" id="request"><div class="mdui-dialog-title" id="requestResult"></div><div class="mdui-dialog-content mdui-typo" id="requestResultContent"></div><div class="mdui-dialog-actions"><button class="mdui-btn mdui-ripple" mdui-dialog-close id="requestAction">OK</button></div></div></div><script src="https://cdn.jsdelivr.net/combine/npm/html2canvas@1/dist/html2canvas.min.js,npm/mdui@1/dist/js/mdui.min.js,gh/TransparentLC/WechatMomentScreenshot@37c480453d7fc4a8e42bd5e918a05d4658251496/main.min.js"></script></body></html>