Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
xxadev
vscode
提交
ec3c967a
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,发现更多精彩内容 >>
提交
ec3c967a
编写于
4月 10, 2018
作者:
P
Peng Lyu
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
Add review mode overlay in the editor.
上级
260d2992
变更
3
隐藏空白更改
内联
并排
Showing
3 changed file
with
180 addition
and
25 deletion
+180
-25
src/vs/editor/contrib/review/review.css
src/vs/editor/contrib/review/review.css
+20
-0
src/vs/editor/contrib/review/review.ts
src/vs/editor/contrib/review/review.ts
+131
-25
src/vs/editor/contrib/review/reviewModel.ts
src/vs/editor/contrib/review/reviewModel.ts
+29
-0
未找到文件。
src/vs/editor/contrib/review/review.css
浏览文件 @
ec3c967a
...
...
@@ -3,6 +3,22 @@
* Licensed under the MIT License. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/
.monaco-editor
.review-switch-widget
{
padding
:
5px
10px
;
background
:
#fc618d
;
border-radius
:
6px
;
opacity
:
0.9
;
}
.monaco-editor
.review-switch-widget.inactive
{
background
:
#363537
;
}
.monaco-editor
.review-switch-widget
:hover
{
opacity
:
1
;
cursor
:
pointer
;
}
.monaco-editor
.margin-view-overlays
.review
{
background-image
:
url('comment.svg')
;
cursor
:
pointer
;
...
...
@@ -23,6 +39,10 @@
position
:
absolute
;
}
.monaco-editor
.review-widget
.head
{
height
:
100%
;
}
.monaco-editor
.review-widget
.body
.review-comment
{
margin-left
:
20px
;
padding
:
8px
16px
8px
0px
;
...
...
src/vs/editor/contrib/review/review.ts
浏览文件 @
ec3c967a
...
...
@@ -6,9 +6,10 @@
import
'
vs/css!./review
'
;
import
*
as
nls
from
'
vs/nls
'
;
import
*
as
dom
from
'
vs/base/browser/dom
'
;
import
*
as
modes
from
'
vs/editor/common/modes
'
;
import
{
IEditorContribution
}
from
'
vs/editor/common/editorCommon
'
;
import
{
ICodeEditor
,
IEditorMouseEvent
,
MouseTargetType
,
IViewZone
}
from
'
vs/editor/browser/editorBrowser
'
;
import
{
ICodeEditor
,
IEditorMouseEvent
,
MouseTargetType
,
IViewZone
,
IOverlayWidget
,
IOverlayWidgetPosition
,
OverlayWidgetPositionPreference
}
from
'
vs/editor/browser/editorBrowser
'
;
import
{
$
}
from
'
vs/base/browser/builder
'
;
import
{
IDisposable
,
dispose
}
from
'
vs/base/common/lifecycle
'
;
import
{
registerEditorContribution
}
from
'
vs/editor/browser/editorExtensions
'
;
...
...
@@ -29,6 +30,9 @@ import { peekViewEditorBackground, peekViewBorder, } from 'vs/editor/contrib/ref
import
{
Color
}
from
'
vs/base/common/color
'
;
import
{
IMarginData
}
from
'
vs/editor/browser/controller/mouseTarget
'
;
import
{
ICommandService
}
from
'
vs/platform/commands/common/commands
'
;
import
{
Emitter
,
Event
}
from
'
vs/base/common/event
'
;
import
{
Widget
}
from
'
vs/base/browser/ui/widget
'
;
import
{
ReviewModel
,
ReviewStyle
}
from
'
vs/editor/contrib/review/reviewModel
'
;
export
const
ctxReviewPanelVisible
=
new
RawContextKey
<
boolean
>
(
'
reviewPanelVisible
'
,
false
);
export
const
ID
=
'
editor.contrib.review
'
;
...
...
@@ -72,6 +76,7 @@ export class ReviewZoneWidget extends ZoneWidget {
private
_bodyElement
:
HTMLElement
;
private
_resizeObserver
:
any
;
private
_comments
:
modes
.
Comment
[];
private
_onDidClose
=
new
Emitter
<
ReviewZoneWidget
>
();
constructor
(
private
readonly
themeService
:
IThemeService
,
...
...
@@ -85,6 +90,10 @@ export class ReviewZoneWidget extends ZoneWidget {
this
.
themeService
.
onThemeChange
(
this
.
_applyTheme
,
this
);
}
public
get
onDidClose
():
Event
<
ReviewZoneWidget
>
{
return
this
.
_onDidClose
.
event
;
}
protected
_fillContainer
(
container
:
HTMLElement
):
void
{
this
.
setCssClass
(
'
review-widget
'
);
this
.
_headElement
=
<
HTMLDivElement
>
$
(
'
.head
'
).
getHTMLElement
();
...
...
@@ -115,24 +124,36 @@ export class ReviewZoneWidget extends ZoneWidget {
this
.
_actionbarWidget
=
new
ActionBar
(
actionsContainer
.
getHTMLElement
(),
{});
this
.
_disposables
.
push
(
this
.
_actionbarWidget
);
this
.
_actionbarWidget
.
push
(
new
Action
(
'
review.expand
'
,
nls
.
localize
(
'
label.expand
'
,
"
Expand
"
),
'
expand-review-action octicon octicon-chevron-down
'
,
true
,
()
=>
{
let
toggleAction
=
new
Action
(
'
review.expand
'
,
nls
.
localize
(
'
label.expand
'
,
"
Expand
"
),
'
expand-review-action octicon octicon-chevron-down
'
,
true
,
()
=>
{
// let webView = await commentProvider.resolveComment(threadId)
// this._bodyElement.appendChild(webView);
this
.
_bodyElement
.
style
.
display
=
'
block
'
;
return
null
;
}),
{
label
:
false
,
icon
:
true
});
if
(
toggleAction
.
class
.
indexOf
(
'
octicon-chevron-down
'
)
>=
0
)
{
this
.
_bodyElement
.
style
.
display
=
'
block
'
;
toggleAction
.
class
=
'
expand-review-action octicon octicon-chevron-up
'
;
}
else
{
this
.
_bodyElement
.
style
.
display
=
'
none
'
;
toggleAction
.
class
=
'
expand-review-action octicon octicon-chevron-down
'
;
this
.
_actionbarWidget
.
push
(
new
Action
(
'
review.close
'
,
nls
.
localize
(
'
label.close
'
,
"
Close
"
),
'
close-review-action
'
,
true
,
()
=>
{
this
.
dispose
();
}
return
null
;
})
,
{
label
:
false
,
icon
:
true
})
;
});
this
.
_actionbarWidget
.
push
(
toggleAction
,
{
label
:
false
,
icon
:
true
});
// this._actionbarWidget.push(new Action('review.close', nls.localize('label.close', "Close"), 'close-review-action', true, () => {
// this.dispose();
// return null;
// }), { label: false, icon: true });
}
display
(
commentThread
:
modes
.
CommentThread
,
lineNumber
:
number
)
{
const
comments
=
commentThread
.
comments
;
this
.
show
({
lineNumber
:
lineNumber
,
column
:
1
},
2
);
var
headHeight
=
Math
.
ceil
(
this
.
editor
.
getConfiguration
().
lineHeight
*
1.2
);
this
.
_headElement
.
style
.
height
=
`
${
headHeight
}
px`
;
this
.
_headElement
.
style
.
lineHeight
=
this
.
_headElement
.
style
.
height
;
this
.
_bodyElement
.
style
.
display
=
'
none
'
;
for
(
let
i
=
0
;
i
<
comments
.
length
;
i
++
)
{
let
singleCommentContainer
=
document
.
createElement
(
'
div
'
);
...
...
@@ -183,7 +204,7 @@ export class ReviewZoneWidget extends ZoneWidget {
if
(
entries
[
0
].
target
===
this
.
_bodyElement
)
{
const
lineHeight
=
this
.
editor
.
getConfiguration
().
lineHeight
;
const
arrowHeight
=
Math
.
round
(
lineHeight
/
3
);
const
computedLinesNumber
=
Math
.
ceil
((
entries
[
0
].
contentRect
.
height
+
arrowHeight
+
30
)
/
lineHeight
);
const
computedLinesNumber
=
Math
.
ceil
((
headHeight
+
entries
[
0
].
contentRect
.
height
+
arrowHeight
)
/
lineHeight
);
this
.
_relayout
(
computedLinesNumber
);
}
});
...
...
@@ -205,8 +226,43 @@ export class ReviewZoneWidget extends ZoneWidget {
this
.
_resizeObserver
.
disconnect
();
this
.
_resizeObserver
=
null
;
}
this
.
_onDidClose
.
fire
();
}
}
export
class
ReviewSwitchWidget
extends
Widget
implements
IOverlayWidget
{
private
_domNode
:
HTMLElement
;
constructor
(
reviewModel
:
ReviewModel
)
{
super
();
this
.
_domNode
=
document
.
createElement
(
'
div
'
);
this
.
_domNode
.
className
=
'
review-switch-widget
'
;
this
.
_domNode
.
textContent
=
'
Review
'
;
this
.
_domNode
.
onclick
=
e
=>
{
dom
.
toggleClass
(
this
.
_domNode
,
'
inactive
'
);
if
(
dom
.
hasClass
(
this
.
_domNode
,
'
inactive
'
))
{
reviewModel
.
setStyle
(
ReviewStyle
.
Gutter
);
}
else
{
reviewModel
.
setStyle
(
ReviewStyle
.
Inline
);
}
};
}
getId
():
string
{
return
'
editor.contrib.reviewSwitch
'
;
}
getDomNode
():
HTMLElement
{
return
this
.
_domNode
;
}
getPosition
():
IOverlayWidgetPosition
{
return
{
preference
:
OverlayWidgetPositionPreference
.
BOTTOM_RIGHT_CORNER
};
}
}
export
class
ReviewController
implements
IEditorContribution
{
...
...
@@ -216,10 +272,12 @@ export class ReviewController implements IEditorContribution {
private
decorationIDs
:
string
[];
private
newCommentHintDecoration
:
string
[];
private
_domNode
:
HTMLElement
;
private
_reviewSwitch
:
ReviewSwitchWidget
;
private
_zoneWidget
:
ReviewZoneWidget
;
private
_zoneWidgets
:
ReviewZoneWidget
[];
private
_reviewPanelVisible
:
IContextKey
<
boolean
>
;
private
_commentThreads
:
modes
.
CommentThread
[];
private
_reviewModel
:
ReviewModel
;
constructor
(
editor
:
ICodeEditor
,
...
...
@@ -235,11 +293,48 @@ export class ReviewController implements IEditorContribution {
this
.
mouseDownInfo
=
null
;
this
.
_commentThreads
=
[];
this
.
_zoneWidgets
=
[];
this
.
_zoneWidget
=
null
;
this
.
_reviewSwitch
=
null
;
this
.
_reviewPanelVisible
=
ctxReviewPanelVisible
.
bindTo
(
contextKeyService
);
this
.
_domNode
=
document
.
createElement
(
'
div
'
);
this
.
_domNode
.
className
=
'
review-widget
'
;
this
.
_zoneWidget
=
null
;
this
.
_reviewModel
=
new
ReviewModel
();
this
.
_reviewModel
.
onDidChangeStyle
(
style
=>
{
if
(
style
===
ReviewStyle
.
Gutter
)
{
this
.
_zoneWidgets
.
forEach
(
zone
=>
{
zone
.
dispose
();
});
this
.
_zoneWidgets
=
[];
this
.
editor
.
changeDecorations
(
accessor
=>
{
this
.
decorationIDs
=
accessor
.
deltaDecorations
(
this
.
decorationIDs
,
this
.
_commentThreads
.
map
(
thread
=>
({
range
:
thread
.
range
,
options
:
REVIEW_DECORATION
})));
});
}
else
{
this
.
editor
.
changeDecorations
(
accessor
=>
{
this
.
decorationIDs
=
accessor
.
deltaDecorations
(
this
.
decorationIDs
,
[]);
});
if
(
this
.
_zoneWidget
)
{
this
.
_zoneWidget
.
dispose
();
this
.
_zoneWidget
=
null
;
}
this
.
_zoneWidgets
.
forEach
(
zone
=>
{
zone
.
dispose
();
});
this
.
_commentThreads
.
forEach
(
thread
=>
{
let
zoneWidget
=
new
ReviewZoneWidget
(
this
.
themeService
,
this
.
commandService
,
this
.
editor
,
{},
thread
.
comments
);
zoneWidget
.
display
(
this
.
getCommentThread
(
thread
.
range
.
startLineNumber
),
thread
.
range
.
startLineNumber
);
this
.
_zoneWidgets
.
push
(
zoneWidget
);
});
}
});
this
.
globalToDispose
.
push
(
this
.
editor
.
onDidChangeModel
(()
=>
this
.
onModelChanged
()));
}
...
...
@@ -274,6 +369,7 @@ export class ReviewController implements IEditorContribution {
zone
.
dispose
();
});
this
.
_zoneWidgets
=
[];
this
.
localToDispose
.
push
(
this
.
editor
.
onMouseDown
(
e
=>
this
.
onEditorMouseDown
(
e
)));
this
.
localToDispose
.
push
(
this
.
editor
.
onMouseUp
(
e
=>
this
.
onEditorMouseUp
(
e
)));
this
.
localToDispose
.
push
(
this
.
editor
.
onMouseMove
(
e
=>
this
.
onEditorMouseMove
(
e
)));
...
...
@@ -329,6 +425,9 @@ export class ReviewController implements IEditorContribution {
if
(
thread
&&
thread
.
comments
.
length
)
{
this
.
_reviewPanelVisible
.
set
(
true
);
this
.
_zoneWidget
=
new
ReviewZoneWidget
(
this
.
themeService
,
this
.
commandService
,
this
.
editor
,
{},
thread
.
comments
);
this
.
_zoneWidget
.
onDidClose
(
e
=>
{
this
.
_zoneWidget
=
null
;
});
this
.
_zoneWidget
.
display
(
this
.
getCommentThread
(
lineNumber
),
lineNumber
);
}
}
...
...
@@ -401,24 +500,31 @@ export class ReviewController implements IEditorContribution {
setComments
(
commentThreads
:
modes
.
CommentThread
[]):
void
{
this
.
_commentThreads
=
commentThreads
;
this
.
editor
.
changeDecorations
(
accessor
=>
{
this
.
decorationIDs
=
accessor
.
deltaDecorations
(
this
.
decorationIDs
,
commentThreads
.
map
(
thread
=>
({
range
:
thread
.
range
,
options
:
REVIEW_DECORATION
})));
});
// create viewzones
this
.
_zoneWidgets
.
forEach
(
zone
=>
{
zone
.
dispose
(
);
}
);
if
(
!
this
.
_reviewSwitch
)
{
this
.
_reviewSwitch
=
new
ReviewSwitchWidget
(
this
.
_reviewModel
);
this
.
editor
.
addOverlayWidget
(
this
.
_reviewSwitch
);
}
this
.
_commentThreads
.
forEach
(
thread
=>
{
let
zoneWidget
=
new
ReviewZoneWidget
(
this
.
themeService
,
this
.
commandService
,
this
.
editor
,
{},
thread
.
comments
);
zoneWidget
.
display
(
this
.
getCommentThread
(
thread
.
range
.
startLineNumber
),
thread
.
range
.
startLineNumber
);
this
.
_zoneWidgets
.
push
(
zoneWidget
);
});
if
(
this
.
_reviewModel
.
style
===
ReviewStyle
.
Gutter
)
{
this
.
editor
.
changeDecorations
(
accessor
=>
{
this
.
decorationIDs
=
accessor
.
deltaDecorations
(
this
.
decorationIDs
,
commentThreads
.
map
(
thread
=>
({
range
:
thread
.
range
,
options
:
REVIEW_DECORATION
})));
});
}
else
{
// create viewzones
this
.
_zoneWidgets
.
forEach
(
zone
=>
{
zone
.
dispose
();
});
this
.
_commentThreads
.
forEach
(
thread
=>
{
let
zoneWidget
=
new
ReviewZoneWidget
(
this
.
themeService
,
this
.
commandService
,
this
.
editor
,
{},
thread
.
comments
);
zoneWidget
.
display
(
this
.
getCommentThread
(
thread
.
range
.
startLineNumber
),
thread
.
range
.
startLineNumber
);
this
.
_zoneWidgets
.
push
(
zoneWidget
);
});
}
}
...
...
src/vs/editor/contrib/review/reviewModel.ts
0 → 100644
浏览文件 @
ec3c967a
/*---------------------------------------------------------------------------------------------
* Copyright (c) Microsoft Corporation. All rights reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/
'
use strict
'
;
import
{
Emitter
,
Event
}
from
'
vs/base/common/event
'
;
export
enum
ReviewStyle
{
Complete
,
Inline
,
Gutter
}
export
class
ReviewModel
{
private
_style
:
ReviewStyle
;
public
get
style
():
ReviewStyle
{
return
this
.
_style
;
}
private
_onDidChangeStyle
=
new
Emitter
<
ReviewStyle
>
();
public
get
onDidChangeStyle
():
Event
<
ReviewStyle
>
{
return
this
.
_onDidChangeStyle
.
event
;
}
constructor
()
{
this
.
_style
=
ReviewStyle
.
Inline
;
}
setStyle
(
style
:
ReviewStyle
)
{
this
.
_style
=
style
;
this
.
_onDidChangeStyle
.
fire
(
this
.
_style
);
}
}
\ No newline at end of file
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录