Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
掘金者说
vscode
提交
e058fdf5
V
vscode
项目概览
掘金者说
/
vscode
与 Fork 源项目一致
从无法访问的项目Fork
通知
1
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
V
vscode
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
e058fdf5
编写于
12月 10, 2015
作者:
J
Joao Moreno
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
remove react dependency from editor status
上级
ab0bba9e
变更
2
隐藏空白更改
内联
并排
Showing
2 changed file
with
138 addition
and
165 deletion
+138
-165
src/vs/base/browser/dom.ts
src/vs/base/browser/dom.ts
+8
-0
src/vs/workbench/browser/parts/editor/editorStatus.ts
src/vs/workbench/browser/parts/editor/editorStatus.ts
+130
-165
未找到文件。
src/vs/base/browser/dom.ts
浏览文件 @
e058fdf5
...
...
@@ -1067,3 +1067,11 @@ export function emmet(description: string):HTMLElement {
return
result
;
};
export
function
show
(
element
:
HTMLElement
):
void
{
element
.
style
.
display
=
null
;
}
export
function
hide
(
element
:
HTMLElement
):
void
{
element
.
style
.
display
=
'
none
'
;
}
src/vs/workbench/browser/parts/editor/editorStatus.ts
浏览文件 @
e058fdf5
...
...
@@ -8,7 +8,7 @@
import
'
vs/css!./media/editorstatus
'
;
import
nls
=
require
(
'
vs/nls
'
);
import
{
Promise
,
TPromise
}
from
'
vs/base/common/winjs.base
'
;
import
react
=
require
(
'
lib/react
'
)
;
import
{
emmet
as
$
,
append
,
show
,
hide
}
from
'
vs/base/browser/dom
'
;
import
objects
=
require
(
'
vs/base/common/objects
'
);
import
encoding
=
require
(
'
vs/base/common/bits/encoding
'
);
import
strings
=
require
(
'
vs/base/common/strings
'
);
...
...
@@ -23,7 +23,7 @@ import {Registry} from 'vs/platform/platform';
import
{
BaseEditor
}
from
'
vs/workbench/browser/parts/editor/baseEditor
'
;
import
{
UntitledEditorInput
}
from
'
vs/workbench/browser/parts/editor/untitledEditorInput
'
;
import
{
EncodingMode
,
IEncodingSupport
,
asFileEditorInput
,
getUntitledOrFileResource
}
from
'
vs/workbench/common/editor
'
;
import
{
toDisposable
,
IDisposable
}
from
'
vs/base/common/lifecycle
'
;
import
{
toDisposable
,
IDisposable
,
combinedDispose
}
from
'
vs/base/common/lifecycle
'
;
import
{
ICodeEditor
}
from
'
vs/editor/browser/editorBrowser
'
;
import
{
EndOfLineSequence
,
ITokenizedModel
,
EditorType
,
IEditorSelection
,
ITextModel
,
IDiffEditorModel
,
IEditor
}
from
'
vs/editor/common/editorCommon
'
;
import
{
EventType
,
EditorEvent
,
TextEditorSelectionEvent
,
ResourceEvent
}
from
'
vs/workbench/browser/events
'
;
...
...
@@ -58,17 +58,6 @@ interface IEditorSelectionStatus {
charactersSelected
?:
number
;
}
interface
IProps
{
eventService
:
IEventService
;
editorService
:
IWorkbenchEditorService
;
quickOpenService
:
IQuickOpenService
;
onModeClick
:
()
=>
void
;
onSelectionClick
:
()
=>
void
;
onEOLClick
:
()
=>
void
;
onEncodingClick
:
()
=>
void
;
onTabFocusModeClick
:
()
=>
void
;
}
interface
IState
{
selectionStatus
:
IEditorSelectionStatus
;
mode
:
string
;
...
...
@@ -77,33 +66,33 @@ interface IState {
tabFocusMode
:
boolean
;
}
class
WidgetSpec
extends
react
.
BaseComponent
<
IProps
,
IState
>
{
private
static
nlsSingleSelectionRange
=
nls
.
localize
(
'
singleSelectionRange
'
,
"
Ln {0}, Col {1} ({2} selected)
"
);
private
static
nlsSingleSelection
=
nls
.
localize
(
'
singleSelection
'
,
"
Ln {0}, Col {1}
"
);
private
static
nlsMultiSelectionRange
=
nls
.
localize
(
'
multiSelectionRange
'
,
"
{0} selections ({1} characters selected)
"
);
private
static
nlsMultiSelection
=
nls
.
localize
(
'
multiSelection
'
,
"
{0} selections
"
);
public
static
nlsEOLLF
=
nls
.
localize
(
'
endOfLineLineFeed
'
,
"
LF
"
);
public
static
nlsEOLCRLF
=
nls
.
localize
(
'
endOfLineCarriageReturnLineFeed
'
,
"
CRLF
"
);
const
nlsSingleSelectionRange
=
nls
.
localize
(
'
singleSelectionRange
'
,
"
Ln {0}, Col {1} ({2} selected)
"
);
const
nlsSingleSelection
=
nls
.
localize
(
'
singleSelection
'
,
"
Ln {0}, Col {1}
"
);
const
nlsMultiSelectionRange
=
nls
.
localize
(
'
multiSelectionRange
'
,
"
{0} selections ({1} characters selected)
"
);
const
nlsMultiSelection
=
nls
.
localize
(
'
multiSelection
'
,
"
{0} selections
"
);
const
nlsEOLLF
=
nls
.
localize
(
'
endOfLineLineFeed
'
,
"
LF
"
);
const
nlsEOLCRLF
=
nls
.
localize
(
'
endOfLineCarriageReturnLineFeed
'
,
"
CRLF
"
);
const
nlsTabFocusMode
=
nls
.
localize
(
'
tabFocusModeEnabled
'
,
"
Accessibility Mode On
"
);
private
static
nlsTabFocusMode
=
nls
.
localize
(
'
tabFocusModeEnabled
'
,
"
Accessibility Mode On
"
);
export
class
EditorStatus
implements
IStatusbarItem
{
private
state
:
IState
;
private
element
:
HTMLElement
;
private
tabFocusModeElement
:
HTMLElement
;
private
selectionElement
:
HTMLElement
;
private
encodingElement
:
HTMLElement
;
private
eolElement
:
HTMLElement
;
private
modeElement
:
HTMLElement
;
private
toDispose
:
IDisposable
[];
public
componentDidMount
():
void
{
this
.
toDispose
=
[
this
.
props
.
eventService
.
addListener2
(
EventType
.
EDITOR_INPUT_CHANGED
,
(
e
:
EditorEvent
)
=>
this
.
onEditorInputChange
(
e
.
editor
)),
this
.
props
.
eventService
.
addListener2
(
EventType
.
RESOURCE_ENCODING_CHANGED
,
(
e
:
ResourceEvent
)
=>
this
.
onResourceEncodingChange
(
e
.
resource
)),
this
.
props
.
eventService
.
addListener2
(
EventType
.
TEXT_EDITOR_SELECTION_CHANGED
,
(
e
:
TextEditorSelectionEvent
)
=>
this
.
onSelectionChange
(
e
.
editor
)),
this
.
props
.
eventService
.
addListener2
(
EventType
.
TEXT_EDITOR_MODE_CHANGED
,
(
e
:
EditorEvent
)
=>
this
.
onModeChange
(
e
.
editor
)),
this
.
props
.
eventService
.
addListener2
(
EventType
.
TEXT_EDITOR_CONTENT_CHANGED
,
(
e
:
EditorEvent
)
=>
this
.
onEOLChange
(
e
.
editor
)),
this
.
props
.
eventService
.
addListener2
(
EventType
.
TEXT_EDITOR_CONFIGURATION_CHANGED
,
(
e
:
EditorEvent
)
=>
this
.
onTabFocusModeChange
(
e
.
editor
)),
];
}
public
getInitialState
():
IState
{
return
{
constructor
(
@
IWorkbenchEditorService
private
editorService
:
IWorkbenchEditorService
,
@
IQuickOpenService
private
quickOpenService
:
IQuickOpenService
,
@
IInstantiationService
private
instantiationService
:
IInstantiationService
,
@
IEventService
private
eventService
:
IEventService
)
{
this
.
toDispose
=
[];
this
.
state
=
{
selectionStatus
:
null
,
mode
:
null
,
encoding
:
null
,
...
...
@@ -112,74 +101,85 @@ class WidgetSpec extends react.BaseComponent<IProps, IState> {
};
}
public
render
():
react
.
ReactHTMLElement
{
let
children
:
react
.
ReactHTMLElement
[]
=
[];
public
render
(
container
:
HTMLElement
):
IDisposable
{
this
.
element
=
append
(
container
,
$
(
'
.editor-statusbar-item
'
));
this
.
tabFocusModeElement
=
append
(
this
.
element
,
$
(
'
a.editor-status-tabfocusmode
'
));
this
.
tabFocusModeElement
.
title
=
nls
.
localize
(
'
disableTabMode
'
,
"
Disable Accessibility Mode
"
);
this
.
tabFocusModeElement
.
onclick
=
()
=>
this
.
onTabFocusModeClick
();
this
.
tabFocusModeElement
.
textContent
=
nlsTabFocusMode
;
this
.
selectionElement
=
append
(
this
.
element
,
$
(
'
a.editor-status-selection
'
));
this
.
selectionElement
.
title
=
nls
.
localize
(
'
gotoLine
'
,
"
Go to Line
"
);
this
.
selectionElement
.
onclick
=
()
=>
this
.
onSelectionClick
();
this
.
encodingElement
=
append
(
this
.
element
,
$
(
'
a.editor-status-encoding
'
));
this
.
encodingElement
.
title
=
nls
.
localize
(
'
selectEncoding
'
,
"
Select Encoding
"
);
this
.
encodingElement
.
onclick
=
()
=>
this
.
onEncodingClick
();
this
.
eolElement
=
append
(
this
.
element
,
$
(
'
a.editor-status-eol
'
));
this
.
eolElement
.
title
=
nls
.
localize
(
'
selectEOL
'
,
"
Select End of Line Sequence
"
);
this
.
eolElement
.
onclick
=
()
=>
this
.
onEOLClick
();
this
.
modeElement
=
append
(
this
.
element
,
$
(
'
a.editor-status-mode
'
));
this
.
modeElement
.
title
=
nls
.
localize
(
'
selectLanguageMode
'
,
"
Select Language Mode
"
);
this
.
modeElement
.
onclick
=
()
=>
this
.
onModeClick
();
this
.
setState
(
this
.
state
);
this
.
toDispose
.
push
(
this
.
eventService
.
addListener2
(
EventType
.
EDITOR_INPUT_CHANGED
,
(
e
:
EditorEvent
)
=>
this
.
onEditorInputChange
(
e
.
editor
)),
this
.
eventService
.
addListener2
(
EventType
.
RESOURCE_ENCODING_CHANGED
,
(
e
:
ResourceEvent
)
=>
this
.
onResourceEncodingChange
(
e
.
resource
)),
this
.
eventService
.
addListener2
(
EventType
.
TEXT_EDITOR_SELECTION_CHANGED
,
(
e
:
TextEditorSelectionEvent
)
=>
this
.
onSelectionChange
(
e
.
editor
)),
this
.
eventService
.
addListener2
(
EventType
.
TEXT_EDITOR_MODE_CHANGED
,
(
e
:
EditorEvent
)
=>
this
.
onModeChange
(
e
.
editor
)),
this
.
eventService
.
addListener2
(
EventType
.
TEXT_EDITOR_CONTENT_CHANGED
,
(
e
:
EditorEvent
)
=>
this
.
onEOLChange
(
e
.
editor
)),
this
.
eventService
.
addListener2
(
EventType
.
TEXT_EDITOR_CONFIGURATION_CHANGED
,
(
e
:
EditorEvent
)
=>
this
.
onTabFocusModeChange
(
e
.
editor
))
);
if
(
this
.
state
.
tabFocusMode
&&
this
.
state
.
tabFocusMode
===
true
)
{
children
.
push
(
react
.
createElement
(
'
a
'
,
{
className
:
'
editor-status-tabfocusmode
'
,
title
:
nls
.
localize
(
'
disableTabMode
'
,
"
Disable Accessibility Mode
"
),
onClick
:
this
.
onTabFocusModeClick
},
WidgetSpec
.
nlsTabFocusMode
));
return
combinedDispose
(...
this
.
toDispose
);
}
private
setState
(
state
:
IState
):
void
{
this
.
state
=
state
;
if
(
state
.
tabFocusMode
&&
state
.
tabFocusMode
===
true
)
{
show
(
this
.
tabFocusModeElement
);
}
else
{
hide
(
this
.
tabFocusModeElement
);
}
let
selectionLabel
=
this
.
getSelectionLabel
();
if
(
selectionLabel
)
{
children
.
push
(
react
.
createElement
(
'
a
'
,
{
className
:
'
editor-status-selection
'
,
title
:
nls
.
localize
(
'
gotoLine
'
,
"
Go to Line
"
),
onClick
:
this
.
onSelectionClick
},
selectionLabel
));
this
.
selectionElement
.
textContent
=
selectionLabel
;
show
(
this
.
selectionElement
);
}
else
{
hide
(
this
.
selectionElement
);
}
if
(
this
.
state
.
encoding
)
{
children
.
push
(
react
.
createElement
(
'
a
'
,
{
className
:
'
editor-status-encoding
'
,
title
:
nls
.
localize
(
'
selectEncoding
'
,
"
Select Encoding
"
),
onClick
:
this
.
onEncodingClick
},
this
.
state
.
encoding
));
if
(
state
.
encoding
)
{
this
.
encodingElement
.
textContent
=
state
.
encoding
;
show
(
this
.
encodingElement
);
}
else
{
hide
(
this
.
encodingElement
);
}
if
(
this
.
state
.
EOL
)
{
children
.
push
(
react
.
createElement
(
'
a
'
,
{
className
:
'
editor-status-eol
'
,
title
:
nls
.
localize
(
'
selectEOL
'
,
"
Select End of Line Sequence
"
),
onClick
:
this
.
onEOLClick
},
(
this
.
state
.
EOL
===
'
\r\n
'
?
WidgetSpec
.
nlsEOLCRLF
:
WidgetSpec
.
nlsEOLLF
)));
if
(
state
.
EOL
)
{
this
.
eolElement
.
textContent
=
state
.
EOL
===
'
\r\n
'
?
nlsEOLCRLF
:
nlsEOLLF
;
show
(
this
.
eolElement
);
}
else
{
hide
(
this
.
eolElement
);
}
if
(
this
.
state
.
mode
)
{
children
.
push
(
react
.
createElement
(
'
a
'
,
{
className
:
'
editor-status-mode
'
,
title
:
nls
.
localize
(
'
selectLanguageMode
'
,
"
Select Language Mode
"
),
onClick
:
this
.
onModeClick
},
this
.
state
.
mode
));
if
(
state
.
mode
)
{
this
.
modeElement
.
textContent
=
state
.
mode
;
show
(
this
.
modeElement
);
}
else
{
hide
(
this
.
modeElement
);
}
return
react
.
createElement
(
'
div
'
,
{
className
:
'
editor-statusbar-item
'
,
children
:
children
});
}
private
onModeClick
():
void
{
this
.
props
.
onModeClick
();
}
private
onSelectionClick
():
void
{
this
.
props
.
onSelectionClick
();
}
private
onEOLClick
():
void
{
this
.
props
.
onEOLClick
();
}
private
onEncodingClick
():
void
{
this
.
props
.
onEncodingClick
();
}
private
onTabFocusModeClick
():
void
{
this
.
props
.
onTabFocusModeClick
();
private
updateState
(
update
:
any
):
void
{
this
.
setState
(
objects
.
assign
({},
this
.
state
,
update
));
}
private
getSelectionLabel
():
string
{
...
...
@@ -191,19 +191,51 @@ class WidgetSpec extends react.BaseComponent<IProps, IState> {
if
(
info
.
selections
.
length
===
1
)
{
if
(
info
.
charactersSelected
)
{
return
strings
.
format
(
WidgetSpec
.
nlsSingleSelectionRange
,
info
.
selections
[
0
].
positionLineNumber
,
info
.
selections
[
0
].
positionColumn
,
info
.
charactersSelected
);
return
strings
.
format
(
nlsSingleSelectionRange
,
info
.
selections
[
0
].
positionLineNumber
,
info
.
selections
[
0
].
positionColumn
,
info
.
charactersSelected
);
}
else
{
return
strings
.
format
(
WidgetSpec
.
nlsSingleSelection
,
info
.
selections
[
0
].
positionLineNumber
,
info
.
selections
[
0
].
positionColumn
);
return
strings
.
format
(
nlsSingleSelection
,
info
.
selections
[
0
].
positionLineNumber
,
info
.
selections
[
0
].
positionColumn
);
}
}
else
{
if
(
info
.
charactersSelected
)
{
return
strings
.
format
(
WidgetSpec
.
nlsMultiSelectionRange
,
info
.
selections
.
length
,
info
.
charactersSelected
);
return
strings
.
format
(
nlsMultiSelectionRange
,
info
.
selections
.
length
,
info
.
charactersSelected
);
}
else
{
return
strings
.
format
(
WidgetSpec
.
nlsMultiSelection
,
info
.
selections
.
length
);
return
strings
.
format
(
nlsMultiSelection
,
info
.
selections
.
length
);
}
}
}
private
onModeClick
():
void
{
let
action
=
this
.
instantiationService
.
createInstance
(
ChangeModeAction
,
ChangeModeAction
.
ID
,
ChangeModeAction
.
LABEL
);
action
.
run
().
done
(
null
,
errors
.
onUnexpectedError
);
action
.
dispose
();
}
private
onSelectionClick
():
void
{
this
.
quickOpenService
.
show
(
'
:
'
);
// "Go to line"
}
private
onEOLClick
():
void
{
let
action
=
this
.
instantiationService
.
createInstance
(
ChangeEOLAction
,
ChangeEOLAction
.
ID
,
ChangeEOLAction
.
LABEL
);
action
.
run
().
done
(
null
,
errors
.
onUnexpectedError
);
action
.
dispose
();
}
private
onEncodingClick
():
void
{
let
action
=
this
.
instantiationService
.
createInstance
(
ChangeEncodingAction
,
ChangeEncodingAction
.
ID
,
ChangeEncodingAction
.
LABEL
);
action
.
run
().
done
(
null
,
errors
.
onUnexpectedError
);
action
.
dispose
();
}
private
onTabFocusModeClick
():
void
{
let
activeEditor
=
this
.
editorService
.
getActiveEditor
();
if
(
activeEditor
instanceof
BaseTextEditor
&&
isCodeEditorWithTabFocusMode
(
activeEditor
))
{
(
<
ICodeEditor
>
activeEditor
.
getControl
()).
updateOptions
({
tabFocusMode
:
false
});
}
}
private
onEditorInputChange
(
e
:
BaseEditor
):
void
{
this
.
onSelectionChange
(
e
);
this
.
onModeChange
(
e
);
...
...
@@ -339,13 +371,13 @@ class WidgetSpec extends react.BaseComponent<IProps, IState> {
}
private
isActiveEditor
(
e
:
BaseEditor
):
boolean
{
let
activeEditor
=
this
.
props
.
editorService
.
getActiveEditor
();
let
activeEditor
=
this
.
editorService
.
getActiveEditor
();
return
activeEditor
&&
e
&&
activeEditor
===
e
;
}
private
getActiveEditor
(
resource
:
uri
):
BaseEditor
{
let
activeEditor
=
this
.
props
.
editorService
.
getActiveEditor
();
let
activeEditor
=
this
.
editorService
.
getActiveEditor
();
if
(
activeEditor
)
{
let
r
=
getUntitledOrFileResource
(
activeEditor
.
input
);
if
(
r
&&
r
.
toString
()
===
resource
.
toString
())
{
...
...
@@ -355,73 +387,6 @@ class WidgetSpec extends react.BaseComponent<IProps, IState> {
return
null
;
}
private
updateState
(
update
:
any
,
callback
?:
()
=>
void
):
void
{
this
.
setState
(
objects
.
mixin
(
update
,
this
.
state
,
false
),
callback
);
}
}
let
EditorStatusWidget
=
react
.
createFactoryForTS
<
IProps
>
(
WidgetSpec
.
prototype
);
export
class
EditorStatus
implements
IStatusbarItem
{
constructor
(
@
IWorkbenchEditorService
private
editorService
:
IWorkbenchEditorService
,
@
IQuickOpenService
private
quickOpenService
:
IQuickOpenService
,
@
IInstantiationService
private
instantiationService
:
IInstantiationService
,
@
IEventService
private
eventService
:
IEventService
)
{
}
public
render
(
container
:
HTMLElement
):
IDisposable
{
react
.
render
(
EditorStatusWidget
({
editorService
:
this
.
editorService
,
eventService
:
this
.
eventService
,
quickOpenService
:
this
.
quickOpenService
,
onModeClick
:
()
=>
this
.
onModeClick
(),
onSelectionClick
:
()
=>
this
.
onSelectionClick
(),
onEOLClick
:
()
=>
this
.
onEOLClick
(),
onTabFocusModeClick
:
()
=>
this
.
onTabFocusModeClick
(),
onEncodingClick
:
()
=>
this
.
onEncodingClick
()
}),
container
);
return
toDisposable
(()
=>
react
.
unmountComponentAtNode
(
container
));
}
private
onModeClick
():
void
{
let
action
=
this
.
instantiationService
.
createInstance
(
ChangeModeAction
,
ChangeModeAction
.
ID
,
ChangeModeAction
.
LABEL
);
action
.
run
().
done
(
null
,
errors
.
onUnexpectedError
);
action
.
dispose
();
}
private
onSelectionClick
():
void
{
this
.
quickOpenService
.
show
(
'
:
'
);
// "Go to line"
}
private
onEOLClick
():
void
{
let
action
=
this
.
instantiationService
.
createInstance
(
ChangeEOLAction
,
ChangeEOLAction
.
ID
,
ChangeEOLAction
.
LABEL
);
action
.
run
().
done
(
null
,
errors
.
onUnexpectedError
);
action
.
dispose
();
}
private
onEncodingClick
():
void
{
let
action
=
this
.
instantiationService
.
createInstance
(
ChangeEncodingAction
,
ChangeEncodingAction
.
ID
,
ChangeEncodingAction
.
LABEL
);
action
.
run
().
done
(
null
,
errors
.
onUnexpectedError
);
action
.
dispose
();
}
private
onTabFocusModeClick
():
void
{
let
activeEditor
=
this
.
editorService
.
getActiveEditor
();
if
(
activeEditor
instanceof
BaseTextEditor
&&
isCodeEditorWithTabFocusMode
(
activeEditor
))
{
(
<
ICodeEditor
>
activeEditor
.
getControl
()).
updateOptions
({
tabFocusMode
:
false
});
}
}
}
function
isCodeEditorWithTabFocusMode
(
e
:
BaseTextEditor
):
boolean
{
...
...
@@ -548,8 +513,8 @@ export class ChangeEOLAction extends Action {
let
textModel
=
getTextModel
(
editorWidget
);
let
EOLOptions
:
IChangeEOLEntry
[]
=
[
{
label
:
WidgetSpec
.
nlsEOLLF
,
eol
:
EndOfLineSequence
.
LF
},
{
label
:
WidgetSpec
.
nlsEOLCRLF
,
eol
:
EndOfLineSequence
.
CRLF
},
{
label
:
nlsEOLLF
,
eol
:
EndOfLineSequence
.
LF
},
{
label
:
nlsEOLCRLF
,
eol
:
EndOfLineSequence
.
CRLF
},
];
let
selectedIndex
=
(
textModel
.
getEOL
()
===
'
\n
'
)
?
0
:
1
;
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录