82 lines
2.5 KiB
JavaScript
82 lines
2.5 KiB
JavaScript
|
const h = require('snabbdom/h')
|
||
|
|
const flyd = require('flyd')
|
||
|
|
const R = require('ramda')
|
||
|
|
const request = require('../../common/request')
|
||
|
|
const format = require('../../common/format')
|
||
|
|
const branding = require('../../components/nonprofit-branding')
|
||
|
|
flyd.mergeAll = require('flyd/module/mergeall')
|
||
|
|
|
||
|
|
const quantityLeft = require('./gift-option-quantity-left')
|
||
|
|
const giftButton = require('./gift-option-button')
|
||
|
|
|
||
|
|
// Pass in a stream that has a value when the gift options need to be refreshed, so we know when to refresh em!
|
||
|
|
function init(giftsNeedRefresh$, parentState) {
|
||
|
|
var state = {
|
||
|
|
timeRemaining$: parentState.timeRemaining$
|
||
|
|
, clickOption$: flyd.stream()
|
||
|
|
, openEditGiftModal$: flyd.stream()
|
||
|
|
}
|
||
|
|
|
||
|
|
// XXX some legacy viewscript mixed in here
|
||
|
|
flyd.map(gift => {
|
||
|
|
appl.open_modal('giftOptionFormModal')
|
||
|
|
appl.def('gift_options', {current: gift, is_updating: true})
|
||
|
|
appl.def('gift_option_action', 'Edit')
|
||
|
|
}, state.openEditGiftModal$)
|
||
|
|
|
||
|
|
const pageloadGifts$ = index()
|
||
|
|
const refreshedGifts$ = flyd.flatMap(index, giftsNeedRefresh$)
|
||
|
|
state.giftOptions$ = flyd.mergeAll([
|
||
|
|
pageloadGifts$
|
||
|
|
, refreshedGifts$
|
||
|
|
, flyd.stream([]) // default before ajax loads
|
||
|
|
])
|
||
|
|
return state
|
||
|
|
}
|
||
|
|
|
||
|
|
function index() {
|
||
|
|
const path = `/nonprofits/${app.nonprofit_id}/campaigns/${app.campaign_id}/campaign_gift_options`
|
||
|
|
return flyd.map(
|
||
|
|
req => req.body.data
|
||
|
|
, request({path, method: 'get'}).load
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
function view(state) {
|
||
|
|
return h('aside.sideGifts.u-marginBottom--15', {
|
||
|
|
class: {'u-hide': !state.giftOptions$().length}
|
||
|
|
}, R.map(giftBox(state), state.giftOptions$())
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
const giftBox = state => gift => {
|
||
|
|
return h('section.u-relative', [
|
||
|
|
h('div.sideGift.pastelBox--grey--dark', [
|
||
|
|
h('h5.u-marginTop--0', gift.name)
|
||
|
|
, totalContributions(gift)
|
||
|
|
, quantityLeft(gift)
|
||
|
|
, h('p.u-marginBottom--15', gift.description)
|
||
|
|
, h('div', [ giftButton(state, gift) ])
|
||
|
|
])
|
||
|
|
, app.current_campaign_editor // Show edit button only if the current user is a campaign editor
|
||
|
|
? h('button.button--tiny.absolute.edit.hasShadow', {
|
||
|
|
on: {click: ev => state.openEditGiftModal$(gift)}
|
||
|
|
}, [
|
||
|
|
h('i.fa.fa-pencil')
|
||
|
|
, ' Edit Gift'
|
||
|
|
])
|
||
|
|
: '' // do not show gift edit button
|
||
|
|
])
|
||
|
|
}
|
||
|
|
|
||
|
|
const totalContributions = gift => {
|
||
|
|
if(gift.hide_contributions) return ''
|
||
|
|
return h('p', [
|
||
|
|
h('i.fa.fa-star', { style: { color: branding.base} })
|
||
|
|
, ` ${format.numberWithCommas(gift.total_gifts)} Contribution${gift.total_gifts === 1 ? '' : 's'}`
|
||
|
|
])
|
||
|
|
}
|
||
|
|
|
||
|
|
module.exports = {view, init}
|
||
|
|
|