115 lines
3.2 KiB
JavaScript
115 lines
3.2 KiB
JavaScript
context = window
|
|
EventActions = context.EventActions
|
|
|
|
context.EventList = React.createClass({
|
|
|
|
mixins: [Reflux.listenTo(EventStore, "onEventsChanged")],
|
|
|
|
events: null,
|
|
|
|
getInitialState: function () {
|
|
return {events: null}
|
|
},
|
|
|
|
componentDidMount: function () {
|
|
},
|
|
|
|
isModeYours: function() {
|
|
return this.props.mode == 'yours'
|
|
},
|
|
|
|
render: function () {
|
|
return this.renderAll();
|
|
},
|
|
|
|
|
|
renderEvents() {
|
|
if(!this.state.events || this.state.events.length == 0) {
|
|
return null;
|
|
}
|
|
|
|
var items = []
|
|
|
|
|
|
var isModeYours = this.isModeYours();
|
|
for(var i = 0; i < this.state.events.length; i++) {
|
|
var event = this.state.events[i]
|
|
|
|
if(isModeYours && (!!event.authorization || event.allow_in) || !isModeYours && (!event.authorization && !event.allow_in)) {
|
|
|
|
var dynamic = null
|
|
var thumb = null
|
|
if(event.img_url) {
|
|
thumb = <img className="thumb" src={event.img_url} />
|
|
dynamic = 'event'
|
|
}
|
|
else {
|
|
dynamic = 'event no-image'
|
|
}
|
|
|
|
var title = event.title ? event.title : 'Missing event title'
|
|
title = <a className="title-link" href={"/events/" + event.slug}>{title}</a>
|
|
var when = event.starts_at ? <div className="when">{new Date(event.starts_at).toLocaleString()}</div> : null
|
|
var item = <div className={dynamic} key={event.id}>
|
|
{thumb}
|
|
<div className="detail">
|
|
<div className="title">{title}</div>
|
|
<div className="when">{when}</div>
|
|
</div>
|
|
</div>
|
|
items.push(item)
|
|
}
|
|
}
|
|
return items
|
|
},
|
|
|
|
renderAll: function() {
|
|
var events = this.renderEvents()
|
|
var headerText = this.isModeYours() ? 'Your Registered Events' : 'All Upcoming Events'
|
|
|
|
if(!events || events.length == 0) {
|
|
return null;
|
|
}
|
|
|
|
if(events) {
|
|
var response = <div className="EventList">
|
|
<div className="event-header">
|
|
{headerText}
|
|
</div>
|
|
|
|
<div className="event-section">
|
|
{events}
|
|
</div>
|
|
</div>
|
|
return response
|
|
}
|
|
else {
|
|
return <div className="EventList">
|
|
<div className="event-header">
|
|
{headerText}
|
|
</div>
|
|
|
|
<div className="event-section loading">
|
|
Loading ...
|
|
</div>
|
|
</div>;
|
|
}
|
|
},
|
|
|
|
onEventsChanged: function (allEvents) {
|
|
var scopedEvents = []
|
|
if(this.isModeYours()) {
|
|
allEvents.events.entries.forEach(function(event) {
|
|
if (event.authorization || event.allow_in) {
|
|
scopedEvents.push(event)
|
|
}
|
|
})
|
|
}
|
|
else {
|
|
scopedEvents = allEvents.events.entries
|
|
}
|
|
|
|
|
|
this.setState({events: scopedEvents})
|
|
}
|
|
}) |