diff --git a/services/web/public/coffee/ide/editor/directives/aceEditor.coffee b/services/web/public/coffee/ide/editor/directives/aceEditor.coffee index 0166bbd89e..4edeb5aae6 100644 --- a/services/web/public/coffee/ide/editor/directives/aceEditor.coffee +++ b/services/web/public/coffee/ide/editor/directives/aceEditor.coffee @@ -1,15 +1,18 @@ define [ "base" "ace/ace" + "ace/ext-searchbox" "ide/editor/directives/aceEditor/undo/UndoManager" "ide/editor/directives/aceEditor/auto-complete/AutoCompleteManager" "ide/editor/directives/aceEditor/spell-check/SpellCheckManager" "ide/editor/directives/aceEditor/highlights/HighlightsManager" "ide/editor/directives/aceEditor/cursor-position/CursorPositionManager" -], (App, Ace, UndoManager, AutoCompleteManager, SpellCheckManager, HighlightsManager, CursorPositionManager) -> +], (App, Ace, SearchBox, UndoManager, AutoCompleteManager, SpellCheckManager, HighlightsManager, CursorPositionManager) -> EditSession = require('ace/edit_session').EditSession - App.directive "aceEditor", ["$timeout", ($timeout) -> + App.directive "aceEditor", ["$timeout", "$compile", "$rootScope", ($timeout, $compile, $rootScope) -> + monkeyPatchSearch($rootScope, $compile) + return { scope: { theme: "=" @@ -57,6 +60,20 @@ define [ editor.commands.removeCommand "showSettingsMenu" editor.commands.removeCommand "foldall" + # Trigger search AND replace on CMD+F + editor.commands.addCommand + name: "find", + bindKey: win: "Ctrl-F", mac: "Command-F" + exec: (editor) -> + Ace.require("ace/ext/searchbox").Search(editor, true) + readOnly: true + editor.commands.removeCommand "replace" + + # Make '/' work for search in vim mode. + editor.showCommandLine = (arg) => + if arg == "/" + Ace.require("ace/ext/searchbox").Search(editor, true) + if attrs.resizeOn? for event in attrs.resizeOn.split(",") scope.$on event, () -> @@ -183,4 +200,47 @@ define [ """ } - ] \ No newline at end of file + ] + + monkeyPatchSearch = ($rootScope, $compile) -> + SearchBox = Ace.require("ace/ext/searchbox").SearchBox + searchHtml = """ + + """ + + # Remove Ace CSS + $("#ace_searchbox").remove() + + $init = SearchBox::$init + SearchBox::$init = () -> + @element = $compile(searchHtml)($rootScope.$new())[0]; + $init.apply(@) diff --git a/services/web/public/stylesheets/app/editor.less b/services/web/public/stylesheets/app/editor.less index c0104d5f9a..c7f49124ab 100644 --- a/services/web/public/stylesheets/app/editor.less +++ b/services/web/public/stylesheets/app/editor.less @@ -6,6 +6,7 @@ @import "./editor/share.less"; @import "./editor/chat.less"; @import "./editor/binary-file.less"; +@import "./editor/search.less"; .full-size { position: absolute; diff --git a/services/web/public/stylesheets/app/editor/search.less b/services/web/public/stylesheets/app/editor/search.less new file mode 100644 index 0000000000..b4125fe6a0 --- /dev/null +++ b/services/web/public/stylesheets/app/editor/search.less @@ -0,0 +1,57 @@ +.ace_search { + background-color: @gray-lightest; + border: 1px solid @toolbar-border-color; + border-top: 0 none; + width: 350px; + overflow: hidden; + position: absolute; + top: 0px; + z-index: 99; + white-space: normal; + padding: @line-height-computed / 4; + + font-family: @font-family-sans-serif; + + a, button { + i { + pointer-events: none; + } + } + + .ace_searchbtn_close { + position: absolute; + top: 6px; + right: 12px; + color: @gray; + &:hover { + color: @gray-dark; + } + } + + .ace_search_form, .ace_replace_form { + margin-bottom: @line-height-computed / 4; + input { + width: 210px; + display: inline-block; + } + .btn-group { + display: inline-block; + } + } + + .ace_nomatch { + input { + border-color: @red; + } + } +} +.ace_search.left { + border-left: 0 none; + border-radius: 0px 0px @border-radius-base 0px; + left: 0; +} +.ace_search.right { + border-radius: 0px 0px 0px @border-radius-base; + border-right: 0 none; + right: 0; +} \ No newline at end of file diff --git a/services/web/public/stylesheets/core/mixins.less b/services/web/public/stylesheets/core/mixins.less index cf1ed131e1..3a48dd027c 100755 --- a/services/web/public/stylesheets/core/mixins.less +++ b/services/web/public/stylesheets/core/mixins.less @@ -505,6 +505,7 @@ &:focus, &:active, &.active, + &.checked, .open .dropdown-toggle& { color: @color; background-color: darken(@background, 8%);