diff --git a/apps/common/embed/lib/view/SearchBar.js b/apps/common/embed/lib/view/SearchBar.js
index abb0b94dae..ed0399f3aa 100644
--- a/apps/common/embed/lib/view/SearchBar.js
+++ b/apps/common/embed/lib/view/SearchBar.js
@@ -45,7 +45,10 @@ common.view.SearchBar = new(function() {
var tpl = '
';
- var tplBody = '' +
+ var tplBody = '' +
'' +
'' +
'' +
@@ -71,6 +74,13 @@ common.view.SearchBar = new(function() {
$('#search-bar-next').attr({disabled: disable});
},
+ updateResultsNumber: function (current, all) {
+ var $results = $('#search-bar-results'),
+ $input = $('#search-bar-text');
+ $results.text(!all || $input.val() === '' ? '0/0' : current + 1 + '/' + all);
+ $input.css('padding-right', $results.outerWidth() + 'px');
+ },
+
textFind: 'Find'
};
diff --git a/apps/common/embed/resources/less/common.less b/apps/common/embed/resources/less/common.less
index de08df890f..cb5aecde18 100644
--- a/apps/common/embed/resources/less/common.less
+++ b/apps/common/embed/resources/less/common.less
@@ -824,23 +824,38 @@
display: flex;
padding: 16px;
- input {
- width: 192px;
+ .search-input-group {
+ display: flex;
+ position: relative;
height: 22px;
- border-radius: 2px;
- box-shadow: none;
- border: solid 1px #CFCFCF;
- padding: 1px 3px;
- color: #444444;
- font-size: 11px;
- &::placeholder {
- color: #CFCFCF;
+ input {
+ width: 192px;
+ height: 100%;
+ border-radius: 2px;
+ box-shadow: none;
+ border: solid 1px #CFCFCF;
+ padding: 1px 25px 1px 3px;
+ color: #444444;
+ font-size: 11px;
+
+ &::placeholder {
+ color: #CFCFCF;
+ }
+
+ &:focus {
+ border-color: #848484;
+ outline: 0;
+ }
}
- &:focus {
- border-color: #848484;
- outline: 0;
+ #search-bar-results {
+ position: absolute;
+ right: 0;
+ height: 100%;
+ line-height: 22px;
+ padding: 0 4px;
+ color: #A5A5A5;
}
}
diff --git a/apps/documenteditor/embed/js/SearchBar.js b/apps/documenteditor/embed/js/SearchBar.js
index 06d5a6f61c..bf8b76faba 100644
--- a/apps/documenteditor/embed/js/SearchBar.js
+++ b/apps/documenteditor/embed/js/SearchBar.js
@@ -121,6 +121,7 @@
onQuerySearch();
} else {
api.asc_endFindText();
+ common.view.SearchBar.updateResultsNumber();
}
clearInterval(_searchTimer);
_searchTimer = undefined;
@@ -136,6 +137,7 @@
searchSettings.put_WholeWords(false);
if (!api.asc_findText(searchSettings, d != 'back')) {
common.view.SearchBar.disableNavButtons();
+ common.view.SearchBar.updateResultsNumber();
return false;
}
return true;
@@ -153,6 +155,7 @@
var onApiUpdateSearchCurrent = function (current, all) {
common.view.SearchBar.disableNavButtons(current, all);
+ common.view.SearchBar.updateResultsNumber(current, all);
};
var highlightResults = function (val) {
diff --git a/apps/presentationeditor/embed/js/SearchBar.js b/apps/presentationeditor/embed/js/SearchBar.js
index d182da9501..70dad96bf4 100644
--- a/apps/presentationeditor/embed/js/SearchBar.js
+++ b/apps/presentationeditor/embed/js/SearchBar.js
@@ -119,6 +119,7 @@
onQuerySearch();
} else {
api.asc_endFindText();
+ common.view.SearchBar.updateResultsNumber();
}
clearInterval(_searchTimer);
_searchTimer = undefined;
@@ -134,6 +135,7 @@
searchSettings.put_WholeWords(false);
if (!api.asc_findText(searchSettings, d != 'back')) {
common.view.SearchBar.disableNavButtons();
+ common.view.SearchBar.updateResultsNumber();
return false;
}
return true;
@@ -151,6 +153,7 @@
var onApiUpdateSearchCurrent = function (current, all) {
common.view.SearchBar.disableNavButtons(current, all);
+ common.view.SearchBar.updateResultsNumber(current, all);
};
return {
diff --git a/apps/spreadsheeteditor/embed/js/SearchBar.js b/apps/spreadsheeteditor/embed/js/SearchBar.js
index 02d62f3cec..87ef7ebc73 100644
--- a/apps/spreadsheeteditor/embed/js/SearchBar.js
+++ b/apps/spreadsheeteditor/embed/js/SearchBar.js
@@ -139,6 +139,7 @@
options.asc_setNotSearchEmptyCells(true);
if (!api.asc_findText(options)) {
common.view.SearchBar.disableNavButtons();
+ common.view.SearchBar.updateResultsNumber();
return false;
}
return true;
@@ -156,6 +157,7 @@
var onApiUpdateSearchCurrent = function (current, all) {
common.view.SearchBar.disableNavButtons(current, all);
+ common.view.SearchBar.updateResultsNumber(current, all);
};
var highlightResults = function (val) {