diff --git a/apps/common/main/lib/view/Header.js b/apps/common/main/lib/view/Header.js index 5dbf268b81..6622a1fa8a 100644 --- a/apps/common/main/lib/view/Header.js +++ b/apps/common/main/lib/view/Header.js @@ -461,6 +461,7 @@ define([ me.btnSearch = new Common.UI.Button({ cls: 'btn-header no-caret', iconCls: 'toolbar__icon icon--inverse btn-menu-search', + enableToggle: true, dataHint: '0', dataHintDirection: 'bottom', dataHintOffset: 'big' diff --git a/apps/common/main/lib/view/SearchBar.js b/apps/common/main/lib/view/SearchBar.js index 5d963f0c67..b2605d2870 100644 --- a/apps/common/main/lib/view/SearchBar.js +++ b/apps/common/main/lib/view/SearchBar.js @@ -49,7 +49,8 @@ define([ width: 328, height: 54, header: false, - cls: 'search-bar' + cls: 'search-bar', + alias: 'SearchBar' }, initialize : function(options) { @@ -57,28 +58,59 @@ define([ this.template = [ '
', - 'jghjgj', + '', + '
', + '
', + '
', + '
', + '
', '
' ].join(''); this.options.tpl = _.template(this.template)(this.options); Common.UI.Window.prototype.initialize.call(this, this.options); + + Common.NotificationCenter.on('layout:changed', _.bind(this.onLayoutChanged, this)); }, render: function() { Common.UI.Window.prototype.render.call(this); + this.inputSearch = this.$window.find('#search-bar-text'); + this.btnBack = new Common.UI.Button({ + parentEl: $('#search-bar-back'), + cls: 'btn-toolbar', + iconCls: 'toolbar__icon btn-arrow-up' + }); + this.btnBack.on('click', _.bind(this.onBtnClick, this, 'back')); + + this.btnNext = new Common.UI.Button({ + parentEl: $('#search-bar-next'), + cls: 'btn-toolbar', + iconCls: 'toolbar__icon btn-arrow-down' + }); + this.btnNext.on('click', _.bind(this.onBtnClick, this, 'next')); + + this.btnClose = new Common.UI.Button({ + parentEl: $('#search-bar-close'), + cls: 'btn-toolbar', + iconCls: 'toolbar__icon btn-close' + }); + this.btnClose.on('click', _.bind(function () { + this.hide(); + }, this)) this.on('animate:before', _.bind(this.focus, this)); return this; }, - show: function(x, y) { - Common.UI.Window.prototype.show.call(this, x, y); - + show: function() { + var top = $('#app-title').height() + $('#toolbar').height() + 2, + left = Common.Utils.innerWidth() - $('#right-menu').width() - this.options.width - 32; + Common.UI.Window.prototype.show.call(this, left, top); this.focus(); }, @@ -86,7 +118,8 @@ define([ focus: function() { var me = this; setTimeout(function(){ - + me.inputSearch.focus(); + me.inputSearch.select(); }, 10); }, @@ -96,5 +129,21 @@ define([ }; }, + onLayoutChanged: function () { + var top = $('#app-title').height() + $('#toolbar').height() + 2, + left = Common.Utils.innerWidth() - $('#right-menu').width() - this.options.width - 32; + this.$window.css({left: left, top: top}); + }, + + onBtnClick: function(action, event) { + if ( $('.asc-loadmask').length ) return; + var opts = { + textsearch : this.inputSearch.val() + }; + this.fireEvent('search:'+action, [this, opts]); + }, + + textFind: 'Find' + }, Common.UI.SearchBar || {})); }); \ No newline at end of file diff --git a/apps/common/main/resources/less/searchdialog.less b/apps/common/main/resources/less/searchdialog.less index 322fb7845c..5f64dfa18f 100644 --- a/apps/common/main/resources/less/searchdialog.less +++ b/apps/common/main/resources/less/searchdialog.less @@ -80,4 +80,22 @@ } } } +} + +.search-bar { + z-index: 950; + .box { + padding: 16px; + display: flex; + input[type=text] { + width: 192px; + } + .tools { + display: flex; + align-items: center; + div { + margin-left: 5px; + } + } + } } \ No newline at end of file diff --git a/apps/documenteditor/main/app.js b/apps/documenteditor/main/app.js index 3e2a273865..ebe926b5c9 100644 --- a/apps/documenteditor/main/app.js +++ b/apps/documenteditor/main/app.js @@ -158,6 +158,7 @@ require([ 'LeftMenu', 'Main', 'ViewTab', + 'Search', 'Common.Controllers.Fonts', 'Common.Controllers.History' /** coauthoring begin **/ @@ -187,6 +188,7 @@ require([ 'documenteditor/main/app/controller/LeftMenu', 'documenteditor/main/app/controller/Main', 'documenteditor/main/app/controller/ViewTab', + 'documenteditor/main/app/controller/Search', 'documenteditor/main/app/view/FileMenuPanels', 'documenteditor/main/app/view/ParagraphSettings', 'documenteditor/main/app/view/HeaderFooterSettings', diff --git a/apps/documenteditor/main/app/controller/Main.js b/apps/documenteditor/main/app/controller/Main.js index b46515549a..633cdf77e4 100644 --- a/apps/documenteditor/main/app/controller/Main.js +++ b/apps/documenteditor/main/app/controller/Main.js @@ -1195,7 +1195,9 @@ define([ leftmenuController = application.getController('LeftMenu'), chatController = application.getController('Common.Controllers.Chat'), pluginsController = application.getController('Common.Controllers.Plugins'), - navigationController = application.getController('Navigation'); + navigationController = application.getController('Navigation'), + searchController = application.getController('Search'); + leftmenuController.getView('LeftMenu').getMenu('file').loadDocument({doc:me.document}); leftmenuController.setMode(me.appOptions).createDelayedElements().setApi(me.api); @@ -1219,6 +1221,8 @@ define([ documentHolderController.getView().setApi(me.api).on('editcomplete', _.bind(me.onEditComplete, me)); + searchController.setApi(me.api); + if (me.appOptions.isEdit) { if (me.appOptions.canForcesave) {// use asc_setIsForceSaveOnUserSave only when customization->forcesave = true me.appOptions.forcesave = Common.localStorage.getBool("de-settings-forcesave", me.appOptions.canForcesave); diff --git a/apps/documenteditor/main/app/controller/Search.js b/apps/documenteditor/main/app/controller/Search.js new file mode 100644 index 0000000000..6026abd345 --- /dev/null +++ b/apps/documenteditor/main/app/controller/Search.js @@ -0,0 +1,87 @@ +/* + * + * (c) Copyright Ascensio System SIA 2010-2020 + * + * This program is a free software product. You can redistribute it and/or + * modify it under the terms of the GNU Affero General Public License (AGPL) + * version 3 as published by the Free Software Foundation. In accordance with + * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect + * that Ascensio System SIA expressly excludes the warranty of non-infringement + * of any third-party rights. + * + * This program is distributed WITHOUT ANY WARRANTY; without even the implied + * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. For + * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html + * + * You can contact Ascensio System SIA at 20A-12 Ernesta Birznieka-Upisha + * street, Riga, Latvia, EU, LV-1050. + * + * The interactive user interfaces in modified source and object code versions + * of the Program must display Appropriate Legal Notices, as required under + * Section 5 of the GNU AGPL version 3. + * + * Pursuant to Section 7(b) of the License you must retain the original Product + * logo when distributing the program. Pursuant to Section 7(e) we decline to + * grant you any rights under trademark law for use of our trademarks. + * + * All the Product's GUI elements, including illustrations and icon sets, as + * well as technical writing content are licensed under the terms of the + * Creative Commons Attribution-ShareAlike 4.0 International. See the License + * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode + * + */ + +/** + * ViewTab.js + * + * Created by Julia Svinareva on 09.02.2022 + * Copyright (c) 2022 Ascensio System SIA. All rights reserved. + * + */ + +define([ + 'core' +], function () { + 'use strict'; + + DE.Controllers.Search = Backbone.Controller.extend(_.extend({ + sdkViewName : '#id_main', + + initialize: function () { + console.log('init'); + this.addListeners({ + 'SearchBar': { + 'search:back': _.bind(this.onQuerySearch, this, 'back'), + 'search:next': _.bind(this.onQuerySearch, this, 'next'), + } + }); + }, + onLaunch: function () { + this._state = {}; + }, + + setApi: function (api) { + if (api) { + this.api = api; + } + return this; + }, + + onQuerySearch: function (d, w, opts) { + if (opts.textsearch && opts.textsearch.length) { + if (!this.api.asc_findText(opts.textsearch, d != 'back')) { + var me = this; + Common.UI.info({ + msg: this.textNoTextFound, + callback: function() { + //me.dlgSearch.focus(); + } + }); + } + } + }, + + textNoTextFound: 'The data you have been searching for could not be found. Please adjust your search options.', + + }, DE.Controllers.Search || {})); +}); \ No newline at end of file diff --git a/apps/documenteditor/main/app/controller/Viewport.js b/apps/documenteditor/main/app/controller/Viewport.js index ec93ef6318..b261e8b6bc 100644 --- a/apps/documenteditor/main/app/controller/Viewport.js +++ b/apps/documenteditor/main/app/controller/Viewport.js @@ -463,15 +463,21 @@ define([ }, onSearchClick: function () { - if ( !this.searchBar ) { - this.searchBar = (new Common.UI.SearchBar({ - })); + if (!this.searchBar) { + this.searchBar = new Common.UI.SearchBar({}); } - - var top = $('#app-title').height() + $('#toolbar').height() + 2, - left = Common.Utils.innerWidth() - $('#right-menu').width() - this.searchBar.options.width - 32; - - this.searchBar.show(left, top); + if (this.header.btnSearch.pressed) { + if (this.searchBar.isVisible()) { + this.searchBar.focus(); + } else { + this.searchBar.show(); + } + } else { + this.searchBar.hide(); + } + this.searchBar.on('hide', _.bind(function () { + this.header.btnSearch.toggle(false); + }, this)); }, textFitPage: 'Fit to Page', diff --git a/apps/documenteditor/main/app_dev.js b/apps/documenteditor/main/app_dev.js index cb8cdd5a4b..1463eec8b8 100644 --- a/apps/documenteditor/main/app_dev.js +++ b/apps/documenteditor/main/app_dev.js @@ -148,6 +148,7 @@ require([ 'LeftMenu', 'Main', 'ViewTab', + 'Search', 'Common.Controllers.Fonts', 'Common.Controllers.History' /** coauthoring begin **/ @@ -177,6 +178,7 @@ require([ 'documenteditor/main/app/controller/LeftMenu', 'documenteditor/main/app/controller/Main', 'documenteditor/main/app/controller/ViewTab', + 'documenteditor/main/app/controller/Search', 'documenteditor/main/app/view/FileMenuPanels', 'documenteditor/main/app/view/ParagraphSettings', 'documenteditor/main/app/view/HeaderFooterSettings',