author.ts

import * as m from 'mithril';
import { State } from '../model/state';
import { Photo } from '../model/photo';
import { NestedCSSProperties } from 'typestyle/lib/types';

const UTM = '?utm_source=resplash&utm_medium=referral';
const UNSLPASH_URL = `https://unsplash.com${UTM}`;

const style: NestedCSSProperties = {
    position: 'absolute',
    top: '2rem',
    left: '1rem'
};

function authorLink(photo: Photo) {
    let url = `${photo.user.links.html}${UTM}`
    let fullName = `${photo.user.first_name} ${photo.user.last_name}`;
    return m('a', { href: url, target: '_blank' }, fullName);
}

function unsplashLink() {
    return m('a', { href: UNSLPASH_URL, target: '_blank' }, 'Unsplash');
}

export default function unsplashAttribution(state: State) {
    if (state.photo)
        return m('div', { style },
            'Photo by ', authorLink(state.photo), ' on ', unsplashLink());
    else
        return null;
}