diff --git a/src/css/style.css b/src/css/style.css index 2398a8b..5dfbda6 100644 --- a/src/css/style.css +++ b/src/css/style.css @@ -78,3 +78,7 @@ body, max-width: 100%; overflow-x: scroll; } + +.output-format-fieldset { + margin-top: 0; +} diff --git a/src/pages/txt-generator.jsx b/src/pages/txt-generator.jsx index 5cc617e..87e2702 100644 --- a/src/pages/txt-generator.jsx +++ b/src/pages/txt-generator.jsx @@ -10,6 +10,8 @@ import { Label, TextInput, FormGroup, + Fieldset, + Radio, } from "@trussworks/react-uswds" import Layout from "../layouts" @@ -30,6 +32,27 @@ contact-email: ${contactEmail}` ) .join("\n\n") +const metaTagOutput = (hospitals) => + hospitals + .map((hospital, idx) => { + const prefix = "og:reg:hpt" + const suffix = hospitals.length > 1 ? `:${idx + 1}` : `` + const hospitalProperties = [ + ["location-name", hospital.name], + ["source-page-url", hospital.sourcePageUrl], + ["mrf-url", hospital.mrfUrl], + ["contact-name", hospital.contactName], + ["contact-email", hospital.contactEmail], + ] + return hospitalProperties + .map( + ([prop, value]) => + `` + ) + .join("\n") + }) + .join("\n\n") + const removeIndex = (array, index) => [ ...array.slice(0, index), ...array.slice(index + 1), @@ -50,6 +73,7 @@ const TxtGenerator = () => { const [state, setState] = useState({ hospitals: [{ ...baseHospital }], downloadUrl: "", + outputFormat: "txt", }) useEffect(() => { @@ -57,14 +81,21 @@ const TxtGenerator = () => { }, []) useEffect(() => { - let blob = new Blob([txtFileOutput(state.hospitals)], { - type: "text/plain;charset=utf8", - }) + let blob + if (state.outputFormat === "txt") { + blob = new Blob([txtFileOutput(state.hospitals)], { + type: "text/plain;charset=utf8", + }) + } else if (state.outputFormat === "html") { + blob = new Blob([metaTagOutput(state.hospitals)], { + type: "text/html;charset=utf8", + }) + } setState({ ...state, downloadUrl: window.URL.createObjectURL(blob), }) - }, [state.hospitals]) + }, [state.hospitals, state.outputFormat]) const updateHospital = (index, updatedHospital) => { const hospitals = [...state.hospitals] @@ -261,12 +292,34 @@ const TxtGenerator = () => { > {alertMessages} +
{txtFileOutput(state.hospitals)}+
+ {state.outputFormat === "txt" && txtFileOutput(state.hospitals)} + {state.outputFormat === "html" && + metaTagOutput(state.hospitals)} +