<commit_before>'use strict'
let logger = require('js-logger-aknudsen').get('displayProject')
let h = require('react-hyperscript')
let R = require('ramda')
let S = require('underscore.string.fp')
let component = require('omniscient')
let React = require('react')
let ReactDOM = require('react-dom')

let datetime = require('../../datetime')
let {nbsp,} = require('../../specialChars')
let {convertMarkdown,} = require('../../markdown')
let ajax = require('../../ajax')
let userManagement = require('../../userManagement')
let licenses = require('../../licenses')
let ProjectStore = require('./projectStore')

if (__IS_BROWSER__) {
  require('./displayProject.styl')
}

let getFileSize = (numBytes) => {
  let sizeStr
  if (numBytes < 1024) {
    sizeStr = `${numBytes} B`
  } else if (numBytes < 1024*1024) {
    sizeStr = `${Math.ceil(numBytes / 1024.0)} KB`
  } else if (numBytes < 1024*1024*1024) {
    sizeStr = `${Math.ceil(numBytes / (1024*1024.0))} MB`
  } else if (numBytes < 1024*1024*1024*1024) {
    sizeStr = `${Math.ceil(numBytes / (1024*1024*1024.0))} GB`
  } else {
    throw new Error(`File size too large: ${numBytes}`)
  }
  return sizeStr
}

let ProjectControls = component('ProjectControls', ({canEdit, project, cursor,}) => {
  let hasStoreItems = !R.isEmpty(project.storeItems || [])
  return h('#project-controls', [
    hasStoreItems ? GoToStore(cursor) : null,
    canEdit ? h('a#edit-project-action.action', {
      href: `/u/${project.owner}/${project.projectId}/edit`, 'data-tooltip': 'Edit project',
    }, [h('span.icon-pencil3'),]) : null,
  ])
})

let GoToStore = component('GoToStore', (cursor) => {
  return h('#go-to-store.action', {
    onClick: () => {
      logger.debug(`Go to store clicked`)
      cursor = cursor.mergeDeep({
        displayProject: {
          goToStore: true,
          activeTab: 'store',
        },
      })
    },
  }, [
    h('span.icon-barcode'),
  ])
})

let TopPad = component('TopPad', (cursor) => {
  let projectCursor = cursor.cursor(['displayProject', 'project',])
  let project = projectCursor.toJS()
  let creationDateString = datetime.displayDateTextual(project.created)
  let mainPicture = project.chosenPicture || project.pictures[0]
  let loggedInUser = userManagement.getLoggedInUser(cursor)
  let canEdit = loggedInUser != null && loggedInUser.username === project.owner
  return h('#project-top-pad', [
    h('#project-top-elements', [
      h('#project-heading', [
        h('h1#project-title', project.title),
        h('p#project-creation-date', [
          `Added ${creationDateString} by `,
          h('a', {href: `/u/${project.owner}`,}, project.ownerName),
        ]),
      ]),
      ProjectControls({canEdit, project, cursor,}),
    ]),
    h('#image-box', [
      h('#thumbnails', R.map((picture) => {
        return h('a', {
          href: '#',
          onClick: (event) => {
            event.preventDefault()
            logger.debug(`Thumbnail clicked:`, picture)
            projectCursor.set('chosenPicture', picture)
          },
        }, [
          h('.thumbnail-wrapper', [
            h('img', {src: picture.url,}),
          ]),
        ])
      }, project.pictures)),
      h('#displayed-image', [
        h('img', {
          src: mainPicture != null ? mainPicture.url : null
        ,}),
      ]),
    ]),
  ])
})

let RightColumn = component('RightColumn', (project) => {
  let tagElems = R.chain((tag) => {
    return [h('a.project-tag', {
      href: '#',
      onClick: (event) => {
        logger.debug(`Project tag '${tag}' clicked`)
        event.preventDefault()
      },
    }, tag), ', ',]
  }, project.tags).slice(0, -1)
  return h('#right-column', [
    h('#tag-pad', [
      h('h2', [
        h('span.icon-tags2'),
        `${nbsp}Tags`,
      ]),
      h('#project-tags', tagElems),
    ]),
    h('#license-pad', [
      h('h2', 'License'),
      h('#license-icons', [
        h('a', {href: project.license.url, target: '_blank',}, R.map((icon) => {
          return h(`span.icon-${icon}`)
        }, project.license.icons)),
      ]),
      h('p', [
        h('strong', [<commit_msg>Add Facebook like button to project pages<commit_after>'use strict'
let logger = require('js-logger-aknudsen').get('displayProject')
let h = require('react-hyperscript')
let R = require('ramda')
let S = require('underscore.string.fp')
let component = require('omniscient')
let React = require('react')
let ReactDOM = require('react-dom')

let datetime = require('../../datetime')
let {nbsp,} = require('../../specialChars')
let {convertMarkdown,} = require('../../markdown')
let ajax = require('../../ajax')
let userManagement = require('../../userManagement')
let licenses = require('../../licenses')
let ProjectStore = require('./projectStore')

if (__IS_BROWSER__) {
  require('./displayProject.styl')
}

let getFileSize = (numBytes) => {
  let sizeStr
  if (numBytes < 1024) {
    sizeStr = `${numBytes} B`
  } else if (numBytes < 1024*1024) {
    sizeStr = `${Math.ceil(numBytes / 1024.0)} KB`
  } else if (numBytes < 1024*1024*1024) {
    sizeStr = `${Math.ceil(numBytes / (1024*1024.0))} MB`
  } else if (numBytes < 1024*1024*1024*1024) {
    sizeStr = `${Math.ceil(numBytes / (1024*1024*1024.0))} GB`
  } else {
    throw new Error(`File size too large: ${numBytes}`)
  }
  return sizeStr
}

let ProjectControls = component('ProjectControls', ({canEdit, project, cursor,}) => {
  let hasStoreItems = !R.isEmpty(project.storeItems || [])
  return h('#project-controls', [
    hasStoreItems ? GoToStore(cursor) : null,
    canEdit ? h('a#edit-project-action.action', {
      href: `/u/${project.owner}/${project.projectId}/edit`, 'data-tooltip': 'Edit project',
    }, [h('span.icon-pencil3'),]) : null,
  ])
})

let GoToStore = component('GoToStore', (cursor) => {
  return h('#go-to-store.action', {
    onClick: () => {
      logger.debug(`Go to store clicked`)
      cursor = cursor.mergeDeep({
        displayProject: {
          goToStore: true,
          activeTab: 'store',
        },
      })
    },
  }, [
    h('span.icon-barcode'),
  ])
})

let FacebookLike = component('FacebookLike', (cursor) => {
  let projectCursor = cursor.cursor(['displayProject', 'project',])
  let owner = projectCursor.get(`owner`)
  let projectId = projectCursor.get(`projectId`)
  let pageUrl = `${cursor.get('appUri')}/u/${owner}/${projectId}`
  logger.debug(`Generating like button for project page '${pageUrl}'`)
  return h('.fb-like', {
    'data-href': pageUrl,
    'data-layout': 'standard',
    'data-action': 'like',
    'data-show-faces': 'true',
    'data-share': 'true',
  })
})

let TopPad = component('TopPad', (cursor) => {
  let projectCursor = cursor.cursor(['displayProject', 'project',])
  let project = projectCursor.toJS()
  let creationDateString = datetime.displayDateTextual(project.created)
  let mainPicture = project.chosenPicture || project.pictures[0]
  let loggedInUser = userManagement.getLoggedInUser(cursor)
  let canEdit = loggedInUser != null && loggedInUser.username === project.owner
  return h('#project-top-pad', [
    h('#project-top-elements', [
      h('#project-heading', [
        h('h1#project-title', project.title),
        h('p#project-creation-date', [
          `Added ${creationDateString} by `,
          h('a', {href: `/u/${project.owner}`,}, project.ownerName),
        ]),
      ]),
      ProjectControls({canEdit, project, cursor,}),
    ]),
    h('#image-box', [
      h('#thumbnails', R.map((picture) => {
        return h('a', {
          href: '#',
          onClick: (event) => {
            event.preventDefault()
            logger.debug(`Thumbnail clicked:`, picture)
            projectCursor.set('chosenPicture', picture)
          },
        }, [
          h('.thumbnail-wrapper', [
            h('img', {src: picture.url,}),
          ]),
        ])
      }, project.pictures)),
      h('#displayed-image', [
        h('img', {
          src: mainPicture != null ? mainPicture.url : null
        ,}),
      ]),
    ]),
    h('#social-controls', [
      FacebookLike(cursor),
    ]),
  ])
})

let RightColumn = component('RightColumn', (project) => {
  let tagElems = R.chain((tag) => {
    return [h('a.project-tag', {
      href: '#',
      onClick: (event) => {
        logger.debug(`Project tag '${tag}' clicked`)
        event.preventDefault()
      },
    }, tag), ', ',]
  }, project.tags).slice(0, -1)
  return h('#right-column', [
    h('#tag-pad', [
      h('h2', [
        h('span.icon-tags2'),
        `${nbsp}Tags`,
      ]),
      h('#project-tags', tagElems),
    ]),
    h('#license-pad', [
      h('h2', 'License'),
      h('#license-icons', [
        h('a', {href: project.license.url, target: '_blank',}, R.map((icon) => {
          return h(`span.icon-${icon}`)
        }, project.license.icons)),
      ]),
      h('p', [
        h('strong', [
{'fraction_non_alphanumeric': 0.19970564926978376, 'fraction_numerical': 0.016981772897090457, 'mean_word_length': 2.855958096900917, 'pattern_counts': {'":': 0, '<': 11, '<?xml version=': 0, '>': 26, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 4, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4535470', 'n_tokens_mistral': 2954, 'n_tokens_neox': 2814, 'n_words': 538}