diff --git a/src/assets/js/components/contact.js b/src/assets/js/components/contact.js index ff87396..a72a46e 100644 --- a/src/assets/js/components/contact.js +++ b/src/assets/js/components/contact.js @@ -1,22 +1,22 @@ -/* global fetch, hcaptcha */ +/* global hcaptcha */ import html from 'nanohtml' import Component from 'nanocomponent' import raw from 'nanohtml/raw' import input from '@resonate/input-element' import messages from '../elements/messages' -import logger from 'nanologger' +// import logger from 'nanologger' import isEmpty from 'validator/lib/isEmpty' -import isLength from 'validator/lib/isLength' -import isEmail from 'validator/lib/isEmail' +// import isLength from 'validator/lib/isLength' +// import isEmail from 'validator/lib/isEmail' import validateFormdata from 'validate-formdata' import nanostate from 'nanostate' import morph from 'nanomorph' import inputField from '../elements/input-field' -const log = logger('form:create') +// const log = logger('form:create') /** * Little contact form to send a quick message to support team @@ -51,9 +51,10 @@ class ContactForm extends Component { }) this.local.data = { - reason: 'feedback' + reason: 'general' } + /* this.local.machine.on('form:reset', () => { this.validator = validateFormdata() this.form = this.validator.state @@ -134,6 +135,7 @@ class ContactForm extends Component { return this.local.machine.emit('form:invalid') }) + */ this.validator = validateFormdata() this.form = this.validator.state @@ -167,7 +169,7 @@ class ContactForm extends Component { const values = this.form.values const options = [ - { value: 'feedback', label: 'Feedback' }, + // { value: 'feedback', label: 'Feedback' }, { value: 'volunteer', label: 'Volunteer' }, { value: 'general', label: 'General' }, { value: 'copyright', label: 'Copyright Violation' } @@ -201,7 +203,16 @@ class ContactForm extends Component { const data = { volunteer: { title: 'Volunteering', - body: 'If you\'d like to help out on the project please fill out the form below, sharing a few details about your background and how you\'d like to get involved.', + // body: 'If you\'d like to help out on the project please fill out the form below, sharing a few details about your background and how you\'d like to get involved.', + body: { + html: ` +

+ If you're interested in helping with the project, take a look at our github or visit our community forum. +

+ ` + }, + fields: [] + /* fields: [ { type: 'email', @@ -214,23 +225,18 @@ class ContactForm extends Component { placeholder: 'Write your message here' } ] - }, - feedback: { - title: 'Beta app Feedback', - fields: [ - { - type: 'email', - labelText: 'E-mail', - value: values.email - }, - { - type: 'textarea', - value: values.message, - placeholder: 'Share your thoughts or technical challenges with the beta app here.' - } - ] + */ }, general: { + body: { + html: ` +

+ Please reach us by E-mail: members [at] resonate.coop. +

+ ` + }, + fields: [] + /* fields: [ { type: 'text', @@ -249,12 +255,13 @@ class ContactForm extends Component { placeholder: 'Write your message here' } ] + */ }, copyright: { fields: [], body: { html: ` -

If you believe that content on Resonate infringes your copyright, please contact our Copyright Team on copyright [at] resonate.is and include the following information.

+

If you believe that content on Resonate infringes your copyright, please contact our Copyright Team on copyright [at] resonate.coop and include the following information.

  1. The full URL and/or name/artist of the track(s) concerned
  2. Your full name, address, email and telephone number
    3. @@ -353,6 +360,7 @@ class ContactForm extends Component { return new Error('Reason is invalid') } }) + /* this.validator.field('subject', { required: false }) this.validator.field('email', { required: true }, (data) => { if (isEmpty(data)) return new Error('Email is required') @@ -362,12 +370,15 @@ class ContactForm extends Component { if (isEmpty(data)) return new Error('Message is required') if (!isLength(data, { min: 0, max: 200 })) return new Error('Message should be no more than 200 characters') }) + */ } unload () { + /* if (this.local.machine.state.form !== 'idle') { this.local.machine.emit('form:reset') } + */ } update () { diff --git a/src/assets/js/main.js b/src/assets/js/main.js index 61d2f1f..a6b86c3 100644 --- a/src/assets/js/main.js +++ b/src/assets/js/main.js @@ -3,14 +3,8 @@ import choo from 'nanochoo' // resonatecoop/nanochoo (fork of nanochoo with adde import './tabbing.js' import Header from './components/header' import RandomLogo from './components/logo' -import Trackgroups from './components/trackgroups' import ContactForm from './components/contact' -import APIService from '@resonate/api-service' -import loadScript from './lib/load-script' - -const { getAPIServiceClient } = APIService({ - apiHost: process.env.APP_HOST || 'https://beta.stream.resonate.coop' -}) +// import loadScript from './lib/load-script' function headerSearchApp (selector) { if (!document.querySelector(selector)) return @@ -45,7 +39,7 @@ function headerSearchApp (selector) { async function contactApp (selector) { if (!document.querySelector(selector)) return - await loadScript('https://js.hcaptcha.com/1/api.js') + // await loadScript('https://js.hcaptcha.com/1/api.js') const contact = choo() @@ -75,61 +69,5 @@ document.addEventListener('DOMContentLoaded', DOMContentLoaded) function DOMContentLoaded () { contactApp('.contact-form') randomLogoApp('.random-logo-component') - releasesApp('.trackgroups') -} - -function releasesApp (selector) { - if (!document.querySelector(selector)) return - - const releases = choo() - - releases.use(async (state, emitter, app) => { - emitter.on(state.events.DOMCONTENTLOADED, async () => { - state.trackgroups = state.trackgroups || [] - - const component = state.components.trackgroups - const { machine } = component - - if (machine.state.request === 'loading') { - return - } - - const loaderTimeout = setTimeout(() => { - machine.state.loader === 'off' && machine.emit('loader:toggle') - }, 300) - - machine.emit('request:start') - - try { - const client = await getAPIServiceClient('trackgroups') - const result = await client.getTrackgroups({ limit: 12 }) - - const { body: response } = result - - state.trackgroups = response.data - - machine.emit('request:resolve') - - emitter.emit(state.events.RENDER) - } catch (err) { - component.error = err - machine.emit('request:reject') - emitter.emit('error', err) - } finally { - machine.state.loader === 'on' && machine.emit('loader:toggle') - clearTimeout(loaderTimeout) - } - }) - }) - - releases.view((state, emit) => { - return state.cache(Trackgroups, 'trackgroups').render({ - items: state.trackgroups || [], - filters: [] - }) - }) - - releases.mount(selector) + headerSearchApp('.search') } - -headerSearchApp('.search')