Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
李少辉-开发者
gitlab-foss
提交
b2daa846
G
gitlab-foss
项目概览
李少辉-开发者
/
gitlab-foss
通知
15
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
G
gitlab-foss
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
b2daa846
编写于
4月 06, 2018
作者:
T
Tim Zallmann
提交者:
Phil Hughes
4月 06, 2018
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
Web IDE blob image + default fallback
上级
08e58764
变更
12
隐藏空白更改
内联
并排
Showing
12 changed file
with
246 addition
and
28 deletion
+246
-28
.scss-lint.yml
.scss-lint.yml
+2
-0
app/assets/javascripts/ide/components/ide_file_buttons.vue
app/assets/javascripts/ide/components/ide_file_buttons.vue
+1
-0
app/assets/javascripts/ide/components/ide_status_bar.vue
app/assets/javascripts/ide/components/ide_status_bar.vue
+20
-20
app/assets/javascripts/ide/components/repo_editor.vue
app/assets/javascripts/ide/components/repo_editor.vue
+7
-6
app/assets/javascripts/ide/stores/mutations/file.js
app/assets/javascripts/ide/stores/mutations/file.js
+1
-0
app/assets/javascripts/ide/stores/utils.js
app/assets/javascripts/ide/stores/utils.js
+1
-0
app/assets/javascripts/vue_shared/components/content_viewer/content_viewer.vue
...s/vue_shared/components/content_viewer/content_viewer.vue
+17
-2
app/assets/javascripts/vue_shared/components/content_viewer/lib/viewer_utils.js
.../vue_shared/components/content_viewer/lib/viewer_utils.js
+9
-0
app/assets/javascripts/vue_shared/components/content_viewer/viewers/download_viewer.vue
...red/components/content_viewer/viewers/download_viewer.vue
+52
-0
app/assets/javascripts/vue_shared/components/content_viewer/viewers/image_viewer.vue
...shared/components/content_viewer/viewers/image_viewer.vue
+68
-0
app/assets/stylesheets/pages/repo.scss
app/assets/stylesheets/pages/repo.scss
+39
-0
spec/javascripts/vue_shared/components/content_viewer/content_viewer_spec.js
...e_shared/components/content_viewer/content_viewer_spec.js
+29
-0
未找到文件。
.scss-lint.yml
浏览文件 @
b2daa846
...
...
@@ -59,6 +59,8 @@ linters:
# Reports when you define the same property twice in a single rule set.
DuplicateProperty
:
enabled
:
true
ignore_consecutive
:
-
cursor
# Separate rule, function, and mixin declarations with empty lines.
EmptyLineBetweenBlocks
:
...
...
app/assets/javascripts/ide/components/ide_file_buttons.vue
浏览文件 @
b2daa846
...
...
@@ -36,6 +36,7 @@ export default {
>
<a
v-tooltip
v-if=
"!file.binary"
:href=
"file.blamePath"
:title=
"__('Blame')"
class=
"btn btn-xs btn-transparent blame"
...
...
app/assets/javascripts/ide/components/ide_status_bar.vue
浏览文件 @
b2daa846
<
script
>
import
icon
from
'
~/vue_shared/components/icon.vue
'
;
import
tooltip
from
'
~/vue_shared/directives/tooltip
'
;
import
timeAgoMixin
from
'
~/vue_shared/mixins/timeago
'
;
import
icon
from
'
~/vue_shared/components/icon.vue
'
;
import
tooltip
from
'
~/vue_shared/directives/tooltip
'
;
import
timeAgoMixin
from
'
~/vue_shared/mixins/timeago
'
;
export
default
{
components
:
{
icon
,
export
default
{
components
:
{
icon
,
},
directives
:
{
tooltip
,
},
mixins
:
[
timeAgoMixin
],
props
:
{
file
:
{
type
:
Object
,
required
:
true
,
},
directives
:
{
tooltip
,
},
mixins
:
[
timeAgoMixin
,
],
props
:
{
file
:
{
type
:
Object
,
required
:
true
,
},
},
};
},
};
</
script
>
<
template
>
...
...
@@ -50,7 +48,9 @@
<div
class=
"text-right"
>
{{
file
.
eol
}}
</div>
<div
class=
"text-right"
>
<div
class=
"text-right"
v-if=
"!file.binary"
>
{{
file
.
editorRow
}}
:
{{
file
.
editorColumn
}}
</div>
<div
class=
"text-right"
>
...
...
app/assets/javascripts/ide/components/repo_editor.vue
浏览文件 @
b2daa846
...
...
@@ -171,10 +171,10 @@ export default {
id=
"ide"
class=
"blob-viewer-container blob-editor-container"
>
<div
class=
"ide-mode-tabs clearfix"
v-if=
"!shouldHideEditor"
>
<ul
class=
"nav-links pull-left
"
>
<div
class=
"ide-mode-tabs clearfix"
>
<ul
class=
"nav-links pull-left"
v-if=
"!shouldHideEditor
"
>
<li
:class=
"editTabCSS"
>
<a
href=
"javascript:void(0);"
...
...
@@ -210,9 +210,10 @@ export default {
>
</div>
<content-viewer
v-if=
"
!shouldHideEditor &&
file.viewMode === 'preview'"
v-if=
"
shouldHideEditor ||
file.viewMode === 'preview'"
:content=
"file.content || file.raw"
:path=
"file.path"
:path=
"file.rawPath"
:file-size=
"file.size"
:project-path=
"file.projectId"
/>
</div>
</template>
app/assets/javascripts/ide/stores/mutations/file.js
浏览文件 @
b2daa846
...
...
@@ -43,6 +43,7 @@ export default {
raw
:
null
,
baseRaw
:
null
,
html
:
data
.
html
,
size
:
data
.
size
,
});
},
[
types
.
SET_FILE_RAW_DATA
](
state
,
{
file
,
raw
})
{
...
...
app/assets/javascripts/ide/stores/utils.js
浏览文件 @
b2daa846
...
...
@@ -40,6 +40,7 @@ export const dataStructure = () => ({
eol
:
''
,
viewMode
:
'
edit
'
,
previewMode
:
null
,
size
:
0
,
});
export
const
decorateData
=
entity
=>
{
...
...
app/assets/javascripts/vue_shared/components/content_viewer/content_viewer.vue
浏览文件 @
b2daa846
<
script
>
import
{
viewerInformationForPath
}
from
'
./lib/viewer_utils
'
;
import
MarkdownViewer
from
'
./viewers/markdown_viewer.vue
'
;
import
ImageViewer
from
'
./viewers/image_viewer.vue
'
;
import
DownloadViewer
from
'
./viewers/download_viewer.vue
'
;
export
default
{
props
:
{
content
:
{
type
:
String
,
required
:
true
,
default
:
''
,
},
path
:
{
type
:
String
,
required
:
true
,
},
fileSize
:
{
type
:
Number
,
required
:
false
,
default
:
0
,
},
projectPath
:
{
type
:
String
,
required
:
false
,
...
...
@@ -20,12 +27,18 @@ export default {
},
computed
:
{
viewer
()
{
if
(
!
this
.
path
)
return
null
;
const
previewInfo
=
viewerInformationForPath
(
this
.
path
);
if
(
!
previewInfo
)
return
DownloadViewer
;
switch
(
previewInfo
.
id
)
{
case
'
markdown
'
:
return
MarkdownViewer
;
case
'
image
'
:
return
ImageViewer
;
default
:
return
null
;
return
DownloadViewer
;
}
},
},
...
...
@@ -36,6 +49,8 @@ export default {
<div
class=
"preview-container"
>
<component
:is=
"viewer"
:path=
"path"
:file-size=
"fileSize"
:project-path=
"projectPath"
:content=
"content"
/>
...
...
app/assets/javascripts/vue_shared/components/content_viewer/lib/viewer_utils.js
浏览文件 @
b2daa846
const
viewers
=
{
image
:
{
id
:
'
image
'
,
},
markdown
:
{
id
:
'
markdown
'
,
previewTitle
:
'
Preview Markdown
'
,
...
...
@@ -7,6 +10,12 @@ const viewers = {
const
fileNameViewers
=
{};
const
fileExtensionViewers
=
{
jpg
:
'
image
'
,
jpeg
:
'
image
'
,
gif
:
'
image
'
,
png
:
'
image
'
,
bmp
:
'
image
'
,
ico
:
'
image
'
,
md
:
'
markdown
'
,
markdown
:
'
markdown
'
,
};
...
...
app/assets/javascripts/vue_shared/components/content_viewer/viewers/download_viewer.vue
0 → 100644
浏览文件 @
b2daa846
<
script
>
import
Icon
from
'
../../icon.vue
'
;
import
{
numberToHumanSize
}
from
'
../../../../lib/utils/number_utils
'
;
export
default
{
components
:
{
Icon
,
},
props
:
{
path
:
{
type
:
String
,
required
:
true
,
},
fileSize
:
{
type
:
Number
,
required
:
false
,
default
:
0
,
},
},
computed
:
{
fileSizeReadable
()
{
return
numberToHumanSize
(
this
.
fileSize
);
},
fileName
()
{
return
this
.
path
.
split
(
'
/
'
).
pop
();
},
},
};
</
script
>
<
template
>
<div
class=
"file-container"
>
<div
class=
"file-content"
>
<p
class=
"prepend-top-10 file-info"
>
{{
fileName
}}
(
{{
fileSizeReadable
}}
)
</p>
<a
:href=
"path"
class=
"btn btn-default"
rel=
"nofollow"
download
target=
"_blank"
>
<icon
name=
"download"
css-classes=
"pull-left append-right-8"
:size=
"16"
/>
{{
__
(
'
Download
'
)
}}
</a>
</div>
</div>
</
template
>
app/assets/javascripts/vue_shared/components/content_viewer/viewers/image_viewer.vue
0 → 100644
浏览文件 @
b2daa846
<
script
>
import
{
numberToHumanSize
}
from
'
../../../../lib/utils/number_utils
'
;
export
default
{
props
:
{
path
:
{
type
:
String
,
required
:
true
,
},
fileSize
:
{
type
:
Number
,
required
:
false
,
default
:
0
,
},
},
data
()
{
return
{
width
:
0
,
height
:
0
,
isZoomable
:
false
,
isZoomed
:
false
,
};
},
computed
:
{
fileSizeReadable
()
{
return
numberToHumanSize
(
this
.
fileSize
);
},
},
methods
:
{
onImgLoad
()
{
const
contentImg
=
this
.
$refs
.
contentImg
;
this
.
isZoomable
=
contentImg
.
naturalWidth
>
contentImg
.
width
||
contentImg
.
naturalHeight
>
contentImg
.
height
;
this
.
width
=
contentImg
.
naturalWidth
;
this
.
height
=
contentImg
.
naturalHeight
;
},
onImgClick
()
{
if
(
this
.
isZoomable
)
this
.
isZoomed
=
!
this
.
isZoomed
;
},
},
};
</
script
>
<
template
>
<div
class=
"file-container"
>
<div
class=
"file-content image_file"
>
<img
ref=
"contentImg"
:class=
"
{ 'isZoomable': isZoomable, 'isZoomed': isZoomed }"
:src="path"
:alt="path"
@load="onImgLoad"
@click="onImgClick"/>
<p
class=
"file-info prepend-top-10"
>
<template
v-if=
"fileSize>0"
>
{{
fileSizeReadable
}}
</
template
>
<
template
v-if=
"fileSize>0 && width && height"
>
-
</
template
>
<
template
v-if=
"width && height"
>
{{
width
}}
x
{{
height
}}
</
template
>
</p>
</div>
</div>
</template>
app/assets/stylesheets/pages/repo.scss
浏览文件 @
b2daa846
...
...
@@ -312,6 +312,45 @@
height
:
100%
;
overflow
:
auto
;
.file-container
{
background-color
:
$gray-darker
;
display
:
flex
;
height
:
100%
;
align-items
:
center
;
justify-content
:
center
;
text-align
:
center
;
.file-content
{
padding
:
$gl-padding
;
max-width
:
100%
;
max-height
:
100%
;
img
{
max-width
:
90%
;
max-height
:
90%
;
}
.isZoomable
{
cursor
:
pointer
;
cursor
:
zoom-in
;
&
.isZoomed
{
cursor
:
pointer
;
cursor
:
zoom-out
;
max-width
:
none
;
max-height
:
none
;
margin-right
:
$gl-padding
;
}
}
}
.file-info
{
font-size
:
$label-font-size
;
color
:
$diff-image-info-color
;
}
}
.md-previewer
{
padding
:
$gl-padding
;
}
...
...
spec/javascripts/vue_shared/components/content_viewer/content_viewer_spec.js
浏览文件 @
b2daa846
...
...
@@ -38,4 +38,33 @@ describe('ContentViewer', () => {
done
();
});
});
it
(
'
renders image preview
'
,
done
=>
{
createComponent
({
path
:
'
test.jpg
'
,
fileSize
:
1024
,
});
setTimeout
(()
=>
{
expect
(
vm
.
$el
.
querySelector
(
'
.image_file img
'
).
getAttribute
(
'
src
'
)).
toBe
(
'
test.jpg
'
);
done
();
});
});
it
(
'
renders fallback download control
'
,
done
=>
{
createComponent
({
path
:
'
test.abc
'
,
fileSize
:
1024
,
});
setTimeout
(()
=>
{
expect
(
vm
.
$el
.
querySelector
(
'
.file-info
'
).
textContent
.
trim
()).
toContain
(
'
test.abc (1.00 KiB)
'
,
);
expect
(
vm
.
$el
.
querySelector
(
'
.btn.btn-default
'
).
textContent
.
trim
()).
toContain
(
'
Download
'
);
done
();
});
});
});
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录