Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
xxadev
vscode
提交
e7d40dd8
V
vscode
项目概览
xxadev
/
vscode
与 Fork 源项目一致
从无法访问的项目Fork
通知
2
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
V
vscode
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
未验证
提交
e7d40dd8
编写于
9月 27, 2019
作者:
M
Miguel Solorio
提交者:
GitHub
9月 27, 2019
浏览文件
操作
浏览文件
下载
差异文件
Merge branch 'master' into misolori/icon-font-settings
上级
a939a80c
408a3eb7
变更
6
显示空白变更内容
内联
并排
Showing
6 changed file
with
130 addition
and
12 deletion
+130
-12
extensions/image-preview/media/loading-dark.svg
extensions/image-preview/media/loading-dark.svg
+31
-0
extensions/image-preview/media/loading-hc.svg
extensions/image-preview/media/loading-hc.svg
+31
-0
extensions/image-preview/media/loading.svg
extensions/image-preview/media/loading.svg
+31
-0
extensions/image-preview/media/main.css
extensions/image-preview/media/main.css
+22
-2
extensions/image-preview/media/main.js
extensions/image-preview/media/main.js
+14
-10
extensions/image-preview/src/preview.ts
extensions/image-preview/src/preview.ts
+1
-0
未找到文件。
extensions/image-preview/media/loading-dark.svg
0 → 100644
浏览文件 @
e7d40dd8
<?xml version='1.0' standalone='no' ?>
<svg
xmlns=
'http://www.w3.org/2000/svg'
version=
'1.1'
width=
'10px'
height=
'10px'
>
<style>
circle {
animation: ball 0.6s linear infinite;
}
circle:nth-child(2) { animation-delay: 0.075s; }
circle:nth-child(3) { animation-delay: 0.15s; }
circle:nth-child(4) { animation-delay: 0.225s; }
circle:nth-child(5) { animation-delay: 0.3s; }
circle:nth-child(6) { animation-delay: 0.375s; }
circle:nth-child(7) { animation-delay: 0.45s; }
circle:nth-child(8) { animation-delay: 0.525s; }
@keyframes ball {
from { opacity: 1; }
to { opacity: 0.3; }
}
</style>
<g
style=
"fill:grey;"
>
<circle
cx=
'5'
cy=
'1'
r=
'1'
style=
'opacity:0.3;'
/>
<circle
cx=
'7.8284'
cy=
'2.1716'
r=
'1'
style=
'opacity:0.3;'
/>
<circle
cx=
'9'
cy=
'5'
r=
'1'
style=
'opacity:0.3;'
/>
<circle
cx=
'7.8284'
cy=
'7.8284'
r=
'1'
style=
'opacity:0.3;'
/>
<circle
cx=
'5'
cy=
'9'
r=
'1'
style=
'opacity:0.3;'
/>
<circle
cx=
'2.1716'
cy=
'7.8284'
r=
'1'
style=
'opacity:0.3;'
/>
<circle
cx=
'1'
cy=
'5'
r=
'1'
style=
'opacity:0.3;'
/>
<circle
cx=
'2.1716'
cy=
'2.1716'
r=
'1'
style=
'opacity:0.3;'
/>
</g>
</svg>
extensions/image-preview/media/loading-hc.svg
0 → 100644
浏览文件 @
e7d40dd8
<?xml version='1.0' standalone='no' ?>
<svg
xmlns=
'http://www.w3.org/2000/svg'
version=
'1.1'
width=
'10px'
height=
'10px'
>
<style>
circle {
animation: ball 0.6s linear infinite;
}
circle:nth-child(2) { animation-delay: 0.075s; }
circle:nth-child(3) { animation-delay: 0.15s; }
circle:nth-child(4) { animation-delay: 0.225s; }
circle:nth-child(5) { animation-delay: 0.3s; }
circle:nth-child(6) { animation-delay: 0.375s; }
circle:nth-child(7) { animation-delay: 0.45s; }
circle:nth-child(8) { animation-delay: 0.525s; }
@keyframes ball {
from { opacity: 1; }
to { opacity: 0.3; }
}
</style>
<g
style=
"fill:white;"
>
<circle
cx=
'5'
cy=
'1'
r=
'1'
style=
'opacity:0.3;'
/>
<circle
cx=
'7.8284'
cy=
'2.1716'
r=
'1'
style=
'opacity:0.3;'
/>
<circle
cx=
'9'
cy=
'5'
r=
'1'
style=
'opacity:0.3;'
/>
<circle
cx=
'7.8284'
cy=
'7.8284'
r=
'1'
style=
'opacity:0.3;'
/>
<circle
cx=
'5'
cy=
'9'
r=
'1'
style=
'opacity:0.3;'
/>
<circle
cx=
'2.1716'
cy=
'7.8284'
r=
'1'
style=
'opacity:0.3;'
/>
<circle
cx=
'1'
cy=
'5'
r=
'1'
style=
'opacity:0.3;'
/>
<circle
cx=
'2.1716'
cy=
'2.1716'
r=
'1'
style=
'opacity:0.3;'
/>
</g>
</svg>
extensions/image-preview/media/loading.svg
0 → 100644
浏览文件 @
e7d40dd8
<?xml version='1.0' standalone='no' ?>
<svg
xmlns=
'http://www.w3.org/2000/svg'
version=
'1.1'
width=
'10px'
height=
'10px'
>
<style>
circle {
animation: ball 0.6s linear infinite;
}
circle:nth-child(2) { animation-delay: 0.075s; }
circle:nth-child(3) { animation-delay: 0.15s; }
circle:nth-child(4) { animation-delay: 0.225s; }
circle:nth-child(5) { animation-delay: 0.3s; }
circle:nth-child(6) { animation-delay: 0.375s; }
circle:nth-child(7) { animation-delay: 0.45s; }
circle:nth-child(8) { animation-delay: 0.525s; }
@keyframes ball {
from { opacity: 1; }
to { opacity: 0.3; }
}
</style>
<g>
<circle
cx=
'5'
cy=
'1'
r=
'1'
style=
'opacity:0.3;'
/>
<circle
cx=
'7.8284'
cy=
'2.1716'
r=
'1'
style=
'opacity:0.3;'
/>
<circle
cx=
'9'
cy=
'5'
r=
'1'
style=
'opacity:0.3;'
/>
<circle
cx=
'7.8284'
cy=
'7.8284'
r=
'1'
style=
'opacity:0.3;'
/>
<circle
cx=
'5'
cy=
'9'
r=
'1'
style=
'opacity:0.3;'
/>
<circle
cx=
'2.1716'
cy=
'7.8284'
r=
'1'
style=
'opacity:0.3;'
/>
<circle
cx=
'1'
cy=
'5'
r=
'1'
style=
'opacity:0.3;'
/>
<circle
cx=
'2.1716'
cy=
'2.1716'
r=
'1'
style=
'opacity:0.3;'
/>
</g>
</svg>
extensions/image-preview/media/main.css
浏览文件 @
e7d40dd8
...
...
@@ -62,11 +62,11 @@ body img {
margin
:
auto
;
}
.container.zoom-in
{
.container.
ready.
zoom-in
{
cursor
:
zoom-in
;
}
.container.zoom-out
{
.container.
ready.
zoom-out
{
cursor
:
zoom-out
;
}
...
...
@@ -76,3 +76,23 @@ body img {
text-decoration
:
underline
;
margin-left
:
5px
;
}
.loading
{
position
:
fixed
;
width
:
30px
;
height
:
30px
;
left
:
50%
;
top
:
50%
;
margin-top
:
-15px
;
margin-left
:
-15px
;
background-image
:
url('./loading.svg')
;
background-size
:
cover
;
}
.vscode-dark
.loading
{
background-image
:
url('./loading-dark.svg')
;
}
.vscode-high-contrast
.loading
{
background-image
:
url('./loading-hc.svg')
;
}
extensions/image-preview/media/main.js
浏览文件 @
e7d40dd8
...
...
@@ -69,13 +69,14 @@
let
scale
=
initialState
.
scale
;
let
ctrlPressed
=
false
;
let
altPressed
=
false
;
let
hasLoadedImage
=
false
;
// Elements
const
container
=
/** @type {HTMLElement} */
(
document
.
querySelector
(
'
body
'
));
const
image
=
document
.
createElement
(
'
img
'
);
function
updateScale
(
newScale
)
{
if
(
!
image
||
!
image
.
parentElement
)
{
if
(
!
image
||
!
hasLoadedImage
||
!
image
.
parentElement
)
{
return
;
}
...
...
@@ -125,7 +126,7 @@
}
function
firstZoom
()
{
if
(
!
image
)
{
if
(
!
image
||
!
hasLoadedImage
)
{
return
;
}
...
...
@@ -134,7 +135,7 @@
}
window
.
addEventListener
(
'
keydown
'
,
(
/** @type {KeyboardEvent} */
e
)
=>
{
if
(
!
image
)
{
if
(
!
image
||
!
hasLoadedImage
)
{
return
;
}
ctrlPressed
=
e
.
ctrlKey
;
...
...
@@ -147,7 +148,7 @@
});
window
.
addEventListener
(
'
keyup
'
,
(
/** @type {KeyboardEvent} */
e
)
=>
{
if
(
!
image
)
{
if
(
!
image
||
!
hasLoadedImage
)
{
return
;
}
...
...
@@ -161,7 +162,7 @@
});
container
.
addEventListener
(
'
click
'
,
(
/** @type {MouseEvent} */
e
)
=>
{
if
(
!
image
)
{
if
(
!
image
||
!
hasLoadedImage
)
{
return
;
}
...
...
@@ -194,7 +195,7 @@
});
container
.
addEventListener
(
'
wheel
'
,
(
/** @type {WheelEvent} */
e
)
=>
{
if
(
!
image
)
{
if
(
!
image
||
!
hasLoadedImage
)
{
return
;
}
...
...
@@ -215,7 +216,7 @@
});
window
.
addEventListener
(
'
scroll
'
,
()
=>
{
if
(
!
image
||
!
image
.
parentElement
||
scale
===
'
fit
'
)
{
if
(
!
image
||
!
hasLoadedImage
||
!
image
.
parentElement
||
scale
===
'
fit
'
)
{
return
;
}
...
...
@@ -229,9 +230,11 @@
container
.
classList
.
add
(
'
zoom-in
'
);
image
.
classList
.
add
(
'
scale-to-fit
'
);
image
.
style
.
visibility
=
'
hidden
'
;
image
.
addEventListener
(
'
load
'
,
()
=>
{
document
.
querySelector
(
'
.loading
'
).
remove
();
hasLoadedImage
=
true
;
if
(
!
image
)
{
return
;
}
...
...
@@ -241,7 +244,9 @@
value
:
`
${
image
.
naturalWidth
}
x
${
image
.
naturalHeight
}
`
,
});
image
.
style
.
visibility
=
'
visible
'
;
container
.
classList
.
add
(
'
ready
'
);
document
.
body
.
append
(
image
);
updateScale
(
scale
);
if
(
initialState
.
scale
!==
'
fit
'
)
{
...
...
@@ -250,7 +255,6 @@
});
image
.
src
=
decodeURI
(
settings
.
src
);
document
.
body
.
append
(
image
);
window
.
addEventListener
(
'
message
'
,
e
=>
{
switch
(
e
.
data
.
type
)
{
...
...
extensions/image-preview/src/preview.ts
浏览文件 @
e7d40dd8
...
...
@@ -96,6 +96,7 @@ export class Preview extends Disposable {
<meta id="image-preview-settings" data-settings="
${
escapeAttribute
(
JSON
.
stringify
(
settings
))}
">
</head>
<body class="container image scale-to-fit">
<div class='loading'></div>
<script src="
${
escapeAttribute
(
this
.
extensionResource
(
'
/media/main.js
'
))}
"></script>
</body>
</html>`
;
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录