diff --git a/Frontend/src/components/registerwork.jsx b/Frontend/src/components/registerwork.jsx
index c88f07bc0ba0f5d1c583c9512101446abd289549..7f0c9f5eb98f318b3d869bfe68b277f10fd60db3 100644
--- a/Frontend/src/components/registerwork.jsx
+++ b/Frontend/src/components/registerwork.jsx
@@ -31,7 +31,6 @@ const RegisterWork = () => {
//licence
const [licence, setLicence] = useState("No licence selected"); //'TODO load Licence List - inside brackets
//Speicheroptionen
-
const [visibility, setVisibility] = useState(false);
const [filename, setFilename] = useState("");
const [saveFileInFileSystem, setSaveFileInFileSystem] = useState(false);
@@ -130,7 +129,11 @@ const RegisterWork = () => {
};
return (
- <>
+ <>
+ <RegisterWorkFileUpload
+ onSetFile={onSetFile} file={file}
+ onSetFilename={onSetFilename} filename={filename}>
+ </RegisterWorkFileUpload>
<RegisterWorkInformation
onSetType={onSetType} type={type}
onSetTitle={onSetTitle} title={title}
@@ -153,22 +156,6 @@ const RegisterWork = () => {
onSetLicence={onSetLicence} licence={licence}>
</RegisterWorkLicence>
- <RegisterWorkSave
- onSetVisibility={onSetVisibility} visibility={visibility}>
- </RegisterWorkSave>
-
- {/*
- RegisterWorkFileUpload nur anzeigen wenn auch ein File hochgeladen werden muss:
- -> Fairregister Filesystem
- -> IPFS
-
- (- was passiert mit dem Namen dann? weil der wird ja auch in die Metadaten abgespeichert?)
- */}
- <RegisterWorkFileUpload
- onSetFile={onSetFile} file={file}
- onSetFilename={onSetFilename} filename={filename}>
- </RegisterWorkFileUpload>
-
<RegisterWorkConfirmation onSendRegister={onSendRegister}></RegisterWorkConfirmation>
</>
);
diff --git a/Frontend/src/components/registerwork/HelpIcon.jsx b/Frontend/src/components/registerwork/HelpIcon.jsx
index ca6433ffa5f72c1438647b29dbf6cf5046c69e97..56fcec695f3bc89d1eaa1ceadb05761feb901a0a 100644
--- a/Frontend/src/components/registerwork/HelpIcon.jsx
+++ b/Frontend/src/components/registerwork/HelpIcon.jsx
@@ -27,7 +27,7 @@ const HelpIcon = (props) => {
</svg>
</div>
<div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
- <h3 class="text-lg leading-6 font-medium text-gray-900" id="modal-title">Hilfe</h3>
+ <h3 class="text-lg leading-6 font-medium text-gray-900" id="modal-title">{props.Title} ?</h3>
<div class="mt-2">
<p class="text-sm text-gray-500">{props.Message}</p>
</div>
diff --git a/Frontend/src/components/registerwork/registerworkFileUpload.jsx b/Frontend/src/components/registerwork/registerworkFileUpload.jsx
index 700c1c0e53e53fc46b3df396b0d630a5b81e4784..8aa7fad4514554a1cfd77b29dfc068b4be85cdef 100644
--- a/Frontend/src/components/registerwork/registerworkFileUpload.jsx
+++ b/Frontend/src/components/registerwork/registerworkFileUpload.jsx
@@ -24,9 +24,9 @@ const RegisterWorkFileUpload = (props) => {
reader.readAsArrayBuffer(file)
//File upload
- setFilename(file.name)
- setFilesize(formatBytesSizeUnits(file.size))
- setFileUploaded(true)
+ setFilename(file.name);
+ setFilesize(formatBytesSizeUnits(file.size));
+ setFileUploaded(true);
})
}, [])
diff --git a/Frontend/src/components/registerwork/registerworkInformation.jsx b/Frontend/src/components/registerwork/registerworkInformation.jsx
index d8f9ababbb4e95a008eca450743b197e438ea153..55a5164d0b6ae6590f890fcfb013c4d8c1d16286 100644
--- a/Frontend/src/components/registerwork/registerworkInformation.jsx
+++ b/Frontend/src/components/registerwork/registerworkInformation.jsx
@@ -31,12 +31,15 @@ const RegisterWorkInformation = (props) => {
</h4>
{/* Worktype */}
<div>
+ <div className="inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto" >
<label
htmlFor="worktype"
className="block text-sm font-medium text-gray-700"
>
Werksart<span className="text-red-600">*</span>
</label>
+ <HelpIcon Title="Werksart" Message="Die Art des Werkes welches lizenziert werden soll"></HelpIcon>
+ </div>
<select
id="worktype"
name="worktype"
@@ -62,7 +65,7 @@ const RegisterWorkInformation = (props) => {
>
Titel<span className="text-red-600">*</span>
</label>
- <HelpIcon Message="Der Titel ist dafür da das das Werk verfügbar ist"></HelpIcon>
+ <HelpIcon Title="Title" Message="Der Titel, welcher im System angezeigt wird"></HelpIcon>
</div>
<input
id="title"
@@ -75,12 +78,15 @@ const RegisterWorkInformation = (props) => {
{/* Description */}
<div>
+ <div className="inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto" >
<label
htmlFor="description"
className="block text-sm font-medium text-gray-700"
>
- Beschreibung
+ Beschreibung<span className="text-red-600">*</span>
</label>
+ <HelpIcon Title="Beschreibung" Message="Die Beschreibung welche im System angezeigt wird"></HelpIcon>
+ </div>
<div className="mt-1">
<textarea
id="description"
@@ -99,12 +105,15 @@ const RegisterWorkInformation = (props) => {
{/* Tags (Keywords) */}
<div>
+ <div className="inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto" >
<label
htmlFor="tags"
className="block text-sm font-medium text-gray-700"
>
Tags
</label>
+ <HelpIcon Title="Tags" Message="Tags helfen dabei dein Werk im System zuzuordnen, damit es später besser gefunden werden kann"></HelpIcon>
+ </div>
<input
id="tags"
type="text"
@@ -116,15 +125,14 @@ const RegisterWorkInformation = (props) => {
{/* Language */}
<div>
- <div className="inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto" >
-
+ <div className="inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto" >
<label
htmlfor="select-language"
className="block text-sm font-medium text-gray-700"
>
Sprache
</label>
- <HelpIcon Message="
+ <HelpIcon Title="Sprache" Message="
Die Sprache welche das Werk verfügbar ist/In der das Werk beschrieben wird?
Was ist wenn es sich um ein Werk handelt ohne Sprache - bsp Bild?
- einfach option <andere> auswählen
@@ -148,12 +156,15 @@ const RegisterWorkInformation = (props) => {
{/* Creation Date */}
<div>
+ <div className="inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto" >
<label
htmlFor="date"
className="block text-sm font-medium text-gray-700"
>
Erstellungsdatum
</label>
+ <HelpIcon Title="Erstellungsdatum" Message="Wann wurde das Werk fertiggestellt "></HelpIcon>
+ </div>
<input
id="creationdate"
type="date"
@@ -171,17 +182,20 @@ const RegisterWorkInformation = (props) => {
</h4>
{/*
TODO:
- Creator Ersteller ?
+ Creator Ersteller ? wird durch UID übernommen also brauchts das Feld garnicht?
Publisher Herausgeber ?
*/}
{/* Creator */}
<div>
+ <div className="inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto" >
<label
htmlFor="creator"
className="block text-sm font-medium text-gray-700"
>
- Ersteller
+ Ersteller: Wer ist der Urheber des Werkes<span className="text-red-600">*</span>
</label>
+ <HelpIcon Title="Ersteller" Message="Registrar Ersteller Feld ? wird durch UID übernommen also brauchts das Feld garnicht? Person, die das Werk erstellt hat? oder Person, die das Werk registriert?"></HelpIcon>
+ </div>
<input
id="creator"
type="text"
@@ -193,12 +207,15 @@ const RegisterWorkInformation = (props) => {
{/* Publisher */}
<div>
+ <div className="inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto" >
<label
htmlFor="publisher"
className="block text-sm font-medium text-gray-700"
>
- Herausgeber
+ Herausgeber: Ergänzente Rechte
</label>
+ <HelpIcon Title="Herausgeber" Message="Person, die das Werk erstellt hat? "></HelpIcon>
+ </div>
<input
id="publisher"
type="text"
@@ -210,12 +227,15 @@ const RegisterWorkInformation = (props) => {
{/* Attribution" ( */}
<div>
+ <div className="inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto" >
<label
htmlFor="attribution"
className="block text-sm font-medium text-gray-700"
>
Mitwirkende
</label>
+ <HelpIcon Title="Mitwirkende" Message="Personen, die zusätzlich am Werk mitgewirkt haben"></HelpIcon>
+ </div>
<div className="mt-1">
<textarea
id="attribution"
@@ -239,12 +259,15 @@ const RegisterWorkInformation = (props) => {
{/* Identifier (ISBN, ISRC, ...) */}
<div>
+ <div className="inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto" >
<label
htmlFor="identifier"
className="block text-sm font-medium text-gray-700"
>
Identifikator
</label>
+ <HelpIcon Title="Identifikator" Message="Kennzeichen mit das Werk identifiziert werden kann, beispielsweise ISBN (International Standard Book Number) "></HelpIcon>
+ </div>
<input
id="identifier"
type="text"
@@ -253,63 +276,10 @@ const RegisterWorkInformation = (props) => {
className="mt-1 focus:ring-green-500 focus:border-green-500 block w-full shadow-sm sm:text-sm border-gray-300 rounded-md"
/>
</div>
-
- {/* Relation */}
- <div>
- <label
- htmlFor="relation"
- className="block text-sm font-medium text-gray-700"
- >
- Beziehung
- </label>
- <input
- d="relation"
- type="text"
- name="relation"
- onChange={(event)=> props.onSetRelation(event.target.value)}
- className="mt-1 focus:ring-green-500 focus:border-green-500 block w-full shadow-sm sm:text-sm border-gray-300 rounded-md"
- />
- </div>
</div>
</div>
- <div className="shadow overflow-hidden sm:rounded-md">
- <div className="px-4 py-5 bg-white space-y-6 sm:p-6">
- <h4 className="text-lg font-medium leading-6 text-gray-900">
- Weitere Lizenz-Informationen
- </h4>
- {/* License Terms */}
- <div>
- <label
- htmlFor="licenseterms"
- className="block text-sm font-medium text-gray-700"
- >
- Lizenzbedingungen
- </label>
- <div className="mt-1">
- <textarea
- id="licenseterms"
- name="licenseterms"
- onChange={(event)=> props.onSetLicenceTerms(event.target.value)}
- rows={3}
- className="shadow-sm focus:ring-green-500 focus:border-green-500 mt-1 block w-full sm:text-sm border border-gray-300 rounded-md"
- placeholder="Lizenzbedingungen"
- defaultValue={""}
- />
- <p className="mt-2 text-sm text-gray-500">
- Hier können Sie angeben, wo Ihr Werk verwendet
- werden soll oder nicht (z. B. von
- Organisationen, die die Produktion von Waffen
- unterstützen). Oder unter welchen Bedingungen
- Sie eine kommerzielle Nutzung erlauben würden.
- Dies ist jedoch nicht Teil des rechtlichen
- Lizenztextes. Dennoch wird jeder, der Ihre
- Lizenz nachschlägt, sie sehen.
- </p>
- </div>
- </div>
- </div>
- </div>
+
</div>
</div>
</div>
diff --git a/Frontend/src/components/registerwork/registerworkLicence.jsx b/Frontend/src/components/registerwork/registerworkLicence.jsx
index 9ba3666c90938493405c24761638db77ed4a0cd7..78bb8ad6c52a87fa19bf762f84654a65f74d54de 100644
--- a/Frontend/src/components/registerwork/registerworkLicence.jsx
+++ b/Frontend/src/components/registerwork/registerworkLicence.jsx
@@ -1,6 +1,7 @@
import React, { useState, useEffect } from "react";
import { getLicense, getLicenses, FullLicense, Licenses, License } from "spdx-license";
import { getAssets, getDaliccLicences } from "../../api";
+import HelpIcon from "./HelpIcon";
//TODO: https://api.dalicc.net/docs#/ -> API lässt sich nicht abfragen??
//TODO: SPDX license https://www.npmjs.com/package/spdx-license
@@ -27,8 +28,6 @@ const RegisterWorkLicence = (props) => {
},[])
-
-
const SelectLicence = (event) => {
props.onSetLicence(event.target.textarea);
setLicenceLink(event.target);
@@ -92,126 +91,7 @@ const RegisterWorkLicence = (props) => {
</p>
</div>
</fieldset>
- <div className="mt-4 space-y-4">
- <div className="flex items-center">
- <input
- id="Reproduce"
- name="Reproduce"
- type="checkbox"
- className="focus:ring-green-500 h-4 w-4 text-green-600 border-gray-300"
- />
- <label
- htmlFor="Reproduce"
- className="ml-3 block text-sm font-medium text-gray-700"
- >
- Vervielfältigen: Darf das Werk kopieren werden?
- </label>
- </div>
- </div>
- <div className="mt-4 space-y-4">
- <div className="flex items-center">
- <input
- id="Distribute"
- name="Distribute"
- type="checkbox"
- className="focus:ring-green-500 h-4 w-4 text-green-600 border-gray-300"
- />
- <label
- htmlFor="Distribute"
- className="ml-3 block text-sm font-medium text-gray-700"
- >
- Verbreiten: Darf das Werk von anderen verbreiten werden?
- </label>
- </div>
- </div>
- <div className="mt-4 space-y-4">
- <div className="flex items-center">
- <input
- id="Modify"
- name="Modify"
- type="checkbox"
- className="focus:ring-green-500 h-4 w-4 text-green-600 border-gray-300"
- />
- <label
- htmlFor="Modify"
- className="ml-3 block text-sm font-medium text-gray-700"
- >
- Ändern: Darf das Werk von anderen verändern werden?
- </label>
- </div>
- </div>
- <div className="mt-4 space-y-4">
- <div className="flex items-center">
- <input
- id="Derive"
- name="Derive"
- type="checkbox"
- className="focus:ring-green-500 h-4 w-4 text-green-600 border-gray-300"
- />
- <label
- htmlFor="Derive"
- className="ml-3 block text-sm font-medium text-gray-700"
- >
- Ableiten: Dürfen derivate des Werks unter den gleichen Bedingungen erstellt werden?
- </label>
- </div>
- </div>
- <div className="mt-4 space-y-4">
- <div className="flex items-center">
- <input
- id="CommercialUse"
- name="CommercialUse"
- type="checkbox"
- className="focus:ring-green-500 h-4 w-4 text-green-600 border-gray-300"
- />
- <label
- htmlFor="CommercialUse"
- className="ml-3 block text-sm font-medium text-gray-700"
- >
- Kommerzielle Nutzung: Darf das Werk kommerzielle genutzt werden?
- </label>
- </div>
- </div>
- <div className="mt-4 space-y-4">
- <div className="flex items-center">
- <input
- id="ChargeDistributionFee"
- name="ChargeDistributionFee"
- type="checkbox"
- className="focus:ring-green-500 h-4 w-4 text-green-600 border-gray-300"
- />
- <label
- htmlFor="ChargeDistributionFee"
- className="ml-3 block text-sm font-medium text-gray-700"
- >
- Verbreitungsgebühr erheben: Dürfen Dritte eine Vertriebsgebühr für ihr Werk erheben?
- </label>
- </div>
- </div>
- <div className="mt-4 space-y-4">
- <div className="flex items-center">
- <input
- id="ChangeLicense"
- name="ChangeLicense"
- type="checkbox"
- className="focus:ring-green-500 h-4 w-4 text-green-600 border-gray-300"
- />
- <label
- htmlFor="ChangeLicense"
- className="ml-3 block text-sm font-medium text-gray-700"
- >
- Lizenz ändern: Sollen andere die Lizenz ändern können?
- </label>
- </div>
- </div>
-
- <fieldset>
- <div>
- <p className="text-sm text-gray-500">
- oder
- </p>
- </div>
- </fieldset>
+
<fieldset>
<div>
<p className="text-sm text-gray-500">
@@ -304,27 +184,46 @@ const RegisterWorkLicence = (props) => {
</div>
</fieldset>
<fieldset>
- <div className="col-span-6">
- <legend className="text-base font-medium text-gray-900">
- Custom Lizenzen
- </legend>
- <label
- htmlFor="customlicense"
- className="block text-sm font-medium text-gray-700"
- >
- Lizenztext hier einfügen
- </label>
- <div className="mt-1">
- <textarea
- id="customlicense"
- name="customlicense"
- rows={3}
- className="shadow-sm focus:ring-green-500 focus:border-green-500 mt-1 block w-full sm:text-sm border border-gray-300 rounded-md"
- placeholder="Beschreibung einfügen"
- defaultValue={""}
- />
- </div>
- </div>
+ <div className="shadow overflow-hidden sm:rounded-md">
+ <div className="px-4 py-5 bg-white space-y-6 sm:p-6">
+ <h4 className="text-lg font-medium leading-6 text-gray-900">
+ Weitere Lizenz-Informationen
+ </h4>
+ {/* License Terms */}
+ <div>
+ <div className="inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto" >
+ <label
+ htmlFor="licenseterms"
+ className="block text-sm font-medium text-gray-700"
+ >
+ Lizenzbedingungen
+ </label>
+ <HelpIcon Title="Lizenzbedingungen" Message="Lizenzbedingungen eher ins Lizenz hinzufügen Feld - falls überhaupt gebraucht ? "></HelpIcon>
+ </div>
+ <div className="mt-1">
+ <textarea
+ id="licenseterms"
+ name="licenseterms"
+ onChange={(event)=> props.onSetLicenceTerms(event.target.value)}
+ rows={3}
+ className="shadow-sm focus:ring-green-500 focus:border-green-500 mt-1 block w-full sm:text-sm border border-gray-300 rounded-md"
+ placeholder="Lizenzbedingungen"
+ defaultValue={""}
+ />
+ <p className="mt-2 text-sm text-gray-500">
+ Hier können Sie angeben, wo Ihr Werk verwendet
+ werden soll oder nicht (z. B. von
+ Organisationen, die die Produktion von Waffen
+ unterstützen). Oder unter welchen Bedingungen
+ Sie eine kommerzielle Nutzung erlauben würden.
+ Dies ist jedoch nicht Teil des rechtlichen
+ Lizenztextes. Dennoch wird jeder, der Ihre
+ Lizenz nachschlägt, sie sehen.
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
</fieldset>
</div>
<div className="px-4 py-3 bg-gray-50 text-right sm:px-6">
diff --git a/Frontend/src/components/registerwork/registerworkSave.jsx b/Frontend/src/components/registerwork/registerworkSave.jsx
index de0b90a8204e5b5bd779f936133fc0f5cb43cc88..d9ea52074eaf9457709427376c6dd1406b0ef515 100644
--- a/Frontend/src/components/registerwork/registerworkSave.jsx
+++ b/Frontend/src/components/registerwork/registerworkSave.jsx
@@ -1,6 +1,11 @@
import React, { useState } from "react";
const RegisterWorkSave = (props) => {
+ const [selfSave, setSelfSave] = useState(true);
+ const [saveFilesystem, setSaveFilesystem] = useState(false);
+ const [saveIPFS, setSaveIPFS] = useState(false);
+
+
return (
<div className=" max-w-7xl mx-auto px-2 sm:px-6 lg:px-8 sm:my-6 lg:my-10">
<div className="mt-10 sm:mt-0">
@@ -83,11 +88,36 @@ const RegisterWorkSave = (props) => {
<p className="text-sm text-gray-500"></p>
</div>
<div className="mt-4 space-y-4">
+ <div className="flex items-center">
+ <input
+ id="filesystem-save"
+ name="filesystem-save"
+ type="checkbox"
+ checked={selfSave}
+ className="focus:ring-green-500 h-4 w-4 text-red-600 border-gray-300"
+ />
+ <label
+ htmlFor="filesystem-save"
+ className="ml-3 block text-sm font-medium text-gray-700"
+ >
+ Ich möchte für die Speicherung selbst verantwortlich sein
+ </label>
+ </div>
<div className="flex items-center">
<input
id="filesystem-save"
name="filesystem-save"
type="checkbox"
+ onClick={(event)=> {
+ const checked = event.target.checked;
+ setSaveFilesystem(checked);
+ if (checked){
+ setSelfSave(false);
+ } else if (!saveIPFS) {
+ setSelfSave(true);
+ }
+ }}
+ checked={saveFilesystem}
className="focus:ring-green-500 h-4 w-4 text-green-600 border-gray-300"
/>
<label
@@ -102,6 +132,16 @@ const RegisterWorkSave = (props) => {
id="public-save"
name="public-save"
type="checkbox"
+ onClick={(event)=> {
+ const checked = event.target.checked;
+ setSaveIPFS(checked);
+ if (checked){
+ setSelfSave(false);
+ } else if (!saveFilesystem){
+ setSelfSave(true);
+ }
+ }}
+ checked={saveIPFS}
className="focus:ring-green-500 h-4 w-4 text-green-600 border-gray-300"
/>
<label