From 60ad23f20bcd167ae3a8305649e01a51fe6122e9 Mon Sep 17 00:00:00 2001 From: Alex Eng Date: Fri, 3 Jan 2014 15:18:53 +1000 Subject: [PATCH] WIP: scrolling for project search --- .../java/org/zanata/action/ProjectSearch.java | 21 ++--- .../src/main/resources/messages.properties | 2 +- .../layout/version-group/settings-tab.xhtml | 9 ++- .../script/component-autocomplete.js | 81 ++++++++++++------- 4 files changed, 70 insertions(+), 43 deletions(-) diff --git a/zanata-war/src/main/java/org/zanata/action/ProjectSearch.java b/zanata-war/src/main/java/org/zanata/action/ProjectSearch.java index 9b9da1ad4d..1dfa54feb8 100644 --- a/zanata-war/src/main/java/org/zanata/action/ProjectSearch.java +++ b/zanata-war/src/main/java/org/zanata/action/ProjectSearch.java @@ -1,10 +1,9 @@ package org.zanata.action; -import com.google.common.collect.Lists; -import lombok.AllArgsConstructor; -import lombok.Getter; -import lombok.NoArgsConstructor; -import lombok.Setter; +import java.io.Serializable; +import java.util.List; +import javax.faces.model.DataModel; + import org.apache.commons.lang.StringUtils; import org.apache.lucene.queryParser.ParseException; import org.jboss.seam.ScopeType; @@ -15,10 +14,12 @@ import org.zanata.dao.ProjectDAO; import org.zanata.model.HProject; import org.zanata.security.ZanataIdentity; +import com.google.common.collect.Lists; -import javax.faces.model.DataModel; -import java.io.Serializable; -import java.util.List; +import lombok.AllArgsConstructor; +import lombok.Getter; +import lombok.NoArgsConstructor; +import lombok.Setter; @Name("projectSearch") @Scope(ScopeType.CONVERSATION) @@ -70,7 +71,9 @@ public List suggestProjects() { "view-obsolete")); for (HProject project : searchResult) { - result.add(new SearchResult(project)); + for (int i = 0; i < 10; i++) { + result.add(new SearchResult(project)); + } } result.add(new SearchResult()); return result; diff --git a/zanata-war/src/main/resources/messages.properties b/zanata-war/src/main/resources/messages.properties index f84d7e9d8d..f35eb379a5 100644 --- a/zanata-war/src/main/resources/messages.properties +++ b/zanata-war/src/main/resources/messages.properties @@ -418,7 +418,7 @@ jsf.LanguageAlreadyInGroup=Language '{0}' is already added to group. jsf.InvalidProjectVersion=Invalid project version jsf.VersionAlreadyInGroup=Version '{0}' is already added to group. jsf.ArchiveThisGroup=Archive this Group -jsf.ActivateThisGroup=Activate this Group +jsf.UnArchiveThisGroup=Unarchive this Group jsf.MaintainerRemoveFromGroup=Maintainer '{0}' has been removed from group. jsf.MaintainerAddedToGroup=Maintainer '{0}' has been added to group. jsf.InvalidUsername=Invalid username. diff --git a/zanata-war/src/main/webapp/WEB-INF/layout/version-group/settings-tab.xhtml b/zanata-war/src/main/webapp/WEB-INF/layout/version-group/settings-tab.xhtml index dc630bd001..c0d4abc04b 100644 --- a/zanata-war/src/main/webapp/WEB-INF/layout/version-group/settings-tab.xhtml +++ b/zanata-war/src/main/webapp/WEB-INF/layout/version-group/settings-tab.xhtml @@ -86,12 +86,14 @@

- #{messages['jsf.ActivateThisGroup']} + #{messages['jsf.UnArchiveThisGroup']}

- #{messages['jsf.ActivateGroupMessage']} + #{messages['jsf.ActivateGroupMessage']}

@@ -127,7 +129,8 @@ selectedField="#{versionGroupHome.selectedLocale}" getResultAction="#{versionGroupHome.suggestLocales()}" onSelectItemAction="#{versionGroupHome.addLanguage()}" - maxlength="80" searchWhenFocus="true" id="languageAutocomplete" + maxlength="80" minlength="1" searchWhenFocus="true" + id="languageAutocomplete" queryField="#{versionGroupHome.languageQuery}" fetchValue="#{result.localeId}" render="settings-languages-form" oncomplete="refreshStatistics();focusCurrentActiveInput()" diff --git a/zanata-war/src/main/webapp/resources/script/component-autocomplete.js b/zanata-war/src/main/webapp/resources/script/component-autocomplete.js index 913fa1f3d0..bb59bd51f6 100644 --- a/zanata-war/src/main/webapp/resources/script/component-autocomplete.js +++ b/zanata-war/src/main/webapp/resources/script/component-autocomplete.js @@ -36,9 +36,11 @@ jQuery(document).ready(function() { }); function onResultKeyPressed(autocomplete, event, selectItemAction, - selectItemFunction) { - var currentSelected = jQuery(autocomplete).find('.autocomplete__results') - .children('.is-selected'); + selectItemFunction) { + + var resultDiv = jQuery(autocomplete).find('.autocomplete__results'); + + var currentSelected = jQuery(resultDiv).children('.is-selected'); if (isEnterKey(event)) { event.preventDefault(); @@ -47,22 +49,20 @@ function onResultKeyPressed(autocomplete, event, selectItemAction, } } else if (event.keyCode == 40) { // key: down - deselectRow(currentSelected); + clearAllSelection(resultDiv); if (currentSelected.length == 0 - || jQuery(currentSelected).next().length == 0) { - selectRow(jQuery(autocomplete).find('.autocomplete__results').children( - 'li').first()); + || jQuery(currentSelected).next().length == 0) { + selectRow(resultDiv, jQuery(resultDiv).children('li').first()); } else { - selectRow(jQuery(currentSelected).next("li")); + selectRow(resultDiv, jQuery(currentSelected).next("li")); } } else if (event.keyCode == 38) { // key: up - deselectRow(currentSelected); + clearAllSelection(resultDiv); if (currentSelected.length == 0) { - selectRow(jQuery(autocomplete).find('.autocomplete__results').children( - 'li').last()); + selectRow(resultDiv, jQuery(resultDiv).children('li').last()); } else { - selectRow(jQuery(currentSelected).prev("li")); + selectRow(resultDiv, jQuery(currentSelected).prev("li")); } } } @@ -76,8 +76,21 @@ function onSelectItem(row, selectItemAction, selectItemFunction) { jQuery(row).parent().remove(); } -function selectRow(row) { +function selectRow(resultDiv, row) { jQuery(row).addClass("is-selected"); + + var resultDivPos = jQuery(resultDiv).height(); + var rowPos = jQuery(row).offset().top + jQuery(row).height(); + + console.info(resultDivPos + ":" + rowPos); + + if (resultDivPos <= rowPos) { + console.log('out'); + jQuery(resultDiv).animate({ + scrollTop : (jQuery(row).offset().top) + }, 500); + } + // jQuery(resultDiv).scrollTop(rowPos); } function deselectRow(row) { @@ -108,25 +121,33 @@ function onValueChange(inputField, event, renderResultFn) { } function registerMouseEvent(autocompleteId, selectItemAction, - selectItemFunction) { - jQuery("[id='" + autocompleteId + "']").find('.autocomplete__results') - .children('.autocomplete__result').each(function() { - jQuery(this).mouseover(function() { - selectRow(this); - }); - - jQuery(this).mouseout(function() { - deselectRow(this); - }); - - jQuery(this).click(function() { - onSelectItem(this, selectItemAction, selectItemFunction); - }); - }); + selectItemFunction) { + var resultDiv = jQuery("[id='" + autocompleteId + "']").find( + '.autocomplete__results'); + + jQuery(resultDiv).children('.autocomplete__result').each(function() { + jQuery(this).mouseover(function() { + clearAllSelection(resultDiv); + selectRow(resultDiv, this); + }); + + jQuery(this).mouseout(function() { + deselectRow(this); + }); + + jQuery(this).click(function() { + onSelectItem(this, selectItemAction, selectItemFunction); + }); + }); var firstResult = jQuery("[id='" + autocompleteId + "']").find( - '.autocomplete__results').children('.autocomplete__result').first(); + '.autocomplete__results').children('.autocomplete__result').first(); if (firstResult.length != 0) { - selectRow(firstResult); + selectRow(resultDiv, firstResult); } } + +function clearAllSelection(resultDiv) { + jQuery(resultDiv).children('.autocomplete__result') + .removeClass("is-selected"); +}