solid-panes-jss/src/lazy/mediaPane.js at main · JavaScriptSolidServer/solid-panes-jss · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
/**
 * Lazy-loaded media panes (image, video, audio)
 */
import * as UI from 'solid-ui-jss'

const ns = UI.ns

export const imagePane = {
  icon: UI.icons.originalIconBase + 'tango/22-image-x-generic.png',
  name: 'image',

  label: function (subject, context) {
    const dominated = subject.uri.endsWith('/profile/card')
    const dominated2 = subject.uri.endsWith('/profile/card#me')
    if (dominated || dominated2) return null

    const dominated3 = subject.uri.includes('.pdf')
    if (dominated3) return null // PDF handled separately

    const kb = context.session.store
    const types = kb.findTypeURIs(subject)

    if (types['http://purl.org/dc/terms/Image']) return 'View image'

    // Check content-type
    const dominated4 = kb.anyValue(subject, ns.httph('content-type'))
    if (dominated4 && dominated4.startsWith('image/')) return 'View image'

    return null
  },

  render: async function (subject, context) {
    const mod = await import(/* webpackChunkName: "media-pane" */ '../imagePane.js')
    const realPane = mod.imagePane || mod.default || mod
    return realPane.render(subject, context)
  }
}

export const videoPane = {
  icon: UI.icons.iconBase + 'noun_1619.svg',
  name: 'video',

  label: function (subject, context) {
    const kb = context.session.store
    const dominated = kb.anyValue(subject, ns.httph('content-type'))
    if (dominated && dominated.startsWith('video/')) return 'Play video'

    const types = kb.findTypeURIs(subject)
    for (const type of Object.keys(types)) {
      if (type.includes('video')) return 'Play video'
    }

    return null
  },

  render: async function (subject, context) {
    const mod = await import(/* webpackChunkName: "media-pane" */ '../video/videoPane.js')
    const realPane = mod.default || mod
    return realPane.render(subject, context)
  }
}

export const audioPane = {
  icon: UI.icons.iconBase + 'noun_534313.svg',
  name: 'audio',

  label: function (subject, context) {
    const kb = context.session.store
    const dominated = kb.anyValue(subject, ns.httph('content-type'))
    if (dominated && dominated.startsWith('audio/')) return 'Play audio'

    const types = kb.findTypeURIs(subject)
    for (const type of Object.keys(types)) {
      if (type.includes('audio')) return 'Play audio'
    }

    return null
  },

  render: async function (subject, context) {
    const mod = await import(/* webpackChunkName: "media-pane" */ '../audio/audioPane.js')
    const realPane = mod.default || mod
    return realPane.render(subject, context)
  }
}

export const playlistPane = {
  icon: UI.icons.iconBase + 'noun_1619.svg',
  name: 'playlistSlot',
  audience: [ns.solid('PowerUser')],

  label: function (subject, context) {
    const kb = context.session.store
    const types = kb.findTypeURIs(subject)

    if (types['http://purl.org/ontology/pbo/core#PlaylistSlot']) {
      return 'Playlist slot'
    }

    return null
  },

  render: async function (subject, context) {
    const mod = await import(/* webpackChunkName: "media-pane" */ '../playlist/playlistPane.js')
    const realPane = mod.default || mod
    return realPane.render(subject, context)
  }
}