diff options
| author | Luc Donnet | 2017-10-16 23:52:06 +0200 |
|---|---|---|
| committer | Luc Donnet | 2017-10-16 23:52:06 +0200 |
| commit | f480ad0739e5c0ec2c0c8bb890344b9c4777ba35 (patch) | |
| tree | a19bc6b43449b8b978a53c33476fb3eb571d4dda /app/javascript/routes/components/BSelect2.js | |
| parent | b611a84ed724036c4929bd4c3eaa7e23ea314f45 (diff) | |
| parent | 51a1ea5b141032121913f807a162d305828bec54 (diff) | |
| download | chouette-core-f480ad0739e5c0ec2c0c8bb890344b9c4777ba35.tar.bz2 | |
Merge branch 'master' into staging
Diffstat (limited to 'app/javascript/routes/components/BSelect2.js')
| -rw-r--r-- | app/javascript/routes/components/BSelect2.js | 125 |
1 files changed, 125 insertions, 0 deletions
diff --git a/app/javascript/routes/components/BSelect2.js b/app/javascript/routes/components/BSelect2.js new file mode 100644 index 000000000..340d9df95 --- /dev/null +++ b/app/javascript/routes/components/BSelect2.js @@ -0,0 +1,125 @@ +import _ from'lodash' +import React, { Component, PropTypes } from 'react' +import Select2 from 'react-select2' + + +// get JSON full path +var origin = window.location.origin +var path = window.location.pathname.split('/', 3).join('/') + + +export default class BSelect3 extends Component { + constructor(props, context) { + super(props, context) + } + onChange(e) { + this.props.onChange(this.props.index, { + text: e.currentTarget.textContent, + stoparea_id: e.currentTarget.value, + user_objectid: e.params.data.user_objectid, + longitude: e.params.data.longitude, + latitude: e.params.data.latitude, + name: e.params.data.name, + short_name: e.params.data.short_name, + city_name: e.params.data.city_name, + area_type: e.params.data.area_type, + zip_code: e.params.data.zip_code, + comment: e.params.data.comment + }) + } + + parsedText(data) { + let a = data.replace('</em></small>', '') + let b = a.split('<small><em>') + if (b.length > 1) { + return ( + <span> + {b[0]} + <small><em>{b[1]}</em></small> + </span> + ) + } else { + return ( + <span>{data}</span> + ) + } + } + + render() { + if(this.props.value.edit) + return ( + <div className='select2-bootstrap-append'> + <BSelect2 {...this.props} onSelect={ this.onChange.bind(this) }/> + </div> + ) + else + if(!this.props.value.stoparea_id) + return ( + <div> + <BSelect2 {...this.props} onSelect={ this.onChange.bind(this) }/> + </div> + ) + else + return ( + <a + className='navlink' + href={origin + path + '/stop_areas/' + this.props.value.stoparea_id} + title="Voir l'arrĂȘt" + > + {this.parsedText(this.props.value.text)} + </a> + ) + } +} + +class BSelect2 extends Component{ + componentDidMount() { + this.refs.newSelect.el.select2('open') + } + + render() { + return ( + <Select2 + value={ this.props.value.stoparea_id } + onSelect={ this.props.onSelect } + ref='newSelect' + options={{ + placeholder: this.context.I18n.routes.edit.select2.placeholder, + allowClear: true, + language: 'fr', /* Doesn't seem to work... :( */ + theme: 'bootstrap', + width: '100%', + ajax: { + url: origin + path + '/autocomplete_stop_areas.json', + dataType: 'json', + delay: '500', + data: function(params) { + return { + q: params.term, + target_type: 'zdep' + }; + }, + processResults: function(data, params) { + return { + results: data.map( + item => _.assign( + {}, + item, + { text: item.name + ", " + item.zip_code + " " + item.short_city_name + " <small><em>(" + item.user_objectid + ")</em></small>" } + ) + ) + }; + }, + cache: true + }, + escapeMarkup: function (markup) { return markup; }, + minimumInputLength: 3 + }} + /> + ) + } +} + +BSelect2.contextTypes = { + I18n: PropTypes.object +} |
