Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
58 changes: 14 additions & 44 deletions root/artist/edit_form.tt
Original file line number Diff line number Diff line change
Expand Up @@ -17,17 +17,11 @@
[%- disambiguation_error() -%]
[%- form_row_select(r, 'type_id', add_colon(l('Type'))) -%]
[%- form_row_select(r, 'gender_id', add_colon(l('Gender'))) -%]
[% WRAPPER form_row %]
[% area_field = form.field('area.name') %]
<label for="id-edit-artist.area.name">[% add_colon(l('Area')) %]</label>
<span id="area" class="area autocomplete">
[% React.embed(c, 'static/scripts/common/components/SearchIcon') %]
[% r.hidden(form.field('area').field('gid'), { class => 'gid' }) %]
[% r.hidden('area_id', class => 'id') %]
[% r.text(area_field, class => 'name') %]
</span>
[% field_errors(r.form, 'area.name') %]
[% END %]
[% React.embed(c, 'static/scripts/edit/components/FormRowArea', {
label => add_colon(l('Area')),
field => form_to_json(form.field('area')),
idField => form_to_json(form.field('area_id')),
}) %]
[% React.embed(c, 'static/scripts/edit/components/FormRowTextListSimple', {
repeatable => form_to_json(form.field('ipi_codes')),
label => add_colon(l('IPI codes')),
Expand All @@ -44,39 +38,15 @@
}) %]
</fieldset>

<fieldset>
<legend>[% l('Date period') %]</legend>
<p>
[%- l('Dates are in the format YYYY-MM-DD. Partial dates such as YYYY-MM or just YYYY are OK, or you can omit the date entirely.') -%]
</p>
[% form_row_date(r, 'period.begin_date', add_colon(l('Begin date'))) %]
[% too_short_year_error('too_short_begin_year') %]
[% WRAPPER form_row %]
[% begin_area_field = form.field('begin_area.name') %]
<label id="label-id-edit-artist.begin_area.name" for="id-edit-artist.begin_area.name">[% add_colon(l('Begin area')) %]</label>
<span id="begin_area" class="area autocomplete">
[% React.embed(c, 'static/scripts/common/components/SearchIcon') %]
[% r.hidden(form.field('begin_area').field('gid'), { class => 'gid' }) %]
[% r.hidden('begin_area_id', class => 'id') %]
[% r.text(begin_area_field, class => 'name') %]
</span>
[% field_errors(r.form, 'begin_area.name') %]
[% END %]
[% form_row_date(r, 'period.end_date', add_colon(l('End date'))) %]
[% too_short_year_error('too_short_end_year') %]
[% form_row_checkbox(r, 'period.ended', l('This artist has ended.')) %]
[% WRAPPER form_row %]
[% end_area_field = form.field('end_area.name') %]
<label id="label-id-edit-artist.end_area.name" for="id-edit-artist.end_area.name">[% add_colon(l('End area')) %]</label>
<span id="end_area" class="area autocomplete">
[% React.embed(c, 'static/scripts/common/components/SearchIcon') %]
[% r.hidden(form.field('end_area').field('gid'), { class => 'gid' }) %]
[% r.hidden('end_area_id', class => 'id') %]
[% r.text(end_area_field, class => 'name') %]
</span>
[% field_errors(r.form, 'end_area.name') %]
[% END %]
</fieldset>
[% React.embed(c, 'static/scripts/edit/components/HydratedArtistDateRangeFieldset', {
initialDate => form_to_json(form.field('period')),
endedLabel => 'This artist has ended.',
beginArea => form_to_json(form.field('begin_area')),
beginAreaId => form_to_json(form.field('begin_area_id')),
endArea => form_to_json(form.field('end_area')),
endAreaId => form_to_json(form.field('end_area_id')),
}) %]
[% script_manifest('edit/components/HydratedArtistDateRangeFieldset', {async => 'async'}) %]

[% PROCESS 'forms/relationship-editor.tt' %]

Expand Down
2 changes: 2 additions & 0 deletions root/server/components.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -537,10 +537,12 @@ export default {
'static/scripts/common/components/TaggerIcon': (): Promise<mixed> => import('../static/scripts/common/components/TaggerIcon.js'),
'static/scripts/common/components/WarningIcon': (): Promise<mixed> => import('../static/scripts/common/components/WarningIcon.js'),
'static/scripts/edit/components/AddIcon': (): Promise<mixed> => import('../static/scripts/edit/components/AddIcon.js'),
'static/scripts/edit/components/FormRowArea': (): Promise<mixed> => import('../static/scripts/edit/components/FormRowArea.js'),
'static/scripts/edit/components/FormRowNameWithGuessCase': (): Promise<mixed> => import('../static/scripts/edit/components/FormRowNameWithGuessCase.js'),
'static/scripts/edit/components/FormRowTextList': (): Promise<mixed> => import('../static/scripts/edit/components/FormRowTextList.js'),
'static/scripts/edit/components/FormRowTextListSimple': (): Promise<mixed> => import('../static/scripts/edit/components/FormRowTextListSimple.js'),
'static/scripts/edit/components/GuessCaseIcon': (): Promise<mixed> => import('../static/scripts/edit/components/GuessCaseIcon.js'),
'static/scripts/edit/components/HydratedArtistDateRangeFieldset': (): Promise<mixed> => import('../static/scripts/edit/components/HydratedArtistDateRangeFieldset.js'),
'static/scripts/edit/components/HydratedDateRangeFieldset': (): Promise<mixed> => import('../static/scripts/edit/components/HydratedDateRangeFieldset.js'),
'static/scripts/edit/components/InformationIcon': (): Promise<mixed> => import('../static/scripts/edit/components/InformationIcon.js'),
'static/scripts/recording/RecordingName': (): Promise<mixed> => import('../static/scripts/recording/RecordingName.js'),
Expand Down
4 changes: 3 additions & 1 deletion root/static/scripts/common/components/Autocomplete2.js
Original file line number Diff line number Diff line change
Expand Up @@ -147,6 +147,7 @@ type InitialStateT<T: EntityItemT> = {
+extractSearchTerms?: (OptionItemT<T>) => Array<string>,
+htmlName?: string,
+id: string,
+idHtmlName?: string,
+inputChangeHook?: (
inputValue: string,
state: StateT<T>,
Expand Down Expand Up @@ -300,6 +301,7 @@ component _Autocomplete2<T: EntityItemT>(...props: PropsT<T>) {
highlightedIndex,
htmlName,
id: inputId,
idHtmlName,
inputChangeHook,
inputRef: externalInputRef,
inputValue,
Expand Down Expand Up @@ -824,7 +826,7 @@ component _Autocomplete2<T: EntityItemT>(...props: PropsT<T>) {
{nonEmpty(htmlName) ? (
<>
<input
name={htmlName + '.id'}
name={idHtmlName !== null ? idHtmlName : htmlName + '.id'}
type="hidden"
value={selectedItem ? selectedItem.entity.id : ''}
/>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ export type StateT<T: EntityItemT> = {
+highlightedIndex: number,
+htmlName?: string,
+id: string,
+idHtmlName?: string,
+indexedSearch: boolean,
+inputChangeHook?: (
inputValue: string,
Expand Down
32 changes: 22 additions & 10 deletions root/static/scripts/edit/MB/Control/ArtistEdit.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,25 +19,37 @@ import initializeArea from './Area.js';
export default function ArtistEdit() {
var self = {};

/*
* some of the labels below (like ended) might have other child nodes
* this method supports replacing text without removing child nodes
*/
jQuery.fn.replaceText = function (newText) {
return this.contents().filter(function () {
return (this.nodeType === Node.TEXT_NODE &&
this.nodeValue.trim() !== '');
}).replaceWith(newText);
};


self.$name = $('#id-edit-artist\\.name');
self.$begin = $('#label-id-edit-artist\\.period\\.begin_date');
self.$ended = $('#label-id-edit-artist\\.period\\.ended');
self.$end = $('#label-id-edit-artist\\.period\\.end_date');
self.$beginarea = $('#label-id-edit-artist\\.begin_area\\.name');
self.$endarea = $('#label-id-edit-artist\\.end_area\\.name');
self.$begin = $('label[for="id-edit-artist.period.begin_date.year"]');
self.$ended = $('label:has(#id-edit-artist\\.period\\.ended)');
self.$end = $('label[for="id-edit-artist.period.end_date.year"]');
self.$beginarea = $('label[for="id-edit-artist.begin_area"]');
self.$endarea = $('label[for="id-edit-artist.end_area"]');
self.$type = $('#id-edit-artist\\.type_id');
self.$gender = $('#id-edit-artist\\.gender_id');
self.old_gender = self.$gender.val();

self.changeDateText = function (begin, end, ended) {
self.$begin.text(begin);
self.$end.text(end);
self.$ended.text(ended);
self.$begin.replaceText(begin);
self.$end.replaceText(end);
self.$ended.replaceText(ended);
};

self.changeAreaText = function (begin, end) {
self.$beginarea.text(begin);
self.$endarea.text(end);
self.$beginarea.replaceText(begin);
self.$endarea.replaceText(end);
};

/*
Expand Down
4 changes: 4 additions & 0 deletions root/static/scripts/edit/components/DateRangeFieldset.js
Original file line number Diff line number Diff line change
Expand Up @@ -167,6 +167,8 @@ component _DateRangeFieldset(
dispatch: (ActionT) => void,
endedLabel?: string,
field: DatePeriodFieldT,
beginArea?: React.Node,
endArea?: React.Node,
) {
const subfields = field.field;

Expand Down Expand Up @@ -195,13 +197,15 @@ component _DateRangeFieldset(
type="button"
/>
</FormRowPartialDate>
{beginArea}
<FormRowPartialDate
disabled={disabled}
dispatch={hooks.endDateDispatch}
field={subfields.end_date}
label={addColonText(l('End date'))}
yearInputRef={hooks.endYearInputRef}
/>
{endArea}
<FieldErrors
field={field}
includeSubFields={false}
Expand Down
66 changes: 66 additions & 0 deletions root/static/scripts/edit/components/FormRowArea.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,66 @@
/*
* @flow strict
* Copyright (C) 2018 MetaBrainz Foundation
*
* This file is part of MusicBrainz, the open internet music database,
* and is licensed under the GPL version 2, or (at your option) any
* later version: http://www.gnu.org/licenses/gpl-2.0.txt
*/

import SearchIcon from '../../common/components/SearchIcon.js';
import {last} from '../../common/utility/arrays.js';

import FieldErrors from './FieldErrors.js';
import FormLabel from './FormLabel.js';
import FormRow from './FormRow.js';

component FormRowArea(
children ?: React.Node,
field: AreaFieldT,
idField: FieldT<string>,
label: React.Node,
required: boolean = false,
) {
const subfields = field.field;

return (
<FormRow>
<FormLabel
forField={subfields.name}
label={label}
required={required}
/>
<span
className="area autocomplete"
id={last(field.html_name.split('.'))}
>
<SearchIcon />
<input
className={'gid' + (subfields.gid.has_errors ? ' error' : '')}
defaultValue={subfields.gid.value}
id={'id-' + subfields.gid.html_name}
name={subfields.gid.html_name}
type="hidden"
/>
<input
className={'id' + (idField.has_errors ? ' error' : '')}
defaultValue={idField.value}
id={'id-' + idField.html_name}
name={idField.html_name}
type="hidden"
/>
<input
className={'name' + (subfields.name.has_errors ? ' error' : '')}
defaultValue={subfields.name.value}
id={'id-' + subfields.name.html_name}
name={subfields.name.html_name}
type="text"
/>
</span>
{children}
<FieldErrors field={field} />
</FormRow>
);
}

export default FormRowArea;
Loading
Loading