Skip to content
Snippets Groups Projects
Commit 33b18203 authored by Anthony's avatar Anthony
Browse files

Transform search bar

parent 3217174e
Branches
Tags
1 merge request!15Add research field and undo research manifest in annotation content
Source diff could not be displayed: it is too large. Options to address this: view the blob.
...@@ -8,10 +8,13 @@ import ListItemText from '@material-ui/core/ListItemText'; ...@@ -8,10 +8,13 @@ import ListItemText from '@material-ui/core/ListItemText';
import Typography from '@material-ui/core/Typography'; import Typography from '@material-ui/core/Typography';
import SearchIcon from '@material-ui/icons/SearchSharp'; import SearchIcon from '@material-ui/icons/SearchSharp';
import InputBase from '@material-ui/core/InputBase'; import InputBase from '@material-ui/core/InputBase';
import CircularProgress from '@material-ui/core/CircularProgress';
import TextField from '@material-ui/core/TextField';
import SanitizedHtml from '../containers/SanitizedHtml'; import SanitizedHtml from '../containers/SanitizedHtml';
import { ScrollTo } from './ScrollTo'; import { ScrollTo } from './ScrollTo';
import AnnotationManifestsAccordion from '../containers/AnnotationManifestsAccordion'; import AnnotationManifestsAccordion from '../containers/AnnotationManifestsAccordion';
import { filterAnnotation } from '../helper/utils'; import { filterAnnotation } from '../helper/utils';
import { MiradorMenuButton } from './MiradorMenuButton';
/** /**
* CanvasAnnotations ~ * CanvasAnnotations ~
...@@ -77,31 +80,29 @@ export class CanvasAnnotations extends Component { ...@@ -77,31 +80,29 @@ export class CanvasAnnotations extends Component {
let { annotations } = this.props; let { annotations } = this.props;
if (annotations.length === 0) return null;
const { inputSearch } = this.state; const { inputSearch } = this.state;
if (inputSearch != undefined && inputSearch !== '') { if (inputSearch != undefined && inputSearch !== '') {
annotations = filterAnnotation(annotations, inputSearch); annotations = filterAnnotation(annotations, inputSearch);
} }
return ( return (
<> <>
<Typography className={classes.sectionHeading} variant="overline"> <div className={classes.form}>
{t('annotationCanvasLabel', { context: `${index + 1}/${totalSize}`, label })} <TextField
</Typography> label={t('searchPlaceholderAnnotation')}
onChange={this.handleAnnotationSearch}
<div className={classes.search}> InputProps={{
<div className={classes.searchIcon}> endAdornment: (
<div className={classes.endAdornment}>
<MiradorMenuButton aria-label={t('searchSubmitAria')} type="submit">
<SearchIcon /> <SearchIcon />
</MiradorMenuButton>
</div> </div>
<InputBase ),
placeholder="Search…"
classes={{
input: classes.inputInput,
root: classes.inputRoot,
}} }}
inputProps={{ 'aria-label': 'search' }}
onChange={this.handleAnnotationSearch}
/> />
</div> </div>
<MenuList autoFocusItem variant="selectedMenu"> <MenuList autoFocusItem variant="selectedMenu">
......
...@@ -69,6 +69,9 @@ const styles = theme => ({ ...@@ -69,6 +69,9 @@ const styles = theme => ({
marginRight: theme.spacing(0.5), marginRight: theme.spacing(0.5),
marginTop: theme.spacing(1), marginTop: theme.spacing(1),
}, },
form: {
padding: theme.spacing(0, 1, 0, 1),
},
grow: { grow: {
flexGrow: 1, flexGrow: 1,
}, },
......
...@@ -125,6 +125,7 @@ ...@@ -125,6 +125,7 @@
"searchResultsRemaining": "{{numLeft}} remaining", "searchResultsRemaining": "{{numLeft}} remaining",
"searchSubmitAria": "Submit search", "searchSubmitAria": "Submit search",
"searchTitle": "Search", "searchTitle": "Search",
"searchPlaceholderAnnotation" : "Search...",
"selectWorkspaceMenu": "Select workspace type", "selectWorkspaceMenu": "Select workspace type",
"showingNumAnnotations_one": "Showing {{number}} annotation", "showingNumAnnotations_one": "Showing {{number}} annotation",
"showingNumAnnotations_other": "Showing {{number}} annotations", "showingNumAnnotations_other": "Showing {{number}} annotations",
......
...@@ -117,6 +117,7 @@ ...@@ -117,6 +117,7 @@
"searchInputLabel": "Chercher un mot", "searchInputLabel": "Chercher un mot",
"searchNextResult": "Résultat suivant", "searchNextResult": "Résultat suivant",
"searchNoResults": "Aucun résultat trouvé", "searchNoResults": "Aucun résultat trouvé",
"searchPlaceholderAnnotation" : "Rechercher...",
"searchPreviousResult": "Résultat précédent", "searchPreviousResult": "Résultat précédent",
"searchSubmitAria": "Lancer la recherche", "searchSubmitAria": "Lancer la recherche",
"searchTitle": "Rechercher", "searchTitle": "Rechercher",
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment