Skip to content
Open
Show file tree
Hide file tree
Changes from 2 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/HydratedDateRangeFieldset', {
initialField => form_to_json(form.field('period')),
endedLabel => 'This artist has ended.',
beginAreaField => form_to_json(form.field('begin_area')),
beginAreaIdField => form_to_json(form.field('begin_area_id')),
endAreaField => form_to_json(form.field('end_area')),
endAreaIdField => form_to_json(form.field('end_area_id')),
}) %]
[% script_manifest('edit/components/HydratedDateRangeFieldset', {async => 'async'}) %]

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

Expand Down
1 change: 1 addition & 0 deletions root/server/components.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -537,6 +537,7 @@ 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'),
Expand Down
29 changes: 19 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,34 @@ import initializeArea from './Area.js';
export default function ArtistEdit() {
var self = {};

// support replacing text without removing other 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\\.name"]');
self.$endarea = $('label[for="id-edit-artist\\.end_area\\.name"]');
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
25 changes: 25 additions & 0 deletions root/static/scripts/edit/components/DateRangeFieldset.js
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import {isDatePeriodValid} from '../utility/dates.js';
import {applyAllPendingErrors} from '../utility/subfieldErrors.js';

import FieldErrors from './FieldErrors.js';
import FormRowArea from './FormRowArea.js';
import FormRowCheckbox from './FormRowCheckbox.js';
import FormRowPartialDate, {
type ActionT as FormRowPartialDateActionT,
Expand Down Expand Up @@ -167,6 +168,10 @@ component _DateRangeFieldset(
dispatch: (ActionT) => void,
endedLabel?: string,
field: DatePeriodFieldT,
beginAreaField?: AreaFieldT,
beginAreaIdField?: FieldT<string>,
endAreaField?: AreaFieldT,
endAreaIdField?: FieldT<string>,
) {
const subfields = field.field;

Expand Down Expand Up @@ -195,13 +200,33 @@ component _DateRangeFieldset(
type="button"
/>
</FormRowPartialDate>
{beginAreaField && beginAreaIdField
? (
<FormRowArea
disabled={disabled}
field={beginAreaField}
idField={beginAreaIdField}
label={addColonText(l('Begin area'))}
/>
)
: null}
<FormRowPartialDate
disabled={disabled}
dispatch={hooks.endDateDispatch}
field={subfields.end_date}
label={addColonText(l('End date'))}
yearInputRef={hooks.endYearInputRef}
/>
{endAreaField && endAreaIdField
? (
<FormRowArea
disabled={disabled}
field={endAreaField}
idField={endAreaIdField}
label={addColonText(l('End area'))}
/>
)
: null}
<FieldErrors
field={field}
includeSubFields={false}
Expand Down
68 changes: 68 additions & 0 deletions root/static/scripts/edit/components/FormRowArea.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,68 @@
/*
* @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,
disabled: boolean = false,
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"
disabled={disabled}
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;
Original file line number Diff line number Diff line change
Expand Up @@ -23,12 +23,20 @@ component _HydratedDateRangeFieldset(
disabled: boolean = false,
endedLabel?: string,
initialField: DatePeriodFieldT,
beginAreaIdField?: FieldT<string>,
beginAreaField?: AreaFieldT,
endAreaIdField?: FieldT<string>,
endAreaField?: AreaFieldT,
) {
const [field, dispatch] = React.useReducer(reducer, initialField);
return (
<DateRangeFieldset
beginAreaField={beginAreaField}
beginAreaIdField={beginAreaIdField}
disabled={disabled}
dispatch={dispatch}
endAreaField={endAreaField}
endAreaIdField={endAreaIdField}
endedLabel={endedLabel}
field={field}
>
Expand Down
Loading