\n )\n }\n}\n\nclass Table2 extends Component {\n static getDescription() {\n return {\n name: 'Table2',\n component: Table2,\n label: 'Table2 widget',\n variables: [\n {\n name: 'query',\n type: 'yasgui',\n label:\n 'Query to fill table. If table item should be a link, than the you should add a property with the same name with suffix \"URI\", eg: ?object ?objectURI. For HTML rendering add the suffix \"HTML\".',\n },\n {\n name: 'publishVariable',\n type: 'text',\n label:\n 'Variabele in which tree item URI is published, when a link in the table is clicked.',\n },\n\n {\n name: 'renderEmpty',\n type: 'boolean',\n label: 'render an empty table',\n },\n {\n name: 'isFirstItemBold',\n type: 'boolean',\n label: 'First item bold',\n },\n {\n name: 'title',\n type: 'text',\n label: 'Titel boven de tabel',\n },\n {\n name: 'onClick',\n type: 'javascript',\n label: 'Code that runs before link click event.',\n },\n ],\n }\n }\n\n createStateValues(items) {\n let res = {}\n for (var i = 0; i < items.length; i++) {\n let item = items[i]\n Object.keys(item).forEach((key) => {\n if (key.endsWith('URI')) return\n if (key.endsWith('URL')) return\n let obj = { value: item[key] }\n\n if (item[key + 'URI']) obj.link = item[key + 'URI']\n if (item[key + 'URL']) obj.link2 = item[key + 'URL']\n if (!res[key]) {\n res[key] = obj\n } else if (Array.isArray(res[key])) {\n if (!res[key].filter((re) => re.value === obj.value).length) {\n res[key].push(obj)\n }\n } else if (res[key].value !== item[key]) {\n res[key] = [res[key], obj]\n }\n })\n }\n\n Object.keys(res).forEach((key) => {\n if (Array.isArray(res[key])) {\n res[key].sort((a, b) => a.value.localeCompare(b.value))\n }\n })\n\n return res\n }\n\n render() {\n //console.log(\"table 2 render function \");\n let data = this.props.data\n // console.log(data);\n if (!data || !data.results || data.results.bindings.length === 0) {\n if (this.props.renderEmpty) {\n data = generateEmptyResponse(this.props.query)\n } else {\n return null\n }\n }\n\n let items = restructureResponse(data)\n if (!items.length) return null\n let valuesObj = this.createStateValues(items)\n\n //if (this.state.loading) {console.log(\"table2 loading\");}\n\n let disabled = false\n if (this.state != null) {\n if (this.state.loading) {\n disabled = true\n console.log('Disabling table2 ')\n }\n }\n\n return (\n \n {this.props.title && (\n
{this.props.title}
\n )}\n
\n {/* \n
\n {data.head.vars.map((headVar, index) => (\n
{headVar}
\n ))}\n
\n */}\n \n {data.head.vars.map((headVar) => {\n if (headVar.endsWith('URI')) {\n return null\n }\n if (headVar.endsWith('URL')) {\n return null\n }\n let valueObject = valuesObj[headVar]\n //if (!valueObject) return null;\n if (!valueObject) valueObject = ''\n var html = false\n if (headVar.endsWith('HTML')) {\n headVar = headVar.substr(0, headVar.length - 4)\n html = true\n }\n\n if (Array.isArray(valueObject)) {\n return valueObject.map((val, index) => {\n return (\n \n )\n })\n } else {\n return (\n \n )\n }\n })}\n \n
\n \n )\n }\n}\n\nexport default Table2\n","import './bbutil'\n\nimport React, { Component } from 'react'\nimport Spinner from '../../Spinner'\n\nimport Upload from 'react-widget-upload'\nimport styles from './BBUpload.module.css'\nimport PublishUtils from '../../../helpers/PublishUtils'\nimport 'react-widget-upload/style'\n\nimport axios from 'axios'\n\n/*\n//class BBUpload extends BBIFrame {\n constructor222()\n {\n super();\n \n this.scrolling=\"true\";\n this.noEvents=false;\n \n }\n\n*/\n\nclass BBUpload extends Component {\n state = {\n files: [],\n enabled: true,\n }\n\n downloadReport(key, file) {\n let url = this.props.serverUrl\n if (url == null) {\n alert('no download url defined')\n return\n }\n\n if (!url.startsWith('http')) {\n url = this.props.repoURL\n }\n url = url.replace('sparql', 'download')\n console.log('download ', url, key)\n //const formData = new FormData();\n //formData.append(\"fileToDownload\",key);\n //formData.append(\"test\",\"hans\");\n let o = {}\n\n if (key == null) {\n key = ''\n }\n o.fileToDownload = key\n var me = this\n\n axios.defaults.withCredentials = true\n axios.defaults.credentials = 'include'\n axios\n .post(url, null, { params: o })\n .then(function (data) {\n console.log('success data download ', data)\n const downloadUrl = window.URL.createObjectURL(new Blob([data.data]))\n\n const link = document.createElement('a')\n\n link.href = downloadUrl\n if (file == null) {\n file = 'file.txt'\n }\n link.setAttribute('download', file) //any other extension\n\n document.body.appendChild(link)\n\n link.click()\n\n link.remove()\n\n setTimeout(function () {\n me.setState({ enabled: true })\n }, 5000)\n })\n .catch(function (e) {\n alert('error downloading')\n console.log('FAILURE!!', e)\n })\n }\n\n handleChange = (files) => {\n this.setState({\n files,\n enabled: false,\n })\n\n var me = this\n if (!files.length) return\n const file = files[0]\n\n const formData = new FormData()\n formData.append('command', this.props.command)\n formData.append('file', file, file.name)\n axios.defaults.withCredentials = true\n axios.defaults.credentials = 'include'\n let url = this.props.serverUrl\n if (url == null) {\n alert('no upload url defined')\n return\n }\n\n if (!url.startsWith('http')) {\n url = this.props.repoURL.replace('sparql', url)\n }\n //console.log(this.props,url);\n axios\n .post(url, formData)\n .then(function () {\n console.log('SUCCESS upload!!')\n\n if (me.props.successEval != null) {\n console.log('executing after upload ', me.props.successEval)\n try {\n eval(me.props.successEval) //eslint-disable-line no-eval\n } catch (e) {\n console.log(e)\n }\n PublishUtils.setTimeStampParameter(me, true)\n }\n me.setState({ enabled: true })\n })\n .catch(function (e) {\n //console.log('upload failure ',e);\n alert('could not upload file')\n me.setState({ enabled: true })\n })\n }\n\n render() {\n const enabled = this.state.enabled\n var text = this.props.uploadText\n\n if (text == null) {\n text = 'upload'\n }\n if (enabled === false) {\n text = this.props.processingText\n if (text == null) {\n text = 'processing'\n }\n // return ()\n }\n\n return (\n
\n \n \n
{text}
\n \n
\n )\n }\n static getDescription() {\n return {\n name: 'BBUpload',\n component: BBUpload,\n label: 'BB Upload widget',\n variables: [\n {\n name: 'serverUrl',\n type: 'text',\n label: 'server url (full url or upload)',\n },\n {\n name: 'command',\n type: 'text',\n label: 'command for server {validateGarantie}',\n },\n {\n name: 'uploadText',\n type: 'text',\n label: 'text for the widget',\n },\n {\n name: 'processingText',\n type: 'text',\n label: 'text for the widget when uploading and processing',\n },\n {\n name: 'fileExtensions',\n type: 'text',\n label: 'fileExtensions xslx,js',\n },\n {\n name: 'fields',\n type: 'json',\n label: 'json for w2uiform fields',\n },\n {\n name: 'tabs',\n type: 'text',\n label: 'optional w2ui tabs definitie',\n },\n\n {\n name: 'multiple',\n type: 'boolean',\n label: 'multiple files ',\n },\n {\n name: 'autoUpload',\n type: 'boolean',\n label: 'auto upload ',\n },\n {\n name: 'successEval',\n type: 'text',\n label:\n 'javascript code after successfull upload... e.g. me.downloadReport(\"garantierapport\",\"garantie.html\") ',\n },\n\n PublishUtils.getTimestampParametersDef(),\n ],\n }\n }\n\n /*\n getUrl()\n {\n return \"/bb/upload/configurableUploaderReact.html\";\n }\n */\n}\n\nexport default BBUpload\n","import React, { Component } from 'react'\nimport yasqe from 'yasgui-yasqe'\nimport '../../node_modules/yasgui-yasqe/dist/yasqe.css'\n// import { Button } from 'reactstrap';\n\nclass Yasgui extends Component {\n constructor(props) {\n super(props)\n this.textArea = React.createRef()\n }\n\n componentDidMount() {\n this.yas = yasqe.fromTextArea(this.textArea.current)\n this.yas.setValue(this.props.value || '')\n this.yas.on('blur', () => {\n this.props.handleBlur(this.yas.getValue())\n })\n }\n\n render() {\n return \n }\n}\n\nexport default Yasgui\n","// extracted by mini-css-extract-plugin\nmodule.exports = {\"default\":\"FormField_default__sRnyI\"};","import axios from 'axios'\n\nclass LoginHelper {\n static logoff(repoUrl) {\n if (repoUrl == null) {\n repoUrl = window.top.url\n }\n var ilUrl = repoUrl.replace('sparql', 'logout')\n var dataSend = {}\n axios.defaults.withCredentials = true\n axios.defaults.credentials = 'include'\n axios(\n {\n method: 'post',\n url: ilUrl,\n data: dataSend,\n },\n {\n withCredentials: true,\n headers: {\n 'Content-Type': 'application/json',\n },\n }\n ).then(({ data, iets }) => {\n console.log('logoff ', data)\n })\n }\n\n static login(repoUrl, repo, login, psw, rv) {\n var ilUrl = repoUrl.replace('sparql', 'login')\n var dataSend = { login: login, psw: psw } //applogin:true,\n console.log('login', ilUrl, rv)\n\n axios.defaults.withCredentials = true\n axios.defaults.credentials = 'include'\n axios(\n {\n method: 'post',\n url: ilUrl,\n data: dataSend,\n },\n {\n withCredentials: true,\n headers: {\n 'Content-Type': 'application/json',\n },\n }\n ).then(\n ({ data, iets }) => {\n // console.log(\"got login results \",data,rv);\n try {\n if (data.loggedIn === 'TRUE') {\n if (repo != null && data.repo != null) {\n if (repo === data.repo) {\n axios.defaults.withCredentials = true\n // console.log(\"alles is ok. calling rv functie \",rv);\n if (rv != null) {\n rv.call(this, this)\n }\n } else {\n console.log('niet ok ', repo, data)\n //window.location.reload(false);\n }\n }\n } else {\n // console.log(data);\n alert('could not log in. Wrong name or password.')\n // window.location.reload(true);\n }\n } catch (error) {\n console.log('error', error)\n }\n },\n ({ error, iets }) => {\n console.log('error in sending ', error, iets, ilUrl)\n alert('could not log in. general error')\n window.location.reload(true)\n }\n )\n }\n\n static isLoggedIn(ilUrl, repo) {\n axios.defaults.withCredentials = true\n axios.defaults.credentials = 'include'\n\n axios(\n {\n method: 'get',\n url: ilUrl,\n },\n {\n headers: {\n 'Access-Control-Allow-Origin': '*',\n 'Content-Type': 'application/json',\n },\n }\n ).then(\n ({ data }) => {\n try {\n if (data.loggedIn === 'TRUE') {\n // console.log(\"confirmed. you are loged in. need to check for the correct repo\",data,this);\n if (repo != null) {\n if (data.repo === repo) {\n // console.log(\"repo komt overeen\");\n } else {\n // console.log(\"repo komt niet overeen. \");\n this.props.history.replace(this.props.location.state || '/')\n }\n } else {\n this.props.history.replace(this.props.location.state || '/')\n }\n } else {\n console.log('not confirmed. you are not logged in (???)')\n }\n } catch (e) {\n console.log('catch error', e)\n }\n },\n ({ error }) => {\n console.log('netwerk error ', error)\n }\n )\n }\n}\n\nwindow.top.logoff = LoginHelper.logoff\nexport default LoginHelper\n","export default __webpack_public_path__ + \"static/media/gear-white.9f887544.svg\";","export default __webpack_public_path__ + \"static/media/gear-blue.dbaac633.svg\";","export default __webpack_public_path__ + \"static/media/plus.d2c8885b.svg\";","import React, { Component } from 'react'\nimport styles from './Table.module.css'\nimport {\n restructureResponse,\n generateEmptyResponse,\n aggregateResultsByFirstParameter,\n} from '../../helpers/sparql'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport { faCheck, faTimes } from '@fortawesome/free-solid-svg-icons'\nimport PublishUtils from './../../helpers/PublishUtils'\n\n// import { Table as StrapTable } from 'reactstrap';\n\nfunction camelCaseToSpaces(str) {\n str = str.replace(/([a-zA-Z])(?=[A-Z])/g, '$1 ').toLowerCase()\n return str.charAt(0).toUpperCase() + str.slice(1)\n}\n\nconst check = \nconst cross = \n\nclass Table extends Component {\n onClick = (uri) => {\n PublishUtils.resetParameter(this)\n this.props.publish(this.props.publishVariable, uri)\n }\n openLink = (url) => {\n window.open(url, '_blank')\n }\n\n static getDescription() {\n return {\n name: 'Table',\n component: Table,\n label: 'Table widget',\n variables: [\n {\n name: 'query',\n type: 'yasgui',\n label:\n 'Query to fill table. If table item should be a link, than the you should add a property with the same name with suffix \"URI\", eg: ?object ?objectURI.',\n },\n {\n name: 'publishVariable',\n type: 'text',\n label:\n 'Variabele in which item URI is published, when a link in the table is clicked.',\n },\n {\n name: 'highlightVariable',\n type: 'text',\n label: 'highlight table row with this uri',\n },\n {\n name: 'ashtml',\n type: 'boolean',\n label: 'tabel waardes als html',\n },\n {\n name: 'title',\n type: 'text',\n label: 'Titel boven de tabel',\n },\n {\n name: 'renderEmpty',\n type: 'boolean',\n label: 'render an empty table',\n },\n {\n name: 'zeroResult',\n type: 'text',\n label:\n 'text to display when sparql results is valid but has zero results',\n },\n {\n name: 'aggregateResultsByFirstParameter',\n type: 'boolean',\n label: 'aggregate sparql results by the first parameter',\n },\n {\n name: 'hasNumberedRows',\n type: 'boolean',\n label: 'show row numbers',\n },\n PublishUtils.getResetValueDef(),\n ],\n }\n }\n\n render() {\n var data = this.props.data\n\n if (!this.props.data || this.props.data.results.bindings.length === 0) {\n if (this.props.renderEmpty) {\n data = generateEmptyResponse(this.props.query)\n // console.log(\"table rende empty \",this.props.query, this.props);\n } else {\n try {\n if (this.props.zeroResult != null) {\n if (\n this.props.zeroResult != null &&\n this.props.data.results &&\n this.props.data.results.bindings.length === 0\n ) {\n var label = this.props.zeroResult\n return (\n
\n
{label}
\n
\n )\n }\n }\n } catch (e) {}\n\n return null\n }\n }\n\n let selectedUri = null\n if (this.props.highlightVariable != null) {\n let parameter = this.props.highlightVariable\n selectedUri = this.props.pubsub[parameter]\n }\n let headVars = data.head.vars\n let items = restructureResponse(data)\n\n if (this.props.aggregateResultsByID) {\n items = aggregateResultsByFirstParameter(items, headVars[0])\n }\n\n var html = false\n if (this.props.ashtml) html = true\n\n return (\n
\n {this.props.title && (\n
{this.props.title}
\n )}\n
\n \n
\n {this.props.hasNumberedRows && (\n
\n )}\n {headVars.map((headVar, index) => {\n if (headVar.endsWith('URI')) return null\n if (headVar.endsWith('URL')) return null\n\n return
\n {item.children &&\n this.state.childrenVisible &&\n item.children.map((item, index) => {\n return (\n \n )\n })}\n \n \n )\n }\n}\n\nclass Tree extends Component {\n state = {\n items: [],\n rootitem: null,\n selectedItem: null,\n }\n\n static getDescription() {\n return {\n name: 'Tree',\n component: Tree,\n label: 'Tree widget',\n variables: [\n {\n name: 'query',\n type: 'yasgui',\n label:\n 'Query to fill tree. First item should be the object label, the second the object URI, the third the parent URI. optional you can use icon, icon2 and icon3 variables for fa-fa icons',\n },\n {\n name: 'publishVariable',\n type: 'text',\n label:\n 'Variabele in which tree item URI is published, when tree item is clicked.',\n },\n {\n name: 'publishVariable2',\n type: 'text',\n label:\n 'Variabele in which tree item URI2 is published, when tree item is clicked.',\n },\n {\n name: 'subscribeVariable',\n type: 'text',\n label:\n 'Publish variabele on which to listen to to define tree item selection.',\n },\n {\n name: 'rootLabel',\n type: 'text',\n label: 'Label of the root of the tree. Leave empty for no root.',\n },\n\n {\n name: 'title',\n type: 'text',\n label: 'title',\n },\n {\n name: 'defaultIcon',\n type: 'text',\n label: 'fa icon name when no icon is defined. ',\n },\n {\n name: 'aggregate',\n type: 'boolean',\n label: 'Aggregate the results based upon parent and child uri ',\n },\n {\n name: 'shouldNonSelectedSubTreeClose',\n type: 'boolean',\n label:\n 'Should a subtree that does not contain selection fold on new selection.',\n },\n {\n name: 'setSelectionInURL',\n type: 'boolean',\n label: 'the selected URI will be used in the browser URL',\n },\n {\n name: 'setSelectionInURLStartsString',\n type: 'text',\n label:\n 'the selected URI will be used in the browser URL only if it starts with',\n },\n {\n name: 'parseInitialURLForSelection',\n type: 'boolean',\n label: 'parse the initial URL for selection',\n },\n {\n name: 'initialSelection',\n type: 'text',\n label: 'initial uri selection',\n },\n {\n name: 'scrollSelectionIntoView',\n type: 'boolean',\n label: 'try to automatically scroll the selected object into view',\n },\n ],\n }\n }\n\n componentDidUpdate() {\n if (this.props.subscribeVariable == null) {\n return\n }\n if (this.selectEvent) {\n this.selectEvent = false\n return\n }\n let selectedURI = this.props.pubsub[this.props.subscribeVariable]\n //console.log(\"tree component did update \",selectedURI);\n if (this.props.scrollSelectionIntoView === true) {\n //not sure if this works correctly\n // console.log(\"smooth tree scorll, \",selectedURI, this.latestTreeSelection);\n if (selectedURI != null && this.latestTreeSelection === selectedURI) {\n // console.log(\"no smooth tree scroll\");\n } else {\n // console.log(\" smooth tree scrolling \");\n if (selectedURI != null) {\n setTimeout(function () {\n const element = document.getElementById(selectedURI)\n // console.log(\"tree component did update element foud \",element);\n if (element != null) {\n element.scrollIntoView({ behavior: 'smooth' })\n }\n }, 10)\n } else {\n // reset scroll\n const element = document.getElementById('begin')\n if (element != null) {\n element.scrollIntoView({ behavior: 'smooth' })\n }\n }\n }\n }\n }\n\n processURLSelection() {\n if (this.props != null) {\n if (this.props.parseInitialURLForSelection) {\n var url = window.top.location.href\n // console.log(\"trying to find selection from url\",url);\n if (url.startsWith(this.props.setSelectionInURLStartsString)) {\n // console.log(\"try parsing url path\",url);\n\n this.props.pubsub[this.props.subscribeVariable] = url\n } else {\n try {\n // console.log(\"trying to find selection from url parameter\");\n const queryString = window.top.location.search\n // console.log(queryString);\n const urlParams = new URLSearchParams(queryString)\n var selection = urlParams.get('selection')\n if (selection != null) {\n if (\n selection.startsWith(\n this.props.setSelectionInURLStartsString\n ) ||\n selection.startsWith('http://localhost:3000/')\n ) {\n // console.log(\"try parsing url from selection\",selection);\n this.props.pubsub[this.props.subscribeVariable] = selection\n return true\n } else {\n console.log(\n 'initial parametervalue not according to ',\n this.props.setSelectionInURLStartsString\n )\n }\n } else {\n console.log('no initial selection parameter value found', url)\n }\n } catch (error) {\n console.log(error)\n }\n }\n\n //url=\"https://otl.waternet.nl/def/Document\"; //voorbeeld\n // remove url parameters\n }\n }\n return false\n }\n\n componentDidMount() {\n if (this.processURLSelection()) {\n return\n }\n //this.processURLSelection();\n // check of we een selectie (niet zeker of die bestaat) moeten registerern op basis van de url.\n if (this.props.initialSelection != null) {\n if (\n this.props.subscribeVariable != null ||\n this.props.publishVariable != null\n ) {\n // console.log(\"setting initial selection value\");\n let selection = this.props.subscribeVariable\n if (selection == null) {\n selection = this.props.publishVariable\n }\n this.props.pubsub[selection] = this.props.initialSelection\n }\n }\n }\n\n treeItemClicked = (item) => {\n this.selectEvent = true\n this.latestTreeSelection = item.uri\n // console.log(\"latest tree selection\",item.uri);\n let treeItemURIKey = this.props.data.head.vars[1]\n let publishVariable = this.props.publishVariable\n let publishVariable2 = this.props.publishVariable2\n if (publishVariable2) {\n //console.log(\"two tree selection event publishing \",publishVariable2, item[\"URI2\"]);\n //this.props.publish(publishVariable2, item[\"URI2\"]);\n //setTimeout(function(){ props.publish(publishVariable, item[treeItemURIKey]);},10);\n var v1 = item[treeItemURIKey]\n var v2 = item['URI2']\n\n this.props.dispatch({\n type: 'PUBLISH',\n data: {\n [publishVariable]: v1,\n //[publishVariable2]:v2\n },\n })\n var me = this\n setTimeout(function () {\n me.props.dispatch({\n type: 'PUBLISH',\n data: {\n //[publishVariable]: v1,\n [publishVariable2]: v2,\n },\n })\n }, 20)\n } else {\n console.log(\n 'single tree selection event publishing ',\n publishVariable,\n item[treeItemURIKey]\n )\n v1 = item[treeItemURIKey]\n this.props.dispatch({\n type: 'PUBLISH',\n data: {\n [publishVariable]: v1,\n },\n })\n this.props.publish(publishVariable, item[treeItemURIKey])\n }\n this.setState({ selectedItem: item[treeItemURIKey] })\n }\n\n containsSelection(selectedURI, treeItemURIKey, item) {\n if (item[treeItemURIKey] === selectedURI) {\n return true\n }\n var b = false\n for (var n in item.children) {\n var child = item.children[n]\n child.containsSelection = this.containsSelection(\n selectedURI,\n treeItemURIKey,\n child\n )\n if (child.containsSelection === true) {\n b = true\n }\n }\n return b\n }\n\n openSelectie(items) {\n let selectedURI = this.props.pubsub[this.props.subscribeVariable]\n if (selectedURI == null) {\n return\n }\n let treeItemURIKey = this.props.data.head.vars[1]\n for (var n in items) {\n var item = items[n]\n item.containsSelection = this.containsSelection(\n selectedURI,\n treeItemURIKey,\n item\n )\n }\n }\n\n findParents(ar) {\n let headVars = this.props.data.head.vars\n let treeItemURIKey = headVars[1]\n let parentItemURIKey = headVars[2]\n let parents = []\n let uri_items = {}\n // zoek parents en creeer uri hash\n for (var n in ar) {\n let item = ar[n]\n\n var itemsar = uri_items[item[treeItemURIKey]]\n if (itemsar == null) {\n itemsar = []\n uri_items[item[treeItemURIKey]] = itemsar\n }\n itemsar.push(item)\n }\n\n // zet children\n for (const n in ar) {\n var item = ar[n]\n if (uri_items[item[parentItemURIKey]] == null) {\n parents.push(item)\n // console.log(\"finding parent \"+item[labelKey],parents[0]);\n }\n // console.log(parents) ;\n\n var parent = item[parentItemURIKey]\n if (parent != null) {\n itemsar = uri_items[parent]\n if (itemsar != null) {\n for (var i in itemsar) {\n var parentO = itemsar[i]\n var children = parentO.children\n if (children == null) {\n children = []\n parentO.children = children\n }\n children.push(item)\n }\n }\n }\n }\n\n return parents\n }\n\n aggregate(items) {\n try {\n let headVars = this.props.data.head.vars\n let treeItemURIKey = headVars[1]\n let parentItemURIKey = headVars[2]\n\n var id_binding = {}\n for (var n in items.results.bindings) {\n var binding = items.results.bindings[n]\n var parent = 'onbekend'\n if (binding[parentItemURIKey] != null)\n parent = binding[parentItemURIKey].value\n var id = parent + '_' + binding[treeItemURIKey].value\n var double = id_binding[id]\n if (double != null) {\n for (var key in binding) {\n double[key] = binding[key]\n }\n } else {\n id_binding[id] = binding\n }\n }\n var result = []\n //console.log(id_binding);\n for (var k in id_binding) result.push(id_binding[k])\n\n items.results.bindings = result\n // console.log(items);\n return items\n } catch (e) {\n console.log(e)\n }\n return null\n }\n\n /*shouldComponentUpdate()\n {\n console.log(\"tree needs to be updated\");\n return true;\n }\n*/\n exists(uri, item) {\n //console.log(uri,item);\n try {\n if (item.child === uri) {\n return true\n }\n if (item.children == null) {\n return false\n }\n for (var n in item.children) {\n var b = this.exists(uri, item.children[n])\n if (b) {\n return true\n }\n }\n } catch (e) {\n console.log(e)\n }\n\n return false\n }\n\n render() {\n if (!this.props.data) return null\n var item = this.state.rootitem\n if (item == null) {\n item = this.createTreeItems()\n //this.state.rootitem=item;\n }\n\n if (item == null) {\n return null\n }\n\n let selectedURI = this.props.pubsub[this.props.subscribeVariable]\n if (selectedURI == null) {\n selectedURI = this.state.selectedItem\n }\n\n if (selectedURI && this.props.setSelectionInURL) {\n var getUrl = window.top.location\n var baseUrl = getUrl.origin + '/'\n var suri = baseUrl + selectedURI.replace(baseUrl, '') // makesure it has the same origin\n if (suri !== selectedURI) {\n // console.log(\"selected uri not in this domain. resetting url \",selectedURI);\n suri = baseUrl\n }\n if (!this.exists(selectedURI, item)) {\n // console.log( \"selected uri bestaat niet \",selectedURI);\n suri = baseUrl\n }\n // if (suri!=baseUrl)\n //console.log(\"should push suri \",suri);\n if (true) {\n //console.log(\"selected uri in this domain so changing url\",selectedURI);\n setTimeout(function () {\n try {\n window.top.history.pushState({}, null, suri)\n } catch (e) {\n console.log(e)\n }\n }, 0)\n } else {\n console.log('not reloading')\n }\n }\n\n //console.log(this.props.data,item);\n var depth = 0\n\n return (\n
\n {this.props.title && (\n
{this.props.title}
\n )}\n \n
\n )\n }\n\n createTreeItems() {\n let selectedURI = this.props.pubsub[this.props.subscribeVariable]\n\n let items = this.props.data\n if (this.props.aggregate) {\n items = this.aggregate(items)\n }\n if (items == null) {\n return null\n }\n items = restructureResponse(items)\n if (items == null) {\n return null\n }\n\n let headVars = this.props.data.head.vars\n\n items = this.findParents(items)\n this.openSelectie(items)\n\n let labelKey = headVars[0]\n let item = {\n [labelKey]: this.props.rootLabel,\n children: items,\n containsSelection: !!selectedURI,\n }\n\n if (\n (this.props.rootLabel === '' || this.props.rootLabel == null) &&\n items.length === 1\n ) {\n item = items[0]\n // console.log(\"setting single data parent as root of the table\",item);\n }\n // console.log(\"returning tree items \",item);\n return item\n }\n}\n\nexport default Tree\n","import React from 'react'\nimport styles from './List.module.css'\n\nimport { Button } from 'reactstrap'\nimport { restructureResponse } from '../../helpers/sparql'\nimport PublishUtils from './../../helpers/PublishUtils'\n\nclass List extends React.Component {\n state = { checklist: {} }\n\n handleOnChange = (e) => {\n // setIsChecked(!isChecked);\n // console.log(e,e.target.value,e.target.checked);\n let checklist = this.state.checklist\n checklist[e.target.value] = e.target.checked\n\n this.setState({ checklist: checklist })\n let publishVariable = this.props.publishVariable\n if (publishVariable != null) {\n let valueString = ''\n let komma = ''\n let pre = '<'\n let end = '>'\n let kommaT = ','\n if (this.props.multipleselectparametertype === 'csvstring') {\n pre = '\"'\n end = pre\n }\n if (this.props.multipleselectparametertype === 'valuestring') {\n pre = '(\"'\n end = '\") '\n kommaT = ''\n }\n if (this.props.multipleselectparametertype === 'valueuri') {\n pre = '(<'\n end = '>) '\n kommaT = ''\n }\n\n for (let n in checklist) {\n if (checklist[n]) {\n valueString += komma + pre + n + end\n komma = kommaT\n }\n }\n // console.log(valueString);\n if (valueString === '') valueString = ''\n\n this.props.publish(publishVariable, valueString)\n //PublishUtils.resetParameter(this);\n }\n }\n\n static getDescription() {\n return {\n name: 'List',\n component: List,\n label: 'List widget',\n variables: [\n {\n name: 'title',\n type: 'text',\n label: 'Titel boven de lijst',\n },\n {\n name: 'query',\n type: 'yasgui',\n label: 'first variabele for the labels ',\n },\n {\n name: 'publishVariable',\n type: 'text',\n label: 'sparql parameter name for publishing select event result',\n },\n {\n name: 'subscribeVariable',\n type: 'text',\n label:\n 'Published variabele on which to listen to to define list item selection.',\n },\n {\n name: 'multipleselect',\n type: 'boolean',\n label:\n 'allow multiple selections. parameters are filled as comma separated values',\n },\n {\n name: 'multipleselectparametertype',\n type: 'select',\n options: [\n { label: 'csv as uri', value: 'csvuri' },\n { label: 'csv as string with \"', value: 'csvstring' },\n { label: 'sparql value string with \"', value: 'valuestring' },\n { label: 'sparql value uri)', value: 'valueuri' },\n ],\n label:\n 'for Multiple selection only: how to set the multivalue parameters',\n },\n PublishUtils.getResetValueDef(),\n /*,\n {\n name: 'clearParameter',\n type: 'text',\n label: 'clears widget when parameter changes'\n }*/\n ],\n }\n }\n\n //state= {clearList:false};\n clearList = false\n\n shouldComponentUpdate(nextProps, nextState) {\n if (nextProps == null) {\n return false\n }\n if (this.props == null) {\n return false\n }\n if (this.props.data == null) {\n return true\n }\n\n if (nextProps.data !== this.props.data) {\n // let key = this.props.data.head.vars[0]\n // let label = this.props.data.head.vars[0]\n // if (this.props.data.head.vars.length > 1) {\n // key = this.props.data.head.vars[1]\n // }\n\n // let items = restructureResponse(this.props.data)\n this.setState({ checklist: {} })\n let publishVariable = this.props.publishVariable\n if (publishVariable != null) {\n this.props.publish(publishVariable, null)\n PublishUtils.resetParameter(this)\n }\n\n this.setState({ checklist: {} })\n\n return true\n }\n\n return true\n }\n\n renderMultiple() {\n let key = this.props.data.head.vars[0]\n let label = this.props.data.head.vars[0]\n if (this.props.data.head.vars.length > 1) {\n key = this.props.data.head.vars[1]\n }\n\n // let publishVariable = this.props.publishVariable\n\n let items = restructureResponse(this.props.data)\n //console.log(key,items);\n let checklist = this.state.checklist\n return (\n
\n {this.props.title && (\n
{this.props.title}
\n )}\n
\n {items.map((item, index) => {\n let checkboxvalue = item[key]\n let check = checklist[checkboxvalue] ?? false\n\n return (\n
\n \n {item[label]}\n
\n )\n })}\n
\n
\n )\n }\n\n render() {\n if (!this.props.data) return null\n if (this.props.multipleselect) return this.renderMultiple()\n\n let key = this.props.data.head.vars[0]\n let label = this.props.data.head.vars[0]\n if (this.props.data.head.vars.length > 1) {\n key = this.props.data.head.vars[1]\n }\n\n let publishVariable = this.props.publishVariable\n\n let items = restructureResponse(this.props.data)\n //console.log(key,items);\n let selectedItem = this.props.pubsub[publishVariable]\n\n return (\n
\n {this.props.title && (\n
{this.props.title}
\n )}\n
\n {items.map((item, index) => {\n if (publishVariable) {\n return (\n
\n ))}\n \n )\n }\n renderOptionsVertical() {\n let value = this.props.pubsub[this.props.publishVariable]\n let options = this.restructureOptions()\n\n if (!options) {\n return (\n
Options should be a comma separated list of value,label pairs
\n )\n }\n}\n\nexport default SelectBox\n","import React, { Component } from 'react'\nimport styles from './Slider.module.css'\nimport { restructureResponse } from '../../helpers/sparql'\nimport throttle from 'lodash/throttle'\n// import isEqual from 'lodash/isEqual';\n\nclass Slider extends Component {\n state = {}\n\n // componentDidMount() {\n // if (this.props.data) {\n // let item = restructureResponse(this.props.data)[0];\n // let keyURI = this.props.data.head.vars[0];\n // let value = item[keyURI];\n // this.props.publish(this.props.publishVariable, value);\n // }\n // }\n\n static getDescription() {\n var r = {\n name: 'Slider',\n component: Slider,\n label: 'Slider widget',\n variables: [\n {\n name: 'query',\n type: 'yasgui',\n label:\n 'Sparql query to define min max values of the slider. it uses only the first parameter',\n },\n {\n name: 'publishVariable',\n type: 'text',\n label: 'Variabele in which the value of the slider is published.',\n },\n\n {\n name: 'startMin',\n type: 'boolean',\n label: 'default on minimum',\n },\n {\n name: 'publishStartValue',\n type: 'boolean',\n label: 'publish the initial value',\n },\n\n {\n name: 'tick',\n type: 'text',\n label: 'tick',\n },\n {\n name: 'label',\n type: 'text',\n label: 'Label',\n },\n {\n name: 'textwidth',\n type: 'text',\n label: 'text width',\n },\n ],\n }\n return r\n }\n\n shouldComponentUpdate(arg1) {\n if (this.props.data == null && arg1.data != null) {\n if (this.props.publishVariable && this.props.publishStartValue) {\n //console.log(\"should component slider\",this.props.data,arg1);\n var minmax = this.defineMaxMinValue(arg1)\n\n let value = minmax.maxValue\n if (this.props.startMin) {\n value = minmax.minValue\n }\n this.props.publish(this.props.publishVariable, value)\n }\n }\n return true\n }\n\n defineMaxMinValue(arg) {\n let minValue = 1000000\n let maxValue = -1000000\n try {\n var data = this.props.data\n if (arg) {\n data = arg.data\n }\n let headVars = data.head.vars\n let key = headVars[0] // eg. oprichtingsDatum\n let items = restructureResponse(data)\n\n items.forEach((item) => {\n let value = item[key]\n try {\n if (typeof value === 'string') value = Number(value)\n } catch (error) {\n console.log(error)\n }\n if (value < minValue) minValue = value\n if (value > maxValue) maxValue = value\n })\n return { minValue, maxValue }\n } catch (e) {\n console.log(e)\n }\n return { minValue, maxValue }\n }\n\n onChange = (event) => {\n this.setState({\n value: event.target.value,\n })\n // console.log(event);\n\n //this.onChangeThrottle();\n }\n onmouseup = (event) => {\n // console.log(\"mouse up\");\n this.onChangeThrottle()\n }\n\n onChangeThrottle = throttle(() => {\n // console.log(\"slider update\");\n let value = this.state.value\n\n if (value) {\n console.log('really publishing ', this.props.publishVariable, value)\n this.props.publish(this.props.publishVariable, value)\n }\n }, 200)\n\n render() {\n if (!this.props.data) return null\n let step = 1\n if (this.props.tick != null) {\n try {\n step = parseInt(this.props.tick)\n } catch (error) {}\n }\n let { minValue, maxValue } = this.defineMaxMinValue()\n\n // let value = this.props.pubsub[this.props.publishVariable] || maxValue;\n let value = null\n if (this.props.startMin) {\n value = this.state.value || minValue\n } else {\n value = this.state.value || maxValue\n }\n\n return (\n
\n
\n \n
\n
\n
{this.props.label}
\n
\n
{minValue}
\n \n
{maxValue}
\n
({value})
\n
\n
\n
\n \n
\n
\n )\n }\n}\n\nexport default Slider\n","import React, { Component } from 'react'\nimport styles from './SearchAutocomplete.module.css'\nimport { Input } from 'reactstrap'\nimport { restructureResponse } from '../../helpers/sparql'\nimport PublishUtils from '../../helpers/PublishUtils'\n\n//magnifyingGlass from '../../images/magnifying-glass.svg';\n//import cross from '../../images/cross.svg';\n\nclass SearchAutocomplete extends Component {\n state = {\n searchValue: '',\n validItems: [],\n showPopup: false,\n selectedIndex: null,\n }\n\n static getDescription() {\n return {\n name: 'SearchAutocomplete',\n component: SearchAutocomplete,\n label: 'Search autocomplete widget',\n variables: [\n {\n name: 'query',\n type: 'yasgui',\n label: 'Query to fill search results. parameters search string, uri',\n },\n {\n name: 'publishVariable',\n type: 'text',\n label: 'Variabele in which searchterm is published.',\n },\n {\n name: 'alignItems',\n type: 'select',\n label: 'Uitlijning',\n options: [\n {\n label: 'Stretch',\n value: 'stretch',\n },\n {\n label: 'Start',\n value: 'flex-start',\n },\n {\n label: 'Center',\n value: 'center',\n },\n {\n label: 'End',\n value: 'flex-end',\n },\n ],\n },\n PublishUtils.getResetValueDef(),\n {\n name: 'textbefore',\n type: 'text',\n label: 'text before the search input.',\n },\n {\n name: 'cssEscape',\n type: 'text',\n label: 'JSON object of CSS statements',\n },\n\n {\n name: 'resetPublishVariable',\n type: 'boolean',\n label: 'Reset the publish variable when sparql changes',\n },\n ],\n }\n }\n\n shouldComponentUpdate(e, b) {\n if (e == null) return true\n if (this.props == null) return true\n if (e.data !== this.props.data) {\n //console.log(\"NEW DATA. refresh current searchbox\");\n\n if (this.props.resetPublishVariable === true) {\n let pv = this.props.publishVariable\n // console.log(\"should reset if variable is present\",pv);\n if (pv != null) {\n // console.log(\"publish variable could be present\");\n if (this.props.pubsub[pv] != null) {\n //console.log(\"reset publish variable \",pv,this.props.pubsub[pv]);\n\n this.setState({ searchValue: '' })\n this.props.publish(pv, 'http://www.buildingbits.nl/empty')\n }\n }\n }\n }\n return true\n }\n\n handleKeyPress = (e) => {\n if (e.key === 'Enter') {\n if (!this.state.validItems.length) {\n console.log('niets')\n this.publish(null, '')\n return\n }\n if (!this.state.selectedIndex) {\n console.log('niets')\n this.publish(null, '')\n return\n }\n let selectedItem = this.state.validItems[this.state.selectedIndex]\n let objectURIKey = this.props.data.head.vars[1]\n\n this.publish(selectedItem[objectURIKey])\n } else if (e.key === 'ArrowDown') {\n let selectedIndex = this.state.selectedIndex\n let validItems = this.state.validItems\n if (selectedIndex === validItems.length - 1) return\n this.setState({\n selectedIndex: selectedIndex === null ? 0 : selectedIndex + 1,\n })\n } else if (e.key === 'ArrowUp') {\n let selectedIndex = this.state.selectedIndex\n if (selectedIndex === 0) return\n this.setState({\n selectedIndex:\n selectedIndex === null\n ? this.state.validItems.length - 1\n : selectedIndex - 1,\n })\n } else if (e.key === 'Escape') {\n this.setState({ searchValue: '' })\n }\n }\n\n onChange = (e) => {\n let objectKey = this.props.data.head.vars[0]\n let searchValue = e.target.value\n\n let items = restructureResponse(this.props.data)\n let validItems = items.filter(\n (item) =>\n item[objectKey] &&\n item[objectKey].toLowerCase().includes(searchValue.toLowerCase())\n )\n this.setState({\n searchValue,\n showPopup: true,\n validItems,\n selectedIndex: null,\n })\n }\n\n onBlur = (e) => {\n setTimeout(() => {\n this.setState({\n showPopup: false,\n })\n }, 300)\n }\n\n publish(objectURI, key) {\n let publishVariable = this.props.publishVariable\n var data = {}\n\n data[publishVariable] = objectURI\n\n this.props.publish(publishVariable, objectURI) //DIT EERST\n\n PublishUtils.resetParameter(this, false)\n /*\n var me=this;\n setTimeout(function(){console.log(\"resetting parameters \",data);\n me.props.dispatch({\n type: 'PUBLISH',\n data: data\n });},100);\n */\n\n this.setState({\n showPopup: false,\n searchValue: key,\n })\n }\n\n renderLabel(label, searchValue) {\n let ind = label.toLowerCase().indexOf(searchValue.toLowerCase())\n if (ind === -1) {\n return
{label}
\n }\n let end = ind + searchValue.length\n let l1 = label.slice(0, ind)\n let l2 = label.slice(ind, end)\n let l3 = label.slice(end)\n return (\n
\n {l1}\n {l2}\n {l3}\n
\n )\n }\n\n renderValidItems() {\n try {\n if (!this.props.data) return\n\n let objectKey = this.props.data.head.vars[0]\n let objectURIKey = this.props.data.head.vars[1]\n let searchValue = this.state.searchValue\n let validItems = this.state.validItems\n let selectedIndex = this.state.selectedIndex\n let selectedItem = validItems[selectedIndex]\n\n if (!searchValue) return null\n if (!validItems.length)\n return
geen resultaten gevonden
\n if (!this.state.showPopup) return null\n\n return (\n
\n )\n }\n}\n\nexport default SearchAutocomplete\n","import React, { Component } from 'react'\nimport styles from './Tab.module.css'\nimport Area from '../Area'\nimport { library } from '@fortawesome/fontawesome-svg-core'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport {\n faProjectDiagram,\n faShareAlt,\n faBacon,\n faTag,\n faTable,\n faSearch,\n faMap,\n faCoffee,\n faSitemap,\n faCube,\n faCheck,\n faDrawPolygon,\n faCircle,\n faInfo,\n faSquare,\n faSquareFull,\n faPlus,\n faBox,\n faCogs,\n faDotCircle,\n faDatabase,\n faDiceD6,\n faBullseye,\n faBoxOpen,\n faCheckSquare,\n} from '@fortawesome/free-solid-svg-icons'\n\nlibrary.add(\n faProjectDiagram,\n faShareAlt,\n faBacon,\n faTag,\n faTable,\n faMap,\n faSearch,\n faCheckSquare,\n faSitemap,\n faCheck,\n faCircle,\n faDrawPolygon,\n faInfo,\n faSquare,\n faSquareFull,\n faPlus,\n faCogs,\n faBullseye,\n faDotCircle,\n faDiceD6,\n faDatabase,\n faBox,\n faBoxOpen,\n faCube,\n faCoffee,\n faCube\n)\n\nclass Tab extends Component {\n static tabId = 0\n state = { selectedIndex: 0, hideTabs: null, areas: [], id: Tab.tabId++ }\n\n static getDescription() {\n return {\n name: 'Tab',\n component: Tab,\n label: 'Tab Layout',\n variables: [\n {\n name: 'tabs',\n type: 'array',\n label: 'Tabs',\n },\n {\n name: 'tabSelectionSubscription',\n type: 'text',\n label: 'Variabele to listen to for tab selection',\n },\n {\n name: 'hideTabs',\n type: 'text',\n label:\n 'Variabele to listen to for tab visualisation. Use tab names to hide the tabs',\n },\n\n {\n name: 'icons',\n type: 'array',\n label: 'fa icon names when no icon is defined. ',\n },\n {\n name: 'initialTabSelection',\n type: 'text',\n label: 'index of the initial selected tab',\n },\n {\n name: 'areas',\n type: 'json',\n // label: 'Column widths or row heights (separated by commas). Value can be a number (which will be set as flex values/verhoudingswaarden) or a px/% value',\n label: 'area definitions',\n },\n ],\n }\n }\n\n static registeredTabComponents = [] //registering all tabs for 'back button'\n\n getTabId() {\n return this.state.id\n }\n\n componentDidMount2() {\n if (this.props.initialTabSelection != null) {\n try {\n // var index = parseInt(this.props.initialTabSelection+\"\");\n let index = this.props.initialTabSelection\n this.setState({ selectedIndex: index })\n } catch (e) {}\n }\n Tab.registeredTabComponents.push(this)\n }\n getFirstNonHiddenTab()\n {\n \n \n let selectedIndex=0;\n let hideTabs = this.props.hideTabs\n let data = this.props.pubsub[hideTabs];\n\n\n for (let n in this.props.tabs)\n {\n let tab= this.props.tabs[n];\n if (tab!=data)\n {\n return n;\n }\n\n }\n\n return selectedIndex;\n }\n\n componentDidUpdate(prevProps) {\n let tabSelectionSubscription = this.props.tabSelectionSubscription\n if (tabSelectionSubscription) {\n // console.log(\"tab did update \",this.state);\n if (\n prevProps.pubsub[tabSelectionSubscription] !==\n this.props.pubsub[tabSelectionSubscription]\n ) {\n let index = this.props.pubsub[tabSelectionSubscription]\n //index=parseInt(index+\"\");\n // console.log(\"set selected index change \");\n this.setState({ selectedIndex: index })\n }\n }\n let hideTabs = this.props.hideTabs\n if (hideTabs) {\n if (prevProps.pubsub[hideTabs] !== this.props.pubsub[hideTabs]) {\n let data = this.props.pubsub[hideTabs];\n \n let selectedIndex=this.state.selectedIndex;\n let selectedTabname=this.props.tabs[selectedIndex];\n \n // data =prevProps.pubsub[hideTabs];\n if (selectedTabname==data)\n {\n \n selectedIndex=this.getFirstNonHiddenTab();\n selectedIndex=parseInt(selectedIndex+\"\");\n //console.log(\"hidden tab is selected\",selectedIndex);\n this.onTabClick(selectedIndex);\n }\n // console.log(\"set selected index change 2\");\n this.setState({ hideTabs: data, selectedIndex: selectedIndex })\n }\n }\n }\n\n onTabClick = (index) => {\n let tabSelectionSubscription = this.props.tabSelectionSubscription\n\n if (tabSelectionSubscription) {\n var me = this\n me.props.publish(tabSelectionSubscription, index)\n } else {\n }\n this.setState({ selectedIndex: index })\n }\n\n render() {\n let mode = this.props.mode;\n return (\n \n
\n {this.props.tabs.map((tab, index) => {\n let selected = index === this.state.selectedIndex\n var icons = this.props.icons\n if (this.state.hideTabs != null) {\n if (tab === this.state.hideTabs) {\n return null\n }\n }\n\n return (\n this.onTabClick(index)}\n >\n {icons != null && (\n \n )}\n {tab}\n
\n )\n })}\n \n\n {this.props.tabs.map((tab, index) => {\n let areaConfig = this.props.areas[index] || {}\n\n let selected = index === this.state.selectedIndex\n // console.log(index,this.state.selectedIndex,selected);\n if (this.props.withinSelectedTab != null) {\n if (this.props.withinSelectedTab === false) {\n selected = false\n // console.log(\"TEST FF NIET SELECTED TAB WANT TAB IS NIET ZICHTBAAR\");\n }\n }\n\n return (\n \n \n \n )\n })}\n \n )\n }\n}\n\nexport default Tab\n","import React, { Component } from 'react'\nimport styles from './SplitLayout.module.css'\nimport Area from '../Area'\n\nclass SplitLayout extends Component {\n static getDescription() {\n return {\n name: 'SplitLayout',\n component: SplitLayout,\n label: 'Split Layout',\n variables: [\n {\n name: 'direction',\n type: 'select',\n label: 'Direction',\n options: [\n {\n label: 'Rijen',\n value: 'column',\n },\n {\n label: 'Kolommen',\n value: 'row',\n },\n ],\n },\n {\n name: 'disableScrollbars',\n type: 'boolean',\n label: 'disable scrollbars',\n },\n {\n name: 'minimize',\n type: 'boolean',\n label: 'minimize size',\n },\n {\n name: 'areaSizes',\n type: 'array',\n // label: 'Column widths or row heights (separated by commas). Value can be a number (which will be set as flex values/verhoudingswaarden) or a px/% value',\n label:\n \"Kolom Breedte of Rij hoogte, gescheiden door comma's. Waarden kunnen gegeven worden in pixels, percentage of getallen. Een getal is verhoudingsgetal ten opzichte van de andere Rijen/Kolommen. (Een voorbeeld: 130px,1,10%)\",\n },\n {\n name: 'areas',\n type: 'json',\n // label: 'Column widths or row heights (separated by commas). Value can be a number (which will be set as flex values/verhoudingswaarden) or a px/% value',\n label: 'area definitions',\n },\n ],\n }\n }\n\n render() {\n if (this.props.withinSelectedTab === false && this.firstTime == null) {\n return null\n } else {\n this.firstTime = false\n }\n\n let areaSizes = this.props.areaSizes\n\n if (typeof areaSizes === 'string') {\n areaSizes = areaSizes.split(' ')\n }\n\n let extraStyle = ''\n if (this.props.disableScrollbars === true) {\n extraStyle = styles.overflowHidden\n }\n let mode = this.props.mode || 'preview'\n\n // if (this.props.minimize)\n return (\n \n {areaSizes.map((areaSize, index) => {\n let areaConfig = this.props.areas[index] || {}\n areaSize = areaSize.trim()\n let flex = '0 0 auto'\n // let flex = '1 1 auto';\n let fixedSize = 'auto'\n\n if (/^\\d+$/.test(areaSize)) {\n if (areaSize === '0') {\n areaSize = '0 0 auto'\n }\n flex = areaSize\n } else {\n fixedSize = areaSize\n }\n let heightOrWidth =\n this.props.direction === 'row' ? 'width' : 'height'\n if (this.props.minimize) {\n heightOrWidth =\n 'max' +\n heightOrWidth.substr(1).toLocaleUpperCase() +\n heightOrWidth.substr(1)\n //console.log(\"minimize \",heightOrWidth, fixedSize);\n flex = '1 1 auto'\n }\n\n if (this.props.direction !== 'row') {\n // console.log(areaSize);\n if (!areaSize.endsWith('px')) {\n flex = '1 1 auto'\n }\n }\n if (mode !== 'preview' && areaSize.endsWith('px')) {\n areaSize = parseInt(areaSize.replace('px', ''))\n areaSize += 200\n areaSize = areaSize + 'px'\n // console.log(\"moeten we nu niet de hoogte aanpassen ?\",areaSize);\n }\n\n return (\n \n \n \n )\n })}\n \n )\n }\n}\n\nexport default SplitLayout\n","import React from 'react'\n\nclass AbstractArea extends React.Component {\n isAA() {\n return true\n }\n}\n\nexport default AbstractArea\n","import React from 'react'\nimport styles from './SplitLayoutTest.module.css'\nimport Area from '../Area'\nimport AbstractArea from '../AbstractArea'\n\nimport { ReflexContainer, ReflexSplitter, ReflexElement } from 'react-reflex'\n\nimport 'react-reflex/styles.css'\n\nclass SplitLayoutTest extends AbstractArea {\n static getDescription() {\n return {\n name: 'SplitLayoutTest',\n component: SplitLayoutTest,\n label: 'Split Layout Test',\n variables: [\n {\n name: 'direction',\n type: 'select',\n label: 'Direction',\n options: [\n {\n label: 'Rijen',\n value: 'column',\n },\n {\n label: 'Kolommen',\n value: 'row',\n },\n ],\n },\n {\n name: 'areaSizes',\n type: 'array',\n // label: 'Column widths or row heights (separated by commas). Value can be a number (which will be set as flex values/verhoudingswaarden) or a px/% value',\n label:\n \"Kolom Breedte of Rij hoogte, gescheiden door comma's. Waarden kunnen gegeven worden in getallen. Een getal is verhoudingsgetal ten opzichte van de andere Rijen/Kolommen. (Een voorbeeld: 1,3,1)\",\n },\n {\n name: 'minSizes',\n type: 'array',\n // label: 'Column widths or row heights (separated by commas). Value can be a number (which will be set as flex values/verhoudingswaarden) or a px/% value',\n label:\n \"initiele grootte, gescheiden door comma's. Waarden kunnen gegeven worden in pixels. (Een voorbeeld: 130px,200px,300px)\",\n },\n {\n name: 'cardSizes',\n type: 'array',\n // label: 'Column widths or row heights (separated by commas). Value can be a number (which will be set as flex values/verhoudingswaarden) or a px/% value',\n label:\n 'padding Waarden kunnen gegeven worden in pixels, percentage of getallen. Een getal is verhoudingsgetal ten opzichte van de andere Rijen/Kolommen. (Een voorbeeld: 130px,1,10%)',\n },\n {\n name: 'areas',\n type: 'json',\n // label: 'Column widths or row heights (separated by commas). Value can be a number (which will be set as flex values/verhoudingswaarden) or a px/% value',\n label: 'area definitions',\n },\n ],\n }\n }\n\n render() {\n try {\n if (this.props.withinSelectedTab === false && this.firstTime == null) {\n return null\n } else {\n this.firstTime = false\n }\n\n // return this.renderNormalPanels();\n //return this.renderResizeablePanels();\n return this.testRender2()\n } catch (error) {\n console.log(error)\n }\n return
\n }\n\n testRender() {\n let areaSizes = this.props.areaSizes\n if (typeof areaSizes === 'string') {\n areaSizes = areaSizes.split(' ')\n }\n\n let mode = this.props.mode || 'preview'\n\n let direction = 'vertical'\n if (this.props.direction !== 'row') {\n direction = 'horizontal'\n }\n let index = 0\n let areaConfig = this.props.areas[index] || {}\n\n return (\n \n \n \n
\n \n
\n \n\n \n\n \n
\n \n
\n \n \n \n )\n }\n\n testRender2() {\n let areaSizes = this.props.areaSizes\n if (typeof areaSizes === 'string') {\n areaSizes = areaSizes.split(' ')\n }\n let mode = this.props.mode || 'preview'\n let direction = 'vertical'\n if (this.props.direction !== 'row') {\n direction = 'horizontal'\n }\n let total = 0\n try {\n total = this.props.areaSizes.length || 0\n } catch (error) {}\n\n //console.log(total,this.props.areas);\n\n let o0 = {}\n try {\n o0 = this.props.areas[0]\n } catch (e) {}\n let o1 = {}\n try {\n o1 = this.props.areas[1]\n } catch (e) {}\n let o2 = {}\n try {\n o2 = this.props.areas[2]\n } catch (e) {}\n let o3 = {}\n try {\n o3 = this.props.areas[3]\n } catch (e) {}\n\n return (\n \n \n {0 < total && this.createArea(0, 'left-pane', o0)}\n {1 < total && }\n {1 < total && this.createArea(1, 'middle-pane', o1)}\n {2 < total && }\n {2 < total && this.createArea(2, 'right-pane', o2)}\n {3 < total && }\n {3 < total && this.createArea(3, 'right-pane', o3)}\n {4 < total && }\n {4 < total && this.createArea(4, 'right-pane', this.props.areas[4])}\n {5 < total && }\n {5 < total && this.createArea(5, 'right-pane', this.props.areas[5])}\n \n \n )\n }\n\n createArea(index, panel, areaConfig) {\n if (areaConfig == null) {\n areaConfig = {}\n }\n\n let areaSizes = this.props.areaSizes\n if (typeof areaSizes === 'string') {\n areaSizes = areaSizes.split(' ')\n }\n let areaSize = areaSizes[index]\n\n areaSize = areaSize.trim()\n\n let flex = '0 0 auto'\n\n if (index === areaSizes.length - 1) {\n flex = '1 1 auto'\n }\n\n if (/^\\d+$/.test(areaSize)) {\n if (areaSize === '0') {\n areaSize = '0 1 auto'\n }\n\n flex = areaSize\n }\n //if ((flex==NaN)||(flex==\"NaN\")){flex=\"\"}\n // if (flex=\"1\"){flex=\"0 1 auto\";}\n\n let minSizes = this.props.minSizes\n if (typeof minSizes === 'string') {\n minSizes = minSizes.split(' ')\n }\n let minSize = null\n if (minSizes != null) minSize = minSizes[index] || null\n if (isNaN(flex) || flex === 'NaN') {\n flex = '0 1 auto' // tja\n }\n //console.log(index+\" flex:\",flex,minSize);\n if (minSize == null) {\n minSize = false\n }\n return (\n \n
\n \n
\n \n )\n }\n\n renderResizeablePanels() {\n let areaSizes = this.props.areaSizes\n if (typeof areaSizes === 'string') {\n areaSizes = areaSizes.split(' ')\n }\n\n let mode = this.props.mode || 'preview'\n\n return (\n \n \n {areaSizes.map((areaSize, index) => {\n let paneLocation = 'left-pane'\n if (index > 0) {\n paneLocation = 'middle-pane'\n }\n if (index > 0) {\n paneLocation = 'right-pane'\n }\n\n let areaConfig = this.props.areas[index] || {}\n areaSize = areaSize.trim()\n\n let flex = '0 0 auto'\n let fixedSize = 'auto'\n\n if (index === areaSizes.length - 1) {\n flex = '1 1 auto'\n }\n\n if (/^\\d+$/.test(areaSize)) {\n if (areaSize === '0') {\n areaSize = '0 0 auto'\n }\n\n flex = areaSize\n } else {\n fixedSize = areaSize\n }\n let heightOrWidth =\n this.props.direction === 'row' ? 'width' : 'height'\n\n return (\n
\n \n
\n \n \n
\n
\n \n \n \n )\n })}\n \n \n )\n }\n\n renderNormalPanels() {\n let areaSizes = this.props.areaSizes\n if (typeof areaSizes === 'string') {\n areaSizes = areaSizes.split(' ')\n }\n\n let mode = this.props.mode || 'preview'\n\n return (\n \n {areaSizes.map((areaSize, index) => {\n let areaConfig = this.props.areas[index] || {}\n areaSize = areaSize.trim()\n\n let flex = '0 0 auto'\n let fixedSize = 'auto'\n\n if (index === areaSizes.length - 1) {\n flex = '1 1 auto'\n }\n\n if (/^\\d+$/.test(areaSize)) {\n if (areaSize === '0') {\n areaSize = '0 0 auto'\n }\n\n flex = areaSize\n } else {\n fixedSize = areaSize\n }\n let heightOrWidth =\n this.props.direction === 'row' ? 'width' : 'height'\n\n return (\n \n \n \n )\n })}\n \n )\n }\n}\n\nexport default SplitLayoutTest\n","import React, { Component } from 'react'\nimport styles from './Yasgui.module.css'\nimport yasqe from 'yasgui-yasqe'\nimport '../../../node_modules/yasgui-yasqe/dist/yasqe.css'\nimport axios from 'axios'\nimport { Button } from 'reactstrap'\nimport { restructureResponse } from '../../helpers/sparql'\n\nclass Yasgui extends Component {\n constructor(props) {\n super(props)\n this.textArea = React.createRef()\n }\n\n state = {\n message: '',\n }\n\n // componentDidMount() {\n // setTimeout(() => {\n // this.yas = yasqe.fromTextArea(this.textArea.current);\n // // this.yas.setSize('100%')\n // let defaultValue = `PREFIX xsd: \n // select * where {\n // ?s ?p ?o .\n // } limit 100`;\n // this.yas.setValue(defaultValue);\n // // debugger\n // // this.textArea.current.focus()\n // }, 500);\n\n // // this.yas.on('blur', () => {\n // // // this.props.handleBlur(this.yas.getValue());\n // // this.loadData(this.yas.getValue())\n // // });\n // }\n\n componentDidUpdate(prevProps) {\n if (\n prevProps.withinSelectedTab !== this.props.withinSelectedTab &&\n this.props.withinSelectedTab\n ) {\n if (this.yas) return\n this.yas = yasqe.fromTextArea(this.textArea.current)\n let defaultValue = `PREFIX xsd: \nselect * where { \n ?s ?p ?o .\n} limit 10`\n this.yas.setValue(defaultValue)\n }\n }\n\n onRunClick = () => {\n this.loadData(this.yas.getValue())\n }\n\n loadData(query) {\n if (!this.props.repoURL) return console.log('Repo URL is not set!')\n\n if (query) {\n // default use proxy server\n let url = '/api/sparql/' + this.props.repoURL\n let data = {\n query: encodeURIComponent(query),\n }\n let headers = {\n Authorization: `Bearer ${localStorage.getItem('kvk-vb-token')}`,\n }\n if (this.props.repoURL.startsWith('http')) {\n // request sparql endpoint directly\n url = this.props.repoURL\n data =\n 'infer=true&limit=1000&offset=0&sameAs=true&query=' +\n encodeURIComponent(query)\n headers = {\n 'Content-Type': 'application/x-www-form-urlencoded',\n Accept: 'application/sparql-results+json',\n }\n }\n\n axios({\n method: 'post',\n url,\n data,\n headers,\n })\n .then((response) => {\n this.setState({\n data: response.data,\n message: '',\n })\n })\n .catch((err) => {\n console.log(err)\n this.setState({\n message: 'Er ging iets mis met laden van de data.',\n })\n })\n }\n }\n\n renderData() {\n if (this.state.message) {\n return
{this.state.message}
\n }\n\n if (!this.state.data) return null\n let headVars = this.state.data.head.vars\n let items = restructureResponse(this.state.data)\n\n return (\n
\n )\n }\n}\n","import React, { Component } from 'react'\n\nimport styles from './BBHTML.module.css'\n\nexport default class BBHTML extends Component {\n state = {}\n\n static getDescription() {\n return {\n name: 'BBHTML',\n component: BBHTML,\n label: 'BBHTML',\n variables: [\n {\n name: 'query',\n type: 'yasgui',\n label: 'use parameter {{parameters}} to change html ',\n },\n {\n name: 'html',\n type: 'text',\n label: 'html ',\n },\n {\n name: 'htmlgeenresultaat',\n type: 'text',\n label: 'html bij 0 resultaten',\n },\n {\n name: 'cls',\n type: 'text',\n label: 'class ',\n },\n ],\n }\n }\n\n render() {\n if (!this.props.html && !this.props.htmlgeenresultaat) {\n return null\n }\n let html = this.props.html\n var html2 = ''\n let data = this.props.data\n if (data != null && html != null) {\n if (\n data.results != null &&\n data.results.bindings != null &&\n data.results.bindings.length > 0\n ) {\n var object = data.results.bindings[0]\n var html3 = html\n for (var key in object) {\n try {\n var value = object[key].value\n html3 = html3.replace('{{' + key + '}}', value)\n } catch (e) {}\n }\n html2 += html3\n }\n\n if (\n this.props.htmlgeenresultaat != null &&\n data.results.bindings.length === 0\n ) {\n html2 = this.props.htmlgeenresultaat\n }\n } else {\n html2 = html\n }\n\n html2 = html2.replace(/.*{{.*}}.*/, '')\n\n let cls = this.props.cls\n if (styles[cls] != null) cls = styles[cls]\n return \n }\n}\n","import React, { Component } from 'react'\nimport styles from './BBPicture.module.css'\n\nimport FormRenderer, {\n componentTypes,\n validatorTypes,\n} from '@data-driven-forms/react-form-renderer'\nimport {\n componentMapper,\n FormTemplate,\n} from '@data-driven-forms/mui-component-mapper'\n\nexport default class BBDForm extends Component {\n state = {\n schema: {\n fields: [\n {\n component: componentTypes.TEXT_FIELD,\n name: 'voornaam',\n label: 'voornaam',\n validate: [{ type: validatorTypes.REQUIRED }],\n },\n {\n component: componentTypes.TEXT_FIELD,\n name: 'achternaam',\n label: 'achternaam',\n },\n {\n component: componentTypes.CHECKBOX,\n name: 'adres',\n label: 'adres of zoiets',\n },\n {\n component: componentTypes.CHECKBOX,\n name: 'adres2',\n label: 'adres of zoiets v22',\n },\n {\n component: componentTypes.DATE_PICKER,\n name: 'datepicker',\n label: 'datum of zoiets',\n },\n {\n component: componentTypes.SWITCH,\n name: 'iets3',\n label: 'datum of zoiets',\n },\n {\n component: componentTypes.SELECT,\n name: 'iets34',\n label: 'datum of zoiets',\n options: [\n {\n label: 'Dogs',\n value: '1',\n },\n {\n label: 'Cats',\n value: '2',\n },\n {\n label: 'Hamsters',\n value: '3',\n },\n ],\n },\n {\n component: componentTypes.SLIDER,\n name: 'iets35',\n label: 'datum of zoiets',\n },\n ],\n },\n }\n\n /*BUTTON: \"button\"\nCHECKBOX: \"checkbox\"\nDATE_PICKER: \"date-picker\"\nDUAL_LIST_SELECT: \"dual-list-select\"\nFIELD_ARRAY: \"field-array\"\nINPUT_ADDON_BUTTON_GROUP: \"input-addon-button-group\"\nINPUT_ADDON_GROUP: \"input-addon-group\"\nPLAIN_TEXT: \"plain-text\"\nRADIO: \"radio\"\nSELECT: \"select\"\nSLIDER: \"slider\"\nSUB_FORM: \"sub-form\"\nSWITCH: \"switch\"\nTABS: \"tabs\"\nTAB_ITEM: \"tab-item\"\nTEXTAREA: \"textarea\"\nTEXT_FIELD: \"text-field\"\nTIME_PICKER: \"time-picker\"\nWIZARD: \"wizard\"\n*/\n\n static getDescription() {\n return {\n name: 'BBDForm',\n component: BBDForm,\n label: 'BBDForm',\n variables: [\n {\n name: 'title',\n type: 'text',\n label: 'Titel boven de form',\n },\n {\n name: 'class',\n type: 'text',\n label: 'uri van de owl/shacl classe',\n },\n {\n name: 'query',\n type: 'yasgui',\n label:\n 'to fill the form. Use title,uri, propUri, label,value, type (xsd,select), optionLabel optionValue ?required regex, multiple,objectOfCls ',\n },\n {\n name: 'nocancelbutton',\n type: 'boolean',\n label: 'do not show cancel button.',\n },\n {\n name: 'submit',\n type: 'select',\n label: 'submit handling ',\n options: [\n { label: 'none', value: 'none' },\n { label: 'internal parameters', value: 'internalparameters' },\n { label: 'submit to sparql endpoint', value: 'sparqlendpoint' },\n { label: 'javascript', value: 'javascript' },\n ],\n },\n ],\n }\n }\n\n shouldComponentUpdate2(arg, arg2) {\n this.getSchema()\n return true\n }\n\n getSchema() {\n var schema = { fields: [] }\n if (this.props.data == null) {\n return null\n }\n\n var item_def = {}\n var id_def = {}\n schema.props = item_def\n schema.propsID = id_def\n var volgorde = []\n for (var i in this.props.data.results.bindings) {\n var binding = this.props.data.results.bindings[i]\n var propUri = encodeURIComponent(binding.propUri.value)\n\n var o = item_def[propUri]\n // console.log(propUri,binding.propUri.value,item_def);\n\n var label = binding.label.value\n var type = 'text-field'\n\n if (o == null) {\n var id = 'id' + volgorde.length\n o = { id: id }\n item_def[propUri] = o\n volgorde.push(o)\n id_def[id] = o\n o.propuri = propUri\n o.component = componentTypes.TEXT_FIELD\n o.name = id\n o.label = label\n try {\n o.initialValue = binding.value.value\n } catch (ee) {}\n }\n try {\n if (binding.required.value === true) {\n o.validate = [{ type: validatorTypes.REQUIRED }]\n }\n } catch (e) {}\n\n //selects\n try {\n var option = binding.option.value\n o.noOptionsMessage = 'no options found'\n if (o.options == null) {\n o.options = []\n o.component = 'select'\n o.simpleValue = true\n }\n if (binding.optionUri == null) {\n o.options.push({ label: option, value: option })\n o.dataType = 'string'\n o.datatype2 = 'string' // case sensitive\n } else {\n var optionUri = encodeURIComponent(binding.optionUri.value)\n o.options.push({ label: option, value: optionUri })\n }\n } catch (error) {}\n if (o.options == null) {\n //datatype\n try {\n type = binding.datatype.value.replace(\n 'http://www.w3.org/2001/XMLSchema#',\n ''\n )\n\n if (type === 'int') {\n type = 'integer'\n }\n if (type === 'decimal') {\n type = 'float'\n }\n if (\n type === 'integer' ||\n type === 'string' ||\n type === 'float' ||\n type === 'boolean'\n ) {\n o.dataType = type\n o.datatype2 = type\n } else {\n if (type === 'date' || type === 'dateTime') {\n o.component = 'date-picker'\n o.datatype2 = type\n }\n }\n console.log(o)\n // o.dataType=type\n } catch (ee) {}\n }\n }\n\n // console.log(binding,propUri);\n\n schema.volgorde = volgorde\n schema.fields = volgorde\n //this.setState({schema:schema});\n return schema\n }\n\n onSubmit = (waardes) => {\n var r = { props: {} }\n\n if (this.props.submit === 'internalparameters') {\n for (var id in waardes) {\n this.props.publish(id, waardes[id])\n console.log('submitting internal values ', id, waardes[id])\n }\n\n return\n }\n\n for (const id in waardes) {\n var propdef = this.state.schema.propsID[id]\n\n var uri = decodeURIComponent(propdef.propuri)\n var waarde = waardes[id]\n //\n var foundType = false\n if (propdef.datatype2 == null) {\n waarde = '<' + decodeURIComponent(waarde) + '>'\n foundType = true\n }\n if (\n propdef.dataType === 'boolean' ||\n propdef.datatype === 'int' ||\n propdef.dataType === 'float' ||\n propdef.dataType === 'string' ||\n propdef.dataType === 'integer' ||\n propdef.datatype2 === 'dateTime' ||\n propdef.datatype2 === 'date' ||\n propdef.datatype2 === 'time'\n ) {\n // on purpose case sensitve\n foundType = true\n waarde =\n '\"' +\n waarde +\n '\"^^'\n }\n\n if (foundType === false) {\n alert('unsupported datatype found in form ')\n console.log(\n 'unsupported datatype found in form ' + propdef.dataType,\n propdef\n )\n return\n }\n r.props[uri] = { value: waarde, def: propdef }\n }\n\n console.log(r)\n }\n onCancel(iets) {\n console.log(this, iets)\n }\n\n render() {\n //console.log(this.props.data);\n\n //if (this.props.data==null){return null;}\n let schema = this.getSchema()\n let buttons = this.props.nocancelbutton\n if (buttons == null) {\n buttons = false\n }\n //let schema = this.state.schema;\n if (schema == null) {\n return null\n }\n\n return (\n
\n {this.props.title && (\n
{this.props.title}
\n )}\n \n
\n )\n }\n}\n","import React from 'react'\nimport {\n ProSidebar,\n SidebarContent,\n SidebarFooter,\n SidebarHeader,\n Menu,\n MenuItem,\n} from 'react-pro-sidebar'\nimport styles from './BBSideMenu.module.edit.css'\nimport './BBSideMenu.css'\n\nimport { Tooltip } from '@material-ui/core'\n\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport AsbtractArea from '../../AbstractArea'\nimport Area from '../../Area'\n\nimport { FaBeer } from 'react-icons/fa'\n//import * as Icons from '@fortawesome/free-solid-svg-icons';\nimport { library } from '@fortawesome/fontawesome-svg-core'\nimport { fas } from '@fortawesome/free-solid-svg-icons'\n\nimport { faAngleLeft, faAngleRight } from '@fortawesome/free-solid-svg-icons'\n\nlibrary.add(fas)\n\nclass BBSideMenu extends AsbtractArea {\n state = {\n collapsed: false,\n selectedIndex: 0,\n hideTabs: null,\n areas: [],\n }\n\n componentDidMount() {\n // console.log(\"check url \");\n let tab = this.props['tabSelectionSubscription']\n if (tab != null) {\n const queryString = window.top.location.search\n const urlParams = new URLSearchParams(queryString)\n const value = urlParams.get(tab)\n if (value != null) {\n try {\n const n = parseInt(value)\n this.setState({ selectedIndex: n })\n } catch (e) {\n console.log(e)\n }\n }\n }\n }\n\n static getDescription() {\n return {\n name: 'BBSideMenu',\n component: BBSideMenu,\n label: 'BBSideMenu',\n variables: [\n {\n name: 'query',\n type: 'yasgui',\n label:\n 'Query to fill tree. First item should be the object label, the second the object URI, the third the parent URI. optional you can use icon, icon2 and icon3 variables for fa-fa icons ()',\n },\n {\n name: 'tabs',\n type: 'array',\n label: 'Tabs',\n },\n {\n name: 'tabSelectionSubscription',\n type: 'text',\n label: 'Variabele to listen to for tab selection',\n },\n {\n name: 'hideTabs',\n type: 'text',\n label:\n 'Variabele to listen to for tab visualisation. Use tab names to hide the tabs',\n },\n {\n name: 'icons',\n type: 'array',\n label:\n 'fa icon names for each tab such as box,cogs,coffee,envelope,hand-point-left,arrow-left,cube,database,gavel,gift,stop,',\n },\n {\n name: 'headertext',\n type: 'text',\n label: 'text for the header when expanded',\n },\n\n {\n name: 'footertext',\n type: 'text',\n label: 'text for the footer',\n },\n {\n name: 'backgroundimage',\n type: 'text',\n label: 'background image',\n },\n {\n name: 'className',\n type: 'text',\n label: 'css classNames',\n },\n {\n name: 'areas',\n type: 'json',\n // label: 'Column widths or row heights (separated by commas). Value can be a number (which will be set as flex values/verhoudingswaarden) or a px/% value',\n label: 'area definitions',\n },\n ],\n }\n }\n\n componentDidUpdate(prevProps) {\n let tabSelectionSubscription = this.props.tabSelectionSubscription\n if (tabSelectionSubscription) {\n if (\n prevProps.pubsub[tabSelectionSubscription] !==\n this.props.pubsub[tabSelectionSubscription]\n ) {\n let index = this.props.pubsub[tabSelectionSubscription]\n this.setState({ selectedIndex: index })\n }\n }\n let hideTabs = this.props.hideTabs\n if (hideTabs) {\n if (prevProps.pubsub[hideTabs] !== this.props.pubsub[hideTabs]) {\n let data = this.props.pubsub[hideTabs]\n this.setState({ hideTabs: data, selectedIndex: 0 })\n }\n }\n }\n\n onTabClick = (index, event) => {\n if (event) {\n event.stopPropagation()\n }\n let tabSelectionSubscription = this.props.tabSelectionSubscription\n if (tabSelectionSubscription) {\n this.props.publish(tabSelectionSubscription, index)\n } else {\n this.setState({ selectedIndex: index })\n }\n }\n\n headerClicked = () => {\n var collapsed = !this.state.collapsed\n this.setState({ collapsed: collapsed })\n }\n render() {\n try {\n // \n let backgroundimage = this.props.backgroundimage\n let footertext = this.props.footertext\n let headertext = this.props.headertext\n let state = this.state\n let collapsed = this.state.collapsed\n let className = this.props.className\n\n return (\n
\n ))}\n \n )\n }\n}\nexport default BBLinkButtons\n","import './bbutil'\nimport BBIFrame from './BBIFrame'\nimport PublishUtils from '../../../helpers/PublishUtils'\n\nclass BBIFCViewer extends BBIFrame {\n constructor() {\n super()\n\n this.scrolling = 'no'\n this.noEvents = false\n\n /*this.updateMe=this.updateMe2; // no throttle\n console.log(\"noThrottle\");*/\n\n \n }\n\n static getDescription() {\n return {\n name: 'BBIFCViewer',\n component: BBIFCViewer,\n label: 'BBIFCViewer',\n variables: [\n {\n name: 'query',\n type: 'yasgui',\n label:\n ' Use ?uri ?expressID ?file. optionally ?highlight boolean . Optionally use ?color for automatic coloring.',\n },\n\n {\n name: 'publishVariable',\n type: 'text',\n label:\n 'Variabele in which an item URI is published, when a feature in the map is clicked.',\n },\n {\n name: 'subscribeVariable',\n type: 'text',\n label:\n 'Published uri variabele on which to listen to define selection.',\n },\n PublishUtils.getResetValueDef(),\n {\n name: 'className',\n type: 'text',\n label: 'iframe classNames',\n },\n {\n name: 'resetparameter',\n type: 'text',\n label: 'resets the viewer when this parameter changes (BETA)',\n },\n {\n name: 'reloadparameter',\n type: 'text',\n label: 'reloads the IFCviewer when this parameter changes for more consistent viewer behaviour',\n },\n {\n name: 'selectguidquery',\n type: 'yasgui',\n label:\n ' Use ?guid to highlight (make red) objects in the 3d viewer',\n },\n ],\n }\n }\n\n state = { selectedUri: null }\n\n shouldComponentUpdate(nprops, nstate) {\n let b = super.shouldComponentUpdate(nprops, nstate)\n try {\n let par = nprops['resetparameter']\n if (par != null) {\n let par1 = this.props.pubsub[par]\n let npar1 = nprops.pubsub[par]\n\n if (par1 !== npar1) {\n if (this.iface.resetViewer != null) {\n this.iface.resetViewer()\n }\n }\n }\n } catch (e) {}\n try {\n let par = nprops['reloadparameter']\n if (par != null) {\n let par1 = this.props.pubsub[par]\n let npar1 = nprops.pubsub[par]\n\n if (par1 !== npar1) {\n console.log(\"reload BBIFCViewer\");\n this.reload();\n return true\n }\n }\n } catch (e) {}\n\n return b\n }\n getUrl() {\n // return \"/bb/ifcviewer/index.html\";\n return '/bb/static/iframes/ifcviewer/indexBB.html'\n }\n}\n\nexport default BBIFCViewer\n","import React, { Component } from 'react'\nimport { Paper } from '@material-ui/core'\nimport Card from '@material-ui/core/Card'\n//import { makeStyles } from '@material-ui/core/styles';\nimport CardContent from '@material-ui/core/CardContent'\n\nimport styles from './BBStructuredText.module.css'\n\nimport PublishUtils from './../../../helpers/PublishUtils'\n\nexport default class BBStructuredText extends Component {\n state = {}\n static id = 0\n\n static getDescription() {\n return {\n name: 'BBStructuredText',\n component: BBStructuredText,\n label: 'BB Structured Text',\n variables: [\n {\n name: 'query',\n type: 'yasgui',\n label: 'use parameter ?header ?headerText ?content ',\n },\n {\n name: 'paperbackground',\n type: 'select',\n label: 'paper background',\n options: [\n {\n label: 'default',\n value: 'noneWhite',\n },\n {\n label: 'grey',\n value: 'bbgrey',\n },\n {\n label: 'white',\n value: 'bbwhite',\n },\n {\n label: 'default grey',\n value: 'noneGrey',\n },\n ],\n },\n {\n name: 'papercolor',\n type: 'select',\n label: 'paper color',\n options: [\n {\n label: 'default',\n value: 'noneWhite',\n },\n {\n label: 'white paper',\n value: 'bbwhitePaper',\n },\n {\n label: 'grey paper',\n value: 'bbgreyPaper',\n },\n\n {\n label: 'default grey',\n value: 'noneGrey',\n },\n ],\n },\n\n {\n name: 'cls',\n type: 'text',\n label: 'class ',\n },\n ],\n }\n }\n shouldComponentUpdate_werktniet(arg, arg2) {\n PublishUtils.emptyDataParameterChange(this, arg, arg2)\n return true\n }\n\n componentDidUpdate() {\n // console.log(\"componentDiDupdate \",this.selectedID);\n var me = this\n if (this.selectedID != null) {\n setTimeout(function () {\n const element = document.getElementById(me.selectedID)\n if (element != null) {\n element.scrollIntoView({ behavior: 'smooth' })\n }\n }, 50)\n } else {\n // reset scroll\n setTimeout(function () {\n const element = document.getElementById('begin')\n if (element != null) {\n element.scrollIntoView({ behavior: 'smooth' })\n }\n }, 50)\n }\n }\n\n render() {\n this.selectedID = null\n var de = (\n
\n {' '}\n \n
\n )\n\n let data = this.props.data\n\n if (data == null) {\n return de\n }\n if (data.results == null) {\n return de\n }\n\n let items = data.results.bindings\n var previousItem = null\n var nextPreviousItem = null\n let cls = this.props.cls\n return (\n
\n )\n })}\n \n )\n }\n\n render() {\n let project = this.props.project\n if (project.loading) return \n let viewers = project.viewers\n let { role, isAuthenticated } = this.props.me\n // viewers = orderBy(viewers, ['createdAt'], ['asc']);\n viewers = orderBy(viewers, ['title'], ['asc'])\n return (\n
\n \n {project.title}\n \n \n \n \n
\n
\n
\n {`Connected Apps van ${this.props.project.title}`}
\n {/*
Selecteer een viewer
*/}\n
\n {this.renderViewers(viewers, isAuthenticated)}\n {isAuthenticated && role !== 'viewer' && (\n
\n
\n \n \n Nieuwe app aanmaken...\n \n
\n
\n )}\n
\n
\n
\n \n
\n \n )\n }\n}\n\nconst mapStateToProps = (state) => ({\n project: state.project,\n me: state.me,\n})\n\nexport default connect(mapStateToProps)(Project)\n","import React, { Component } from 'react'\nimport { connect } from 'react-redux'\nimport './App.css'\nimport { BrowserRouter as Router, Route } from 'react-router-dom'\n//import { HashRouter as Router, Route } from 'react-router-dom';\nimport Home from './components/Home'\nimport Users from './components/Users'\nimport Login from './components/Login'\nimport Loginbb from './components/Loginbb'\nimport Project from './components/Project'\nimport Viewer from './components/Viewer'\nimport Spinner from './components/Spinner'\nimport axios from 'axios'\n\nconst ERR_INVALID_RESPONSE_WITH_SUGGESTION =\n 'Invalid response! When developing use `yarn dev`.'\n\nclass App extends Component {\n componentDidMount() {\n \n if (window.CONNECTED_APPS_STATIC) {\n \n return this.props.dispatch({\n type: 'FETCH_ME_SUCCESS',\n me: {\n isAuthenticated: false,\n },\n })\n }\n\n axios({\n method: 'get',\n url: '/api/me',\n headers: {\n Authorization: `Bearer ${localStorage.getItem('kvk-vb-token')}`,\n withCredentials: true,\n },\n })\n .then(({ data }) => {\n if (!data.me) throw new Error(ERR_INVALID_RESPONSE_WITH_SUGGESTION)\n this.props.dispatch({\n type: 'FETCH_ME_SUCCESS',\n me: data.me,\n })\n })\n .catch((error) => {\n localStorage.removeItem('kvk-vb-token')\n this.props.dispatch({\n type: 'FETCH_ME_FAILURE',\n })\n })\n }\n\n render() {\n \n try\n {\n \n if (this.props.me.loading) return \n }\n catch(e){}\n \n \n if (window.CONNECTED_APPS_STATIC)\n {\n \n return (\n \n \n \n \n \n \n \n )\n }\n \n\n return (\n \n
\n \n \n \n \n \n \n \n
\n \n )\n }\n}\n\nconst mapStateToProps = (state) => ({\n me: state.me,\n})\n\nexport default connect(mapStateToProps)(App)\n","// This optional code is used to register a service worker.\n// register() is not called by default.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on subsequent visits to a page, after all the\n// existing tabs open on the page have been closed, since previously cached\n// resources are updated in the background.\n\n// To learn more about the benefits of this model and instructions on how to\n// opt-in, read http://bit.ly/CRA-PWA\n\nconst isLocalhost = Boolean(\n window.location.hostname === 'localhost' ||\n // [::1] is the IPv6 localhost address.\n window.location.hostname === '[::1]' ||\n // 127.0.0.1/8 is considered localhost for IPv4.\n window.location.hostname.match(\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\n )\n)\n\nexport function register(config) {\n if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\n // The URL constructor is available in all browsers that support SW.\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href)\n if (publicUrl.origin !== window.location.origin) {\n // Our service worker won't work if PUBLIC_URL is on a different origin\n // from what our page is served on. This might happen if a CDN is used to\n // serve assets; see https://github.com/facebook/create-react-app/issues/2374\n return\n }\n\n window.addEventListener('load', () => {\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`\n\n if (isLocalhost) {\n // This is running on localhost. Let's check if a service worker still exists or not.\n checkValidServiceWorker(swUrl, config)\n\n // Add some additional logging to localhost, pointing developers to the\n // service worker/PWA documentation.\n navigator.serviceWorker.ready.then(() => {\n console.log(\n 'This web app is being served cache-first by a service ' +\n 'worker. To learn more, visit http://bit.ly/CRA-PWA'\n )\n })\n } else {\n // Is not localhost. Just register service worker\n registerValidSW(swUrl, config)\n }\n })\n }\n}\n\nfunction registerValidSW(swUrl, config) {\n navigator.serviceWorker\n .register(swUrl)\n .then((registration) => {\n registration.onupdatefound = () => {\n const installingWorker = registration.installing\n if (installingWorker == null) {\n return\n }\n installingWorker.onstatechange = () => {\n if (installingWorker.state === 'installed') {\n if (navigator.serviceWorker.controller) {\n // At this point, the updated precached content has been fetched,\n // but the previous service worker will still serve the older\n // content until all client tabs are closed.\n console.log(\n 'New content is available and will be used when all ' +\n 'tabs for this page are closed. See http://bit.ly/CRA-PWA.'\n )\n\n // Execute callback\n if (config && config.onUpdate) {\n config.onUpdate(registration)\n }\n } else {\n // At this point, everything has been precached.\n // It's the perfect time to display a\n // \"Content is cached for offline use.\" message.\n console.log('Content is cached for offline use.')\n\n // Execute callback\n if (config && config.onSuccess) {\n config.onSuccess(registration)\n }\n }\n }\n }\n }\n })\n .catch((error) => {\n console.error('Error during service worker registration:', error)\n })\n}\n\nfunction checkValidServiceWorker(swUrl, config) {\n // Check if the service worker can be found. If it can't reload the page.\n fetch(swUrl)\n .then((response) => {\n // Ensure service worker exists, and that we really are getting a JS file.\n const contentType = response.headers.get('content-type')\n if (\n response.status === 404 ||\n (contentType != null && contentType.indexOf('javascript') === -1)\n ) {\n // No service worker found. Probably a different app. Reload the page.\n navigator.serviceWorker.ready.then((registration) => {\n registration.unregister().then(() => {\n window.location.reload()\n })\n })\n } else {\n // Service worker found. Proceed as normal.\n registerValidSW(swUrl, config)\n }\n })\n .catch(() => {\n console.log(\n 'No internet connection found. App is running in offline mode.'\n )\n })\n}\n\nexport function unregister() {\n if ('serviceWorker' in navigator) {\n navigator.serviceWorker.ready.then((registration) => {\n registration.unregister()\n })\n }\n}\n","import React from 'react'\nimport ReactDOM from 'react-dom'\nimport { Provider } from 'react-redux'\nimport configureStore from './store'\nimport 'bootstrap/dist/css/bootstrap.min.css'\nimport './index.css'\nimport App from './App'\nimport * as serviceWorker from './serviceWorker'\n//import * as serviceWorker from './serviceWorkerRegistration'\n\nReactDOM.render(\n \n \n ,\n document.getElementById('root')\n)\n\n// If you want your app to work offline and load faster, you can change\n// unregister() to register() below. Note this comes with some pitfalls.\n// Learn more about service workers: http://bit.ly/CRA-PWA\nserviceWorker.unregister()\n//serviceWorker.register();\n","import { createStore, applyMiddleware, compose } from 'redux'\nimport thunk from 'redux-thunk'\nimport rootReducer from './redux/rootReducer'\n\nexport default function configureStore(initialState = {}) {\n const composeEnhancers =\n window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose\n return createStore(\n rootReducer,\n initialState,\n composeEnhancers(applyMiddleware(thunk))\n )\n}\n","// extracted by mini-css-extract-plugin\nmodule.exports = {\"wrapper\":\"Footer_wrapper__2rG-r\",\"main\":\"Footer_main__1l7I7\",\"names\":\"Footer_names__3Ib0-\",\"commentMessage\":\"Footer_commentMessage__3kubv\",\"email\":\"Footer_email__2GJZb\"};","import React, { Component } from 'react'\nimport styles from './Footer.module.css'\n//import logo from '../images/logo-white.svg';\nimport { withRouter } from 'react-router-dom'\n\nclass Footer extends Component {\n render() {\n //var keuze=\"normaal\";\n var keuze = 'buildingbits'\n\n try {\n if (this.props.location.pathname.includes('waternet')) {\n keuze = 'waternet'\n }\n } catch (er) {}\n try {\n if (this.props.location.pathname.includes('kvk')) {\n keuze = 'kvk'\n }\n } catch (er) {}\n try {\n if (this.props.location.pathname.includes('buildingbits')) {\n keuze = 'buildingbits'\n }\n } catch (er) {}\n try {\n if (this.props.location.pathname.includes('rws')) {\n keuze = 'buildingbits'\n }\n } catch (er) {}\n try {\n if (this.props.location.pathname.includes('connectedapps')) {\n keuze = 'buildingbits'\n }\n } catch (er) {}\n try {\n if (this.props.location.pathname.includes('mayer')) {\n keuze = 'mayer'\n }\n } catch (er) {}\n // \n return (\n
\n