Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Context menu change #1

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
142 changes: 68 additions & 74 deletions demo.html
Original file line number Diff line number Diff line change
@@ -1,75 +1,69 @@
<!doctype html>
<html>
<head>
<meta name="copyright" content="Copyright (c) IBM Corporation and others 2010, 2014." >
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Pluggable Editor Demo</title>
<style type="text/css">
.demoTitle{
border: none;
vertical-align: middle;
overflow: hidden;
text-align: left;
margin-left: 15%;
margin-right: 15%;
padding-bottom: 5px;
position: relative;
}
.demoBody{
border: 1px solid;
vertical-align: middle;
border-color: blue;
overflow: hidden;
text-align: left;
margin-left: 15%;
margin-right: 15%;
margin-bottom: 15px;
padding-bottom: 5px;
position: relative;
height: 450px;
}
</style>
<link rel="stylesheet" type="text/css" href="editorBuild/code_edit/built-codeEdit.css"/>
<script src="editorBuild/code_edit/built-codeEdit.js"></script>
<script>
/*globals orion */
window.onload=function(){
var codeEdit = new orion.codeEdit();
var contents = 'var foo = "bar";\n' +
"var bar = foo;\n" +
"/*\n" +
" * test demo\n" +
"*/\n" +
"function test(){\n" +
" var foo1 = bar.lastIndexOf(char, from);\n" +
"}\n" +
"//Keep editting in this demo and try the content assit, probem validations and hover service!\n" +
"var foo2 = foo.";
codeEdit.create({parent: "embeddedEditor", contentType: "application/javascript", contents: contents}).then(function(editorViewer) {
document.getElementById("progressMessageDiv").textContent = "Plugins loaded!";
//You can call APIs from editorViewer.editor for further actions.
});
};
</script>
</head>
<body id="orion-browser" spellcheck="false" class="orionPage">
<div class="demoTitle">
<div>This is a demo for the <b>Orion Code Edit</b> widget. This demo consumes the <b>build version</b> of the widget.</div>
<div> Keep editing in this demo and try:</div>
<div> 1.content assist. E.g., put cursor after "foo." at the last line and press CTRL+space.</div>
<div> 2.probem validations. E.g., modify something and you will see new validation markers coming up, if any</div>
<div> 3.hover service. Hover on any error markers or inside the eidtor.</div>
<div> 4.syntax highlighting</div>
<div> 5.Quick fix. Hover on a problem inside the eidtor, not on the ruler, e.g., (char, from) in this demo. Click on the quick fix and see.</div>
<div> 6.Find declaration. Select a variable and press f3.</div>
<div> 7.new tooling features coming while Orion is being improved...</div>
</div>
<div class="demoTitle">
<span id = "progressMessageDiv" style="color: green">Loading language tooling plugins...</span>
</div>
</div>
<div class="demoBody" id="embeddedEditor">
</div>
</body>
<!doctype html>
<html>
<head>
<meta name="copyright" content="Copyright (c) IBM Corporation and others 2010, 2014." >
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Pluggable Editor Demo</title>
<style type="text/css">
.demoTitle{
border: none;
vertical-align: middle;
overflow: hidden;
text-align: left;
margin-left: 15%;
margin-right: 15%;
padding-bottom: 5px;
position: relative;
}
.demoBody{
border: 1px solid;
vertical-align: middle;
border-color: blue;
overflow: hidden;
text-align: left;
margin-left: 15%;
margin-right: 15%;
margin-bottom: 15px;
padding-bottom: 5px;
position: relative;
height: 450px;
}
</style>
<script src="http://localhost/projects/cdnjs-master/ajax/libs/jquery/2.1.4/jquery.js"></script>
<link rel="stylesheet" type="text/css" href="editorBuild/code_edit/built-codeEdit.css"/>
<script src="editorBuild/code_edit/built-codeEdit.js"></script>
<script>
/*globals orion */
window.onload=function(){
var codeEdit = new orion.codeEdit();
var contents = 'var foo = ';

codeEdit.create({ parent: "embeddedEditor", contentType: "application/javascript", contents: contents}).then(function(editorViewer) {
document.getElementById("progressMessageDiv").textContent = "Plugins loaded!";
editorViewer.settings.contentAssistAutoTrigger = true;
});

};

</script>
</head>
<body id="orion-browser" spellcheck="false" class="orionPage">
<div class="demoTitle">
<div>This is a demo for the <b>Orion Code Edit</b> widget. This demo consumes the <b>build version</b> of the widget.</div>
<div> Keep editing in this demo and try:</div>
<div> 1.content assist. E.g., put cursor after "foo." at the last line and press CTRL+space.</div>
<div> 2.probem validations. E.g., modify something and you will see new validation markers coming up, if any</div>
<div> 3.hover service. Hover on any error markers or inside the eidtor.</div>
<div> 4.syntax highlighting</div>
<div> 5.Quick fix. Hover on a problem inside the eidtor, not on the ruler, e.g., (char, from) in this demo. Click on the quick fix and see.</div>
<div> 6.Find declaration. Select a variable and press f3.</div>
<div> 7.new tooling features coming while Orion is being improved...</div>
</div>
<div class="demoTitle">
<span id = "progressMessageDiv" style="color: green">Loading language tooling plugins...</span>
</div>
<div class="demoBody" id="embeddedEditor">
</div>
</body>
</html>
Binary file removed editorBuild/built-codeEdit.zip
Binary file not shown.
56 changes: 51 additions & 5 deletions editorBuild/code_edit/built-codeEdit.css
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,600);
.textview {
background-color: white;
font-family: "Consolas", "Monaco", "Vera Mono", monospace;
Expand Down Expand Up @@ -130,7 +131,7 @@
.textviewTooltip p {
word-wrap: break-word;
}
.textviewTooltip em {
.textviewTooltip multi_anno {
font-style: normal;
font-weight: bold;
}
Expand All @@ -149,6 +150,9 @@
padding-left: 3px;
vertical-align: middle;
}
.textviewTooltip .hoverTooltipTitle {
font-weight: normal;
}
.textviewTooltip .commandButton {
border: 1px solid #325C80;
background-color: inherit;
Expand All @@ -164,6 +168,7 @@
.textViewTooltipOnHover {
overflow: auto;
}

.textViewFind {
background-color: #ddd;
position: absolute;
Expand Down Expand Up @@ -215,6 +220,7 @@
}
.contentassist {
font-size:12px;
font-family: "Open+Sans", "Consolas", "Monaco", "Vera Mono", monospace;
display: none;
background-color: white;
position: fixed;
Expand All @@ -238,6 +244,7 @@
}
.contentassist .proposal-emphasis {
font-weight: normal;
position: relative;
}
.contentassist hr{
border: 0;
Expand Down Expand Up @@ -282,6 +289,31 @@
visibility: visible;
z-index: 1000;
}
.contentassist .proposalTag {
display: inline-block;
line-height: 11px;
height: 10px;
border-radius: 2px;
background: #325C80;
padding: 2px;
margin-right: 3px;
text-align: center;
color: white;
}
.contentassist .iconTagGreen {
display: inline-block;
font-size: 10px;
font-weight: bold;
line-height: 13px;
height: 12px;
width: 12px;
border-radius: 50%;
background: green;
padding: 1px;
margin-right: 3px;
text-align: center;
color: white;
}
.contentassist>div {
padding: 1px 3px 1px 5px;
}
Expand Down Expand Up @@ -401,6 +433,7 @@
.cm-bracket { color: white; background-color: gray; }
.cm-tag { color: #3f7f7f; }
.cm-attribute { color: #7f007f; }

.annotation {
}
.annotation.error,
Expand Down Expand Up @@ -687,6 +720,7 @@
.annotationLine.currentLine {
background-color: #EAF2FE;
}

.headerLayout {
height: 60px;
}
Expand Down Expand Up @@ -1027,7 +1061,7 @@
left: 33%;
height: 100%;
z-index: 51;
width: 1px;
width: 3px;
cursor: e-resize;
visibility: hidden;
}
Expand All @@ -1036,7 +1070,7 @@
top: 33%;
width: 100%;
z-index: 51;
height: 1px;
height: 3px;
cursor: n-resize;
visibility: hidden;
}
Expand Down Expand Up @@ -1833,7 +1867,7 @@ a.breadcrumb.currentLocation {
.commandInactiveItem {
}
.split {
background: #263238;
background: #37474F;
}
.splitTracking {
background: #37474F;
Expand Down Expand Up @@ -1943,7 +1977,6 @@ a.breadcrumb.currentLocation {
width: 12px;
}
.dropdownMenuItem .dropdownKeyBinding {
color: grey !important;
flex-grow: 0;
-webkit-flex-grow: 0;
font-size: 11px;
Expand Down Expand Up @@ -2158,3 +2191,16 @@ a.breadcrumb.currentLocation {
outline: none;
vertical-align: top;
}
.proposal-belongsTo{
position: absolute;
display: block;
top: 0px;
right: 5px;
background-color: #ffffff;
font-size: 11px;
color: #909090;
}

.proposal-emphasis.selected .proposal-belongsTo{
display: none;
}
Loading