diff --git a/apps/common/mobile/lib/view/Search.jsx b/apps/common/mobile/lib/view/Search.jsx index 02c00a400b..8a3effdbe2 100644 --- a/apps/common/mobile/lib/view/Search.jsx +++ b/apps/common/mobile/lib/view/Search.jsx @@ -93,7 +93,7 @@ class SearchView extends Component { this.onReplaceClick = this.onReplaceClick.bind(this); } - componentDidMount(){ + componentDidMount() { this.$replace = $$('#idx-replace-val'); const $editor = $$('#editor_sdk'); @@ -126,8 +126,13 @@ class SearchView extends Component { } componentWillUnmount() { - $$('#editor_sdk').off('pointerdown', this.onEditorTouchStart) - .off('pointerup', this.onEditorTouchEnd); + $$('#editor_sdk') + .off('pointerdown', this.onEditorTouchStart) + .off('pointerup', this.onEditorTouchEnd); + + if(this.searchTimer) { + clearInterval(this.searchTimer); + } } onSettingsClick(e) { @@ -152,9 +157,9 @@ class SearchView extends Component { if (this.searchbar && this.state.searchQuery) { if (this.props.onSearchQuery) { let params = this.searchParams(); + params.find = this.state.searchQuery; params.forward = action != SEARCH_BACKWARD; - // console.log(params); this.props.onSearchQuery(params); } @@ -190,7 +195,7 @@ class SearchView extends Component { // } onEditorTouchStart(e) { - console.log('taouch start'); + // console.log('taouch start'); this.startPoint = this.pointerPosition(e); } @@ -236,11 +241,43 @@ class SearchView extends Component { }); } - onSearchKeyBoard(event) { + onSearchKeyDown(e) { this.props.setNumberSearchResults(null); - if(event.keyCode === 13) { - this.props.onSearchQuery(this.searchParams()); + if(e.keyCode === 13) { + if (this.props.onSearchQuery(this.searchParams(), true) && this.searchTimer) { + clearInterval(this.searchTimer); + this.searchTimer = undefined; + } + } + } + + onSearchInput(e) { + const text = e.target.value; + const api = Common.EditorApi.get(); + + if (text && this.state.searchQuery !== text) { + this.setState(prevState => ({ + ...prevState, + searchQuery: text + })); + + this.lastInputChange = new Date(); + + if (this.searchTimer === undefined) { + this.searchTimer = setInterval(() => { + if (new Date() - this.lastInputChange < 400) return; + + if (this.state.searchQuery !== '') { + this.props.onSearchQuery(this.searchParams(), true); + } else { + api.asc_endFindText(); + } + + clearInterval(this.searchTimer); + this.searchTimer = undefined; + }, 10); + } } } @@ -270,7 +307,8 @@ class SearchView extends Component {
this.onSearchKeyBoard(e)} + onKeyDown={e => this.onSearchKeyDown(e)} + onInput={e => this.onSearchInput(e)} onChange={e => {this.changeSearchQuery(e.target.value)}} ref={el => this.refSearchbarInput = el} /> {isIos ? : null} this.changeSearchQuery('')} /> diff --git a/apps/documenteditor/mobile/src/controller/Search.jsx b/apps/documenteditor/mobile/src/controller/Search.jsx index aa93703ffb..928ffa9c0c 100644 --- a/apps/documenteditor/mobile/src/controller/Search.jsx +++ b/apps/documenteditor/mobile/src/controller/Search.jsx @@ -97,7 +97,7 @@ const Search = withTranslation()(props => { const _t = t('Settings', {returnObjects: true}); const [numberSearchResults, setNumberSearchResults] = useState(null); - const onSearchQuery = params => { + const onSearchQuery = (params, isSearchByTyping) => { const api = Common.EditorApi.get(); f7.popover.close('.document-menu.modal-in', false); @@ -113,7 +113,10 @@ const Search = withTranslation()(props => { if(!resultCount) { setNumberSearchResults(0); api.asc_selectSearchingResults(false); - f7.dialog.alert(null, t('Settings.textNoMatches')); + + if(!isSearchByTyping) { + f7.dialog.alert(null, t('Settings.textNoMatches')); + } } else { setNumberSearchResults(resultCount); } diff --git a/apps/presentationeditor/mobile/src/controller/Search.jsx b/apps/presentationeditor/mobile/src/controller/Search.jsx index 6aababed01..54f87e9d15 100644 --- a/apps/presentationeditor/mobile/src/controller/Search.jsx +++ b/apps/presentationeditor/mobile/src/controller/Search.jsx @@ -77,7 +77,7 @@ const Search = withTranslation()(props => { const _t = t('View.Settings', {returnObjects: true}); const [numberSearchResults, setNumberSearchResults] = useState(null); - const onSearchQuery = params => { + const onSearchQuery = (params, isSearchByTyping) => { const api = Common.EditorApi.get(); f7.popover.close('.document-menu.modal-in', false); @@ -90,7 +90,10 @@ const Search = withTranslation()(props => { api.asc_findText(options, params.forward, function(resultCount) { if(!resultCount) { setNumberSearchResults(0); - f7.dialog.alert(null, t('View.Settings.textNoMatches')); + + if(!isSearchByTyping) { + f7.dialog.alert(null, t('View.Settings.textNoMatches')); + } } else { setNumberSearchResults(resultCount); } diff --git a/apps/spreadsheeteditor/mobile/src/controller/Search.jsx b/apps/spreadsheeteditor/mobile/src/controller/Search.jsx index 0b2a353c8e..98079deee1 100644 --- a/apps/spreadsheeteditor/mobile/src/controller/Search.jsx +++ b/apps/spreadsheeteditor/mobile/src/controller/Search.jsx @@ -148,7 +148,7 @@ const Search = withTranslation()(props => { } }); - const onSearchQuery = params => { + const onSearchQuery = (params, isSearchByTyping) => { const api = Common.EditorApi.get(); let lookIn = +params.lookIn === 0; @@ -170,7 +170,10 @@ const Search = withTranslation()(props => { api.asc_findText(options, function(resultCount) { if(!resultCount) { setNumberSearchResults(0); - f7.dialog.alert(null, t('View.Settings.textNoMatches')); + + if(!isSearchByTyping) { + f7.dialog.alert(null, t('View.Settings.textNoMatches')); + } } else { setNumberSearchResults(resultCount); }