-
Notifications
You must be signed in to change notification settings - Fork 272
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'feat/whole-bundle' into docs
- Loading branch information
Showing
14 changed files
with
179 additions
and
12 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,44 @@ | ||
.replay-labs { | ||
padding: 40px 80px 400px; | ||
height: 100%; | ||
color: white; | ||
text-align: center; | ||
background: linear-gradient(-45deg, #ee7752, #e33d7d, #6d25e0, #23d5ab); | ||
background-size: 400% 400%; | ||
animation: gradient 30s ease infinite; | ||
text-shadow: 0 4px 4px rgba(0, 0, 0, 0.4); | ||
overflow: auto; | ||
h1 { | ||
font-size: 58px; | ||
} | ||
h2 { | ||
font-size: 42px; | ||
color: #e0e0e0; | ||
} | ||
.code-block { | ||
display: inline-block; | ||
margin-block: 40px; | ||
code * { | ||
font-size: 18px; | ||
} | ||
} | ||
.statement { | ||
text-align: right; | ||
&:before { | ||
content: '*'; | ||
margin-right: 4px; | ||
} | ||
} | ||
} | ||
|
||
@keyframes gradient { | ||
0% { | ||
background-position: 0% 50%; | ||
} | ||
50% { | ||
background-position: 100% 50%; | ||
} | ||
100% { | ||
background-position: 0% 50%; | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,49 @@ | ||
import { CodeBlock } from '@/components/CodeBlock'; | ||
import './index.less'; | ||
import { Button, Upload } from 'antd'; | ||
import { UploadOutlined } from '@ant-design/icons'; | ||
|
||
export const ReplayLabs = () => { | ||
return ( | ||
<div className="replay-labs"> | ||
<h1 style={{ textAlign: 'right' }}>欢迎来到回放实验室!</h1> | ||
<div className="statement"> | ||
您的日志数据不会经过服务器传输、完全在您本地客户端运行,可放心使用 | ||
</div> | ||
<h2 style={{ marginTop: 150 }}>一行代码,</h2> | ||
<h2>在项目中接入 PageSpy</h2> | ||
<CodeBlock code='<script src="https://pagespy.org/plugin/whole-bundle/index.min.js" crossorigin="anonymous"></script>' /> | ||
|
||
<h2 style={{ marginTop: '50vh' }}>接入之后,</h2> | ||
<h2>页面会出现右下角所示的 "问题反馈" 组件</h2> | ||
<h2>试着玩一下~</h2> | ||
|
||
<h2 style={{ marginTop: '50vh' }}>一切就绪,</h2> | ||
<h2>点击下方按钮,上传导出的文件</h2> | ||
<Upload | ||
accept=".json" | ||
maxCount={1} | ||
customRequest={async (file) => { | ||
const url = URL.createObjectURL(file.file as File); | ||
const replayURL = `https://pagespy.org/#/replay?url=${url}#Console`; | ||
setTimeout(() => { | ||
window.open(replayURL); | ||
}, 50); | ||
return null; | ||
}} | ||
itemRender={() => null} | ||
> | ||
<Button | ||
size="large" | ||
icon={<UploadOutlined />} | ||
style={{ marginTop: 40 }} | ||
> | ||
上传文件 | ||
</Button> | ||
</Upload> | ||
|
||
<h2 style={{ marginTop: '50vh' }}>开发者,祝你好运!</h2> | ||
<h2>Talk is cheap, the code is shown.</h2> | ||
</div> | ||
); | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters