1
0
mirror of https://github.com/salexdv/bsl_console.git synced 2025-09-16 09:06:17 +02:00

tingle modal

This commit is contained in:
salexdv
2023-12-14 14:24:51 +03:00
parent 63df102a3b
commit 9df0e431ff
8 changed files with 61 additions and 18 deletions

View File

@@ -84,10 +84,17 @@
visibility: visible !important;
}
div:has(> .add-review) {
background-color: #ddd;
}
div:has(> .add-review) > .line-numbers {
color: #ddd;
width: 0;
display: none !important;
}
.add-review {
margin-left: 2px;
margin-top: -1px;
@@ -99,10 +106,13 @@ div:has(> .add-review) {
transform: scale(0.8, 0.8);
z-index: 2;
cursor: pointer;
left: 0 !important;
position: unset !important;
margin: 0 auto;
text-align: center;
}
.add-review:hover {
margin-left: 0;
margin-top: -3px;
width: 22px !important;
height: 22px !important;
@@ -112,14 +122,12 @@ div:has(> .add-review) {
content: '+';
color: #fff;
font-size: 18px;
padding: 3px;
line-height: 18px;
}
.add-review:hover::after {
font-size: 22px;
line-height: 22px;
padding: 4px;
font-weight: bold;
}

View File

@@ -1663,6 +1663,7 @@ define(['bslGlobals', 'bslMetadata', 'snippets', 'bsl_language', 'vs/editor/edit
setOption('reviewMode', true);
setOption('readOnlyCodeReview', readOnlyCodeReview);
currentIssue = -1;
}
@@ -2638,6 +2639,14 @@ define(['bslGlobals', 'bslMetadata', 'snippets', 'bsl_language', 'vs/editor/edit
editor.diffEditorUpdateDecorations();
else
editor.updateDecorations(standaloneEditor.reviewDecorations);
setTimeout(() => {
let lineElement = document.querySelector('.add-review');
if (lineElement) {
lineElement.nextSibling.style.display = 'none';
lineElement.parentElement.style.backgroundColor = '#ddd';
}
}, 5);
}
@@ -3444,7 +3453,9 @@ define(['bslGlobals', 'bslMetadata', 'snippets', 'bsl_language', 'vs/editor/edit
let widgetId = 'bsl.review.widget.' + startLineNumber;
if (reviewWidgets.get(widgetId))
return;
return;
let standaloneEditor = editor.navi ? editor.getModifiedEditor() : editor;
let reviewWidget = {
widgetId: widgetId,
@@ -3459,7 +3470,7 @@ define(['bslGlobals', 'bslMetadata', 'snippets', 'bsl_language', 'vs/editor/edit
this.domNode.classList.remove('review-hint');
},
close: function () {
let height = getActiveEditor().getOption(monaco.editor.EditorOption.lineHeight) * 4 + 'px'
let height = standaloneEditor.getOption(monaco.editor.EditorOption.lineHeight) * 4 + 'px'
let widget = reviewWidgets.get(this.widgetId);
this.domNode.classList.add('close');
this.domNode.getElementsByClassName("review-header")[0].style.display = 'flex';
@@ -3467,7 +3478,7 @@ define(['bslGlobals', 'bslMetadata', 'snippets', 'bsl_language', 'vs/editor/edit
this.domNode.getElementsByClassName("review-edit")[0].style.display = 'none'
this.domNode.style.height = height;
document.querySelector('[monaco-view-zone="' + widget.zone + '"]').style.height = height;
getActiveEditor().changeViewZones(function (changeAccessor) {
standaloneEditor.changeViewZones(function (changeAccessor) {
changeAccessor.layoutZone(widget.zone);
});
},
@@ -3496,6 +3507,7 @@ define(['bslGlobals', 'bslMetadata', 'snippets', 'bsl_language', 'vs/editor/edit
this.removeSeverity();
this.domNode.classList.add("review-" + widget.severity);
this.close();
sendEvent("EVENT_ON_REVIEW_CHANGED", "");
}
else {
textarea.classList.add('required');
@@ -3503,11 +3515,12 @@ define(['bslGlobals', 'bslMetadata', 'snippets', 'bsl_language', 'vs/editor/edit
},
delete: function () {
let widget = reviewWidgets.get(this.widgetId);
getActiveEditor().removeOverlayWidget(widget.widget);
getActiveEditor().changeViewZones(function (changeAccessor) {
standaloneEditor.removeOverlayWidget(widget.widget);
standaloneEditor.changeViewZones(function (changeAccessor) {
changeAccessor.removeZone(widget.zone);
});
reviewWidgets.delete(this.widgetId);
sendEvent("EVENT_ON_REVIEW_CHANGED", "");
},
cancel: function () {
let widget = reviewWidgets.get(this.widgetId);
@@ -3518,14 +3531,14 @@ define(['bslGlobals', 'bslMetadata', 'snippets', 'bsl_language', 'vs/editor/edit
},
edit: function () {
let widget = reviewWidgets.get(this.widgetId);
let height = getActiveEditor().getOption(monaco.editor.EditorOption.lineHeight) * 10 + 'px'
let height = standaloneEditor.getOption(monaco.editor.EditorOption.lineHeight) * 10 + 'px'
this.domNode.classList.remove('close');
this.domNode.getElementsByClassName("review-header")[0].style.display = 'none';
this.domNode.getElementsByClassName("review-text")[0].style.display = 'none';
this.domNode.getElementsByClassName("review-edit")[0].style.display = 'block';
this.domNode.style.height = height;
document.querySelector('[monaco-view-zone="' + widget.zone + '"]').style.height = height;
getActiveEditor().changeViewZones(function (changeAccessor) {
standaloneEditor.changeViewZones(function (changeAccessor) {
changeAccessor.layoutZone(widget.zone);
});
},
@@ -3582,8 +3595,21 @@ define(['bslGlobals', 'bslMetadata', 'snippets', 'bsl_language', 'vs/editor/edit
button.classList.add('review-delete');
button.setAttribute('widgetid', widgetId);
button.onclick = function () {
if (confirm("Удалить замечание?"))
reviewWidgets.get(this.getAttribute("widgetid")).widget.delete();
let modal = new tingle.modal({
footer: true,
stickyFooter: false,
closeMethods: ['button'],
widgetid: this.getAttribute("widgetid")
});
modal.setContent('<h3>Удалить замечание?</h3>');
modal.addFooterBtn('Да', 'tingle-btn tingle-btn--primary', function () {
reviewWidgets.get(modal.opts.widgetid).widget.delete();
modal.close();
});
modal.addFooterBtn('Нет', 'tingle-btn tingle-btn--danger', function () {
modal.close();
});
modal.open();
}
buttons.appendChild(button);
}
@@ -3693,7 +3719,7 @@ define(['bslGlobals', 'bslMetadata', 'snippets', 'bsl_language', 'vs/editor/edit
}
};
getActiveEditor().changeViewZones(function (changeAccessor) {
standaloneEditor.changeViewZones(function (changeAccessor) {
let domNode = document.createElement("div");
editor.domNode = domNode;
@@ -3708,7 +3734,7 @@ define(['bslGlobals', 'bslMetadata', 'snippets', 'bsl_language', 'vs/editor/edit
showInHiddenAreas: false,
onDomNodeTop: function (top) {
if (this.widget.domNode) {
let layout = getActiveEditor().getLayoutInfo();
let layout = standaloneEditor.getLayoutInfo();
let scrollWidth = editor.navi ? layout.verticalScrollbarWidth * 2 : layout.verticalScrollbarWidth;
let width = layout.width - scrollWidth - layout.minimapWidth;
this.widget.domNode.style.top = top + 'px';
@@ -3728,12 +3754,12 @@ define(['bslGlobals', 'bslMetadata', 'snippets', 'bsl_language', 'vs/editor/edit
widget: reviewWidget
});
getActiveEditor().layout();
standaloneEditor.layout();
setTimeout(() => {reviewWidget.load(issue)}, 10);
});
getActiveEditor().addOverlayWidget(reviewWidget);
standaloneEditor.addOverlayWidget(reviewWidget);
}
@@ -3743,7 +3769,7 @@ define(['bslGlobals', 'bslMetadata', 'snippets', 'bsl_language', 'vs/editor/edit
value.widget.delete();
});
let standaloneEditor = editor.navi ? editor.getModifiedEditor() : editor;
let standaloneEditor = editor.navi ? editor.getModifiedEditor() : editor;
standaloneEditor.reviewDecorations = [];
if (editor.navi)

View File

@@ -7,6 +7,8 @@
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<link href="./decorations.css" rel="stylesheet">
<link href="./tree/tree.css" rel="stylesheet">
<link href="./tingle.css" rel="stylesheet">
<script src="./tingle.js"></script>
<style>
html,
body {

1
src/micromodal.js Normal file

File diff suppressed because one or more lines are too long

View File

@@ -11,7 +11,9 @@
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chai/2.0.0/chai.js"></script>
<link href="./decorations.css" rel="stylesheet">
<link href="./tree/tree.css" rel="stylesheet">
<link href="./tree/tree.css" rel="stylesheet">
<link href="./tingle.css" rel="stylesheet">
<script src="./tingle.js"></script>
</head>
<body>

View File

@@ -12,6 +12,8 @@
<script src="https://cdnjs.cloudflare.com/ajax/libs/chai/2.0.0/chai.js"></script>
<link href="./decorations.css" rel="stylesheet">
<link href="./tree/tree.css" rel="stylesheet">
<link href="./tingle.css" rel="stylesheet">
<script src="./tingle.js"></script>
</head>
<body>

1
src/tingle.css Normal file
View File

@@ -0,0 +1 @@
.tingle-modal *{box-sizing:border-box}.tingle-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:flex;visibility:hidden;flex-direction:column;align-items:center;overflow:hidden;-webkit-overflow-scrolling:touch;background:rgba(0,0,0,.4);opacity:0;cursor:url("data:image/svg+xml,%3Csvg width='19' height='19' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.514.535l-6.42 6.42L2.677.536a1.517 1.517 0 00-2.14 0 1.517 1.517 0 000 2.14l6.42 6.419-6.42 6.419a1.517 1.517 0 000 2.14 1.517 1.517 0 002.14 0l6.419-6.42 6.419 6.42a1.517 1.517 0 002.14 0 1.517 1.517 0 000-2.14l-6.42-6.42 6.42-6.418a1.517 1.517 0 000-2.14 1.516 1.516 0 00-2.14 0z' fill='%23FFF' fill-rule='nonzero'/%3E%3C/svg%3E"),auto}@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.tingle-modal{-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px)}}.tingle-modal--confirm .tingle-modal-box{text-align:center}.tingle-modal--noOverlayClose{cursor:default}.tingle-modal--noClose .tingle-modal__close{display:none}.tingle-modal__close{position:fixed;top:2.5rem;right:2.5rem;z-index:1000;padding:0;width:2rem;height:2rem;border:none;background-color:transparent;color:#fff;cursor:pointer}.tingle-modal__close svg *{fill:currentColor}.tingle-modal__closeLabel{display:none}.tingle-modal__close:hover{color:#fff}.tingle-modal-box{text-align:center;position:relative;flex-shrink:0;margin-top:auto;margin-bottom:auto;width:15%;border-radius:4px;background:#fff;opacity:1;cursor:auto;will-change:transform,opacity}.tingle-modal-box__content{padding:1rem}.tingle-modal-box__footer{padding:1rem;width:auto;border-bottom-right-radius:4px;border-bottom-left-radius:4px;background-color:#f5f5f5;cursor:auto}.tingle-modal-box__footer::after{display:table;clear:both;content:""}.tingle-modal-box__footer--sticky{position:fixed;bottom:-200px;z-index:10001;opacity:1;transition:bottom .3s ease-in-out .3s}.tingle-enabled{position:fixed;right:0;left:0;overflow:hidden}.tingle-modal--visible .tingle-modal-box__footer{bottom:0}.tingle-modal--visible{visibility:visible;opacity:1}.tingle-modal--visible .tingle-modal-box{animation:scale .2s cubic-bezier(.68,-.55,.265,1.55) forwards}.tingle-modal--overflow{overflow-y:scroll;padding-top:8vh}.tingle-btn{border-radius:0.3rem;display:inline-block;margin:0 .5rem;padding:0.5rem 2rem;border:none;background-color:grey;box-shadow:none;color:#fff;vertical-align:middle;text-decoration:none;font-size:inherit;font-family:inherit;line-height:normal;cursor:pointer;transition:background-color .4s ease}.tingle-btn--primary{background-color:#3498db}.tingle-btn--danger{background-color:#e74c3c}.tingle-btn--default{background-color:#34495e}.tingle-btn--pull-left{float:left}.tingle-btn--pull-right{float:right}@media (max-width :540px){.tingle-modal{top:0;display:block;padding-top:60px;width:100%}.tingle-modal-box{text-align:center;width:auto;border-radius:0}.tingle-modal-box__content{overflow-y:scroll}.tingle-modal--noClose{top:0}.tingle-modal--noOverlayClose{padding-top:0}.tingle-modal-box__footer .tingle-btn{display:block;float:none;margin-bottom:1rem;width:100%}.tingle-modal__close{top:0;right:0;left:0;display:block;width:100%;height:60px;border:none;background-color:#2c3e50;box-shadow:none;color:#fff}.tingle-modal__closeLabel{display:inline-block;vertical-align:middle;font-size:1.6rem;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Fira Sans","Droid Sans","Helvetica Neue",sans-serif}.tingle-modal__closeIcon{display:inline-block;margin-right:.8rem;width:1.6rem;vertical-align:middle;font-size:0}}@keyframes scale{0%{opacity:0;transform:scale(.9)}100%{opacity:1;transform:scale(1)}}

1
src/tingle.js Normal file

File diff suppressed because one or more lines are too long