Wikizone - Benutzerbeiträge [de]

ProcessWire - Job Template

2025-12-12T09:02:15Z

Steff:

== Links ==
[[ProcessWire - Job Modul]]

== Beispiel Setting für Jobs mit strukturierten Daten ==
Beispiel von SPPS

=== Job Template ===

==== Felder ====
<pre>
{
"job_addresscountry": {
"id": 191,
"name": "job_addresscountry",
"label": "Land",
"flags": 0,
"type": "FieldtypeText",
"textformatters": [
"TextformatterEntities"
],
"minlength": 0,
"maxlength": 2048,
"showCount": 0,
"size": 0,
"collapsed": 0,
"inputfieldClass": "",
"showIf": "",
"themeInputSize": "",
"themeInputWidth": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"themeBlank": "",
"columnWidth": 100,
"required": "",
"requiredAttr": "",
"requiredIf": "",
"stripTags": "",
"placeholder": "",
"pattern": ""
},
"job_addresslocality": {
"id": 188,
"name": "job_addresslocality",
"label": "Ort",
"flags": 0,
"type": "FieldtypeText",
"textformatters": [
"TextformatterEntities"
],
"minlength": 0,
"maxlength": 2048,
"showCount": 0,
"size": 0,
"collapsed": 0,
"inputfieldClass": "",
"showIf": "",
"themeInputSize": "",
"themeInputWidth": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"themeBlank": "",
"columnWidth": 100,
"required": "",
"requiredAttr": "",
"requiredIf": "",
"stripTags": "",
"placeholder": "",
"pattern": ""
},
"job_addressregion": {
"id": 189,
"name": "job_addressregion",
"label": "Job Region",
"flags": 0,
"type": "FieldtypeText",
"textformatters": [
"TextformatterEntities"
],
"minlength": 0,
"maxlength": 2048,
"showCount": 0,
"size": 0,
"collapsed": 0,
"inputfieldClass": "",
"showIf": "",
"themeInputSize": "",
"themeInputWidth": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"themeBlank": "",
"columnWidth": 100,
"required": "",
"requiredAttr": "",
"requiredIf": "",
"stripTags": "",
"placeholder": "",
"pattern": ""
},
"job_basesalary_maxvalue": {
"id": 185,
"name": "job_basesalary_maxvalue",
"label": "job_basesalary_maxvalue",
"flags": 0,
"type": "FieldtypeInteger",
"zeroNotEmpty": 0,
"columnWidth": 33,
"inputType": "text",
"size": 10,
"collapsed": 0,
"defaultValue": "",
"showIf": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"required": "",
"requiredIf": "",
"min": "",
"max": ""
},
"job_basesalary_minvalue": {
"id": 184,
"name": "job_basesalary_minvalue",
"label": "job_basesalary_minvalue",
"flags": 0,
"type": "FieldtypeInteger",
"zeroNotEmpty": 0,
"collapsed": 0,
"columnWidth": 33,
"inputType": "text",
"size": 10,
"defaultValue": "",
"showIf": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"required": "",
"requiredIf": "",
"min": "",
"max": ""
},
"job_basesalary_unittext": {
"id": 186,
"name": "job_basesalary_unittext",
"label": "Bezahlung pro",
"flags": 0,
"type": "FieldtypeOptions",
"inputfieldClass": "InputfieldSelect",
"collapsed": 0,
"columnWidth": 33,
"initValue": "",
"showIf": "",
"themeInputSize": "",
"themeInputWidth": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"required": "",
"requiredIf": "",
"defaultValue": "",
"export_options": {
"default": "1=MONTH|Monat\n2=YEAR|Jahr\n3=HOUR|Stunde\n4=WEEK|Woche\n5=DAY|Tag"
}
},
"job_dateposted": {
"id": 179,
"name": "job_dateposted",
"label": "Job Datum",
"flags": 0,
"type": "FieldtypeDatetime",
"collapsed": 0,
"inputType": "text",
"htmlType": "date",
"dateSelectFormat": "yMd",
"yearFrom": 1922,
"yearTo": 2042,
"yearLock": 0,
"datepicker": 3,
"timeInputSelect": 0,
"dateInputFormat": "Y-m-d",
"size": 25,
"columnWidth": 25,
"notes": "Datum des Postings",
"defaultToday": 1,
"dateOutputFormat": "",
"showIf": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"required": "",
"requiredAttr": "",
"requiredIf": "",
"dateMin": "",
"dateMax": "",
"timeStep": "",
"timeMin": "",
"timeMax": "",
"timeInputFormat": "",
"placeholder": "",
"yearRange": ""
},
"job_description": {
"id": 181,
"name": "job_description",
"label": "job_description",
"flags": 0,
"type": "FieldtypeTextareaLanguage",
"inputfieldClass": "InputfieldCKEditor",
"contentType": 1,
"minlength": 0,
"maxlength": 0,
"showCount": 0,
"rows": 5,
"textformatters": [
"TextformatterHannaCode"
],
"htmlOptions": [
2,
4,
16
],
"langBlankInherit": 0,
"collapsed": 0,
"toolbar": "Format, Styles, -, Bold, Italic, -, RemoveFormat\nNumberedList, BulletedList, -, Blockquote\nPWLink, Unlink, Anchor\nPWImage, Table, HorizontalRule, SpecialChar\nPasteText, PasteFromWord\nScayt, -, Sourcedialog\nJustifyCenter, JustifyLeft, JustifyRight",
"inlineMode": 0,
"useACF": 1,
"usePurifier": 1,
"formatTags": "p;h1;h2;h3;h4;h5;h6;pre;address",
"contentsCss": "/site/templates/modules/InputfieldCKEditor/contents.css",
"stylesSet": "customstyles:/site/templates/modules/InputfieldCKEditor/mystyles.js",
"extraPlugins": [
"pwimage",
"pwlink",
"sourcedialog"
],
"removePlugins": "image,magicline",
"showIf": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"columnWidth": 100,
"required": "",
"requiredAttr": "",
"requiredIf": "",
"imageFields": "",
"toggles": "",
"extraAllowedContent": "",
"contentsInlineCss": "",
"customOptions": "",
"plugin_sourcedialog": ""
},
"job_employmenttype": {
"id": 192,
"name": "job_employmenttype",
"label": "Art der Anstellung",
"flags": 0,
"type": "FieldtypeOptions",
"inputfieldClass": "InputfieldSelect",
"collapsed": 0,
"initValue": "",
"showIf": "",
"themeInputSize": "",
"themeInputWidth": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"columnWidth": 100,
"required": "",
"requiredIf": "",
"defaultValue": "",
"export_options": {
"default": "1=FULL_TIME|Vollzeit\n2=PART_TIME|Teilzeit\n3=CONTRACTOR|Vertrag\n4=TEMPORARY|Zeitarbeit\n5=INTERN|Internship (Trainee etc.)\n6=VOLUNTEER|Volontariat\n7=PER_DIEM|Per diem\n8=OTHER|Andere"
}
},
"job_link": {
"id": 178,
"name": "job_link",
"label": "Link zum Jobangebot",
"flags": 0,
"type": "FieldtypeURL",
"textformatters": [
"TextformatterEntities"
],
"noRelative": 0,
"allowIDN": 0,
"allowQuotes": 0,
"addRoot": 0,
"collapsed": 0,
"minlength": 0,
"maxlength": 1024,
"showCount": 0,
"size": 0,
"showIf": "",
"themeInputSize": "",
"themeInputWidth": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"themeBlank": "",
"columnWidth": 100,
"required": "",
"requiredAttr": "",
"requiredIf": "",
"placeholder": "",
"pattern": ""
},
"job_logo": {
"id": 183,
"name": "job_logo",
"label": "Logo",
"flags": 0,
"type": "FieldtypeImage",
"fileSchema": 270,
"textformatters": [
"TextformatterEntities"
],
"extensions": "gif jpg jpeg png",
"maxFiles": 0,
"outputFormat": 2,
"descriptionRows": 1,
"useTags": 0,
"gridMode": "grid",
"focusMode": "on",
"resizeServer": 0,
"clientQuality": 90,
"maxReject": "",
"dimensionsByAspectRatio": "",
"defaultValuePage": "",
"inputfieldClass": "InputfieldImage",
"notes": "optional",
"collapsed": 0,
"outputString": "",
"noLang": "",
"entityEncode": "",
"tagsList": "",
"showIf": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"columnWidth": 100,
"required": "",
"requiredIf": "",
"unzip": "",
"overwrite": "",
"maxWidth": "",
"maxHeight": "",
"maxSize": "",
"minWidth": "",
"minHeight": "",
"aspect_ratios": ""
},
"job_organizationname": {
"id": 193,
"name": "job_organizationname",
"label": "Name der Organisation",
"flags": 0,
"type": "FieldtypeOptions",
"inputfieldClass": "InputfieldSelect",
"collapsed": 0,
"initValue": "",
"showIf": "",
"themeInputSize": "",
"themeInputWidth": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"columnWidth": 100,
"required": "",
"requiredIf": "",
"defaultValue": "",
"export_options": {
"default": "1=intensiv|SPPS Karlsruhe Intensiv\n2=karlsruhe|SPPS Karlsruhe\n3=rastatt|SPPS Ötigheim/Rastatt\n4=pforzheim|SPPS Pforzheim\n5=rheinhausen|SPPS Rheinhausen-Oberhausen\n6=tagespflege|Tagespflege Etje"
}
},
"job_organizationname_old": {
"id": 182,
"name": "job_organizationname_old",
"label": "Name der Organisation",
"flags": 0,
"type": "FieldtypeText",
"collapsed": 0,
"minlength": 0,
"maxlength": 2048,
"showCount": 0,
"size": 0,
"textformatters": "",
"inputfieldClass": "",
"showIf": "",
"themeInputSize": "",
"themeInputWidth": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"themeBlank": "",
"columnWidth": 100,
"required": "",
"requiredAttr": "",
"requiredIf": "",
"stripTags": "",
"placeholder": "",
"pattern": ""
},
"job_postalcode": {
"id": 190,
"name": "job_postalcode",
"label": "PLZ",
"flags": 0,
"type": "FieldtypeText",
"textformatters": [
"TextformatterEntities"
],
"minlength": 0,
"maxlength": 2048,
"showCount": 0,
"size": 0,
"collapsed": 0,
"inputfieldClass": "",
"showIf": "",
"themeInputSize": "",
"themeInputWidth": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"themeBlank": "",
"columnWidth": 100,
"required": "",
"requiredAttr": "",
"requiredIf": "",
"stripTags": "",
"placeholder": "",
"pattern": ""
},
"job_streetaddress": {
"id": 187,
"name": "job_streetaddress",
"label": "Adresse",
"flags": 0,
"type": "FieldtypeText",
"textformatters": [
"TextformatterEntities"
],
"collapsed": 0,
"minlength": 0,
"maxlength": 2048,
"showCount": 0,
"size": 0,
"inputfieldClass": "",
"showIf": "",
"themeInputSize": "",
"themeInputWidth": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"themeBlank": "",
"columnWidth": 100,
"required": "",
"requiredAttr": "",
"requiredIf": "",
"stripTags": "",
"placeholder": "",
"pattern": ""
},
"job_validthrough": {
"id": 180,
"name": "job_validthrough",
"label": "Gültig bis",
"flags": 0,
"type": "FieldtypeDatetime",
"inputType": "text",
"htmlType": "date",
"dateSelectFormat": "yMd",
"yearFrom": 1922,
"yearTo": 2042,
"yearLock": 0,
"datepicker": 3,
"timeInputSelect": 0,
"dateInputFormat": "Y-m-d",
"size": 25,
"columnWidth": 25,
"collapsed": 0,
"dateOutputFormat": "",
"showIf": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"required": "",
"requiredAttr": "",
"requiredIf": "",
"dateMin": "",
"dateMax": "",
"timeStep": "",
"timeMin": "",
"timeMax": "",
"timeInputFormat": "",
"placeholder": "",
"yearRange": "",
"defaultToday": ""
}
}
</pre>
Options für:

'''job_basesalary_unittext'''
<pre>
1=MONTH|Monat
2=YEAR|Jahr
3=HOUR|Stunde
4=WEEK|Woche
5=DAY|Tag
</pre>

'''job_employmenttype'''
<pre>
1=FULL_TIME|Vollzeit
2=PART_TIME|Teilzeit
3=CONTRACTOR|Vertrag
4=TEMPORARY|Zeitarbeit
5=INTERN|Internship (Trainee etc.)
6=VOLUNTEER|Volontariat
7=PER_DIEM|Per diem
8=OTHER|Andere
</pre>

'''job_organizationname'''
<pre>
kann genutzt werden wenn man mehrere Organisationen hat
</pre>

'''Job Fieldset Page'''

Das Feld fasst die anderen Felder in eines zusammen. So kann man sie einfacher handeln.
<pre>
{
"job": {
"id": 177,
"name": "job",
"label": "Job",
"flags": 0,
"type": "FieldtypeFieldsetPage",
"notes": "Daten für ein Jobposting",
"icon": "wrench",
"template_id": 0,
"parent_id": 0,
"repeaterLoading": 2,
"repeaterMaxItems": 1,
"repeaterMinItems": 1,
"collapsed": 0,
"repeaterFields": [
"job_dateposted",
"job_validthrough",
"job_organizationname",
"job_description",
"job_basesalary_minvalue",
"job_basesalary_maxvalue",
"job_basesalary_unittext",
"job_streetaddress",
"job_postalcode",
"job_addresslocality",
"job_addressregion",
"job_addresscountry",
"job_employmenttype",
"job_link",
"job_logo"
],
"showIf": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"columnWidth": 100,
"required": "",
"requiredIf": "",
"fieldContexts": {
"job_dateposted": {
"icon": "calendar",
"notes": "Datum des Postings. Wenn leer wird das Erstelldatum dieser Seite verwendet."
},
"job_validthrough": {
"icon": "calendar",
"notes": "Empfohlen. Unbefristet für manche Berufsgruppen erlaubt (z.B. Bedienungen)"
},
"job_organizationname": [],
"job_description": [],
"job_basesalary_minvalue": [],
"job_basesalary_maxvalue": [],
"job_basesalary_unittext": [],
"job_streetaddress": [],
"job_postalcode": [],
"job_addresslocality": [],
"job_addressregion": [],
"job_addresscountry": [],
"job_employmenttype": [],
"job_link": {
"notes": "Wenn leer wird diese Seite genutzt."
},
"job_logo": []
}
}
}
</pre>

==== Templates Import ====
Import Daten (Zulässige Kind/Elternseiten von Hand nachtragen)
<pre>
{
"job": {
"id": 53,
"name": "job",
"fieldgroups_id": "job",
"flags": 0,
"cache_time": 0,
"useRoles": 1,
"editRoles": [],
"addRoles": [],
"createRoles": [],
"rolesPermissions": [],
"noInherit": 0,
"childrenTemplatesID": 0,
"sortfield": "",
"noChildren": 1,
"noParents": "",
"childTemplates": [],
"parentTemplates": [
"jobs"
],
"allowPageNum": 0,
"allowChangeUser": 0,
"redirectLogin": 0,
"urlSegments": 0,
"https": 0,
"slashUrls": 1,
"slashPageNum": 0,
"slashUrlSegments": 0,
"altFilename": "",
"guestSearchable": 0,
"pageClass": "",
"childNameFormat": "",
"pageLabelField": "fa-user-circle-o title",
"noGlobal": 0,
"noMove": 0,
"noTrash": 0,
"noSettings": 0,
"noChangeTemplate": 0,
"noShortcut": 0,
"noUnpublish": 0,
"noLang": 0,
"compile": 3,
"nameContentTab": 0,
"noCacheGetVars": "",
"noCachePostVars": "",
"useCacheForUsers": 0,
"cacheExpire": 0,
"cacheExpirePages": [],
"cacheExpireSelector": "",
"label": "Stellenangebot",
"tags": "",
"titleNames": 0,
"noPrependTemplateFile": 0,
"noAppendTemplateFile": 0,
"prependFile": "",
"appendFile": "",
"pagefileSecure": 0,
"tabContent": "",
"tabChildren": "",
"nameLabel": "",
"contentType": "",
"errorAction": 0,
"connectedFieldID": null,
"ns": "ProcessWire",
"_exportMode": true,
"roles": [
"guest"
],
"fieldgroupFields": [
"title",
"layout_blocks",
"job"
],
"fieldgroupContexts": {
"title": [],
"layout_blocks": [],
"job": []
}
},
"jobs": {
"id": 55,
"name": "jobs",
"fieldgroups_id": "jobs",
"flags": 0,
"cache_time": 0,
"useRoles": 1,
"editRoles": [],
"addRoles": [],
"createRoles": [],
"rolesPermissions": [],
"noInherit": 0,
"childrenTemplatesID": 0,
"sortfield": "",
"noChildren": "",
"noParents": -1,
"childTemplates": [
"job"
],
"parentTemplates": [],
"allowPageNum": 1,
"allowChangeUser": 0,
"redirectLogin": 0,
"urlSegments": 0,
"https": 0,
"slashUrls": 1,
"slashPageNum": 0,
"slashUrlSegments": 0,
"altFilename": "",
"guestSearchable": 0,
"pageClass": "",
"childNameFormat": "",
"pageLabelField": "fa-users title",
"noGlobal": 0,
"noMove": 0,
"noTrash": 0,
"noSettings": 0,
"noChangeTemplate": 0,
"noShortcut": 0,
"noUnpublish": 0,
"noLang": 0,
"compile": 3,
"nameContentTab": 0,
"noCacheGetVars": "",
"noCachePostVars": "",
"useCacheForUsers": 0,
"cacheExpire": 0,
"cacheExpirePages": [],
"cacheExpireSelector": "",
"label": "Stellenangebote",
"tags": "",
"titleNames": 0,
"noPrependTemplateFile": 0,
"noAppendTemplateFile": 0,
"prependFile": "",
"appendFile": "",
"pagefileSecure": 0,
"tabContent": "",
"tabChildren": "",
"nameLabel": "",
"contentType": "",
"errorAction": 0,
"connectedFieldID": null,
"ns": "ProcessWire",
"_exportMode": true,
"roles": [
"guest"
],
"fieldgroupFields": [
"title",
"layout_blocks",
"images",
"files",
"menu"
],
"fieldgroupContexts": {
"title": [],
"layout_blocks": [],
"images": [],
"files": [],
"menu": []
}
}
}
</pre>

=== Template Jobs ===
Todo besser als Layout-Block
<syntaxhighlight lang="php">
// JOBLIST
$joblist = '';
$jobs = pages('template=job,sort=-published');
foreach ($jobs as $item) {
$joblist .= '<li class="joblist-item"><a href="'.$item->url.'">'.$item->title.' ('.$item->job->job_organizationname->title.')</a></div>';
}
$joblist = '<ul class="joblist">'.$joblist.'</ul>';
</syntaxhighlight>
=== Template Job ===
Benötigt im Admin Bereich nur das job Feld. In diesem sind alle anderen benötigten Felder bereits enthalten.

<syntaxhighlight lang="php">
<?php namespace ProcessWire;
include_once('includes/SchemaHelper.php');
$sh = new SchemaHelper;
$jsonld = $sh->jsonldJobPosting($page);

// BEWERBUNGSFORMULAR WENN GEWÜNSCHT
$contact = $forms->render('bewerbung');

ob_start();
?>

<div class="container">
<div id="apply">
<h1><?=$page->title?></h1>
<div class="job-description">
<?=$page->job->job_description?>
</div>
<div class="">Arbeitgeber</div>
<?=$page->job->job_organizationname->title?><br>
<?=$page->link?>
</div>
<div class="font-heavy">Arbeitsort</div>
<?=$page->job->job_streetaddress?><br>
<?=$page->job->job_postalcode?> <?=$page->job->job_addresslocality?>
</div>
<?php if ($page->job->job_basesalary_minvalue && $page->job->job_basesalary_maxvalue && $page->job->job_basesalary_unittext): ?>
<div class="font-heavy">Vergütung</div>
<div><?=$page->job->job_basesalary_minvalue?>€ - <?=$page->job->job_basesalary_maxvalue?>€ <?=$page->job->job_basesalary_unittext->title?></div>
<?php elseif($page->job->job_basesalary_minvalue && $page->job->job_basesalary_unittext): ?>
<div class="font-heavy">Vergütung</div>
<div><?=$page->job->job_basesalary_minvalue?>€ <?=$page->unit->title?></div>
<?php endif ?>
<div class="font-heavy pt-20">Art der Anstellung</div>
<div class="pb-30"><?=$page->job->job_employmenttype->title?></div>
</div>

<div id="apply-form" class="">
<h2>Bewerbung</h2>
<div><?= $contact ?></div>
</div>

<?=$jsonld?>
</div>
<?php

$content = ob_get_clean();
</syntaxhighlight>

=== Bewerbungsformular ===
<pre>
{
"required": false,
"columnWidth": 0,
"roles": {
"form-submit": [
"guest"
],
"form-list": [],
"form-edit": [],
"form-delete": [],
"entries-list": [],
"entries-edit": [],
"entries-delete": [],
"entries-page": [],
"entries-resend": []
},
"flags": 256,
"pluginActions": [],
"framework": "Uikit3",
"allowPreset": 0,
"skipSessionKey": 0,
"useCookies": 0,
"partialEntryDays": 14,
"spamEntryDays": 7,
"submitText": "Absenden",
"successMessage": "Vielen Dank - Ihre Bewerbung wurde versendet.",
"errorMessage": "Ein Fehler ist aufgetreten. Bitte überprüfen Sie Ihre Eingaben.",
"mobilePx": 0,
"frBasic_noLoad": [],
"frBasic_cssURL": "/site/modules/FormBuilder/frameworks/basic/main.css",
"frBasic_itemContent": [
"description",
"out",
"error",
"notes"
],
"spamFlags": 0,
"listFields": [],
"entryDays": 0,
"emailSubject": "Bewerbungsformular auf salus-klinik.de",
"responderSubject": "Auto-Response",
"saveFlags": 35,
"spamWords": [],
"honeypot": "name_1",
"emailTo": "post@stephanschlegel.de",
"frUikit3_noLoad": [
"framework",
"jquery",
"jqueryui"
],
"frUikit3_ukURL": "/site/modules/FormBuilder/frameworks/uikit3/",
"frUikit3_css": "uikit.min.css",
"frUikit3_horizontal": "0",
"frUikit3_inlineErrorBelow": "1",
"frUikit3_horizHeaderWidth": 30,
"frUikit3_buttonType": "primary",
"children": {
"name_1": {
"type": "Text",
"label": "Name",
"required": false,
"columnWidth": 0,
"collapsed": "0",
"minlength": 0,
"maxlength": 2048,
"showCount": "0",
"size": 0
},
"name_2": {
"type": "Text",
"label": "Name",
"required": 1,
"columnWidth": 0,
"collapsed": "0",
"minlength": 0,
"maxlength": 2048,
"showCount": "0",
"size": 0
},
"e_mail": {
"type": "Email",
"label": "E-Mail",
"required": 1,
"columnWidth": 0,
"collapsed": "0",
"minlength": 0,
"maxlength": 250,
"showCount": "0",
"size": 0
},
"telefon": {
"type": "Text",
"label": "Telefon",
"required": 1,
"columnWidth": 0,
"collapsed": "0",
"minlength": 0,
"maxlength": 2048,
"showCount": "0",
"size": 0
},
"bewerbungsunterlagen": {
"type": "FormBuilderFile",
"label": "Bewerbungsunterlagen",
"notes": "Maximal 3 Dateien á 5MB",
"required": false,
"columnWidth": 0,
"collapsed": "0",
"extensions": "pdf doc docx xls xlsx gif jpg jpeg png",
"maxFiles": 3,
"maxFileSize": 5242880
}
}
}
</pre>
=== Layout Block - Job-Liste ===
Beispiel Salus
<syntaxhighlight lang="php">
<?php namespace ProcessWire;
$sectionClasses = array($page->_type);
$containerClasses = array('ani section');
if($page->bg && $page->bg->value) {
$colorClassBorder = $page->bg->value;
$colorClassContent = $page->bg->value;
}
else {
$colorClassBorder = 'bc1';
$colorClassContent = 'bc1';
}

$out = '';
$jobsMarkup = '';
$jobsAccordion = new Box;
$jobs = pages('template=job,sort=-published');
foreach ($jobs as $item) {

$jobsMarkup .= '
<li class="bc1 joblist-item">
<a class="uk-accordion-title uk-padding-small" href="#">
'.$item->title.'
</a>
<div class="uk-accordion-content uk-padding-small nmt npt">
<p><strong>'.$item->job->job_organizationname->title.'</strong></p>
<p><strong>Arbeitsort:</strong> '.$item->job->job_addresslocality.'<br>
<strong>Art der Anstellung: </strong>'.$item->job->job_employmenttype->title.'</p>
<p><a class="uk-button uk-button-primary" href="'.$item->url.'">Zur Stellenbeschreibung</a></p>
</div>
</li>
';
}

$jobsAccordion->addClasses('accordion uk-accordion nmb');
$jobsAccordion->addAttributes('uk-accordion=""'); // i.e. active:0
$out .= $jobsAccordion->wrap($jobsMarkup,'ul');

// RANDSPALTE?
$out = '
<div class="uk-grid uk-grid-collapse uk-grid-match" uk-grid>
<div class="uk-visible@m uk-width-1-5 '.$colorClassBorder.'">
<div class="uk-padding-small">
</div>
</div>

<div class="uk-width-expand@m">
<div class="uk-padding npt npb npr">
'.renderHeadline($page).'
'. $out .'
</div>
</div>
</div>
';
//$out = renderContainer($page,$out,$containerClasses);
$out = renderSection($page,$out,$sectionClasses,array('skipDefaultClasses'=>false));
return $out;

</syntaxhighlight>

==== Bewerberformular vorausfüllen mit verschiedenen Ansprechpartnern ====
Das Formular soll versendet werden mit
- Titel der Stellenanzeige (nicht veränderbar)
- Name der Einrichtung (nicht veränderbar)
- an verschiedene E-Mail Adressen, je nach Einrichtung für die die Stellenanzeige gilt.

ready.php
<syntaxhighlight lang="php">
<?php namespace ProcessWire;

if(!defined("PROCESSWIRE")) die();

$emailList = array(
'intensiv' => 'intensiv@sp-ps.de',
'karlsruhe' => 'info@sp-ps.de',
'rastatt' => 'oetigheim@sp-ps.de',
'pforzheim' => 'info-pf@sp-ps.de',
'rheinhausen' => 'info-oh@sp-ps.de',
'tagespflege' => 'oetigheim@sp-ps.de',
);

// HOOKS FÜR BEWERBUNG IM JOBTEMPLATE
if($page->template->name=='job'){
$formname = 'schnellkontakt';
// E-Mails (Wert aus Template 'job' Feld: job_organizationname => Mailadresse)
$organization = $page->job->job_organizationname->title;
$organizationName = $page->job->job_organizationname->value;
$jobtitle = $page->title;

$wire->addHookBefore('FormBuilderProcessor::renderReady',
function($event) use($organization, $jobtitle, $formname) {

$form = $event->arguments(0);
if($form->name !== $formname) return;
$form->getChildByName('ich_bewerbe_mich_fur_folgende_einrichtung')
->val($organization)
->attr('disabled', 'disabled');
$form->getChildByName('ich_bewerbe_mich_als')
->val($jobtitle)
->attr('disabled', 'disabled');
}
);
// nach dem übermitteln der eingaben (user kann nichts mehr ändern)
$wire->addHook('FormBuilderProcessor::processInputDone',
function($event) use($organization, $jobtitle, $formname) {
$form = $event->arguments(0);
if($form->name !== $formname) return;
$form->getChildByName('ich_bewerbe_mich_fur_folgende_einrichtung')->val($organization);
$form->getChildByName('ich_bewerbe_mich_als')->val($jobtitle);
}
);
// change email based on job
$wire->addHookBefore('FormBuilderProcessor::emailForm',
function($event) use($organizationName, $emailList, $formname) {
$processor = $event->object;
if($processor->formName != $formname) return;
if(array_key_exists($organizationName,$emailList)){
$processor->emailTo = $emailList[$organizationName]; // tell FormBuilder to use that email
}
}
);
}else{
// HOOKS FÜR INITIATIVBEWERBUNG
// change email based on job
$wire->addHookBefore('FormBuilderProcessor::emailForm',
function($event) use($emailList) {
$processor = $event->object;
if($processor->formName != 'initiativbewerbung') return;
$form = $event->arguments(0);
$name = $form->getChildByName('ich_bewerbe_mich_fur_folgende_einrichtung')->val();
if(array_key_exists($name,$emailList)){
$processor->emailTo = $emailList[$name]; // tell FormBuilder to use that email
}
}
);
}

</syntaxhighlight>

=== Funktionalität ===
==== SchemaHelper ====
Für Erzeugung der Strukturierten Daten

<syntaxhighlight lang="php">
<?php namespace ProcessWire;
/**
* SchemaHelper
* Class for structured data
* V1.0
*/
// @todo outsource some of the nessecary types (i.e. place) in backend use
// fieldgroups for that maybe s.th. like $place = getFg('schema_place')
class SchemaHelper{
// Load the requested schema from the schemas directory and register the class
public function jsonldJobPosting ($p) {
$jsonld = array();
$sanitizer = wire('sanitizer');
//set unset fields (for not mandatory fields)
$p->job->job_validthrough = $p->job->job_validthrough ? : ''; // todo test

$jsonld["@context"] = "http://schema.org/";
$jsonld["@type"] = "JobPosting";
if($p->job->job_link) $jsonld["url"] = $p->job->job_link;
else $jsonld["url"] = $sanitizer->url($p->httpUrl);
$jsonld["datePosted"] = !empty($p->job->job_dateposted) ? date('Y-m-d', $p->job->getUnformatted('job_dateposted') ) : date('Y-m-d', strtotime($p->created));
$jsonld["validThrough"] = date('Y-m-d', $p->job->getUnformatted('job_validthrough') );
$jsonld["description"] = $sanitizer->textarea($p->job->job_description);
$jsonld['hiringOrganization'] = array(
"@type" => "Organization",
"name" => $sanitizer->text($p->job->job_organizationname->title),
"sameAs" => $sanitizer->url($p->job->job_link)
);
if($p->job->link2)$jsonld['hiringOrganization']['logo'] = $p->job->link2;
$jsonld['title'] = $sanitizer->text($p->title);

if($p->job->job_basesalary_minvalue && $p->job->job_basesalary_maxvalue && $p->job->job_basesalary_unittext){
$jsonld['baseSalary'] = array(
"@type" => "MonetaryAmount",
"currency" => "EUR",
"value" => array(
"@type" => "QuantitativeValue",
"minValue" => $sanitizer->float($p->job->job_basesalary_minvalue),
"maxValue" => $sanitizer->float($p->job->job_basesalary_maxvalue),
"unitText" => $sanitizer->text($p->job->job_basesalary_unittext->value)
)
);
}else if($p->job->job_basesalary_minvalue && $p->job->job_basesalary_unittext){
$jsonld['baseSalary'] = array(
"@type" => "MonetaryAmount",
"currency" => "EUR",
"value" => array(
"@type" => "QuantitativeValue",
"value" => $sanitizer->float($p->job->job_basesalary_minvalue),
"unitText" => $sanitizer->text($p->job->job_basesalary_unittext->value)
)
);
}
$jsonld['jobLocation'] = array(
"@type" => "Place",
"address" => array(
"@type" => "PostalAddress",
"streetAddress" => $sanitizer->text($p->job->job_streetaddress),
"addressLocality" => $sanitizer->text($p->job->job_addresslocality),
"addressRegion" => $sanitizer->text($p->job->job_addressregion),
"postalCode" => $sanitizer->text($p->job->job_postalcode),
"addressCountry" => $sanitizer->text($p->job->job_addresscountry),
)
);
// recommended properties

if($c = count($p->job->job_employmenttype)){
$types = array();
foreach($p->job->job_employmenttype as $type){
$types[] = $sanitizer->text($type->value);
}
//var_dump($c);
if($c > 1) $jsonld['employmentType'] = $types;
else $jsonld['employmentType'] = $types[0];
}

//$out .= '<script type="application/ld+json">' . json_encode($jsonld) . '</script>';
$out = '<script type="application/ld+json">' . json_encode($jsonld,JSON_PRETTY_PRINT) . '</script>';

return $out;
}

}

</syntaxhighlight>

ProcessWire - Job Template

2025-12-12T08:41:09Z

Steff:

== Links ==
[[ProcessWire - Job Modul]]

== Beispiel Setting für Jobs mit strukturierten Daten ==
Beispiel von SPPS

=== Job Template ===

==== Felder ====
<pre>
{
"job_addresscountry": {
"id": 191,
"name": "job_addresscountry",
"label": "Land",
"flags": 0,
"type": "FieldtypeText",
"textformatters": [
"TextformatterEntities"
],
"minlength": 0,
"maxlength": 2048,
"showCount": 0,
"size": 0,
"collapsed": 0,
"inputfieldClass": "",
"showIf": "",
"themeInputSize": "",
"themeInputWidth": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"themeBlank": "",
"columnWidth": 100,
"required": "",
"requiredAttr": "",
"requiredIf": "",
"stripTags": "",
"placeholder": "",
"pattern": ""
},
"job_addresslocality": {
"id": 188,
"name": "job_addresslocality",
"label": "Ort",
"flags": 0,
"type": "FieldtypeText",
"textformatters": [
"TextformatterEntities"
],
"minlength": 0,
"maxlength": 2048,
"showCount": 0,
"size": 0,
"collapsed": 0,
"inputfieldClass": "",
"showIf": "",
"themeInputSize": "",
"themeInputWidth": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"themeBlank": "",
"columnWidth": 100,
"required": "",
"requiredAttr": "",
"requiredIf": "",
"stripTags": "",
"placeholder": "",
"pattern": ""
},
"job_addressregion": {
"id": 189,
"name": "job_addressregion",
"label": "Job Region",
"flags": 0,
"type": "FieldtypeText",
"textformatters": [
"TextformatterEntities"
],
"minlength": 0,
"maxlength": 2048,
"showCount": 0,
"size": 0,
"collapsed": 0,
"inputfieldClass": "",
"showIf": "",
"themeInputSize": "",
"themeInputWidth": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"themeBlank": "",
"columnWidth": 100,
"required": "",
"requiredAttr": "",
"requiredIf": "",
"stripTags": "",
"placeholder": "",
"pattern": ""
},
"job_basesalary_maxvalue": {
"id": 185,
"name": "job_basesalary_maxvalue",
"label": "job_basesalary_maxvalue",
"flags": 0,
"type": "FieldtypeInteger",
"zeroNotEmpty": 0,
"columnWidth": 33,
"inputType": "text",
"size": 10,
"collapsed": 0,
"defaultValue": "",
"showIf": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"required": "",
"requiredIf": "",
"min": "",
"max": ""
},
"job_basesalary_minvalue": {
"id": 184,
"name": "job_basesalary_minvalue",
"label": "job_basesalary_minvalue",
"flags": 0,
"type": "FieldtypeInteger",
"zeroNotEmpty": 0,
"collapsed": 0,
"columnWidth": 33,
"inputType": "text",
"size": 10,
"defaultValue": "",
"showIf": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"required": "",
"requiredIf": "",
"min": "",
"max": ""
},
"job_basesalary_unittext": {
"id": 186,
"name": "job_basesalary_unittext",
"label": "Bezahlung pro",
"flags": 0,
"type": "FieldtypeOptions",
"inputfieldClass": "InputfieldSelect",
"collapsed": 0,
"columnWidth": 33,
"initValue": "",
"showIf": "",
"themeInputSize": "",
"themeInputWidth": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"required": "",
"requiredIf": "",
"defaultValue": "",
"export_options": {
"default": "1=MONTH|Monat\n2=YEAR|Jahr\n3=HOUR|Stunde\n4=WEEK|Woche\n5=DAY|Tag"
}
},
"job_dateposted": {
"id": 179,
"name": "job_dateposted",
"label": "Job Datum",
"flags": 0,
"type": "FieldtypeDatetime",
"collapsed": 0,
"inputType": "text",
"htmlType": "date",
"dateSelectFormat": "yMd",
"yearFrom": 1922,
"yearTo": 2042,
"yearLock": 0,
"datepicker": 3,
"timeInputSelect": 0,
"dateInputFormat": "Y-m-d",
"size": 25,
"columnWidth": 25,
"notes": "Datum des Postings",
"defaultToday": 1,
"dateOutputFormat": "",
"showIf": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"required": "",
"requiredAttr": "",
"requiredIf": "",
"dateMin": "",
"dateMax": "",
"timeStep": "",
"timeMin": "",
"timeMax": "",
"timeInputFormat": "",
"placeholder": "",
"yearRange": ""
},
"job_description": {
"id": 181,
"name": "job_description",
"label": "job_description",
"flags": 0,
"type": "FieldtypeTextareaLanguage",
"inputfieldClass": "InputfieldCKEditor",
"contentType": 1,
"minlength": 0,
"maxlength": 0,
"showCount": 0,
"rows": 5,
"textformatters": [
"TextformatterHannaCode"
],
"htmlOptions": [
2,
4,
16
],
"langBlankInherit": 0,
"collapsed": 0,
"toolbar": "Format, Styles, -, Bold, Italic, -, RemoveFormat\nNumberedList, BulletedList, -, Blockquote\nPWLink, Unlink, Anchor\nPWImage, Table, HorizontalRule, SpecialChar\nPasteText, PasteFromWord\nScayt, -, Sourcedialog\nJustifyCenter, JustifyLeft, JustifyRight",
"inlineMode": 0,
"useACF": 1,
"usePurifier": 1,
"formatTags": "p;h1;h2;h3;h4;h5;h6;pre;address",
"contentsCss": "/site/templates/modules/InputfieldCKEditor/contents.css",
"stylesSet": "customstyles:/site/templates/modules/InputfieldCKEditor/mystyles.js",
"extraPlugins": [
"pwimage",
"pwlink",
"sourcedialog"
],
"removePlugins": "image,magicline",
"showIf": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"columnWidth": 100,
"required": "",
"requiredAttr": "",
"requiredIf": "",
"imageFields": "",
"toggles": "",
"extraAllowedContent": "",
"contentsInlineCss": "",
"customOptions": "",
"plugin_sourcedialog": ""
},
"job_employmenttype": {
"id": 192,
"name": "job_employmenttype",
"label": "Art der Anstellung",
"flags": 0,
"type": "FieldtypeOptions",
"inputfieldClass": "InputfieldSelect",
"collapsed": 0,
"initValue": "",
"showIf": "",
"themeInputSize": "",
"themeInputWidth": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"columnWidth": 100,
"required": "",
"requiredIf": "",
"defaultValue": "",
"export_options": {
"default": "1=FULL_TIME|Vollzeit\n2=PART_TIME|Teilzeit\n3=CONTRACTOR|Vertrag\n4=TEMPORARY|Zeitarbeit\n5=INTERN|Internship (Trainee etc.)\n6=VOLUNTEER|Volontariat\n7=PER_DIEM|Per diem\n8=OTHER|Andere"
}
},
"job_link": {
"id": 178,
"name": "job_link",
"label": "Link zum Jobangebot",
"flags": 0,
"type": "FieldtypeURL",
"textformatters": [
"TextformatterEntities"
],
"noRelative": 0,
"allowIDN": 0,
"allowQuotes": 0,
"addRoot": 0,
"collapsed": 0,
"minlength": 0,
"maxlength": 1024,
"showCount": 0,
"size": 0,
"showIf": "",
"themeInputSize": "",
"themeInputWidth": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"themeBlank": "",
"columnWidth": 100,
"required": "",
"requiredAttr": "",
"requiredIf": "",
"placeholder": "",
"pattern": ""
},
"job_logo": {
"id": 183,
"name": "job_logo",
"label": "Logo",
"flags": 0,
"type": "FieldtypeImage",
"fileSchema": 270,
"textformatters": [
"TextformatterEntities"
],
"extensions": "gif jpg jpeg png",
"maxFiles": 0,
"outputFormat": 2,
"descriptionRows": 1,
"useTags": 0,
"gridMode": "grid",
"focusMode": "on",
"resizeServer": 0,
"clientQuality": 90,
"maxReject": "",
"dimensionsByAspectRatio": "",
"defaultValuePage": "",
"inputfieldClass": "InputfieldImage",
"notes": "optional",
"collapsed": 0,
"outputString": "",
"noLang": "",
"entityEncode": "",
"tagsList": "",
"showIf": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"columnWidth": 100,
"required": "",
"requiredIf": "",
"unzip": "",
"overwrite": "",
"maxWidth": "",
"maxHeight": "",
"maxSize": "",
"minWidth": "",
"minHeight": "",
"aspect_ratios": ""
},
"job_organizationname": {
"id": 193,
"name": "job_organizationname",
"label": "Name der Organisation",
"flags": 0,
"type": "FieldtypeOptions",
"inputfieldClass": "InputfieldSelect",
"collapsed": 0,
"initValue": "",
"showIf": "",
"themeInputSize": "",
"themeInputWidth": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"columnWidth": 100,
"required": "",
"requiredIf": "",
"defaultValue": "",
"export_options": {
"default": "1=intensiv|SPPS Karlsruhe Intensiv\n2=karlsruhe|SPPS Karlsruhe\n3=rastatt|SPPS Ötigheim/Rastatt\n4=pforzheim|SPPS Pforzheim\n5=rheinhausen|SPPS Rheinhausen-Oberhausen\n6=tagespflege|Tagespflege Etje"
}
},
"job_organizationname_old": {
"id": 182,
"name": "job_organizationname_old",
"label": "Name der Organisation",
"flags": 0,
"type": "FieldtypeText",
"collapsed": 0,
"minlength": 0,
"maxlength": 2048,
"showCount": 0,
"size": 0,
"textformatters": "",
"inputfieldClass": "",
"showIf": "",
"themeInputSize": "",
"themeInputWidth": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"themeBlank": "",
"columnWidth": 100,
"required": "",
"requiredAttr": "",
"requiredIf": "",
"stripTags": "",
"placeholder": "",
"pattern": ""
},
"job_postalcode": {
"id": 190,
"name": "job_postalcode",
"label": "PLZ",
"flags": 0,
"type": "FieldtypeText",
"textformatters": [
"TextformatterEntities"
],
"minlength": 0,
"maxlength": 2048,
"showCount": 0,
"size": 0,
"collapsed": 0,
"inputfieldClass": "",
"showIf": "",
"themeInputSize": "",
"themeInputWidth": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"themeBlank": "",
"columnWidth": 100,
"required": "",
"requiredAttr": "",
"requiredIf": "",
"stripTags": "",
"placeholder": "",
"pattern": ""
},
"job_streetaddress": {
"id": 187,
"name": "job_streetaddress",
"label": "Adresse",
"flags": 0,
"type": "FieldtypeText",
"textformatters": [
"TextformatterEntities"
],
"collapsed": 0,
"minlength": 0,
"maxlength": 2048,
"showCount": 0,
"size": 0,
"inputfieldClass": "",
"showIf": "",
"themeInputSize": "",
"themeInputWidth": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"themeBlank": "",
"columnWidth": 100,
"required": "",
"requiredAttr": "",
"requiredIf": "",
"stripTags": "",
"placeholder": "",
"pattern": ""
},
"job_validthrough": {
"id": 180,
"name": "job_validthrough",
"label": "Gültig bis",
"flags": 0,
"type": "FieldtypeDatetime",
"inputType": "text",
"htmlType": "date",
"dateSelectFormat": "yMd",
"yearFrom": 1922,
"yearTo": 2042,
"yearLock": 0,
"datepicker": 3,
"timeInputSelect": 0,
"dateInputFormat": "Y-m-d",
"size": 25,
"columnWidth": 25,
"collapsed": 0,
"dateOutputFormat": "",
"showIf": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"required": "",
"requiredAttr": "",
"requiredIf": "",
"dateMin": "",
"dateMax": "",
"timeStep": "",
"timeMin": "",
"timeMax": "",
"timeInputFormat": "",
"placeholder": "",
"yearRange": "",
"defaultToday": ""
}
}
</pre>
Options für:

'''job_basesalary_unittext'''
<pre>
1=MONTH|Monat
2=YEAR|Jahr
3=HOUR|Stunde
4=WEEK|Woche
5=DAY|Tag
</pre>

'''job_employmenttype'''
<pre>
1=FULL_TIME|Vollzeit
2=PART_TIME|Teilzeit
3=CONTRACTOR|Vertrag
4=TEMPORARY|Zeitarbeit
5=INTERN|Internship (Trainee etc.)
6=VOLUNTEER|Volontariat
7=PER_DIEM|Per diem
8=OTHER|Andere
</pre>

'''job_organizationname'''
<pre>
kann genutzt werden wenn man mehrere Organisationen hat
</pre>

'''Job Fieldset Page'''

Das Feld fasst die anderen Felder in eines zusammen. So kann man sie einfacher handeln.
<pre>
{
"job": {
"id": 177,
"name": "job",
"label": "Job",
"flags": 0,
"type": "FieldtypeFieldsetPage",
"notes": "Daten für ein Jobposting",
"icon": "wrench",
"template_id": 0,
"parent_id": 0,
"repeaterLoading": 2,
"repeaterMaxItems": 1,
"repeaterMinItems": 1,
"collapsed": 0,
"repeaterFields": [
"job_dateposted",
"job_validthrough",
"job_organizationname",
"job_description",
"job_basesalary_minvalue",
"job_basesalary_maxvalue",
"job_basesalary_unittext",
"job_streetaddress",
"job_postalcode",
"job_addresslocality",
"job_addressregion",
"job_addresscountry",
"job_employmenttype",
"job_link",
"job_logo"
],
"showIf": "",
"themeOffset": "",
"themeBorder": "",
"themeColor": "",
"columnWidth": 100,
"required": "",
"requiredIf": "",
"fieldContexts": {
"job_dateposted": {
"icon": "calendar",
"notes": "Datum des Postings. Wenn leer wird das Erstelldatum dieser Seite verwendet."
},
"job_validthrough": {
"icon": "calendar",
"notes": "Empfohlen. Unbefristet für manche Berufsgruppen erlaubt (z.B. Bedienungen)"
},
"job_organizationname": [],
"job_description": [],
"job_basesalary_minvalue": [],
"job_basesalary_maxvalue": [],
"job_basesalary_unittext": [],
"job_streetaddress": [],
"job_postalcode": [],
"job_addresslocality": [],
"job_addressregion": [],
"job_addresscountry": [],
"job_employmenttype": [],
"job_link": {
"notes": "Wenn leer wird diese Seite genutzt."
},
"job_logo": []
}
}
}
</pre>

==== Templates Import ====
Import Daten (Zulässige Kind/Elternseiten von Hand nachtragen)
<pre>
{
"job": {
"id": 53,
"name": "job",
"fieldgroups_id": "job",
"flags": 0,
"cache_time": 0,
"useRoles": 1,
"editRoles": [],
"addRoles": [],
"createRoles": [],
"rolesPermissions": [],
"noInherit": 0,
"childrenTemplatesID": 0,
"sortfield": "",
"noChildren": 1,
"noParents": "",
"childTemplates": [],
"parentTemplates": [
"jobs"
],
"allowPageNum": 0,
"allowChangeUser": 0,
"redirectLogin": 0,
"urlSegments": 0,
"https": 0,
"slashUrls": 1,
"slashPageNum": 0,
"slashUrlSegments": 0,
"altFilename": "",
"guestSearchable": 0,
"pageClass": "",
"childNameFormat": "",
"pageLabelField": "fa-user-circle-o title",
"noGlobal": 0,
"noMove": 0,
"noTrash": 0,
"noSettings": 0,
"noChangeTemplate": 0,
"noShortcut": 0,
"noUnpublish": 0,
"noLang": 0,
"compile": 3,
"nameContentTab": 0,
"noCacheGetVars": "",
"noCachePostVars": "",
"useCacheForUsers": 0,
"cacheExpire": 0,
"cacheExpirePages": [],
"cacheExpireSelector": "",
"label": "Stellenangebot",
"tags": "",
"titleNames": 0,
"noPrependTemplateFile": 0,
"noAppendTemplateFile": 0,
"prependFile": "",
"appendFile": "",
"pagefileSecure": 0,
"tabContent": "",
"tabChildren": "",
"nameLabel": "",
"contentType": "",
"errorAction": 0,
"connectedFieldID": null,
"ns": "ProcessWire",
"_exportMode": true,
"roles": [
"guest"
],
"fieldgroupFields": [
"title",
"layout_blocks",
"job"
],
"fieldgroupContexts": {
"title": [],
"layout_blocks": [],
"job": []
}
},
"jobs": {
"id": 55,
"name": "jobs",
"fieldgroups_id": "jobs",
"flags": 0,
"cache_time": 0,
"useRoles": 1,
"editRoles": [],
"addRoles": [],
"createRoles": [],
"rolesPermissions": [],
"noInherit": 0,
"childrenTemplatesID": 0,
"sortfield": "",
"noChildren": "",
"noParents": -1,
"childTemplates": [
"job"
],
"parentTemplates": [],
"allowPageNum": 1,
"allowChangeUser": 0,
"redirectLogin": 0,
"urlSegments": 0,
"https": 0,
"slashUrls": 1,
"slashPageNum": 0,
"slashUrlSegments": 0,
"altFilename": "",
"guestSearchable": 0,
"pageClass": "",
"childNameFormat": "",
"pageLabelField": "fa-users title",
"noGlobal": 0,
"noMove": 0,
"noTrash": 0,
"noSettings": 0,
"noChangeTemplate": 0,
"noShortcut": 0,
"noUnpublish": 0,
"noLang": 0,
"compile": 3,
"nameContentTab": 0,
"noCacheGetVars": "",
"noCachePostVars": "",
"useCacheForUsers": 0,
"cacheExpire": 0,
"cacheExpirePages": [],
"cacheExpireSelector": "",
"label": "Stellenangebote",
"tags": "",
"titleNames": 0,
"noPrependTemplateFile": 0,
"noAppendTemplateFile": 0,
"prependFile": "",
"appendFile": "",
"pagefileSecure": 0,
"tabContent": "",
"tabChildren": "",
"nameLabel": "",
"contentType": "",
"errorAction": 0,
"connectedFieldID": null,
"ns": "ProcessWire",
"_exportMode": true,
"roles": [
"guest"
],
"fieldgroupFields": [
"title",
"layout_blocks",
"images",
"files",
"menu"
],
"fieldgroupContexts": {
"title": [],
"layout_blocks": [],
"images": [],
"files": [],
"menu": []
}
}
}
</pre>

=== Template Jobs ===
Todo besser als Layout-Block
<syntaxhighlight lang="php">
// JOBLIST
$joblist = '';
$jobs = pages('template=job,sort=-published');
foreach ($jobs as $item) {
$joblist .= '<li class="joblist-item"><a href="'.$item->url.'">'.$item->title.' ('.$item->job->job_organizationname->title.')</a></div>';
}
$joblist = '<ul class="joblist">'.$joblist.'</ul>';
</syntaxhighlight>
=== Template Job ===
Benötigt im Admin Bereich nur das job Feld. In diesem sind alle anderen benötigten Felder bereits enthalten.

<syntaxhighlight lang="php">
<?php namespace ProcessWire;
include_once('includes/SchemaHelper.php');
$sh = new SchemaHelper;
$jsonld = $sh->jsonldJobPosting($page);

// BEWERBUNGSFORMULAR WENN GESÜNSCHT
$contact = $forms->render('bewerbung');

ob_start();
?>

<div class="container">
<div id="apply">
<h1><?=$page->title?></h1>
<div class="job-description">
<?=$page->job->job_description?>
</div>
<div class="">Arbeitgeber</div>
<?=$page->job->job_organizationname->title?><br>
<?=$page->link?>
</div>
<div class="font-heavy">Arbeitsort</div>
<?=$page->job->job_streetaddress?><br>
<?=$page->job->job_postalcode?> <?=$page->job->job_addresslocality?>
</div>
<?php if ($page->job->job_basesalary_minvalue && $page->job->job_basesalary_maxvalue && $page->job->job_basesalary_unittext): ?>
<div class="font-heavy">Vergütung</div>
<div><?=$page->job->job_basesalary_minvalue?>€ - <?=$page->job->job_basesalary_maxvalue?>€ <?=$page->job->job_basesalary_unittext->title?></div>
<?php elseif($page->job->job_basesalary_minvalue && $page->job->job_basesalary_unittext): ?>
<div class="font-heavy">Vergütung</div>
<div><?=$page->job->job_basesalary_minvalue?>€ <?=$page->unit->title?></div>
<?php endif ?>
<div class="font-heavy pt-20">Art der Anstellung</div>
<div class="pb-30"><?=$page->job->job_employmenttype->title?></div>
</div>

<div id="apply-form" class="">
<h2>Bewerbung</h2>
<div><?= $contact ?></div>
</div>

<?=$jsonld?>
</div>
<?php

$content = ob_get_clean();
</syntaxhighlight>

=== Bewerbungsformular ===
<pre>
{
"required": false,
"columnWidth": 0,
"roles": {
"form-submit": [
"guest"
],
"form-list": [],
"form-edit": [],
"form-delete": [],
"entries-list": [],
"entries-edit": [],
"entries-delete": [],
"entries-page": [],
"entries-resend": []
},
"flags": 256,
"pluginActions": [],
"framework": "Uikit3",
"allowPreset": 0,
"skipSessionKey": 0,
"useCookies": 0,
"partialEntryDays": 14,
"spamEntryDays": 7,
"submitText": "Absenden",
"successMessage": "Vielen Dank - Ihre Bewerbung wurde versendet.",
"errorMessage": "Ein Fehler ist aufgetreten. Bitte überprüfen Sie Ihre Eingaben.",
"mobilePx": 0,
"frBasic_noLoad": [],
"frBasic_cssURL": "/site/modules/FormBuilder/frameworks/basic/main.css",
"frBasic_itemContent": [
"description",
"out",
"error",
"notes"
],
"spamFlags": 0,
"listFields": [],
"entryDays": 0,
"emailSubject": "Bewerbungsformular auf salus-klinik.de",
"responderSubject": "Auto-Response",
"saveFlags": 35,
"spamWords": [],
"honeypot": "name_1",
"emailTo": "post@stephanschlegel.de",
"frUikit3_noLoad": [
"framework",
"jquery",
"jqueryui"
],
"frUikit3_ukURL": "/site/modules/FormBuilder/frameworks/uikit3/",
"frUikit3_css": "uikit.min.css",
"frUikit3_horizontal": "0",
"frUikit3_inlineErrorBelow": "1",
"frUikit3_horizHeaderWidth": 30,
"frUikit3_buttonType": "primary",
"children": {
"name_1": {
"type": "Text",
"label": "Name",
"required": false,
"columnWidth": 0,
"collapsed": "0",
"minlength": 0,
"maxlength": 2048,
"showCount": "0",
"size": 0
},
"name_2": {
"type": "Text",
"label": "Name",
"required": 1,
"columnWidth": 0,
"collapsed": "0",
"minlength": 0,
"maxlength": 2048,
"showCount": "0",
"size": 0
},
"e_mail": {
"type": "Email",
"label": "E-Mail",
"required": 1,
"columnWidth": 0,
"collapsed": "0",
"minlength": 0,
"maxlength": 250,
"showCount": "0",
"size": 0
},
"telefon": {
"type": "Text",
"label": "Telefon",
"required": 1,
"columnWidth": 0,
"collapsed": "0",
"minlength": 0,
"maxlength": 2048,
"showCount": "0",
"size": 0
},
"bewerbungsunterlagen": {
"type": "FormBuilderFile",
"label": "Bewerbungsunterlagen",
"notes": "Maximal 3 Dateien á 5MB",
"required": false,
"columnWidth": 0,
"collapsed": "0",
"extensions": "pdf doc docx xls xlsx gif jpg jpeg png",
"maxFiles": 3,
"maxFileSize": 5242880
}
}
}
</pre>
=== Layout Block - Job-Liste ===
Beispiel Salus
<syntaxhighlight lang="php">
<?php namespace ProcessWire;
$sectionClasses = array($page->_type);
$containerClasses = array('ani section');
if($page->bg && $page->bg->value) {
$colorClassBorder = $page->bg->value;
$colorClassContent = $page->bg->value;
}
else {
$colorClassBorder = 'bc1';
$colorClassContent = 'bc1';
}

$out = '';
$jobsMarkup = '';
$jobsAccordion = new Box;
$jobs = pages('template=job,sort=-published');
foreach ($jobs as $item) {

$jobsMarkup .= '
<li class="bc1 joblist-item">
<a class="uk-accordion-title uk-padding-small" href="#">
'.$item->title.'
</a>
<div class="uk-accordion-content uk-padding-small nmt npt">
<p><strong>'.$item->job->job_organizationname->title.'</strong></p>
<p><strong>Arbeitsort:</strong> '.$item->job->job_addresslocality.'<br>
<strong>Art der Anstellung: </strong>'.$item->job->job_employmenttype->title.'</p>
<p><a class="uk-button uk-button-primary" href="'.$item->url.'">Zur Stellenbeschreibung</a></p>
</div>
</li>
';
}

$jobsAccordion->addClasses('accordion uk-accordion nmb');
$jobsAccordion->addAttributes('uk-accordion=""'); // i.e. active:0
$out .= $jobsAccordion->wrap($jobsMarkup,'ul');

// RANDSPALTE?
$out = '
<div class="uk-grid uk-grid-collapse uk-grid-match" uk-grid>
<div class="uk-visible@m uk-width-1-5 '.$colorClassBorder.'">
<div class="uk-padding-small">
</div>
</div>

<div class="uk-width-expand@m">
<div class="uk-padding npt npb npr">
'.renderHeadline($page).'
'. $out .'
</div>
</div>
</div>
';
//$out = renderContainer($page,$out,$containerClasses);
$out = renderSection($page,$out,$sectionClasses,array('skipDefaultClasses'=>false));
return $out;

</syntaxhighlight>
=== Funktionalität ===
==== SchemaHelper ====
Für Erzeugung der Strukturierten Daten

<syntaxhighlight lang="php">
<?php namespace ProcessWire;
/**
* SchemaHelper
* Class for structured data
* V1.0
*/
// @todo outsource some of the nessecary types (i.e. place) in backend use
// fieldgroups for that maybe s.th. like $place = getFg('schema_place')
class SchemaHelper{
// Load the requested schema from the schemas directory and register the class
public function jsonldJobPosting ($p) {
$jsonld = array();
$sanitizer = wire('sanitizer');
//set unset fields (for not mandatory fields)
$p->job->job_validthrough = $p->job->job_validthrough ? : ''; // todo test

$jsonld["@context"] = "http://schema.org/";
$jsonld["@type"] = "JobPosting";
if($p->job->job_link) $jsonld["url"] = $p->job->job_link;
else $jsonld["url"] = $sanitizer->url($p->httpUrl);
$jsonld["datePosted"] = !empty($p->job->job_dateposted) ? date('Y-m-d', $p->job->getUnformatted('job_dateposted') ) : date('Y-m-d', strtotime($p->created));
$jsonld["validThrough"] = date('Y-m-d', $p->job->getUnformatted('job_validthrough') );
$jsonld["description"] = $sanitizer->textarea($p->job->job_description);
$jsonld['hiringOrganization'] = array(
"@type" => "Organization",
"name" => $sanitizer->text($p->job->job_organizationname->title),
"sameAs" => $sanitizer->url($p->job->job_link)
);
if($p->job->link2)$jsonld['hiringOrganization']['logo'] = $p->job->link2;
$jsonld['title'] = $sanitizer->text($p->title);

if($p->job->job_basesalary_minvalue && $p->job->job_basesalary_maxvalue && $p->job->job_basesalary_unittext){
$jsonld['baseSalary'] = array(
"@type" => "MonetaryAmount",
"currency" => "EUR",
"value" => array(
"@type" => "QuantitativeValue",
"minValue" => $sanitizer->float($p->job->job_basesalary_minvalue),
"maxValue" => $sanitizer->float($p->job->job_basesalary_maxvalue),
"unitText" => $sanitizer->text($p->job->job_basesalary_unittext->value)
)
);
}else if($p->job->job_basesalary_minvalue && $p->job->job_basesalary_unittext){
$jsonld['baseSalary'] = array(
"@type" => "MonetaryAmount",
"currency" => "EUR",
"value" => array(
"@type" => "QuantitativeValue",
"value" => $sanitizer->float($p->job->job_basesalary_minvalue),
"unitText" => $sanitizer->text($p->job->job_basesalary_unittext->value)
)
);
}
$jsonld['jobLocation'] = array(
"@type" => "Place",
"address" => array(
"@type" => "PostalAddress",
"streetAddress" => $sanitizer->text($p->job->job_streetaddress),
"addressLocality" => $sanitizer->text($p->job->job_addresslocality),
"addressRegion" => $sanitizer->text($p->job->job_addressregion),
"postalCode" => $sanitizer->text($p->job->job_postalcode),
"addressCountry" => $sanitizer->text($p->job->job_addresscountry),
)
);
// recommended properties

if($c = count($p->job->job_employmenttype)){
$types = array();
foreach($p->job->job_employmenttype as $type){
$types[] = $sanitizer->text($type->value);
}
//var_dump($c);
if($c > 1) $jsonld['employmentType'] = $types;
else $jsonld['employmentType'] = $types[0];
}

//$out .= '<script type="application/ld+json">' . json_encode($jsonld) . '</script>';
$out = '<script type="application/ld+json">' . json_encode($jsonld,JSON_PRETTY_PRINT) . '</script>';

return $out;
}

}

</syntaxhighlight>

Microsoft 365

2025-06-23T14:25:59Z

Steff: /* Telefon und E-Mail als Administrator festlegen */

== Quickstart ==
In 2023/2024 hat Microsoft die meisten Dienste unter dem Terminus Microsoft 365 zusammengefasst. Diese Seite soll als Startpunkt für die Suche dienen.

== Office auf dem Desktop installieren ==
Die Downloads sind oft schwer zu finden.

Hier geht es Stand März 2025:
* Einloggen auf https://www.microsoft365.com
* Home-Seite
* Oben rechts "Installieren und mehr" Button

== Was ist was ==
=== Admin Center ===
Zentrale Verwaltung, Billing, Benutzerverwaltung

=== Purview ===
Compliance Center

=== Azure / Entra ===
Azure AD heißt jetzt Entra.

=== Exchange ===
Postfächer etc.

=== Defender ===
Bedrohungen analysieren und reagieren

== Anmeldung ==
https://learn.microsoft.com/de-de/entra/identity/authentication/concept-authentication-methods - Einstieg
https://mysignins.microsoft.com/security-info // Self-Service Einstellungen

=== Mehrstufige Authentifizierung (MFA) ===
https://www.youtube.com/watch?v=qNndxl7gqVM
https://aka.ms/MFASetup - Benutzerregistrierung
https://go.microsoft.com/fwlink/?LinkId=627442 Handbuch
==== Anmelde- / Authentifizierungsmethoden als Administrator festlegen (Telefon, SMS, E-Mail, ...) ====
Entra Portal > Benutzer > Benutzer wählen > Authentifizierungsmethoden

=== Bedingter Zugriff ===
=== Kombinierte Anmeldung ===
Todo

=== Probleme ===
MFA wird erzwungen, obwohl sie deaktiviert ist.
Mögliche Gründe:
* Single Sign On
* Richtlinien für bedingten Zugriff - in Azure können extra Richtlinien unter bestimmten Bedingungen definiert sein (z.b. Anmeldung außerhalb des Unternehmensnetzwerks).
* Residuale Situationen (alte Richtlinien)
* Sicherheits (Compliance) Anforderungen Azure / Entra

== OAuth Anmeldung von externer App nutzen ==
Generell kann man externe kann man User externer Anwendungen anmelden. Dazu muss man eine App in EntraID registrieren.
=== ProcessWire User über OAuth ===
[[ProcessWire - OAuth Anmeldung über Microsoft365]]

ProcessWire - schneller CSV-Export

2025-06-17T07:20:31Z

Steff:

Quick & Dirty Template wenn du schnell mal Daten exportieren möchtest.
# Template mit dem Code unten anlegen
# Seite mit dem Template erstellen
# Seite aufrufen (am besten erstmal im Selector die Zahl der Ergebnisse mit limit begrenzen).

<syntaxhighlight lang="php">
<?php

namespace ProcessWire;

/**
* custom-export.php
* Template für quick and dirty exporte
* Um den selector leichter zu erstellen kannst du im Adminbereich unter Page->find eine Abfrage bauen.
* $selector ist der Selector für die Abfrage
* $fields sind die Felder die im CSV-Export ausgegeben werden (müssen Felder sein die zum Abfrageergebnis passen)
*/
$out = '';
// Selector für export von Usern bei fasch angelegter Antwort (wurde danach korrigiert)
//$selector = 'has_parent!=2, template=54|55, selected_answer*=B, pr_question=190720, checkbox=0, limit=0, sort=-modified, include=unpublished'; // hier kommt dein Selector
//$fields = ['pr_question', 'pr_user.firstname', 'pr_user.lastname', 'pr_user.email', 'selected_answer', 'checkbox'];

// User mit mindestens einer beantworteten Frage
$selector = 'template=3, parent=29, include=all, limit=100, status<9999999, template=3, parent=29, answered_questions!=0, roles=1044, sort=name';
$fields = ['name','firstname', 'lastname', 'email'];

exportCustomCSV($selector, $fields);

/**
* exportCSV
* @param String - the selector
* @param Array Feldnamen die exportiert werden.
*
*/
function exportCustomCSV($selector,$fields) {
/**
* Exportiert die user_answer-Datensätze als CSV.
*/
$filename = "pw_export_" . date("Ymd_His") . ".csv";
header('Content-Type: text/csv; charset=utf-8');
header('Content-Disposition: attachment; filename=' . $filename);

$output = fopen('php://output', 'w');

// CSV-Kopfzeile
$headers = [];
foreach($fields as $fieldName) {
// Versuche, das Field-Objekt zu holen
$f = wire()->fields->get($fieldName);
if($f) {
$headers[] = $f->label;
} else {
// Fallback
$headers[] = $fieldName;
}
}
$output = fopen('php://output', 'w');
fputcsv($output, $headers);

// DATEN
$items = pages()->find($selector);
foreach($items as $item) {
bd($item);
$row = [];
foreach($fields as $fieldName) {
$value = $item->$fieldName;
// Wenn PageArray (z.B. mehrere Referenzen), join Titles
if($value instanceof \ProcessWire\PageArray) {
$titles = [];
foreach($value as $p) $titles[] = $p->title;
$row[] = implode('|', $titles);
}
// Wenn einzelne Page (z.B. eine Referenz), Titel ausgeben
elseif($value instanceof \ProcessWire\Page) {
$row[] = $value->title;
}
// Sonst ganz normal in String casten
else {
$row[] = (string) $value;
}
}
fputcsv($output, $row);
}

//bd($items);
fclose($output);
exit;
}
</syntaxhighlight>

ProcessWire - schneller CSV-Export

2025-06-17T07:18:34Z

Steff: Die Seite wurde neu angelegt: „Quick & Dirty Template wenn du schnell mal Daten exportieren möchtest: <syntaxhighlight lang="php"> <?php namespace ProcessWire; /** * custom-export.php…“

Quick & Dirty Template wenn du schnell mal Daten exportieren möchtest:

<syntaxhighlight lang="php">
<?php

namespace ProcessWire;

/**
* custom-export.php
* Template für quick and dirty exporte
* Um den selector leichter zu erstellen kannst du im Adminbereich unter Page->find eine Abfrage bauen.
* $selector ist der Selector für die Abfrage
* $fields sind die Felder die im CSV-Export ausgegeben werden (müssen Felder sein die zum Abfrageergebnis passen)
*/
$out = '';
// Selector für export von Usern bei fasch angelegter Antwort (wurde danach korrigiert)
//$selector = 'has_parent!=2, template=54|55, selected_answer*=B, pr_question=190720, checkbox=0, limit=0, sort=-modified, include=unpublished'; // hier kommt dein Selector
//$fields = ['pr_question', 'pr_user.firstname', 'pr_user.lastname', 'pr_user.email', 'selected_answer', 'checkbox'];

// User mit mindestens einer beantworteten Frage
$selector = 'template=3, parent=29, include=all, limit=100, status<9999999, template=3, parent=29, answered_questions!=0, roles=1044, sort=name';
$fields = ['name','firstname', 'lastname', 'email'];

exportCustomCSV($selector, $fields);

/**
* exportCSV
* @param String - the selector
* @param Array Feldnamen die exportiert werden.
*
*/
function exportCustomCSV($selector,$fields) {
/**
* Exportiert die user_answer-Datensätze als CSV.
*/
$filename = "pw_export_" . date("Ymd_His") . ".csv";
header('Content-Type: text/csv; charset=utf-8');
header('Content-Disposition: attachment; filename=' . $filename);

$output = fopen('php://output', 'w');

// CSV-Kopfzeile
$headers = [];
foreach($fields as $fieldName) {
// Versuche, das Field-Objekt zu holen
$f = wire()->fields->get($fieldName);
if($f) {
$headers[] = $f->label;
} else {
// Fallback
$headers[] = $fieldName;
}
}
$output = fopen('php://output', 'w');
fputcsv($output, $headers);

// DATEN
$items = pages()->find($selector);
foreach($items as $item) {
bd($item);
$row = [];
foreach($fields as $fieldName) {
$value = $item->$fieldName;
// Wenn PageArray (z.B. mehrere Referenzen), join Titles
if($value instanceof \ProcessWire\PageArray) {
$titles = [];
foreach($value as $p) $titles[] = $p->title;
$row[] = implode('|', $titles);
}
// Wenn einzelne Page (z.B. eine Referenz), Titel ausgeben
elseif($value instanceof \ProcessWire\Page) {
$row[] = $value->title;
}
// Sonst ganz normal in String casten
else {
$row[] = (string) $value;
}
}
fputcsv($output, $row);
}

//bd($items);
fclose($output);
exit;
}
</syntaxhighlight>

ProcessWire - Selectors

2025-06-17T07:17:42Z

Steff: /* Schneller CSV-Export von Selector-Ergebnissen */

== Operatoren ==
http://cheatsheet.processwire.com/selectors/selector-operators/
Selector Operators

=
Equal to (any_field=any_value)

!=
Not equal to (any_field!=any_value)

<
Less than (any_field

>
Greater than any_field>any_value

<=
Less than or equal to (any_field<=any_value)

>=
Greater than or equal to (any_field>=any_value)

*=
Contains the exact word or phrase (any_field*=any_value)

~=
Contains all the words (any_field~=any_value)

%=
Contains the exact word or phrase (using slower SQL LIKE) [v2.1] (any_field%=any_value)

^=
Contains the exact word or phrase at the beginning of the field [v2.1] (any_field^=any_value)

$=
Contains the exact word or phrase at the end of the field [v2.1] (any_field$=any_value)

=== Neue Operatoren ab 3.0.160 ===
List of new operators available as of ProcessWire 3.0.160

Here's a list of new operators available as of 3.0.160, along with brief explanation of what each operator does and how it differs from other similar operators.

Contains words partial (~*=)
Like existing match words (~=) operator, except that this one matches partial words as well.

Contains words live (~~=)
Like match words, except that the last word in the query is treated as a partial match.

Contains words like (~%=)
Matches all words in the query, in full or in part.

Contains words and expand (~+=)
Like match words operator, but with the added power of the query expansion feature supported by MySQL fulltext indexes.

Contains any words (~|=)
One or more of the words must match; this is similar to splitting the query with pipe (|) characters, but often easier to use, and better optimized.

Contains any partial words (~|*=)
Similar to the previous operator, except that this one also provides partial matches.

Contains any words like (~|%=)
Similar to the previous two operators, but uses LIKE query behind the scenes instead of the fulltext index.

Contains phrase and expand (*+=)
Variation of the phrase match operator (*=) with added query expansion support.

Contains match (**=)
This operator works much like the MATCH/AGAINST feature of MySQL fulltext indexes.

Contains match and expand (**+=)
Otherwise identical to previous operator, except for the added query expansion.

Advanced text search (#=)
This operator adds support for special characters, such as "+" for "must match", "-" for "must not match", and "*" for specifying partial matches.

== Owner Attribut ==
Nützlich bei '''Pagereferences''', wenn '''auf die Seite verweisende Seiten''' gefunden und '''gleichzeitig gefiltert''' werden sollen.
https://processwire.com/blog/posts/processwire-3.0.95-core-updates/
<syntaxhighlight lang="php">
$members = $pages->find("template=member, age>50");
foreach($members as $m) {
$items = $m->memberships->find("club='Golf Club X', mtype=GOLD");
foreach($items as $membership) {
// add to excel or other export, etc.
}
}
</syntaxhighlight>
Ineffektiv bei vielen Datensätzen ->
<syntaxhighlight lang="php">
$items = $pages->find("club='Golf Club X', mtype=GOLD, memberships.owner.age>50");
foreach($items as $membership) {
// add to excel or other export, etc.
}
</syntaxhighlight>

== Kombinierte Abfragen und Subselektoren ==
Da man auch Seiten im Selektor übergeben kann, kann man relativ einfach kombinierte Abfragen über '''mehrere Templates''', oder auch über '''parents''' etc. machen. Mit Subselektoren kann man das noch abkürzen.

'''Kombinierte Abfrage'''
<pre>
$companies = $pages->find("template=company, locations>5, locations.title%=Finland");
$items = $pages->find("template=product, company=$companies");
</pre>
'''Mit Subselektoren'''
$items = $pages->find("template=product, company=[locations>5, locations.title%=Finland]");

== OR / AND ==
OR funktioniert über

'''Feldwert a oder Feldwert b'''
firstname=Mike|Steve

'''Feldwert a und Feldwert b'''
height>500, height<=1000

'''In Feld a oder in Feld b'''
body|sidebar*=carbonated

=== OR Groups ===
'''(Bedingung a, Bedingung b),(Bedingung c)'''
Wenn man Klammern nutzt muss nur eine der Klammern zutreffen.

Beispiel "product" Seiten in stock, UND entweder in featured date range, ODER highlighted checkbox checked.

<syntaxhighlight lang="php">
$items = $pages->find("template=product, stock>0, (featured_from<=today, featured_to>=today), (highlighted=1)");
</syntaxhighlight>
Die Klammern kennzeichnen Optionale Bedingungen. '''Es muss also nur eine der Klammern zutreffen.'''

Wenn man mehrere Oder-Gruppen benötigt kann man so vorgehen:
foo=(selector1), bar=(selector2), foo=(selector3), bar=(selector4)
Hier gehören alle foo zusammen und alle bar. Sprich es muss '''selector1 ODER selector3 UND selector2 ODER selector4''' erfüllt sein.

https://processwire.com/docs/selectors/#or-selectors1

=== Selektoren und RepeaterMatrix ===
'''Beispiel TV Altötting'''
<syntaxhighlight lang="php">
//BEISPIEL: $results = $pages->find("template=matrix_page,matrix_main.body%=$q"); // name des matrix items weglassen
//$selector = "template=".implode('|',$pageTemplates).", layout_blocks.body~*=".$val; // findet einspalter aber keine in
//$selector = "template=".implode('|',$pageTemplates).", layout_blocks.r_grid.body~*=".$val; // findet mehrspalter aber keine einspalter
// dot notation not allowed with or so we have to use or groups or bracket notation:
$selector = "template=".implode('|',$pageTemplates).", (layout_blocks.body~*=".$val."),(layout_blocks.text~*=".$val."),(layout_blocks.headline~*=".$val."),(layout_blocks.r_grid.body~*=".$val.")"; // findet mehrspalter aber keine einspalter
bd($selector,"selector for content");
$matches = $pages->find($selector);

$searchResultMarkup .= "<h5>Suche im Seiteninhalt [$matches->count]</h5>";
if($matches->count) {
$searchResultMarkup .= renderNav($matches);
} else {
$searchResultMarkup .= "<p>Keine Seiteninhalte mit diesem Suchbegriff gefunden.</p>";
}
</syntaxhighlight>

== Anzahl beschränken mit limit und start ==
limit=50 // 50 or fewer results
start=50, limit=50 //50 (or less) results starting at the 51st (results 51–100).

If you are using a limit selector with pages, and your template has page-numbers (pagination) turned on, ProcessWire will automatically set the "start" selector according to the current page/pagination number. So when it comes to pagination, you don't usually have to think about anything other than the "limit" selector.

== Array Selectors ==
https://processwire.com/blog/posts/processwire-3.0.13-selector-upgrades-and-new-form-builder-version/#building-a-selector-string-with-user-input-example

=== Selektoren als assoziative Arrays ===

Anstatt von Selector Strings kann man seit PW 3.0.13 auch Arrays nutzen.:d of a string:
<syntaxhighlight lang="php">
$results = $pages->find([
'template' => ['basic-page', 'product'],
'title|body%=' => $sanitizer->text($input->get('q')),
'categories' => $sanitizer->intArray($input->get('categories')),
'sort' => '-created'
]);
</syntaxhighlight>
Erläuterung:

Die ''$sanitizer->selectorValue()'' Methode um Text zu sanitizen der in Selektoren geht ist nicht mehr notwendig. Du solltest immer noch User Input sanitizen, aber man kann sich die sanierung für die Selektoren sparen.
Werte können Arrays sein. Im Beispiel werden Arrays für 'template' and 'categories' items genutzt.

Der "=" Operator wird für alle Selektoren Elemente angenommen, solange man nicht einen anderen Operator anhängt. Wie bei '''title|body%=''' zu sehen.

=== Selektoren als reguläre Arrays ===
Man kann auch ein reguläres (nicht assoziatives Array nutzen:
<syntaxhighlight lang="php">
$results = $pages->find([
['template', ['basic-page', 'product']],
['title|body', '%=', $input->get('q'), 'text'],
['categories', '=', $input->get('categories'), 'int'],
['sort', '-created']
]);
</syntaxhighlight>
Hier werden die Selektorenteile als Array im Array übergeben. Das Format ist folgendes:f those arrays can use any of the following formats:
<pre>
[field, value]
[field, operator, value]
[field, operator, value, sanitizer]
[field, operator, value, whitelist]
</pre>

* The field element can be specified as a single field name, pipe "|" separated field names, or an array of field name(s).
* The operator can be any operator. If none is specified, then equals "=" is assumed (which you can do if only specifying a field and value).
* The value can be a string, number or array of either.
* The sanitizer can be any $sanitizer method name that you want the value to pass through before being used in the selector.
* When a whitelist (array) is specified for the sanitizer, the selector will throw an Exception if the given value (or values) are not present in the whitelist array.

Beide Array Formate (assoziativ, regulär) kann man theoretisch sogar mischen.

== Owner Selector ==
https://processwire.com/blog/posts/processwire-3.0.95-core-updates/
Mit Owner Selektoren kannst du Verknüpfungen die über PageTable pages, Page fields oder Repeater fields realisiert werden effizient durchsuchen, ohne Schleifen zu benutzen.

Es dauert etwas bis man das Konzept verstanden hat aber es ist extrem effektiv.

Eine zeitaufwändige Suche über eine Schleife wie diese:
<syntaxhighlight lang="php">
$members = $pages->find("template=member, age>50");
foreach($members as $m) {
$items = $m->memberships->find("club='Golf Club X', mtype=GOLD");
foreach($items as $membership) {
// add to excel or other export, etc.
}
}
</syntaxhighlight>
wird dann einfach zu:
<syntaxhighlight lang="php">
$items = $pages->find("club='Golf Club X', mtype=GOLD, memberships.owner.age>50");
foreach($items as $membership) {
// add to excel or other export, etc.
}
</syntaxhighlight>
Anstatt über template=member zuerst alle Members zu durchlaufen und diese dann weiter nach Mitgliedschaften zu filtern geht man den Weg anders herum. Man nimmt das Feld das man sucht und schaut über den owner Selector wo es überall Referenziert wird. Also eine Art Rückwärtssuche.

== Beispiele ==
=== Datum ===
Per Default nutzt PW das Datum als Timestamp. Um z.B. alle

For recieving page of today, you would have to create a start and end time range and use them in the selector.
<syntaxhighlight lang="php">
$start = strtotime( date('Y-m-d') . " 00:00:00");
$end = strtotime( date('Y-m-d') . " 23:59:59");
$items = $pages->find("template=linkmain,publishdate>=$start,publishdate<=$end,sort=-userid");
</syntaxhighlight>

Beispiel
<syntaxhighlight lang="php">
$startDate = '2023-01-01';
$endDate = '2023-03-31';
$start = $startDate . ' 00:00:00';
$end = $endDate . ' 23:59:59';
$paidInvoices = pages("template=invoice, invoice_paid=1, invoice_date>=$start, invoice_date<=$end");
</syntaxhighlight>
Todo Beispiele mit wire()-> Datumsfunktionen

=== Parents ===
To specify that matches should have a '''specific parent''', specify the parent's path, object or ID. First is an example of using the parent's path:
https://processwire.com/docs/selectors/#finding2
parent=/path/to/parent/
parent=$parent
parent=123
parent=$parent1|$parent2|$parent3

==== Parents bei Repeatern oder RepeaterMatrix ====
https://wiki.stephanschlegel.de/index.php?title=ProcessWire_-_Snippets#Parent_von_Repeater_oder_RepeaterMatrix_finden

=== Sortiere Seiten nach Reihenfolge im Seitenbaum ===
Das funktioniert mit der Sortierung "sort".
$categories = pages('template=template_name,sort=sort');
=== Große Datenmenge mit findMany() durchsuchen ===
[[findMany() - ProcessWire API]]

=== Suche nach Seiten die Verweise auf bestimmte andere Seiten enthalten ===
https://processwire.com/talk/topic/5414-selector-find-page-reference-help/

Es sollen Seiten gefunden werden die mit einer Page Reference auf eine andere Seite verweisen. Am einfachsten geht das wenn man nicht wie man zuerst vermutet nach der Seiten ID sucht, sondern wenn man direkt nach der Seite sucht
team_name=$page

=== Suche nach Phrasen in Daten die in Seitenverweise enthalten sind ===
https://processwire.com/talk/topic/570-searching-page-reference-fields/

Es sollen Seiten gefunden werden, die Verweise auf andere Seiten enthalten. Beispielsweise enthalten Personen (Eltern) Links zu Notfalladressen die separat angelegt sind. Nun soll Nach Eltern gesucht werden, die eine bestimmte Notfalladresse enthalten. Gesucht wird nach einer Phrase im Notfalladrdessen Namen).

Lösung: Es wird in zwei Schritten gesucht.

1. Suche nach Kontakten mit dem Search Term im body und die dem template emergency-contact entsprechen
$contacts = $pages->find("body*='search term', template=emergency-contact");
2. Seiten die diesen Kontakten entsprechen
$parents = $pages->find("emergency-contacts=$contacts");

=== Selektoren in Option Fieldtypes ===
<syntaxhighlight lang="php">
$optionsfield // return id (string)
$optionsfield->id; // return id (int)
$optionsfield->title; // return string USE THIS or
$optionsfield->value; // return empty string or value (if your option settings like '1=value|title')

// dot syntax in selector string
$pages->find('optionsfield.id=2');
</syntaxhighlight>

=== Selektoren für Multiple Options ===

==== Finde Seiten in gewählten Optionen ====
Nehmen wir an wir haben Seiten mit dem Template tag und ein Template product, das wiederum ein PageReference Feld 'tags' hat bei dem man ein oder mehrere Tags auswählen kann.

1. Seiten die eines oder mehr der gewählten Tags haben.
<syntaxhighlight lang="php">
$myTags = array();
// find product pages which fit all options
$tags = array();
foreach($page->tag_selector as $tag) {
$tags[] = $tag->name;
}
$items = $items->find('template=product,tags.name=' . implode('|',$tags) );
//bd($items);
</syntaxhighlight>
2. Seiten die alle gewählten Tags haben oder mindestens einen (mit Schalter)
<syntaxhighlight lang="php">
$or = $page->opt_1;
if(count($page->tag_selector)){
$myTags = array();
$tags = array();
foreach($page->tag_selector as $tag) {
if ($or) $tags[] = $tag->name;
else $tags[] = 'tag.name='.$tag->name;
}
if ($or) $items = pages()->find('template=product,tags.name=' . implode('|',$tags) ); //OR
else $items = pages()->find('template=product,'.implode(',',$tags)); // AND
bd($items);
</syntaxhighlight>

=== Seiten finden ===
<syntaxhighlight lang="php">
$skyscrapers = $pages->find("template=skyscraper, sort=-modified");
foreach($skyscrapers as $skyscraper) {
echo "<li><a href='$skyscraper->url'>$skyscraper->title</a></li>";
}
</syntaxhighlight>

==== Rekursiv suchen ====
$pages->find("parent={$cat->children}, limit=$limit, sort=-date, sort=title"); // expands to something like "parent=1234|1235|1236|1237|...|1507|1508"

=== Page Reference auf diese Seite ===
https://processwire.com/talk/topic/1071-page-fieldtype-two-way-relation/
echo $pages->find("field1=$page")->render();
If the page isn't part of the front-end site, then I'll remove view access from its template. Or if it is part of the front-end, but I don't want to show the relations, then this:

if($page->editable()) echo $pages->find("field1=$page")->render();

Though I almost always integrate these relation-revealing pages into the site structure, as it's rare that this information doesn't have some value to the site's users too. This is an example of one that locates all pages referencing it in a field called 'country':
https://www.tripsite.com/countries/croatia/

=== Suche in PageReference Feldern ===
Generell gilt PageReferences verhalten sich gleich wie wenn man auf ein Page-Object zugreifen würde.
https://processwire.com/talk/topic/1224-selector-and-page-reference-field/

'''Beispiel:''' Finde alle Point of Interest Seiten die eine Referenz auf die Kategorie "Zoo" haben
* Template '''poi''' (Point of Interest)
** Feld '''poi_type''' (PageReference) referenziert auf Seiten mit dem Template type
* Template '''type'''

Der Filter
$poi = $pages->find(template=poi, poi_type.title='Zoo');
Funktioniert nicht!

Stattdessen
# holt man zuerst alle type-Seiten mit dem Titel Zoo
# Dieses PageArray kann man direkt als Filter für eine Suche in den POIs nutzen.

<syntaxhighlight lang="php">
$pr = $pages->get("title=Zoo");
$poi = $pages->find("template=poi, poi_type=$pr");
</syntaxhighlight>

'''Beispiel 2'''
<syntaxhighlight lang="php">
$prs = $pages->find("title=Zoo|Themepark|Museum"); // maybe also use the name or id
$poi = $pages->find("template=poi, poi_type=$prs");
</syntaxhighlight>

ACHTUNG Hier ist es wichtig im ersten Selektor find zu verwenden. Get würde nur den ersten Treffer ausspucken, während find ein PageArray mit allen Ergebnissen zurückgibt.

'''Beispiel 3'''
<syntaxhighlight lang="php">
$invoicesNotSent = $pages->find('template=invoice,invoice_sent=false');
$selector = "template=order,(invoice=$invoicesNotSent),(padinvoice=)";
$ordersWithoutInvoiceOrInvoiceNotSent = $pages->find( $selector );
</syntaxhighlight>

=== Punkt Syntax ===
$architects = $pages->find("template=architect, city.title=Chicago");
$buildings = $pages->find("architect=$architects");
That's easy enough, but wouldn't it be nicer if you could just do this?
$buildings = $pages->find("architect.city.title=Chicago");

$buildings = $pages->find("architect.city.state.abbr=IL");
Broadening further, perhaps we want buildings from all architects in the USA:

$buildings = $pages->find("architect.city.state.country.abbr=USA");
Or perhaps both USA and Canada:

$buildings = $pages->find("architect.city.state.country.abbr=USA|CA");

=== User ===
http://cheatsheet.processwire.com/users/users-methods/users-find-selector/
Find all users whose email address ENDS with processwire.com and create a link to email them
<pre>
$items = $users->find("email$=processwire.com");
foreach($items as $item) {
echo "<li><a href='mailto:{$item->email}'>{$item->name}</a></li>";
}
</pre>
Find all users who have "fred" anywhere in their name

$items = $users->find("name*=fred");
Find all users who have the "superuser" role

$items = $users->find("roles=superuser");

=== Suche alle Kinder / alle Elternseiten ===
<syntaxhighlight lang="php">

/**
* get children categories for a category for a product
*
* Page $p category page
* int $maxDepth
*/
function getChildren($p, $maxDepth=3){
$children = new PageArray;
$children->add($p); // add parent category
if ($p->hasChildren() && $maxDepth > 1){
$children->add( $p->children('template=category') );
foreach($p->children as $c){
$grandchildren = getChildren($c, $maxDepth-1);
$children->add($grandchildren);
}
$children->sort('title');
return $children;
}else return false;
}

/**
* get filter Categories for a item this includes all parent categories
* @return string use as class for the isotope item
* */
function getFilters($item,$prefix='cat'){
// we need to fetch $item categories + parent categories
$filters = array();
$allCategories = new Pagearray;
$categories = $item->categories;
// for each category add category + parent categories to allCategories
foreach($categories as $category){
$allCategories->add( $category );
$allCategories->add( $category->parents('template=category') );
}
foreach($allCategories as $c){
$filters[]= $prefix.$c->id;
}
return implode(' ',$filters);
}
</syntaxhighlight>

=== Schneller CSV-Export von Selector-Ergebnissen ===
[[ProcessWire - schneller CSV-Export]]

PrivacyWire - ProcessWire Modul

2024-11-28T17:28:38Z

Steff: /* Testen der Implementierung */

Modul zum Anzeigen eines Cookie Banners und zum Blockieren von Skripten, Externen Medien etc. Das Modul passt das HTML an
== Links ==
https://processwire.com/modules/privacy-wire/
https://processwire.com/talk/topic/23118-privacywire-cookie-management-async-external-asset-loading/

== Quickstart Cookie Consent für ProcessWire ==
* Modul '''installieren''' (PrivacyWire)
* In der Konfiguration '''Labels übersetzen'''
* Benötigte '''Kategorien auswählen'''
** Zuordnung der Kategorien funktioniert über data-category Attribut.
* '''Externe Skripte''' anpassen
** type bei skripten mit text/plain (wird bei consent durch javascript ersetzt)
** src durch data-src ersetzen
** data-category hinzufügen
** Normale Skripte: type="text/plain" data-type="text/javascript" data-category="marketing"
** Externe Skripte: data-src="..."
* '''Banner''' anpassen
* '''Link zu Cookie Einstellungen'''
* Google Consent V2 Skript

== Externe Skripte anpassen ==
Beispiele:
<script type="text/plain" data-type="text/javascript" data-category="statistics" data-src="/path/to/your/statistic/script.js"></script>
<script type="text/plain" data-type="text/javascript" data-category="marketing" data-src="/path/to/your/marketing/script.js"></script>
<script type="text/plain" data-type="text/javascript" data-category="external_media" data-src="/path/to/your/external-media/script.js"> </script>
<script type="text/plain" data-type="text/javascript" data-category="marketing">console.log("Inline scripts are also working!");</script>

<pre>

<script async type="text/plain" data-type="text/javascript" data-category="marketing" data-src="https://www.googletagmanager.com/gtag/js?id=G-DQPX4V13MY"></script>
<script type="text/plain" data-type="text/javascript" data-category="marketing">
window.dataLayer = window.dataLayer || [];function gtag(){dataLayer.push(arguments);}gtag('js', new Date());gtag('config', 'G-DQPX4V13MY');
</script>
</pre>

== Link zu Cookie Einstellungen anzeigen ==
So gibst du einen Link aus mit dem der User die Cookie Einstellungen erneut setzen kann.
=== Möglichkeit 1 - Textformatter ===
Den Textformatter der mit PrivacyWire im Editor einbinden und dann den passenden Tag setzen:
<pre>
[[privacywire-choose-cookies]]
</pre>

=== Möglichkeit 2 - HTML Code ===
<syntaxhighlight lang="html5">
<a href="#" class="privacywire-show-options">Show Cookie Options</a> 
<button class="privacywire-show-options">Show Cookie Options</button> 
</syntaxhighlight>

== CSS ==
Hinweis: Zusätzliche Styles. Standardstyles müssen eingebunden sein.

<syntaxhighlight lang="css">
.pricacywire,
.privacywire-banner,
.privacywire-options,
.privacywire-message{
background-color: #009999 !important;
}
.pricacywire a,
.privacywire-banner a,
.privacywire-options a{
color: #fff !important;
}
</syntaxhighlight>

<syntaxhighlight lang="css">
.pricacywire,
.privacywire-banner,
.privacywire-options,
.privacywire-message{
background-color: #0e71b1 !important;
color: #fff;
}
.pricacywire a,
.privacywire-banner a,
.privacywire-options a{
color: #fff !important;
}
.privacywire button{
cursor: pointer;
}
.privacywire input{
position: relative;
opacity: 1;
margin-right: 0.5em;
color: #fff;
opacity: 1;
}
.privacywire label{
color: #fff;;
}
</syntaxhighlight>

Betonter Accept Button / bessere Abstände / saubere Buttons:
<syntaxhighlight lang="css">
.privacywire{
padding: 2em !important;
}
.pricacywire,
.privacywire-banner,
.privacywire-options,
.privacywire-message{
background-color: #17428b !important;
color: #fff;
}
.pricacywire a,
.privacywire-banner a,
.privacywire-options a{
color: #fff !important;
}
.privacywire ul{
list-style-type: none;
}
.privacywire input{
position: relative;
opacity: 1;
margin-right: 0.5em;
color: #fff;
opacity: 1;
}
.privacywire label{
color: #fff;;
}
.privacywire-page-links{
margin-top: 0.5rem;
}
.privacywire button{
background: #b3b3b3;
color: #fff;
font-weight: normal;
border: none;
padding: 12px;
border-radius: 0px;
cursor: pointer;
text-transform: uppercase;
}
.privacywire button.allow-all{
background: #3fa535;
border-color: #3fa535;
color: #fff;
}
</syntaxhighlight>

SCSS Beispiel
<syntaxhighlight lang="scss">
// Privacy Banner
$privacywire-bg-color:#d0c5b8;
$privacywire-text-color: #000;
$privacywire-button-text-color: #fff;
$privacywire-button-allow-text-color: #fff;
$privacywire-button-bg-color: #b3b3b3;
$privacywire-button-allow-bg-color: #3fa535;
#privacywire-wrapper{
ul{
list-style-type: none;
}
input{
position: relative;
opacity: 1;
margin-right: 0.5em;
color: $privacywire-text-color;
opacity: 1;
}
label{
color: $privacywire-text-color;;
}
.privacywire{
z-index: 999!important;
padding: 2em !important;
}
.privacywire-banner,
.privacywire-options,
.privacywire-message{
background-color: $privacywire-bg-color !important;
color: $privacywire-text-color;
a{
color: $privacywire-text-color !important;
}
button{
background: $privacywire-button-bg-color;
color: $privacywire-button-text-color;
font-weight: normal;
border: none;
padding: 12px;
border-radius: 0px;
cursor: pointer;
text-transform: uppercase;
&.allow-all{
background: $privacywire-button-allow-bg-color;
border-color: $privacywire-button-allow-bg-color;
color: $privacywire-button-allow-text-color;
}
}

}
.privacywire-page-links{
margin-top: 0.5rem;
}
}
</syntaxhighlight>

== Video Embed Opt-In==
Im VideoEmbed Plugin kann man die Kategorie auswählen (z.B. external Media)

== Bsp. iFrame mit eigenem Opt Out ==
Mit dem Attribut data-ask-consent="1" kann man auch einzelne Elemente freigeben.
<iframe data-src="https://processwire.com/" data-category="marketing" data-ask-consent="1" class="require-consent" frameborder="0" height="400" width="400"></iframe>

Available attributes:
<pre>
Attribute Info Description Type
class require-consent optional (required if config option enabled) If the config option "Detect consent windows by class require-consent instead of data-attribute" is enabled string
data-category required defines the assigned cookie group for this element string
data-type optional (required for scripts) replaces the type attribute after giving consent string
data-src optional (required for external scripts, images or iframes) replaces the src attribute after giving consent string
data-srset optional replaces the srcset attribute for images after giving consent string
data-ask-consent optional Replace element with Opt-In-Element bool 0/1
</pre>
For script tags it is required to add type="text/plain", otherwise the script executes directly.

== PrivacyWire - Lokalisieren ==
Dateien übersetzen oder in Einstellungen von Hand übersetzen. Siehe Webmynet Cloud, da gibt es CSV Dateien mit fertigen Übersetzungen zum Hochladen. Deutsch muss als Defaultsprache festgelegt sein.

=== Übersetzung wird nicht angezeigt ===
* Schau ob die Defaultsprache Deutsch ist.
* Wenn du angemeldet bist muss deine Usersprache ebenfalls auf Deutsch stehen.

== Google Consent v2 ==
=== Links ===
[[Google Consent Mode v2]]

=== Integration und Implementierung ===

'''Einfügen des Tags'''

Der Google Consent Mode Tag muss in den Quellcode der Website eingebunden werden, vorzugsweise im Header.

'''Einwilligungszustände festlegen'''

Festlegung der Einwilligungszustände (z. B. granted oder denied) für verschiedene Cookie-Typen.

'''Konfiguration der Tags'''

Konfiguration der Google-Tags (z. B. Google Analytics, Google Ads), um das Verhalten basierend auf den Einwilligungszuständen zu steuern.

Hier ein Beispiel, wie der Code für den Consent Mode aussehen könnte.

Der Code für das Integrieren kommt so von Google:

<syntaxhighlight lang="javascript">


<script async src="https://www.googletagmanager.com/gtag/js?id=GA_MEASUREMENT_ID"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());

gtag('config', 'GA_MEASUREMENT_ID');
</script>
</syntaxhighlight>

Wir können beim laden der Webseite Default Einstellungen mitgeben:

<syntaxhighlight lang="javascript">

// Einfügen des gtag.js-Tags mit Unterstützung für Consent Mode
<script async src="https://www.googletagmanager.com/gtag/js?id=GA_MEASUREMENT_ID"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('consent', 'default', {
'ad_storage': 'denied',
'analytics_storage': 'denied'
'ad_user_data': 'denied',
'ad_personalization': 'denied',
'wait_for_update': 2000 // milliseconds to wait for update
});

gtag('js', new Date());
gtag('config', 'GA_MEASUREMENT_ID');
</script>
</syntaxhighlight>

Wenn sich die Einwilligungspräferenzen des Nutzers ändern, kann der Code dynamisch angepasst werden:

<syntaxhighlight lang="javascript">
// Aktualisieren der Einwilligungspräferenzen basierend auf Nutzerentscheidung
gtag('consent', 'update', {
'ad_storage': 'granted',
'analytics_storage': 'granted'
});
</syntaxhighlight>

=== Google Tag mit PrivacyWire ===
Wir benötigen einen Weg damit PrivacyWire die oben gezeigte Einwilligungsänderung steuern kann.

Allgemein müssen wir folgendes realsieren:

# Google Tag integrieren (mit v2 Option)
# Google Tag NICHT mit PrivacyWire aussperren
# PrivacyWire mit JS Funktion ausstatten, die passenden Signals an Google sendet.
# Funktionen auslösen bei:
## User speichert Banner
## User hat Banner gespeichert und kommt auf die Seite => Cookies checken und Signale senden.
# Google Tag defaultmäßig auf keine Cookies erlaubt stellen.

=== Implementierung in PrivacyWire - in depth ===
Das Wichtigste:
* PrivacyWire kann eine Funktion aufrufen, nachdem es die User Preferences aktualisiert hat. Du trägst den Namen dieser Funktion einfach in der Konfiguration ein. Z.b. updateConsentFromPrivacyWire.
* Diese Funktion trägst du z.B. zusätzlich zum Google GTAG Code im Header ein.
* PrivacyWire legt die Usereinstellungen im LocalStorage ab. Dort kann sich die neue Funktion die Einstellungen holen und an Google weiterreichen.
Sonst:
* Im localStorage wird der Schlüssel privacyWire angelegt und ein JSON Objekt mit den Usereinstellungen abgelegt. Der alte Schlüssel wird gelöscht.
privacywire:"{"version":1,"cookieGroups":{"necessary":true,"functional":false,"statistics":true,"marketing":false,"external_media":false}}"
* Danach wird der Banner ausgeblendet und die Bestätigung angezeigt. Dann wird der Code der betroffenen Skripte etc. upgedatet. Am Ende wird eine Custom Funktion aufgerufen die man selbst erstellen kann.
* Es gibt den Parameter silent=false der wohl an die custom Function mit übergeben wird. Bedeutung habe ich noch nicht recherchiert.

=== Komplettes Beispiel PrivacyWire und Google Consent v2 ===
Trage in der Konfiguration von PrivacyWire die Funktion '''updateConsentFromPrivacyWire''' ein.

Hier folgt der Code für
* Google Tag Manager (kannst du auch auf der Google Tag Manager Seite kopieren)
* Google Consent V2 + Default Settings
* Update Funktion die von PrivacyWire aufgerufen wird und die neuen Preferences an Google sendet.

<syntaxhighlight lang="html5">

<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-ID-HERE');</script>



<script async src="https://www.googletagmanager.com/gtag/js?id=GTM-ID-HERE"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('consent', 'default', {
'ad_storage': 'denied',
'analytics_storage': 'denied',
'ad_user_data': 'denied',
'ad_personalization': 'denied',
'wait_for_update': 2000 // milliseconds to wait for update
});

gtag('js', new Date());
gtag('config', 'GTM-ID-HERE');
</script>



<script>

function updateConsentFromPrivacyWire() {
console.log('update consent from privacy wire...');
const privacyWireData = localStorage.getItem('privacywire');
if (privacyWireData) {
try {
const consentData = JSON.parse(privacyWireData);
const consentPreferences = {
'ad_storage': consentData.cookieGroups.marketing ? 'granted' : 'denied',
'analytics_storage': consentData.cookieGroups.statistics ? 'granted' : 'denied',
'ad_user_data': consentData.cookieGroups.marketing ? 'granted' : 'denied',
'ad_personalization': consentData.cookieGroups.marketing ? 'granted' : 'denied'
};

// Update gogle consent
gtag('consent', 'update', consentPreferences);
console.log(consentPreferences);
} catch (e) {
console.error('Error parsing PrivacyWire-Data:', e);
}
} else {
console.warn('No PrivacyWire-Data found in localStorage');
}
}
// Update consent at pageload
document.addEventListener('DOMContentLoaded', updateConsentFromPrivacyWire);
</script>
</syntaxhighlight>

=== Testen der Implementierung ===
Über tagassistant.google.com

Sollte etwa so ausschauen:
[[Datei:Google Tagassistant 1.png|gerahmt|links|Testen der Google Consent V2 Einstellung]]

=== Analytics und Conversions ===
==== Analytics ====
Google Analytics Tag im GTM erstellen

Gehe zu deinem Google Tag Manager Konto und öffne den entsprechenden Container.
Erstelle ein neues Tag:
Klicke auf "Tags" im linken Menü.
Klicke auf "Neu" und gib dem Tag einen Namen (z. B. "Google Analytics - Universal Analytics").
Tag-Typ auswählen:
Klicke auf "Tag-Konfiguration" und wähle "Google Analytics: Universal Analytics" aus.
Tracking-Typ auswählen:
Wähle "Seitenaufruf" als Tracking-Typ.
Google Analytics Einstellungen konfigurieren:
Klicke auf "Neue Variable" unter "Google Analytics-Einstellungen" und erstelle eine neue Variable für deine Google Analytics ID (z. B. "GA-XXXXXX").
Gib deine Google Analytics Tracking-ID ein (UA-XXXXXX-Y).
Speichere die Variable.
Trigger hinzufügen:
Klicke auf "Triggering" und wähle "All Pages" (Alle Seiten) aus.
Tag speichern:
Speichere das Tag und veröffentliche die Änderungen im GTM.
==== Conversions ====
'''Werden die Tags für das Conversion Tracking auch über den GTM ausgespielt?'''

ChatGPT

Ja, auch die Tags für das Conversion Tracking können (und sollten) über den Google Tag Manager (GTM) verwaltet werden. Das hat den Vorteil, dass du alle deine Tags zentral an einem Ort verwalten und flexibel auf Einwilligungen reagieren kannst.
Einrichten von Conversion Tracking im Google Tag Manager

Hier sind die Schritte, um Conversion Tracking Tags im GTM einzurichten:
1. Conversion Tracking Tag im GTM erstellen

Öffne dein Google Tag Manager Konto und wähle den entsprechenden Container.
Erstelle ein neues Tag:
Klicke auf "Tags" im linken Menü.
Klicke auf "Neu" und gib dem Tag einen Namen (z. B. "Google Ads Conversion Tracking").
Tag-Typ auswählen:
Klicke auf "Tag-Konfiguration" und wähle den entsprechenden Tag-Typ aus, z. B. "Google Ads Conversion Tracking".
Conversion ID und Conversion Label eingeben:
Gib die Conversion ID und das Conversion Label ein, die du von deinem Google Ads Konto erhalten hast.

2. Conversion Tracking Trigger hinzufügen

Trigger hinzufügen:
Klicke auf "Triggering" und wähle einen passenden Trigger aus, z. B. "Page View" für alle Seitenaufrufe oder einen benutzerdefinierten Trigger für spezifische Conversion-Ereignisse.
Du kannst benutzerdefinierte Trigger für spezifische Conversion-Aktionen wie Formulareinsendungen oder Käufe erstellen.

3. Google Consent Mode und PrivacyWire Einbindung

Stelle sicher, dass du den Google Consent Mode und die PrivacyWire Einbindung gemäß den Einwilligungen der Nutzer aktualisierst.

Einrichten von Conversion Tracking im GTM
1. Gehe zu deinem GTM-Konto und erstelle ein neues Tag für Conversion Tracking.

Klicke auf "Tags" und dann auf "Neu".
Wähle "Google Ads Conversion Tracking" als Tag-Typ.
Gib deine Conversion ID und dein Conversion Label ein.

2. Erstelle den Trigger für das Conversion Tracking.

Klicke auf "Trigger" und dann auf "Neu".
Wähle einen Trigger-Typ aus, z. B. "Page View" oder einen benutzerdefinierten Trigger für spezifische Aktionen.

3. Füge den Trigger zum Conversion Tracking Tag hinzu.

Verknüpfe den Trigger mit deinem Conversion Tracking Tag.

4. Veröffentliche die Änderungen im GTM.

Klicke auf "Senden" und dann auf "Veröffentlichen", um die Änderungen zu aktivieren.

Mit dieser Konfiguration werden alle Tags, einschließlich der Conversion Tracking Tags, über den Google Tag Manager verwaltet und basierend auf den Einwilligungen der Nutzer korrekt ausgelöst.

Datei:Google Tagassistant 1.png

2024-11-28T17:28:26Z

Steff:

Testen der Google Consent V2 Konfiguration im Tagassistant

Datei:Handpan-Kurd.png

2024-07-02T16:57:50Z

Steff:

Handpan in Kurd Stimmung

Datei:Handpan-Amara-Celtic.png

2024-07-02T16:57:16Z

Steff:

Amara Celtic Stimmung

Musik

2024-07-02T16:56:28Z

Steff:

== Musik allgemein ==
[[Musik Hardware und Software]]
[[Komposition]]
[[Musik - Creating Moods / Stimmung erzeugen]]
[[Musikproduktion - EQ Einstellungen]]

== Handpan ==
[[Handpan - Stimmungen]]

Musikproduktion - EQ Einstellungen

2024-07-02T16:49:16Z

Steff: Die Seite wurde neu angelegt: „EQ Bereiche rahmenlos“

EQ Bereiche

[[Datei:EQ-Einstellungen.png|rahmenlos]]

Datei:EQ-Einstellungen.png

2024-07-02T16:48:46Z

Steff:

Equilizer Einstellungsbereiche

Musik

2024-07-02T16:47:44Z

Steff:

[[Musik Hardware und Software]]
[[Komposition]]
[[Musik - Creating Moods / Stimmung erzeugen]]
[[Musikproduktion - EQ Einstellungen]]

DaVinci Resolve - Color Grading

2024-07-02T16:32:12Z

Steff: /* Beispiel Color Grading Nodes */

== Links ==
https://www.youtube.com/watch?v=FUhLgYfyFkE - DaVinci Resolve Color Tab **
[[DaVinci Resolve - Tipps und Tricks]]
https://www.youtube.com/watch?v=7YqrgaT1rxQ - Guter Einstieg mit 2 bis 4 Node Strategy
[[Video - Color Space und Luminanz Dynamik anpassen]]
[[DaVinci Resolve - Color Management, Farbräume, Luminanzdynamik]]

== Hinweis: Color Space und Luminanz-Dynamik ==
Bevor du loslegst solltest du checken in welchem Farbraum dein Material vorliegt. Dann kannst du die Videoschnittsoftware passend einstellen. Check den Link [[DaVinci Resolve - Color Management, Farbräume, Luminanzdynamik]]

== Wie geht Color Grading? ==
Was beinhaltet Color Grading und wie kann man vorgehen. Wichtig ist hier ein sinnvoller Workflow. Man sollte immer zunächst das Material sauber korrigieren und einstellen und erst danach an künstlerische Aspekte oder gar LUTs denken.

=== Color Grading Methodology ===
Hier die wichtigsten Punkte die man im Grading Workflow berücksichtigen sollte. Je nach Material und Anforderung muss man nicht für jeden Punkt im Detail Arbeit investieren.

# '''Kontrast''' anpassen: Kontrast erhöhen/verringern
# '''Sättigung einstellen''': Sättigung steigern oder veringern
# '''Highlight und Schattenverbesserung''': Highlight-Wiederherstellung (Details in überbelichteten Bereichen zurückbringen, indem Lichter wiederhergestellt werden) und Schattenlift (versteckte Details in dunkleren Bereichen des Bildes aufdeckt)
# Verwende die Farbräder, Kurven (Licht und Farben) oder LUTs, um die '''Balance von Lichtern, Mitteltönen und Schatten''' anzupassen
# HSL (Schatten/Sättigung/Helligkeit) anpassen: Isolieren und anpassen '''bestimmter Farben''' im Bild mit den HSL-Steuerelementen
# '''Split Tone''' an: Färben Lichter und Schatten unabhängig voneinander mit unterschiedlichen Farben.

=== Werkzeuge ===
Mit diesen Werkzeugen oder Strategien kannst du Color Grading realisieren.
* Nimm '''gezielte Anpassungen''' am Bild mit Power Windows und Qualifiers vor.
* Realisiere Änderungen an Farbe, Leuchtdichte und anderen Kriterien indem du '''Bereiche''' mithilfe von Keying und Qualifizierern isolierst.
* '''Mischmodi''': Experimentiere mit verschiedenen Mischmodi (Normal, Multiplizieren, Bildschirm, Überlagerung, weiches Licht, Hartlicht, Addieren, Subtrahieren, Differenz, HSCL, Ausschluss, benutzerdefiniertes Alpha): Wie Anpassungsebenen, Ebenen und Knoten miteinander gemischt werden
* Nutze Inspirationsquellen und Referenzen für Farbpaletten z.B.
https://shotdeck.com (Kostenpflichtig)
https://digitalsynopsis.com/design/cinema-palettes-famous-movie-colors/
Suche nach Movie Color Palette

== Color Correction / Balancing ==
=== Quick CC Method ===
Eine einfache schnelle Strategie für saubere Farben ist Folgende:
Color Tab > Histogramm anschalten
Bild mit hoher Dyamik suchen
Dynamikkurve > Grenzen auf Lichter und Schatten einstellen
Bei Bedarf Schatten mit Kurve wieder mehr Zeichnung holen.
Gamma anpassen (dunkler für Cinematic Look, oder heller je nach Wunsch)
Gain leicht ins Grün ziehen für mehr Filmic Look.

== Beispiele für Color Grading Workflows ==
=== Node Strategy ===
Zum Einstieg eignen sich bestimmte Nodes die man immer wieder in der gleichen Reihenfolge einsetzt. Dabei unterscheidet man die Bereiche Color Correction und Grading. Also zuerst die Korrektur des Footage, dann der Stil. Die Bereiche kann man wiederum in mehrere Teilbereiche unterteilen.
==== 2 Node Strategy ====
1.Color Correction - 2.Color Grading

Bei der Color Correction kann man auch mit der Automatik beginnen.
==== 4 Node Strategy ====
Eine feinere Unterteilung wäre folgende:

1.Color Correction - 2.Gamma Correction - 3.Shadows and Higlights - 4.Color Grading
Für die Gamma Correction kann man z.B. die Gradientenkurve nehmen. Shadows und Highlights über die Korrekturrädchen.

Auch hier lassen sich wieder alle Bereiche in Teilbereiche unterteilen.

=== Artistic Contrast mit Opposite Color Methode ===
https://www.youtube.com/watch?v=zB4va-xVFqM

Die Technik basiert darauf, nur zwei Farben im Bild zu behalten und sicherzustellen, dass sie einen starken Farbkontrast haben.
Diese Methode eignet sich hervorragend für künstlerische Projekte, bei denen Farbgenauigkeit nicht oberste Priorität hat.

* '''Reduzieren der Farbpalette''' Beginnen Sie damit, alle Farben außer zwei aus dem Bild zu entfernen. Diese beiden Farben sollten auf gegenüberliegenden Seiten des Farbkreises liegen, um einen starken Kontrast zu erzeugen.
* Anpassung der '''Sättigung''' Da die ausgewählten Farben möglicherweise zu gesättigt sind, ist es ratsam, die Sättigung zu reduzieren, um ein ausgewogeneres Farbbild zu erhalten.
* Anpassung des '''Farbtons''' Falls erforderlich, können Sie den Farbton der ausgewählten Farben anpassen, um sicherzustellen, dass sie harmonisch zueinander passen (Hue Regler). Es ist außerdem sinnvoll bei den folgenden Schritten im Vectroskop die Hauttöne anzeigen zu lassen. Dann kann man die Farben darauf anpassen.
** Hauttonfarbe erhalen über Hue Regler Rottöneauf '''Hautton''' drehen
** Behandlung von Grün '''Wenn Ihr Bild viel Grün enthält''' und Sie diesen Farbton beibehalten möchten, können Sie eine zusätzliche Technik anwenden. Erstellen Sie eine Linie von Farben auf der gegenüberliegenden Seite des Farbkreises, die Grün einschließen. Dadurch können Sie Grün separat steuern, ohne die anderen ausgewählten Farben zu beeinflussen.
Feinabstimmung Verwenden Sie die eingebauten Werkzeuge, wie den Hue-Controller, um Feinabstimmungen an den ausgewählten Farben vorzunehmen, um das gewünschte Ergebnis zu erzielen.
Fertigstellung Die endgültige Bildbearbeitung sollte zu einem Bild führen, bei dem die ausgewählten Farben perfekt kontrastieren und harmonieren.

=== Teal Orange Look - Pro Workflow ===
https://www.youtube.com/watch?v=IDP3j_4icBo
==== Nodes für Balancing ====
Highlights -
Printer Lites - Primaries CC -
Teal Orange Corr - Teal Orange Look - Teal Orange Adj. -
Glow - Grain

=====1. Balancing (Base Grade)=====

'''Primaries'''

Offset, Contrast, Focus auf Skin etc.

'''Printer lites'''

Offset Color angleichen (dezent vorgehen)

=====2. Grading=====
'''Teal Orange Look'''

Lift (Teal) - Gamma (gegensteuern um Hauttöne wieder herzustellen)

'''Teal Orange Correction'''

Fokus auf '''Lichter, Schwarz, Hauttöne''' - dies sind die wichtigen Bereiche die den Look professionell ausschauen lassen. Schatten dürfen nicht gefärbt und übersättigt ausschauen. Hauttöne sollen natürlich ausschauen
* Shadow > gegen Teal steuern
* Midtones > mehr Orange in die Hauttöne bringen
* Highlights falls gefärbt ebenfalls anpassen.

'''Look Adjustment '''

Look lebendiger machen.
* Lift
* Splines etc...

'''Glow'''

Glow Effekt

Composite Type > Softlight
Spread > 0
Blend > reduzieren damit es nicht zu unnatürlich wirkt.

===== 3. Fine Tuning =====
'''Highlights'''

Shift + A (Auswahl anzeigen) > Highlights über Luminance Qualifier auswählen
Highlights reduzieren damit Zeichnung da ist und das Teal mehr durchkommt.
Fine Tuning z.b. bei den Look Adjustments
Mehr Filmic Look > Hue vs Sat > Rottöne etwas runter > evtl. Gelb auch etwas.

'''Grain'''
Am Ende (weil Rechenintensiv)
Grain Effekt

=== Beispiel Color Grading Nodes ===

[[Datei:ColorGradingNodes-01.png|rahmenlos]]

== Color Grading Tipps und Tricks ==
=== LUTs richtig einsetzen ===
LUTs sind immer für einen bestimmten Color Space gemacht - zumindest wenn Sie nicht erstellt sind um von einem Color Space in den anderen zu transformieren.
Das bedeutet du musst sie im '''richtigen Color Space''' einsetzen, sonst erzielst du nicht das gewünschte Ergebnis. Außerdem ist es wichtig zuerst dein Material zu normalisieren und dann die LUT zu verwenden. In DaVinci Resolve kannst du das mit den Knoten gut organisieren. Beispiel für die mitgelieferten DaVinci Film Looks.

Input Color Space Transform (ICT) > Farbkorrektur im Working Color Space > Output Color Space Transform (i.d.R to Rec.709)
> CST mit Gamma Cineon Film Log (Rest bleibt auf Timeline bzw. Default)

So erhälst du das richtige Gamma für die Stock LUTs. Sinnvoll ist immer der Einsatz am Ende der Kette. Du kannst schon am Anfang (nach der Color Correction) eine Richtung mit dem LUT Node vorgeben und den Look in den Knoten davor nach Wunsch tweaken.

Teste mal ob der LUT Knoten besser vor dem letzten Color Transform funktioniert. Evtl. einfach Color Transforms für den LUT davor und dahinter schalten (ungetestet).

=== Schnelle Grading Tipps ===

==== Blue Shadows ====
Add Blue to Shadows (Lift Blue Channel)
Reduce Blue in Highlights (Gain Blue Channel)
Lum vs Sat > Reduce Saturation in Shadows

==== Rich Colors with Color Space Nodes ====
https://www.youtube.com/watch?v=Ze7bRAuIQGg
Basiert darauf, dass man mit '''Nodes in verschiedenen Color Spaces''' unterschiedliche Aspekte gezielt beeinflussen kann.
Knoten im HSV CS > Gain > Grün erhöhen
Der Grünregler regelt jetzt die Sättigung der Farben ohne deren Helligkeit zu verändern. Das kann allerdings Probleme im Blaukanal (vor allem in den Tiefen) erzeugen. Also aufpassen und ggfls '''Node davor''' setzen und:
Hue vs Sat > Blau Bereich weniger Sättigung
Schatten aufhellen

=== Filmic Look mit Desaturate Shadows / Dark Chroma ===
Problem wenn man für einen Film Look Farben verändert entstehen oft, da die Schatten nach Farbkorrekturen (oder Styles) zu stark gesättigt sind. So kannst du dass beheben:

Möglichkeit 1: In DaVinci via
Sat vs Luma Sättigung aus den Schattenziehen

Möglichkeit 2: In DaVinci Knoten auswählen und
Color > Presets > Chroma Dark
Dies erzeugt eine qualified Mask für die Schatten und zieht die Sättigung raus.

Jetzt kannst du vor dem Entfernen der Sättigung einen Knoten setzen in dem du ein Offset für die Farben machen kannst. Das sieht jetzt richtig gut aus, da die Schatten "schattig" bleiben.

=== Hochglanz-Look mit Highlight-Shadow Compression ===
Ein Look wie in Kochshows oder im Real-Estate Bereich mit kräftigen Farben und sehr durchgezeichneten Lichtern und Schatten bekommst du mit einem einfachen Trick:
* Scopes am besten Waveform anzeigen un zu sehen was passiert.
* 1. Node Color Wheels '''Schatten +100, Highlights -100'''
* 2. Node '''Auto Color'''
* 1. Node '''Mid Details''' anpassen, dass keine Halos bei großen Kontrasten mehr da sind.
* 3. Node bei Bedarf '''Gamma und Gain''' etc. anpassen.

=== Color System auf Timeline ===
DaVinci Resolve kann pro Timeline unterschiedliche Color Systems verwenden.

=== ACES Workflow ===
ACES ist ein Color Science Setting. Es versucht bei Anpassungen das Verhalten des menschlichen Auges nachzuempfinden. Wenn man z.B. die Helligkeit manipuliert versucht es zu vermeiden das Lichter oder Schatten verloren gehen und komprimiert stattdessen im oberen und unteren Bereich.

Auf diese Weise kann man Color Gradings effektiver vornehmen.

Man kann ACES z.B für die Timeline setzen. Es geht auch über die Project Setting aber so kannst du mit mehreren Timelines verschiedene Dinge ausprobieren.

Timeline > Rechtsklick > Timelines > Timeline Settings
Color Tab > Use Project Settings abhaken
Color Science > ACEScct
ACES Output Transform Rec.709 (Anzeigemonitor nutzt Rec.709)

Als nächstes '''ACES Input Transform''' für alle Clips auswählen
Color Tab > Clips auswählen > Rechtsklick > Color Space auswählen

== LUTs ==
https://freshluts.com/ - LUTs zum Downloaden
https://www.youtube.com/watch?v=Wwwa6eDdLXU - How to install und bessere Settings für LUT Processing/Interpolation
=== Cineon Film LUTS ===
DaVinci Resolve hat ein paar gute Film Luts für Rec.709. Aber Vorsicht. Sie sind für Filmscanning gedacht und wirken auf den ersten Blick viel zu dunkel. Man muss den
Gamma Output des Knotens > Cineon Film Log stellen.

=== Stärke von LUTs verringern ===
Node für LUT OHNE den Output zu verändern
Node für Color Space Transform > Gamma Out > Cineon Film Log (VOR den LUT Node)
Beide Nodes markieren > Compound Node
Key Tab > Gain Regler > Stärke einstellen.

Datei:ColorGradingNodes-01.png

2024-07-02T16:31:36Z

Steff:

DaVinci Color Grading Nodes

Swift - Singleton Pattern

2023-01-31T17:27:11Z

Steff:

== Links ==
[[Swift (Programmiersprache)]]

== Einführung ==
Singletons sind Eigenschaften einer Klasse, die in allen Instanzen der Klasse gleich sind. Wenn man den Wert in einer Instanz ändert, sind auch alle anderen Instanzen betroffen.

Daher kann man sie nutzen, wenn man über alle Instanzen immer auf den gleichen Wert zugreifen will, egal wo sich die Instanz befindet.

Um diese Eigenschaft zu realisieren nutzt das Singleton Pattern eine statische Variable. In dieser Variable wird eine Instanz der Klasse selbst gespeichert.

Normalerweise kann man auf eine static var nur über den Klassennamen zugreifen. Dadurch dass die Klasse sich selbst als Eigenschaft enthält kann man nun auch über die Instanzen auf statische Variablen zugreifen.

<syntaxhighlight lang="swift">
import UIKit

/**
With the singleton pattern you can share properties through all instances of a class
*/

/**
Normally all properties of a class are independent of each other...
*/
class Car{
var color = "red"
}

var aCar = Car()
aCar.color = "blue"
var bCar = Car()
// aCar is blue, bCar ist red

/**
With singleton pattern you create a instance of the class itself
as a property of the class
*/
class Ship{
var color = "red"
static let singletonShip = Ship()
}
var aShip = Ship.singletonShip
var bShip = Ship.singletonShip
// now aShip and bShip hold a reference to the SAME object
bShip.color = "pink"
print(aShip.color) // pink
print(bShip.color) // pink

// Singletons are used in Swift ie
// UserDefaults.defaults
</syntaxhighlight>

Swift - Singleton Pattern

2023-01-31T17:21:39Z

Steff:

== Links ==
[[Swift (Programmiersprache)]]

== Einführung ==
Singletons sind Eigenschaften einer Klasse, die in allen Instanzen der Klasse gleich sind. Wenn man den Wert in einer Instanz ändert, sind auch alle anderen Instanzen betroffen.

Daher kann man sie nutzen, wenn man über alle Instanzen immer auf den gleichen Wert zugreifen will, egal wo sich die Instanz befindet.

Um diese Eigenschaft zu realisieren nutzt das Singleton Pattern eine statische Variable. In dieser Variable wird eine Instanz der Klasse selbst gespeichert.

Frage wenn man statt einer Instanz der Klasse selbst eine Instanz einer andern Klasse als statische Variable definiert. Ist das dann auch ein Singleton?

<syntaxhighlight lang="swift">
import UIKit

/**
With the singleton pattern you can share properties through all instances of a class
*/

/**
Normally all properties of a class are independent of each other...
*/
class Car{
var color = "red"
}

var aCar = Car()
aCar.color = "blue"
var bCar = Car()
// aCar is blue, bCar ist red

/**
With singleton pattern you create a instance of the class itself
as a property of the class
*/
class Ship{
var color = "red"
static let singletonShip = Ship()
}
var aShip = Ship.singletonShip
var bShip = Ship.singletonShip
// now aShip and bShip hold a reference to the SAME object
bShip.color = "pink"
print(aShip.color) // pink
print(bShip.color) // pink

// Singletons are used in Swift ie
// UserDefaults.defaults
</syntaxhighlight>

Swift - static vars

2023-01-31T17:15:21Z

Steff:

== Links ==
[[Swift (Programmiersprache)]]
[[Swift - Singleton Pattern]]

== Einführung ==

In Swift kann man eine Klasse oder Struktur mit einer statischen Variablen definieren.

* Der Wert einer static var hat ist '''für alle Instanzen einer Klasse oder Struktur gleich.'''
* Dies bedeutet, der Wert wird nur einmal initialisiert wird und bleibt '''für die gesamte Lebensdauer der Anwendung erhalten'''. Selbst wenn keine Instanz mehr vorhanden ist.
* Der Wert wird nicht über eine Instanz sondern über die Klasse selbst gelesen oder gesetzt.
* Um eine static var zu definieren, kann man das Schlüsselwort static vor einer normalen Variablendeklaration verwenden. Hier

== Beispiele ==

<syntaxhighlight lang="swift">
class MyClass {
static var sharedValue = 0
}
</syntaxhighlight>

Um auf den Wert einer static var zuzugreifen, kann man den Klassennamen und den Variablennamen verwenden. Hier ist ein Beispiel:

<syntaxhighlight lang="swift">
MyClass.sharedValue = 10
print(MyClass.sharedValue) // Ausgabe: 10
</syntaxhighlight>

Es ist wichtig zu beachten, dass man eine static var nicht über eine Instanz einer Klasse oder Struktur aufrufen kann. Man muss stattdessen den Klassennamen verwenden.

Swift - static vars

2023-01-31T17:14:15Z

Steff: Die Seite wurde neu angelegt: „In Swift kann man eine Klasse oder Struktur mit einer statischen Variablen definieren. * Der Wert einer static var hat ist '''für alle Instanzen einer Klass…“

In Swift kann man eine Klasse oder Struktur mit einer statischen Variablen definieren.

* Der Wert einer static var hat ist '''für alle Instanzen einer Klasse oder Struktur gleich.'''
* Dies bedeutet, der Wert wird nur einmal initialisiert wird und bleibt '''für die gesamte Lebensdauer der Anwendung erhalten'''. Selbst wenn keine Instanz mehr vorhanden ist.
* Der Wert wird nicht über eine Instanz sondern über die Klasse selbst gelesen oder gesetzt.
* Um eine static var zu definieren, kann man das Schlüsselwort static vor einer normalen Variablendeklaration verwenden. Hier

== Beispiele ==

<syntaxhighlight lang="swift">
class MyClass {
static var sharedValue = 0
}
</syntaxhighlight>

Um auf den Wert einer static var zuzugreifen, kann man den Klassennamen und den Variablennamen verwenden. Hier ist ein Beispiel:

<syntaxhighlight lang="swift">
MyClass.sharedValue = 10
print(MyClass.sharedValue) // Ausgabe: 10
</syntaxhighlight>

Es ist wichtig zu beachten, dass man eine static var nicht über eine Instanz einer Klasse oder Struktur aufrufen kann. Man muss stattdessen den Klassennamen verwenden.

Swift (Programmiersprache)

2023-01-31T17:04:37Z

Steff: /* Funktionen und Eigenschaften */

Programmiersprache im Einsatz in der Apple Welt (MacOs, iOS, WatchOs...)

== Links ==
[[SwiftUI]]
https://www.swift.org/ - Dokumentation einfacher Verständlich als die offizielle von Apple
https://iosref.com/ - Cheatsheets, Statistiken zu OS Verbreitung und mehr

== Konzepte ==
=== Einfache Datentypen ===
[[Swift - Strings]]
[[Swift - Arrays]]
[[Swift - Optionals]]
[[Swift - Tuples]]

=== Collection Datatypes und komplexe Datentypen ===
[[Swift - Dictionaries]]
[[Swift - Structures (Struct)]]
[[Swift - Classes]]

=== Funktionen und Eigenschaften ===
[[Swift - Closures]]
[[Swift - Computed Properties]]
[[Swift - Internal & External Parameter Names]]
[[Swift - weak & strong vars]]
[[Swift - static vars]]
[[Swift - @state vars]] (nur SwiftUI)

==== Auswahl wichtiger Funktionen ====
[[Swift - map/reduce/filter]]

=== Extensions ===
[[Swift - Extension]]

== Loops ==
[[Swift Loops & Animations]]

== Networking ==
=== URLSession for Networking ===
[[Swift - URLSession]]

== Snippets ==
[[Swift - Snippets]]

== Frameworks ==
=== Building a Swift Framework ===
[[Building a Swift Framework]]

=== UIKit ===
UIKit stellt die meisten der gängigen iOS Bedienelemente bereit und ist das wichtigste Modul, wenn es um die Erstellung von iOS Apps geht.
[[UIKit Framework]]

=== Cocoapods Dependency Manager ===
[http://cocoapods.org cocoapods.org]
[[Cocoapods]]
Cocoapods ein Dependency Manager für Swift and Objective-C Cocoa Projekte. Es gibt hier für viele Zwecke freien Code von Programmierern. Über den Dependency Manager kann man dafür sorgen, dass man stets die aktuelle Version in seinen Projekten hat.

=== Google Firebase ===
Development platform für Apps, Spiele und Anbindung an Google Dienstleistungen.
https://firebase.google.com&
[[Swift & Firebase]]

== Assets ==
=== Dark Mode / Light Mode ===
'''System Colors''' verwenden oder '''Color Sets''' in den Assets anlegen.

Bilder können ebenfalls mehrere Versionen für Light und Dark bereitgestellt werden.
Appearances > Any, Light, Dark

=== Vektor Assets ===
Resizing > Preserve Vector Data
Scales > Single Scale (es wird nur eine Version benötigt)

=== Custom Assets ===
Todo

== Protocols & Delegates ==
[[Swift - Protocols]]
[[Swift - Decodable & Encodable]]
[[Swift - Delegate]]

== Daten speichern ==
[[Swift - Möglichkeiten Daten zu speichern]]

== Error Handling ==
[[Swift - Error Handling]]

== Swift - Audio ==
[[Swift - Audio Playback]]
[[AVAudioPlayerNode]] - geeignet für zeitkritisches Timing

== Swift - Location Data ==
[[Swift - CoreLocation]]

== Xcode ==
[[Xcode - Tipps & Tricks]]

== Best Practices ==
=== Constants File ===
[[Swift - Constants File]]

Swift - Singleton Pattern

2023-01-31T17:00:49Z

Steff:

== Links ==
[[Swift (Programmiersprache)]]

== Einführung ==
Singletons sind Eigenschaften einer Klasse, die in allen Instanzen der Klasse gleich sind. Wenn man den Wert in einer Instanz ändert, sind auch alle anderen Instanzen betroffen.

Daher kann man sie nutzen, wenn man über alle Instanzen immer auf den gleichen Wert zugreifen will, egal wo sich die Instanz befindet.

<syntaxhighlight lang="swift">
import UIKit

/**
With the singleton pattern you can share properties through all instances of a class
*/

/**
Normally all properties of a class are independent of each other...
*/
class Car{
var color = "red"
}

var aCar = Car()
aCar.color = "blue"
var bCar = Car()
// aCar is blue, bCar ist red

/**
With singleton pattern you create a instance of the class itself
as a property of the class
*/
class Ship{
var color = "red"
static let singletonShip = Ship()
}
var aShip = Ship.singletonShip
var bShip = Ship.singletonShip
// now aShip and bShip hold a reference to the SAME object
bShip.color = "pink"
print(aShip.color) // pink
print(bShip.color) // pink

// Singletons are used in Swift ie
// UserDefaults.defaults
</syntaxhighlight>

PrivacyWire - ProcessWire Modul

2023-01-30T14:30:03Z

Steff: /* CSS */

PrivacyWire - ProcessWire Modul

2023-01-30T13:39:14Z

Steff: /* Quickstart Cookie Consent für ProcessWire */

PrivacyWire - ProcessWire Modul

2023-01-30T13:36:54Z

Steff:

Swift - Audio Playback

2023-01-28T11:09:25Z

Steff: /* Audio in background */

TODO
== Links ==
[[Swift (Programmiersprache)]]
[[Swift - Play a Sound]]

== Einführung ==
Es gibt untschiedliche Möglichkeiten Audio abzuspielen je nachdem was man möchte.

Jede Möglichkeit ist unterschiedlich aufwändig. Es gibt außerdem Klassen um den Systemmixer zu steuern oder das Verhalten wenn die App in den Hintergrund geht zu beeinflussen.

== Glossar ==
=== AVFoundation ===
==== AVAudioSession ====
AVAudioSession ist ein Singleton-Objekt, das die Audio-Sitzung für Ihre App verwaltet. Es ist verantwortlich für die '''Konfiguration der Audio-Routen''', wie dem Ausgabegerät (z.B. Lautsprecher oder Headset) und für die Verwaltung des Zustands der Audio-Sitzung (z.B. aktiv oder inaktiv). AVAudioSession bietet auch Methoden zur Steuerung der '''Eigenschaften der Audio-Sitzung''', wie der Lautstärke und der Audio-Kategorie.

==== AVAudioPlayerNode ====
AVAudioPlayerNode wird verwendet, um '''Audio-Puffer und -Dateien''' innerhalb eines AVAudioEngine-Graphen '''abzuspielen'''. Es kann verwendet werden, um das Abspielen von Audio-Puffern und -Dateien zu planen, die Wiedergabegeschwindigkeit, den Pan und die Lautstärke zu ändern und einen Rückruf bereitzustellen, wenn die Wiedergabe abgeschlossen ist.

'''Zusammengefasst wird AVAudioSession verwendet, um die Gesamt-Audio-Sitzung für Ihre App zu konfigurieren, während AVAudioPlayerNode verwendet wird, um spezifische Audio-Puffer und -Dateien innerhalb dieser Sitzung abzuspielen.'''

== Audio im Hintergrund abspielen ==
App für Hintergrundplayback konfigurieren

'''In Info.plist'''
<syntaxhighlight lang="xml">
...
<plist version="1.0">
<dict>
...
<key>UIBackgroundModes</key>
<array>
<string>audio</string>
</array>
</dict>
</plist>
</syntaxhighlight>

=== Mit AVAudioPlayer ===
Wenn du die AVAudioPlayer Klasse nutzt stelle die '''numberOfLoops property to -1''' so that the audio will play indefinitely.
<syntaxhighlight lang="swift">
audioPlayer.numberOfLoops = -1
audioPlayer.play()
</syntaxhighlight>

Außerdem mußt du in der AVAudioSession die '''korrekte Kategorie''' setzen. Die Kategorie legt z.B. fest wie mit welcher Priorität Background Audio behandelt wird, falls ein Anfruf reinkommt etc.

<syntaxhighlight lang="swift">
try AVAudioSession.sharedInstance().setCategory(.playback, mode: .default)
</syntaxhighlight>

Es gibt außerdem auch eine '''maximale Dauer die das System für Background Audio erlaubt'''. Die genaue Zeit hängt von verschiedenen Faktoren ab. Unter anderem welche Ressourcen die App benötigt und auf welche Art Audio abgespielt wird. Wenn die App vom System beendet wird ist natürlich Schluss mit Ton.

=== Mit AVAudioEngine ===
Hier ist das Vorgehen ähnlich - auch hier musst du die AVAudioSession richtig konfigurieren:
<syntaxhighlight lang="swift">
// Audio session should play in background
let audioSession = AVAudioSession.sharedInstance()
do {
try audioSession.setCategory(.playback)
// try AVAudioSession.sharedInstance().setActive(true) // neeeded?
} catch {
print("Setting category to AVAudioSessionCategory .playback failed.")
}
</syntaxhighlight>
Evtl. muss man die Session noch aktivieren. Aber bei meinen Tests war das nicht nötig. Sie wurde automatisch (wahrscheinlich über die AudioEngine) aktiviert (siehe Kommentar im Code.

=== Allgemeine Tipps für Apps im Background ===
However, you can help the system to save energy by following some best practices:

Minimize the use of location services, push notifications, and background tasks when your app is not in use.
Use the beginBackgroundTaskWithExpirationHandler method to execute any critical tasks before your app is suspended.
Avoid using CPU-intensive tasks when your app is in the background, as this can drain the battery.
When your app is not in use, release any resources that are not needed, such as images and sounds.

By following these practices, your app will be less likely to consume excessive power and will provide a better user experience by not draining the battery.

It is also possible to suggest to the user to close the app when it's not in use, or to use low power mode in the settings.

Keep in mind that, as a developer, you don't have the power to force the app to go to background or to shut down, but by following best practices you can help the system to save energy.

Swift - Audio Playback

2023-01-28T10:51:01Z

Steff: v1

Swift - Audio Playback

2023-01-28T10:40:11Z

Steff: /* Links */

Swift - Möglichkeiten Daten zu speichern

2023-01-28T10:37:24Z

Steff: Einführung

== Links ==
[[Swift (Programmiersprache)]]

== Einführung ==
Es gibt mehrere Möglichkeiten, Benutzerdaten wie Notizen oder Einkaufslisten in einer iPhone-App, die in Swift geschrieben ist, zu speichern. Einige der populärsten Optionen sind:

# '''User Defaults:''' Dies ist eine einfache und einfach zu verwendende Methode zum Speichern von kleinen Mengen an Benutzerdaten. Es speichert Daten im Schlüssel-Wert-Paar-Format und die Daten werden automatisch gespeichert, wenn die App geschlossen wird oder im Hintergrund läuft.
# '''Core Data:''' Core Data ist ein Framework für objektrelationales Mapping (ORM), mit dem Entwickler auf das Datenmodell der App zugreifen können. Es ist eine leistungsstarke und flexible Lösung zum Speichern und Abrufen großer Datenmengen und bietet Funktionen wie Rückgängig- und Wiederholen-Funktionen, Änderungsverfolgung und Datenvalidierung.
# '''Realm:''' Realm ist ein von Dritten bereitgestelltes ORM, das Core Data ähnlich ist, aber im Allgemeinen als leichter und schneller gilt.
# '''Codable - File I/O:''' Dies ist die traditionelle Methode zum Speichern von Daten in iOS-Apps. Entwickler können Daten mithilfe des Foundation-Frameworks von und auf das lokale Dateisystem der App lesen und schreiben. Codable hilft dabei zum En- und Dekodieren von Objekten.
# '''Cloud Service:''' Durch die Verwendung von Cloud-Service-Anbietern wie AWS, Firebase oder Firestore kann die Daten auf deren Servern gespeichert werden, anstatt auf dem lokalen Gerät. Dieser Ansatz eignet sich, wenn die Daten unter verschiedenen Benutzern geteilt werden oder auf mehreren Geräten zugänglich sein sollen.

[[Datei:Swift-ios-DatenSpeichern.jpg|800px|zentriert]]

Letztlich hängt die Wahl der Methode zum Speichern von Daten von den spezifischen Anforderungen Ihrer App ab, einschließlich der Menge an zu speichernder Daten, der Komplexität des Datenmodells und den Anforderungen an die Datensynchronisierung und Sicherung.

== User Defaults ==
[[Swift - UserDefaults]]

In iOS ist UserDefaults eine bequeme Klasse zum Speichern von kleinen Mengen an benutzerspezifischen Daten. Es wird von einer plist-Datei unterstützt, die ein einfaches Schlüssel-Wert-Speicherformat ist.

== Beispiele ==
=== Speichern von JSON Daten mit File I/O ===
Siehe auch
[[Swift JSONEncoder]]
[[Swift & JSON]]
<syntaxhighlight lang="swift">
struct Setlist: Codable {
var title: String = "Default"
var songs = [Song]()

mutating func addSong(title: String, frequency: Float){
print("Setlist::addSong")
songs.append(Song(title:title, frequency: frequency))
}
}

struct Song: Codable {
let title: String
let frequency: Float
}

// convert Setlist to json Data
let setlist = Setlist()
setlist.addSong(title: "song1", frequency: 44.1)
let encoder = JSONEncoder()
guard let encoded = try? encoder.encode(setlist) else {
print("Encoding Failed")
return
}

// write json Data to file
let documentsURL = FileManager.default.urls(for: .documentDirectory, in: .userDomainMask).first!
let fileURL = documentsURL.appendingPathComponent("setlist.json")
do {
try encoded.write(to: fileURL, options: .atomic)
} catch {
print("Error saving file: \(error)")
}
</syntaxhighlight>

In diesem Beispiel wird die JSONEncoder Klasse verwendet, um eine Instanz des Structs Setlist in ein JSON-kodiertes Data-Objekt umzuwandeln. Das erzeugte JSON-kodierte Data wird in einer Datei gespeichert . In diesem Fall wird die Datei "setlist.json" im Dokumentenverzeichnis des Geräts gespeichert.
Es ist zu beachten, dass es je nach Anwendungsfall sinnvoll sein kann, die Daten an einem anderen Ort oder in einem anderen Format zu speichern.

==== JSON Data Objekt als String ausgeben ====
<syntaxhighlight lang="swift">
if let jsonString = String(data: encoded, encoding: .utf8) {
print(jsonString)
} else {
print("Could not convert encoded Data to String")
}
</syntaxhighlight>

Dieser Code verwendet encoded Data und wandelt es in einen String um, indem es es decodiert und UTF-8 als Encoding verwendet. Wenn die Konvertierung erfolgreich ist, wird der Inhalt des Strings auf der Konsole ausgegeben.
Es ist zu beachten, dass der JSON String nicht immer lesbar ausfällt, da die Reihenfolge der Werte innerhalb des Objekts oder des Arrays unvorhersehbar ist.

=== Speichern von Daten mit CoreData ===
Das Speichern von Instanzen des Structs Setlist in Core Data erfordert einige zusätzliche Schritte im Vergleich zu User Defaults, da Core Data ein umfangreicheres Framework ist. Hier ist ein Beispiel dafür, wie dies mit Swift und Core Data erreicht werden kann:
<syntaxhighlight lang="swift">
import CoreData

struct Setlist {
var title: String = "Default"
var songs = [Song]()
var objectID: NSManagedObjectID?

mutating func addSong(title: String, frequency: Float){
print("Setlist::addSong")
songs.append(Song(title:title, frequency: frequency))
}
}

struct Song {
let title: String
let frequency: Float
}

// To Save
func saveSetlist(_ setlist: Setlist) {
guard let appDelegate = UIApplication.shared.delegate as? AppDelegate else { return }
let managedContext = appDelegate.persistentContainer.viewContext
let setlistEntity = NSEntityDescription.entity(forEntityName: "SetlistEntity", in: managedContext)!
let setlistMO = NSManagedObject(entity: setlistEntity, insertInto: managedContext)
setlistMO.setValue(setlist.title, forKey: "title")

var songMOs = [NSManagedObject]()
for song in setlist.songs {
let songEntity = NSEntityDescription.entity(forEntityName: "SongEntity", in: managedContext)!
let songMO = NSManagedObject(entity: songEntity, insertInto: managedContext)
songMO.setValue(song.title, forKey: "title")
songMO.setValue(song.frequency, forKey: "frequency")
songMOs.append(songMO)
}
setlistMO.setValue(NSOrderedSet(array: songMOs), forKey: "songs")
setlist.objectID = setlistMO.objectID
do {
try managedContext.save()
} catch let error as NSError {
print("Could not save. \(error), \(error.userInfo)")
}
}

// To Retrieve
func fetchSetlist(with objectID: NSManagedObjectID) -> Setlist? {
guard let appDelegate = UIApplication.shared.delegate as? AppDelegate else { return nil }
let managedContext = appDelegate.persistentContainer.viewContext
let fetchRequest = NSFetchRequest<NSManagedObject>(entityName: "SetlistEntity")
fetchRequest.predicate = NSPredicate(format: "self == %@", objectID as CVarArg)
do {
let setlistMO = try managedContext.fetch(fetchRequest).first
guard let title = setlistMO?.value(forKey: "title") as? String, let songsMO = setlistMO?.value(forKey: "songs") as? Set<NSManagedObject> else {
return nil
}
var songs = [Song]()
forsongMO in songsMO {
let title = songMO.value(forKey: "title") as? String, let frequency = songMO.value(forKey: "frequency") as? Float else {
continue
}
songs.append(Song(title: title, frequency: frequency))
}
var setlist = Setlist(title: title, songs: songs)
setlist.objectID = objectID
return setlist
} catch let error as NSError {
print("Could not fetch. (error), (error.userInfo)")
return nil
}
}
</syntaxhighlight>
Dieses Beispiel verwendet Core Data, um Instanzen des Structs Setlist zu speichern und abzurufen. Es verwendet NSManagedObjects, um die Entitäten von Setlist und Song im Datenmodell darzustellen und die Beziehungen zwischen ihnen zu verwalten. Bitte beachten Sie, dass es hier nur um ein Beispiel geht und dass Core Data viele weitere Funktionen bietet, die je nach Anwendungsfall sinnvoll sein können.

=== Speichern mit SQLite und FMDB ===
Das Speichern von Instanzen des Structs Setlist in SQLite erfordert die Verwendung eines Wrapper-Libraries die eine einfachere Anbindung von SQLite Datenbanken in Swift ermöglicht, wie z.B FMDB. Hier ist ein Beispiel dafür, wie dies mit Swift und FMDB (OpenSoure Lib) erreicht werden kann:
<syntaxhighlight lang="swift">
import FMDB

struct Setlist {
var title: String = "Default"
var songs = [Song]()
var id: Int32?
mutating func addSong(title: String, frequency: Float){
print("Setlist::addSong")
songs.append(Song(title:title, frequency: frequency))
}
}

struct Song {
let title: String
let frequency: Float
}

let databaseQueue = FMDatabaseQueue(url: try! FileManager.default.url(for: .documentDirectory, in: .userDomainMask, appropriateFor: nil, create: true).appendingPathComponent("db.sqlite"))

func createTable() {
databaseQueue.inDatabase { db in
do {
try db.executeUpdate("CREATE TABLE Setlist (id INTEGER PRIMARY KEY, title TEXT);", values: nil)
try db.executeUpdate("CREATE TABLE Song (id INTEGER PRIMARY KEY, title TEXT, frequency REAL, setlist_id INTEGER, FOREIGN KEY(setlist_id) REFERENCES Setlist(id));", values: nil)
} catch {
print(error)
}
}
}

// To Save
func saveSetlist(_ setlist: Setlist) {
databaseQueue.inDatabase { db in
do {
try db.executeUpdate("INSERT INTO Setlist (title) VALUES (?);", values: [setlist.title])
setlist.id = db.lastInsertRowId
for song in setlist.songs {
try db.executeUpdate("INSERT INTO Song (title, frequency, setlist_id) VALUES (?, ?, ?);", values: [song.title, song.frequency,setlist.id])
}
} catch {
print(error)
}
}
}

// To Retrive
func fetchSetlist(with id: Int32) -> Setlist? {
var setlist: Setlist?
databaseQueue.inDatabase { db in
do {
let resultSetlist = try db.executeQuery("SELECT * FROM Setlist WHERE id = ?", values: [id])
if resultSetlist.next() {
setlist = Setlist(title: resultSetlist.string(forColumn: "title")!)
setlist!.id = id
let resultSongs = try db.executeQuery("SELECT * FROM Song WHERE setlist_id = ?", values: [id])
while resultSongs.next() {
let song = Song(title: resultSongs.string(forColumn: "title")!,frequency: resultSongs.double(forColumn: "frequency"))
setlist!.songs.append(song)
}
}
resultSetlist.close()
} catch {
print(error)
}
}
return setlist
}
</syntaxhighlight>
Dieses Beispiel verwendet FMDB, um eine Verbindung zur SQLite-Datenbank herzustellen und Abfragen auszuführen, um Instanzen des Structs Setlist zu speichern und abzurufen. Beachten Sie, dass die Beispielstrukturen und die Datenbanktabellen beide eine ID-Eigenschaft haben, um die Beziehungen zwischen Setlist und Song zu verwalten.
Es gibt auch andere Bibliotheken wie SQLite.swift die auch SQLite in Swift erleichtern.
Ich empfehle Ihnen, sich mit den Best Practices für die Verwendung von SQLite in iOS-Apps vertraut zu machen, um sicherzustellen, dass Ihre Anwendung sicher und performant ist.

Swift - Möglichkeiten Daten zu speichern

2023-01-28T10:36:36Z

Steff: /* Einführung */

== Links ==
[[Swift (Programmiersprache)]]

== Einführung ==
Es gibt mehrere Möglichkeiten, Benutzerdaten wie Notizen oder Einkaufslisten in einer iPhone-App, die in Swift geschrieben ist, zu speichern. Einige der populärsten Optionen sind:

# '''User Defaults:''' Dies ist eine einfache und einfach zu verwendende Methode zum Speichern von kleinen Mengen an Benutzerdaten. Es speichert Daten im Schlüssel-Wert-Paar-Format und die Daten werden automatisch gespeichert, wenn die App geschlossen wird oder im Hintergrund läuft.
# '''Core Data:''' Core Data ist ein Framework für objektrelationales Mapping (ORM), mit dem Entwickler auf das Datenmodell der App zugreifen können. Es ist eine leistungsstarke und flexible Lösung zum Speichern und Abrufen großer Datenmengen und bietet Funktionen wie Rückgängig- und Wiederholen-Funktionen, Änderungsverfolgung und Datenvalidierung.
# '''Realm:''' Realm ist ein von Dritten bereitgestelltes ORM, das Core Data ähnlich ist, aber im Allgemeinen als leichter und schneller gilt.
# '''Codable - File I/O:''' Dies ist die traditionelle Methode zum Speichern von Daten in iOS-Apps. Entwickler können Daten mithilfe des Foundation-Frameworks von und auf das lokale Dateisystem der App lesen und schreiben. Codable hilft dabei zum En- und Dekodieren von Objekten.
# '''Cloud Service:''' Durch die Verwendung von Cloud-Service-Anbietern wie AWS, Firebase oder Firestore kann die Daten auf deren Servern gespeichert werden, anstatt auf dem lokalen Gerät. Dieser Ansatz eignet sich, wenn die Daten unter verschiedenen Benutzern geteilt werden oder auf mehreren Geräten zugänglich sein sollen.

[[Datei:Swift-ios-DatenSpeichern.jpg|800px|zentriert]]

[[|800px|miniatur]]

Letztlich hängt die Wahl der Methode zum Speichern von Daten von den spezifischen Anforderungen Ihrer App ab, einschließlich der Menge an zu speichernder Daten, der Komplexität des Datenmodells und den Anforderungen an die Datensynchronisierung und Sicherung.

== User Defaults ==
[[Swift - UserDefaults]]

In iOS ist UserDefaults eine bequeme Klasse zum Speichern von kleinen Mengen an benutzerspezifischen Daten. Es wird von einer plist-Datei unterstützt, die ein einfaches Schlüssel-Wert-Speicherformat ist.

== Beispiele ==
=== Speichern von JSON Daten mit File I/O ===
Siehe auch
[[Swift JSONEncoder]]
[[Swift & JSON]]
<syntaxhighlight lang="swift">
struct Setlist: Codable {
var title: String = "Default"
var songs = [Song]()

mutating func addSong(title: String, frequency: Float){
print("Setlist::addSong")
songs.append(Song(title:title, frequency: frequency))
}
}

struct Song: Codable {
let title: String
let frequency: Float
}

// convert Setlist to json Data
let setlist = Setlist()
setlist.addSong(title: "song1", frequency: 44.1)
let encoder = JSONEncoder()
guard let encoded = try? encoder.encode(setlist) else {
print("Encoding Failed")
return
}

// write json Data to file
let documentsURL = FileManager.default.urls(for: .documentDirectory, in: .userDomainMask).first!
let fileURL = documentsURL.appendingPathComponent("setlist.json")
do {
try encoded.write(to: fileURL, options: .atomic)
} catch {
print("Error saving file: \(error)")
}
</syntaxhighlight>

In diesem Beispiel wird die JSONEncoder Klasse verwendet, um eine Instanz des Structs Setlist in ein JSON-kodiertes Data-Objekt umzuwandeln. Das erzeugte JSON-kodierte Data wird in einer Datei gespeichert . In diesem Fall wird die Datei "setlist.json" im Dokumentenverzeichnis des Geräts gespeichert.
Es ist zu beachten, dass es je nach Anwendungsfall sinnvoll sein kann, die Daten an einem anderen Ort oder in einem anderen Format zu speichern.

==== JSON Data Objekt als String ausgeben ====
<syntaxhighlight lang="swift">
if let jsonString = String(data: encoded, encoding: .utf8) {
print(jsonString)
} else {
print("Could not convert encoded Data to String")
}
</syntaxhighlight>

Dieser Code verwendet encoded Data und wandelt es in einen String um, indem es es decodiert und UTF-8 als Encoding verwendet. Wenn die Konvertierung erfolgreich ist, wird der Inhalt des Strings auf der Konsole ausgegeben.
Es ist zu beachten, dass der JSON String nicht immer lesbar ausfällt, da die Reihenfolge der Werte innerhalb des Objekts oder des Arrays unvorhersehbar ist.

=== Speichern von Daten mit CoreData ===
Das Speichern von Instanzen des Structs Setlist in Core Data erfordert einige zusätzliche Schritte im Vergleich zu User Defaults, da Core Data ein umfangreicheres Framework ist. Hier ist ein Beispiel dafür, wie dies mit Swift und Core Data erreicht werden kann:
<syntaxhighlight lang="swift">
import CoreData

struct Setlist {
var title: String = "Default"
var songs = [Song]()
var objectID: NSManagedObjectID?

mutating func addSong(title: String, frequency: Float){
print("Setlist::addSong")
songs.append(Song(title:title, frequency: frequency))
}
}

struct Song {
let title: String
let frequency: Float
}

// To Save
func saveSetlist(_ setlist: Setlist) {
guard let appDelegate = UIApplication.shared.delegate as? AppDelegate else { return }
let managedContext = appDelegate.persistentContainer.viewContext
let setlistEntity = NSEntityDescription.entity(forEntityName: "SetlistEntity", in: managedContext)!
let setlistMO = NSManagedObject(entity: setlistEntity, insertInto: managedContext)
setlistMO.setValue(setlist.title, forKey: "title")

var songMOs = [NSManagedObject]()
for song in setlist.songs {
let songEntity = NSEntityDescription.entity(forEntityName: "SongEntity", in: managedContext)!
let songMO = NSManagedObject(entity: songEntity, insertInto: managedContext)
songMO.setValue(song.title, forKey: "title")
songMO.setValue(song.frequency, forKey: "frequency")
songMOs.append(songMO)
}
setlistMO.setValue(NSOrderedSet(array: songMOs), forKey: "songs")
setlist.objectID = setlistMO.objectID
do {
try managedContext.save()
} catch let error as NSError {
print("Could not save. \(error), \(error.userInfo)")
}
}

// To Retrieve
func fetchSetlist(with objectID: NSManagedObjectID) -> Setlist? {
guard let appDelegate = UIApplication.shared.delegate as? AppDelegate else { return nil }
let managedContext = appDelegate.persistentContainer.viewContext
let fetchRequest = NSFetchRequest<NSManagedObject>(entityName: "SetlistEntity")
fetchRequest.predicate = NSPredicate(format: "self == %@", objectID as CVarArg)
do {
let setlistMO = try managedContext.fetch(fetchRequest).first
guard let title = setlistMO?.value(forKey: "title") as? String, let songsMO = setlistMO?.value(forKey: "songs") as? Set<NSManagedObject> else {
return nil
}
var songs = [Song]()
forsongMO in songsMO {
let title = songMO.value(forKey: "title") as? String, let frequency = songMO.value(forKey: "frequency") as? Float else {
continue
}
songs.append(Song(title: title, frequency: frequency))
}
var setlist = Setlist(title: title, songs: songs)
setlist.objectID = objectID
return setlist
} catch let error as NSError {
print("Could not fetch. (error), (error.userInfo)")
return nil
}
}
</syntaxhighlight>
Dieses Beispiel verwendet Core Data, um Instanzen des Structs Setlist zu speichern und abzurufen. Es verwendet NSManagedObjects, um die Entitäten von Setlist und Song im Datenmodell darzustellen und die Beziehungen zwischen ihnen zu verwalten. Bitte beachten Sie, dass es hier nur um ein Beispiel geht und dass Core Data viele weitere Funktionen bietet, die je nach Anwendungsfall sinnvoll sein können.

=== Speichern mit SQLite und FMDB ===
Das Speichern von Instanzen des Structs Setlist in SQLite erfordert die Verwendung eines Wrapper-Libraries die eine einfachere Anbindung von SQLite Datenbanken in Swift ermöglicht, wie z.B FMDB. Hier ist ein Beispiel dafür, wie dies mit Swift und FMDB (OpenSoure Lib) erreicht werden kann:
<syntaxhighlight lang="swift">
import FMDB

struct Setlist {
var title: String = "Default"
var songs = [Song]()
var id: Int32?
mutating func addSong(title: String, frequency: Float){
print("Setlist::addSong")
songs.append(Song(title:title, frequency: frequency))
}
}

struct Song {
let title: String
let frequency: Float
}

let databaseQueue = FMDatabaseQueue(url: try! FileManager.default.url(for: .documentDirectory, in: .userDomainMask, appropriateFor: nil, create: true).appendingPathComponent("db.sqlite"))

func createTable() {
databaseQueue.inDatabase { db in
do {
try db.executeUpdate("CREATE TABLE Setlist (id INTEGER PRIMARY KEY, title TEXT);", values: nil)
try db.executeUpdate("CREATE TABLE Song (id INTEGER PRIMARY KEY, title TEXT, frequency REAL, setlist_id INTEGER, FOREIGN KEY(setlist_id) REFERENCES Setlist(id));", values: nil)
} catch {
print(error)
}
}
}

// To Save
func saveSetlist(_ setlist: Setlist) {
databaseQueue.inDatabase { db in
do {
try db.executeUpdate("INSERT INTO Setlist (title) VALUES (?);", values: [setlist.title])
setlist.id = db.lastInsertRowId
for song in setlist.songs {
try db.executeUpdate("INSERT INTO Song (title, frequency, setlist_id) VALUES (?, ?, ?);", values: [song.title, song.frequency,setlist.id])
}
} catch {
print(error)
}
}
}

// To Retrive
func fetchSetlist(with id: Int32) -> Setlist? {
var setlist: Setlist?
databaseQueue.inDatabase { db in
do {
let resultSetlist = try db.executeQuery("SELECT * FROM Setlist WHERE id = ?", values: [id])
if resultSetlist.next() {
setlist = Setlist(title: resultSetlist.string(forColumn: "title")!)
setlist!.id = id
let resultSongs = try db.executeQuery("SELECT * FROM Song WHERE setlist_id = ?", values: [id])
while resultSongs.next() {
let song = Song(title: resultSongs.string(forColumn: "title")!,frequency: resultSongs.double(forColumn: "frequency"))
setlist!.songs.append(song)
}
}
resultSetlist.close()
} catch {
print(error)
}
}
return setlist
}
</syntaxhighlight>
Dieses Beispiel verwendet FMDB, um eine Verbindung zur SQLite-Datenbank herzustellen und Abfragen auszuführen, um Instanzen des Structs Setlist zu speichern und abzurufen. Beachten Sie, dass die Beispielstrukturen und die Datenbanktabellen beide eine ID-Eigenschaft haben, um die Beziehungen zwischen Setlist und Song zu verwalten.
Es gibt auch andere Bibliotheken wie SQLite.swift die auch SQLite in Swift erleichtern.
Ich empfehle Ihnen, sich mit den Best Practices für die Verwendung von SQLite in iOS-Apps vertraut zu machen, um sicherzustellen, dass Ihre Anwendung sicher und performant ist.

Swift - Möglichkeiten Daten zu speichern

2023-01-28T10:34:26Z

Steff: /* Einführung */

== Links ==
[[Swift (Programmiersprache)]]

== Einführung ==
Es gibt mehrere Möglichkeiten, Benutzerdaten wie Notizen oder Einkaufslisten in einer iPhone-App, die in Swift geschrieben ist, zu speichern. Einige der populärsten Optionen sind:

# '''User Defaults:''' Dies ist eine einfache und einfach zu verwendende Methode zum Speichern von kleinen Mengen an Benutzerdaten. Es speichert Daten im Schlüssel-Wert-Paar-Format und die Daten werden automatisch gespeichert, wenn die App geschlossen wird oder im Hintergrund läuft.
# '''Core Data:''' Core Data ist ein Framework für objektrelationales Mapping (ORM), mit dem Entwickler auf das Datenmodell der App zugreifen können. Es ist eine leistungsstarke und flexible Lösung zum Speichern und Abrufen großer Datenmengen und bietet Funktionen wie Rückgängig- und Wiederholen-Funktionen, Änderungsverfolgung und Datenvalidierung.
# '''Realm:''' Realm ist ein von Dritten bereitgestelltes ORM, das Core Data ähnlich ist, aber im Allgemeinen als leichter und schneller gilt.
# '''File I/O:''' Dies ist die traditionelle Methode zum Speichern von Daten in iOS-Apps. Entwickler können Daten mithilfe des Foundation-Frameworks von und auf das lokale Dateisystem der App lesen und schreiben.
# '''Cloud Service:''' Durch die Verwendung von Cloud-Service-Anbietern wie AWS, Firebase oder Firestore kann die Daten auf deren Servern gespeichert werden, anstatt auf dem lokalen Gerät. Dieser Ansatz eignet sich, wenn die Daten unter verschiedenen Benutzern geteilt werden oder auf mehreren Geräten zugänglich sein sollen.

[[Datei:Swift-ios-DatenSpeichern.jpg|800px|zentriert]]

[[|800px|miniatur]]

Letztlich hängt die Wahl der Methode zum Speichern von Daten von den spezifischen Anforderungen Ihrer App ab, einschließlich der Menge an zu speichernder Daten, der Komplexität des Datenmodells und den Anforderungen an die Datensynchronisierung und Sicherung.

== User Defaults ==
[[Swift - UserDefaults]]

In iOS ist UserDefaults eine bequeme Klasse zum Speichern von kleinen Mengen an benutzerspezifischen Daten. Es wird von einer plist-Datei unterstützt, die ein einfaches Schlüssel-Wert-Speicherformat ist.

== Beispiele ==
=== Speichern von JSON Daten mit File I/O ===
Siehe auch
[[Swift JSONEncoder]]
[[Swift & JSON]]
<syntaxhighlight lang="swift">
struct Setlist: Codable {
var title: String = "Default"
var songs = [Song]()

mutating func addSong(title: String, frequency: Float){
print("Setlist::addSong")
songs.append(Song(title:title, frequency: frequency))
}
}

struct Song: Codable {
let title: String
let frequency: Float
}

// convert Setlist to json Data
let setlist = Setlist()
setlist.addSong(title: "song1", frequency: 44.1)
let encoder = JSONEncoder()
guard let encoded = try? encoder.encode(setlist) else {
print("Encoding Failed")
return
}

// write json Data to file
let documentsURL = FileManager.default.urls(for: .documentDirectory, in: .userDomainMask).first!
let fileURL = documentsURL.appendingPathComponent("setlist.json")
do {
try encoded.write(to: fileURL, options: .atomic)
} catch {
print("Error saving file: \(error)")
}
</syntaxhighlight>

In diesem Beispiel wird die JSONEncoder Klasse verwendet, um eine Instanz des Structs Setlist in ein JSON-kodiertes Data-Objekt umzuwandeln. Das erzeugte JSON-kodierte Data wird in einer Datei gespeichert . In diesem Fall wird die Datei "setlist.json" im Dokumentenverzeichnis des Geräts gespeichert.
Es ist zu beachten, dass es je nach Anwendungsfall sinnvoll sein kann, die Daten an einem anderen Ort oder in einem anderen Format zu speichern.

==== JSON Data Objekt als String ausgeben ====
<syntaxhighlight lang="swift">
if let jsonString = String(data: encoded, encoding: .utf8) {
print(jsonString)
} else {
print("Could not convert encoded Data to String")
}
</syntaxhighlight>

Dieser Code verwendet encoded Data und wandelt es in einen String um, indem es es decodiert und UTF-8 als Encoding verwendet. Wenn die Konvertierung erfolgreich ist, wird der Inhalt des Strings auf der Konsole ausgegeben.
Es ist zu beachten, dass der JSON String nicht immer lesbar ausfällt, da die Reihenfolge der Werte innerhalb des Objekts oder des Arrays unvorhersehbar ist.

=== Speichern von Daten mit CoreData ===
Das Speichern von Instanzen des Structs Setlist in Core Data erfordert einige zusätzliche Schritte im Vergleich zu User Defaults, da Core Data ein umfangreicheres Framework ist. Hier ist ein Beispiel dafür, wie dies mit Swift und Core Data erreicht werden kann:
<syntaxhighlight lang="swift">
import CoreData

struct Setlist {
var title: String = "Default"
var songs = [Song]()
var objectID: NSManagedObjectID?

mutating func addSong(title: String, frequency: Float){
print("Setlist::addSong")
songs.append(Song(title:title, frequency: frequency))
}
}

struct Song {
let title: String
let frequency: Float
}

// To Save
func saveSetlist(_ setlist: Setlist) {
guard let appDelegate = UIApplication.shared.delegate as? AppDelegate else { return }
let managedContext = appDelegate.persistentContainer.viewContext
let setlistEntity = NSEntityDescription.entity(forEntityName: "SetlistEntity", in: managedContext)!
let setlistMO = NSManagedObject(entity: setlistEntity, insertInto: managedContext)
setlistMO.setValue(setlist.title, forKey: "title")

var songMOs = [NSManagedObject]()
for song in setlist.songs {
let songEntity = NSEntityDescription.entity(forEntityName: "SongEntity", in: managedContext)!
let songMO = NSManagedObject(entity: songEntity, insertInto: managedContext)
songMO.setValue(song.title, forKey: "title")
songMO.setValue(song.frequency, forKey: "frequency")
songMOs.append(songMO)
}
setlistMO.setValue(NSOrderedSet(array: songMOs), forKey: "songs")
setlist.objectID = setlistMO.objectID
do {
try managedContext.save()
} catch let error as NSError {
print("Could not save. \(error), \(error.userInfo)")
}
}

// To Retrieve
func fetchSetlist(with objectID: NSManagedObjectID) -> Setlist? {
guard let appDelegate = UIApplication.shared.delegate as? AppDelegate else { return nil }
let managedContext = appDelegate.persistentContainer.viewContext
let fetchRequest = NSFetchRequest<NSManagedObject>(entityName: "SetlistEntity")
fetchRequest.predicate = NSPredicate(format: "self == %@", objectID as CVarArg)
do {
let setlistMO = try managedContext.fetch(fetchRequest).first
guard let title = setlistMO?.value(forKey: "title") as? String, let songsMO = setlistMO?.value(forKey: "songs") as? Set<NSManagedObject> else {
return nil
}
var songs = [Song]()
forsongMO in songsMO {
let title = songMO.value(forKey: "title") as? String, let frequency = songMO.value(forKey: "frequency") as? Float else {
continue
}
songs.append(Song(title: title, frequency: frequency))
}
var setlist = Setlist(title: title, songs: songs)
setlist.objectID = objectID
return setlist
} catch let error as NSError {
print("Could not fetch. (error), (error.userInfo)")
return nil
}
}
</syntaxhighlight>
Dieses Beispiel verwendet Core Data, um Instanzen des Structs Setlist zu speichern und abzurufen. Es verwendet NSManagedObjects, um die Entitäten von Setlist und Song im Datenmodell darzustellen und die Beziehungen zwischen ihnen zu verwalten. Bitte beachten Sie, dass es hier nur um ein Beispiel geht und dass Core Data viele weitere Funktionen bietet, die je nach Anwendungsfall sinnvoll sein können.

=== Speichern mit SQLite und FMDB ===
Das Speichern von Instanzen des Structs Setlist in SQLite erfordert die Verwendung eines Wrapper-Libraries die eine einfachere Anbindung von SQLite Datenbanken in Swift ermöglicht, wie z.B FMDB. Hier ist ein Beispiel dafür, wie dies mit Swift und FMDB (OpenSoure Lib) erreicht werden kann:
<syntaxhighlight lang="swift">
import FMDB

struct Setlist {
var title: String = "Default"
var songs = [Song]()
var id: Int32?
mutating func addSong(title: String, frequency: Float){
print("Setlist::addSong")
songs.append(Song(title:title, frequency: frequency))
}
}

struct Song {
let title: String
let frequency: Float
}

let databaseQueue = FMDatabaseQueue(url: try! FileManager.default.url(for: .documentDirectory, in: .userDomainMask, appropriateFor: nil, create: true).appendingPathComponent("db.sqlite"))

func createTable() {
databaseQueue.inDatabase { db in
do {
try db.executeUpdate("CREATE TABLE Setlist (id INTEGER PRIMARY KEY, title TEXT);", values: nil)
try db.executeUpdate("CREATE TABLE Song (id INTEGER PRIMARY KEY, title TEXT, frequency REAL, setlist_id INTEGER, FOREIGN KEY(setlist_id) REFERENCES Setlist(id));", values: nil)
} catch {
print(error)
}
}
}

// To Save
func saveSetlist(_ setlist: Setlist) {
databaseQueue.inDatabase { db in
do {
try db.executeUpdate("INSERT INTO Setlist (title) VALUES (?);", values: [setlist.title])
setlist.id = db.lastInsertRowId
for song in setlist.songs {
try db.executeUpdate("INSERT INTO Song (title, frequency, setlist_id) VALUES (?, ?, ?);", values: [song.title, song.frequency,setlist.id])
}
} catch {
print(error)
}
}
}

// To Retrive
func fetchSetlist(with id: Int32) -> Setlist? {
var setlist: Setlist?
databaseQueue.inDatabase { db in
do {
let resultSetlist = try db.executeQuery("SELECT * FROM Setlist WHERE id = ?", values: [id])
if resultSetlist.next() {
setlist = Setlist(title: resultSetlist.string(forColumn: "title")!)
setlist!.id = id
let resultSongs = try db.executeQuery("SELECT * FROM Song WHERE setlist_id = ?", values: [id])
while resultSongs.next() {
let song = Song(title: resultSongs.string(forColumn: "title")!,frequency: resultSongs.double(forColumn: "frequency"))
setlist!.songs.append(song)
}
}
resultSetlist.close()
} catch {
print(error)
}
}
return setlist
}
</syntaxhighlight>
Dieses Beispiel verwendet FMDB, um eine Verbindung zur SQLite-Datenbank herzustellen und Abfragen auszuführen, um Instanzen des Structs Setlist zu speichern und abzurufen. Beachten Sie, dass die Beispielstrukturen und die Datenbanktabellen beide eine ID-Eigenschaft haben, um die Beziehungen zwischen Setlist und Song zu verwalten.
Es gibt auch andere Bibliotheken wie SQLite.swift die auch SQLite in Swift erleichtern.
Ich empfehle Ihnen, sich mit den Best Practices für die Verwendung von SQLite in iOS-Apps vertraut zu machen, um sicherzustellen, dass Ihre Anwendung sicher und performant ist.

Swift - Möglichkeiten Daten zu speichern

2023-01-28T10:33:08Z

Steff:

== Links ==
[[Swift (Programmiersprache)]]

== Einführung ==
Es gibt mehrere Möglichkeiten, Benutzerdaten wie Notizen oder Einkaufslisten in einer iPhone-App, die in Swift geschrieben ist, zu speichern. Einige der populärsten Optionen sind:

# '''User Defaults:''' Dies ist eine einfache und einfach zu verwendende Methode zum Speichern von kleinen Mengen an Benutzerdaten. Es speichert Daten im Schlüssel-Wert-Paar-Format und die Daten werden automatisch gespeichert, wenn die App geschlossen wird oder im Hintergrund läuft.
# '''Core Data:''' Core Data ist ein Framework für objektrelationales Mapping (ORM), mit dem Entwickler auf das Datenmodell der App zugreifen können. Es ist eine leistungsstarke und flexible Lösung zum Speichern und Abrufen großer Datenmengen und bietet Funktionen wie Rückgängig- und Wiederholen-Funktionen, Änderungsverfolgung und Datenvalidierung.
# '''Realm:''' Realm ist ein von Dritten bereitgestelltes ORM, das Core Data ähnlich ist, aber im Allgemeinen als leichter und schneller gilt.
# '''File I/O:''' Dies ist die traditionelle Methode zum Speichern von Daten in iOS-Apps. Entwickler können Daten mithilfe des Foundation-Frameworks von und auf das lokale Dateisystem der App lesen und schreiben.
# '''Cloud Service:''' Durch die Verwendung von Cloud-Service-Anbietern wie AWS, Firebase oder Firestore kann die Daten auf deren Servern gespeichert werden, anstatt auf dem lokalen Gerät. Dieser Ansatz eignet sich, wenn die Daten unter verschiedenen Benutzern geteilt werden oder auf mehreren Geräten zugänglich sein sollen.

[[Datei:Swift-ios-DatenSpeichern.jpg|rahmenlos|zentriert]]

Letztlich hängt die Wahl der Methode zum Speichern von Daten von den spezifischen Anforderungen Ihrer App ab, einschließlich der Menge an zu speichernder Daten, der Komplexität des Datenmodells und den Anforderungen an die Datensynchronisierung und Sicherung.

== User Defaults ==
[[Swift - UserDefaults]]

In iOS ist UserDefaults eine bequeme Klasse zum Speichern von kleinen Mengen an benutzerspezifischen Daten. Es wird von einer plist-Datei unterstützt, die ein einfaches Schlüssel-Wert-Speicherformat ist.

== Beispiele ==
=== Speichern von JSON Daten mit File I/O ===
Siehe auch
[[Swift JSONEncoder]]
[[Swift & JSON]]
<syntaxhighlight lang="swift">
struct Setlist: Codable {
var title: String = "Default"
var songs = [Song]()

mutating func addSong(title: String, frequency: Float){
print("Setlist::addSong")
songs.append(Song(title:title, frequency: frequency))
}
}

struct Song: Codable {
let title: String
let frequency: Float
}

// convert Setlist to json Data
let setlist = Setlist()
setlist.addSong(title: "song1", frequency: 44.1)
let encoder = JSONEncoder()
guard let encoded = try? encoder.encode(setlist) else {
print("Encoding Failed")
return
}

// write json Data to file
let documentsURL = FileManager.default.urls(for: .documentDirectory, in: .userDomainMask).first!
let fileURL = documentsURL.appendingPathComponent("setlist.json")
do {
try encoded.write(to: fileURL, options: .atomic)
} catch {
print("Error saving file: \(error)")
}
</syntaxhighlight>

In diesem Beispiel wird die JSONEncoder Klasse verwendet, um eine Instanz des Structs Setlist in ein JSON-kodiertes Data-Objekt umzuwandeln. Das erzeugte JSON-kodierte Data wird in einer Datei gespeichert . In diesem Fall wird die Datei "setlist.json" im Dokumentenverzeichnis des Geräts gespeichert.
Es ist zu beachten, dass es je nach Anwendungsfall sinnvoll sein kann, die Daten an einem anderen Ort oder in einem anderen Format zu speichern.

==== JSON Data Objekt als String ausgeben ====
<syntaxhighlight lang="swift">
if let jsonString = String(data: encoded, encoding: .utf8) {
print(jsonString)
} else {
print("Could not convert encoded Data to String")
}
</syntaxhighlight>

Dieser Code verwendet encoded Data und wandelt es in einen String um, indem es es decodiert und UTF-8 als Encoding verwendet. Wenn die Konvertierung erfolgreich ist, wird der Inhalt des Strings auf der Konsole ausgegeben.
Es ist zu beachten, dass der JSON String nicht immer lesbar ausfällt, da die Reihenfolge der Werte innerhalb des Objekts oder des Arrays unvorhersehbar ist.

=== Speichern von Daten mit CoreData ===
Das Speichern von Instanzen des Structs Setlist in Core Data erfordert einige zusätzliche Schritte im Vergleich zu User Defaults, da Core Data ein umfangreicheres Framework ist. Hier ist ein Beispiel dafür, wie dies mit Swift und Core Data erreicht werden kann:
<syntaxhighlight lang="swift">
import CoreData

struct Setlist {
var title: String = "Default"
var songs = [Song]()
var objectID: NSManagedObjectID?

mutating func addSong(title: String, frequency: Float){
print("Setlist::addSong")
songs.append(Song(title:title, frequency: frequency))
}
}

struct Song {
let title: String
let frequency: Float
}

// To Save
func saveSetlist(_ setlist: Setlist) {
guard let appDelegate = UIApplication.shared.delegate as? AppDelegate else { return }
let managedContext = appDelegate.persistentContainer.viewContext
let setlistEntity = NSEntityDescription.entity(forEntityName: "SetlistEntity", in: managedContext)!
let setlistMO = NSManagedObject(entity: setlistEntity, insertInto: managedContext)
setlistMO.setValue(setlist.title, forKey: "title")

var songMOs = [NSManagedObject]()
for song in setlist.songs {
let songEntity = NSEntityDescription.entity(forEntityName: "SongEntity", in: managedContext)!
let songMO = NSManagedObject(entity: songEntity, insertInto: managedContext)
songMO.setValue(song.title, forKey: "title")
songMO.setValue(song.frequency, forKey: "frequency")
songMOs.append(songMO)
}
setlistMO.setValue(NSOrderedSet(array: songMOs), forKey: "songs")
setlist.objectID = setlistMO.objectID
do {
try managedContext.save()
} catch let error as NSError {
print("Could not save. \(error), \(error.userInfo)")
}
}

// To Retrieve
func fetchSetlist(with objectID: NSManagedObjectID) -> Setlist? {
guard let appDelegate = UIApplication.shared.delegate as? AppDelegate else { return nil }
let managedContext = appDelegate.persistentContainer.viewContext
let fetchRequest = NSFetchRequest<NSManagedObject>(entityName: "SetlistEntity")
fetchRequest.predicate = NSPredicate(format: "self == %@", objectID as CVarArg)
do {
let setlistMO = try managedContext.fetch(fetchRequest).first
guard let title = setlistMO?.value(forKey: "title") as? String, let songsMO = setlistMO?.value(forKey: "songs") as? Set<NSManagedObject> else {
return nil
}
var songs = [Song]()
forsongMO in songsMO {
let title = songMO.value(forKey: "title") as? String, let frequency = songMO.value(forKey: "frequency") as? Float else {
continue
}
songs.append(Song(title: title, frequency: frequency))
}
var setlist = Setlist(title: title, songs: songs)
setlist.objectID = objectID
return setlist
} catch let error as NSError {
print("Could not fetch. (error), (error.userInfo)")
return nil
}
}
</syntaxhighlight>
Dieses Beispiel verwendet Core Data, um Instanzen des Structs Setlist zu speichern und abzurufen. Es verwendet NSManagedObjects, um die Entitäten von Setlist und Song im Datenmodell darzustellen und die Beziehungen zwischen ihnen zu verwalten. Bitte beachten Sie, dass es hier nur um ein Beispiel geht und dass Core Data viele weitere Funktionen bietet, die je nach Anwendungsfall sinnvoll sein können.

=== Speichern mit SQLite und FMDB ===
Das Speichern von Instanzen des Structs Setlist in SQLite erfordert die Verwendung eines Wrapper-Libraries die eine einfachere Anbindung von SQLite Datenbanken in Swift ermöglicht, wie z.B FMDB. Hier ist ein Beispiel dafür, wie dies mit Swift und FMDB (OpenSoure Lib) erreicht werden kann:
<syntaxhighlight lang="swift">
import FMDB

struct Setlist {
var title: String = "Default"
var songs = [Song]()
var id: Int32?
mutating func addSong(title: String, frequency: Float){
print("Setlist::addSong")
songs.append(Song(title:title, frequency: frequency))
}
}

struct Song {
let title: String
let frequency: Float
}

let databaseQueue = FMDatabaseQueue(url: try! FileManager.default.url(for: .documentDirectory, in: .userDomainMask, appropriateFor: nil, create: true).appendingPathComponent("db.sqlite"))

func createTable() {
databaseQueue.inDatabase { db in
do {
try db.executeUpdate("CREATE TABLE Setlist (id INTEGER PRIMARY KEY, title TEXT);", values: nil)
try db.executeUpdate("CREATE TABLE Song (id INTEGER PRIMARY KEY, title TEXT, frequency REAL, setlist_id INTEGER, FOREIGN KEY(setlist_id) REFERENCES Setlist(id));", values: nil)
} catch {
print(error)
}
}
}

// To Save
func saveSetlist(_ setlist: Setlist) {
databaseQueue.inDatabase { db in
do {
try db.executeUpdate("INSERT INTO Setlist (title) VALUES (?);", values: [setlist.title])
setlist.id = db.lastInsertRowId
for song in setlist.songs {
try db.executeUpdate("INSERT INTO Song (title, frequency, setlist_id) VALUES (?, ?, ?);", values: [song.title, song.frequency,setlist.id])
}
} catch {
print(error)
}
}
}

// To Retrive
func fetchSetlist(with id: Int32) -> Setlist? {
var setlist: Setlist?
databaseQueue.inDatabase { db in
do {
let resultSetlist = try db.executeQuery("SELECT * FROM Setlist WHERE id = ?", values: [id])
if resultSetlist.next() {
setlist = Setlist(title: resultSetlist.string(forColumn: "title")!)
setlist!.id = id
let resultSongs = try db.executeQuery("SELECT * FROM Song WHERE setlist_id = ?", values: [id])
while resultSongs.next() {
let song = Song(title: resultSongs.string(forColumn: "title")!,frequency: resultSongs.double(forColumn: "frequency"))
setlist!.songs.append(song)
}
}
resultSetlist.close()
} catch {
print(error)
}
}
return setlist
}
</syntaxhighlight>
Dieses Beispiel verwendet FMDB, um eine Verbindung zur SQLite-Datenbank herzustellen und Abfragen auszuführen, um Instanzen des Structs Setlist zu speichern und abzurufen. Beachten Sie, dass die Beispielstrukturen und die Datenbanktabellen beide eine ID-Eigenschaft haben, um die Beziehungen zwischen Setlist und Song zu verwalten.
Es gibt auch andere Bibliotheken wie SQLite.swift die auch SQLite in Swift erleichtern.
Ich empfehle Ihnen, sich mit den Best Practices für die Verwendung von SQLite in iOS-Apps vertraut zu machen, um sicherzustellen, dass Ihre Anwendung sicher und performant ist.

Swift - @state vars

2023-01-28T07:57:52Z

Steff: /* Unterstützt UIView ebenfalls @state ? */

'''Hinweis''': @state ist nicht für UIView verfügbar sondern für die View Klasse. Nicht verwechseln.

In SwiftUI ist eine @State Variable eine Variable, die verwendet wird, '''um den Zustand eines View zu speichern'''. Wenn der Wert einer @State Variable sich ändert, wird die Ansicht '''automatisch neu gerendert''', um den neuen Zustand widerzuspiegeln.

@State Variablen werden verwendet, um den internen Zustand eines Views zu speichern, wie z.B. den aktuellen Wert eines Textfeldes, das ausgewählte Element in einer Liste oder den auf-/zugeklappten Zustand eines Views. Sie werden auf View-Ebene definiert und können von allen Unteransichten dieses Views aufgerufen und modifiziert werden.

Hier ist ein Beispiel dafür, wie man eine @State Variable in einer SwiftUI Ansicht verwendet:
<syntaxhighlight lang="switch">
struct MyView: View {
@State private var text = "Hallo Welt"

var body: some View {
TextField("Geben Sie Text ein", text: $text)
}
}
</syntaxhighlight>

In diesem Beispiel wird die @State Variable text verwendet, um den aktuellen Text im TextField zu speichern. Wenn der Benutzer im Textfeld etwas eingibt, wird der Wert der text Variable aktualisiert und die Ansicht wird neu gerendert, um den neuen Wert widerzuspiegeln.

Es ist wichtig zu beachten, dass @State Eigenschaften nur innerhalb des Objekts, das es deklariert, von self modifiziert werden dürfen und auch nicht zwischen verschiedenen Ansichten geteilt werden können.

'''@State Variablen ähneln @ObservedObject und @EnvironmentObject''', da sie alle den Zustand einer Ansicht speichern, aber sie haben unterschiedliche Anwendungsfälle. '''@ObservedObject''' wird verwendet, um den '''Zustand eines Objekts zu speichern, das von mehreren Ansichten geteilt wird''', während '''@EnvironmentObject''' verwendet wird, um den '''Zustand eines Objekts zu speichern, das im gesamten App geteilt wird.'''

== Unterstützt UIView ebenfalls @state? ==

Nein, @state ist ein Feature von SwiftUI und es ist spezifisch für dieses Framework und ist nicht in UIView verfügbar.

@state ist ein Property Wrapper, der verwendet wird, um den Zustand einer Ansicht im SwiftUI-Framework zu verwalten. Es ermöglicht es Ihnen, eine Eigenschaft als den Zustand der Ansicht zu markieren und sicherzustellen, dass Änderungen an dieser Eigenschaft automatisch die Ansicht aktualisieren.

In UIView wird der Zustand in der Regel durch Eigenschaften verwaltet und Änderungen an diesen Eigenschaften müssen manuell durch Aufru
dev@stephanschlegel.de
Kann ich View innerhalb von UIView benutzen?

Ja, es ist möglich, SwiftUI-Ansichten innerhalb von UIViews zu verwenden. Dies kann erreicht werden, indem man einen UIViewRepresentable-Wrapper erstellt, der die SwiftUI-Ansicht in eine UIView kapselt und diese dann in die UIView-Hierarchie einbetten kann.

Hier ist ein Beispiel, wie man eine SwiftUI-Ansicht in eine UIView einbetten kann:

swift
<syntaxhighlight lang="switch">
struct SwiftUIView: View {
var body: some View {
Text("Hello, World!")
}
}

struct SwiftUIViewWrapper: UIViewRepresentable {
func makeUIView(context: Context) -> UIView {
return UIView()
}

func updateUIView(_ uiView: UIView, context: Context) {
let swiftUIView = SwiftUIView()
let swiftUIViewController = UIHostingController(rootView: swiftUIView)
swiftUIViewController.view.frame = uiView.bounds
uiView.addSubview(swiftUIViewController.view)
}
}
</syntaxhighlight>

Dann kann man diese WrapperView in einer UIViewController oder andere UIView Klasse nutzen.

<syntaxhighlight lang="switch">
class MyViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
let swiftUIViewWrapper = SwiftUIViewWrapper()
view.addSubview(swiftUIViewWrapper.view)
}
}
</syntaxhighlight>

Diese Technik ermöglicht es Ihnen, die Vorteile von SwiftUI und UIKit zu nutzen und eine gemischte App zu erstellen.

== Welches sind die Vorteile von SwiftUI und UIKit im Vergleich? ==

SwiftUI und UIKit sind beide Frameworks für die Erstellung von Benutzeroberflächen auf Apple-Plattformen, aber sie haben einige Unterschiede in Bezug auf ihre Funktionalität und Verwendung.

'''Vorteile von SwiftUI:'''

* Einfacheres und intuitiveres Design: SwiftUI bietet eine deklarative Syntax, die es Entwicklern erleichtert, die Benutzeroberfläche zu erstellen und zu verwalten. Es erfordert weniger Code, um dieselben Ergebnisse zu erzielen, und bietet eine höhere Abstraktionsebene.
* Plattformübergreifend: SwiftUI kann für iOS, iPadOS, macOS, watchOS und tvOS verwendet werden, was die Entwicklung von plattformübergreifenden Apps vereinfacht.
* Automatisierte Aktualisierungen: SwiftUI automatisiert das Aktualisieren der Ansicht, wenn sich die Daten ändern, was die Entwicklung von Apps mit dynamischen Benutzeroberflächen vereinfacht.

'''Vorteile von UIKit:'''

* Ausgereifte und erprobte Technologie: UIKit ist das seit langem etablierte Framework für die Erstellung von Benutzeroberflächen auf Apple-Plattformen und hat eine breite Unterstützung und eine große Anzahl von Ressourcen und Dokumentationen.
* Erweiterbarkeit: UIKit bietet Entwicklern eine breite Palette an vordefinierten UI-Elementen und die Möglichkeit, benutzerdefinierte Steuerelemente zu erstellen, was es ermöglicht, eine breite Palette von Anforderungen an die Benutzeroberfläche zu erfüllen.
* Rückwärtskompatibilität: Apps, die mit UIKit erstellt wurden, sind rückwärtskompatibel mit älteren Versionen von iOS und können daher auf eine größere Anzahl von Geräten ausgeführt werden.

Es gibt also keine universelle Lösung, sondern es hängt von den Anforderungen und Zielen des Projekts ab, welches Framework am besten geeignet ist. In den meisten Fällen kann man aber mit SwiftUI schneller und einfacher eine App erstellen, aber in bestimmten Fällen ist es nötig die Möglichkeiten von UIKit zu nutzen.

Swift - @state vars

2023-01-28T07:57:08Z

Steff:

'''Hinweis''': @state ist nicht für UIView verfügbar sondern für die View Klasse. Nicht verwechseln.

In SwiftUI ist eine @State Variable eine Variable, die verwendet wird, '''um den Zustand eines View zu speichern'''. Wenn der Wert einer @State Variable sich ändert, wird die Ansicht '''automatisch neu gerendert''', um den neuen Zustand widerzuspiegeln.

@State Variablen werden verwendet, um den internen Zustand eines Views zu speichern, wie z.B. den aktuellen Wert eines Textfeldes, das ausgewählte Element in einer Liste oder den auf-/zugeklappten Zustand eines Views. Sie werden auf View-Ebene definiert und können von allen Unteransichten dieses Views aufgerufen und modifiziert werden.

Hier ist ein Beispiel dafür, wie man eine @State Variable in einer SwiftUI Ansicht verwendet:
<syntaxhighlight lang="switch">
struct MyView: View {
@State private var text = "Hallo Welt"

var body: some View {
TextField("Geben Sie Text ein", text: $text)
}
}
</syntaxhighlight>

In diesem Beispiel wird die @State Variable text verwendet, um den aktuellen Text im TextField zu speichern. Wenn der Benutzer im Textfeld etwas eingibt, wird der Wert der text Variable aktualisiert und die Ansicht wird neu gerendert, um den neuen Wert widerzuspiegeln.

Es ist wichtig zu beachten, dass @State Eigenschaften nur innerhalb des Objekts, das es deklariert, von self modifiziert werden dürfen und auch nicht zwischen verschiedenen Ansichten geteilt werden können.

'''@State Variablen ähneln @ObservedObject und @EnvironmentObject''', da sie alle den Zustand einer Ansicht speichern, aber sie haben unterschiedliche Anwendungsfälle. '''@ObservedObject''' wird verwendet, um den '''Zustand eines Objekts zu speichern, das von mehreren Ansichten geteilt wird''', während '''@EnvironmentObject''' verwendet wird, um den '''Zustand eines Objekts zu speichern, das im gesamten App geteilt wird.'''

== Unterstützt UIView ebenfalls @state ? ==

Nein, @state ist ein Feature von SwiftUI und es ist spezifisch für dieses Framework und ist nicht in UIView verfügbar.

@state ist ein Property Wrapper, der verwendet wird, um den Zustand einer Ansicht im SwiftUI-Framework zu verwalten. Es ermöglicht es Ihnen, eine Eigenschaft als den Zustand der Ansicht zu markieren und sicherzustellen, dass Änderungen an dieser Eigenschaft automatisch die Ansicht aktualisieren.

In UIView wird der Zustand in der Regel durch Eigenschaften verwaltet und Änderungen an diesen Eigenschaften müssen manuell durch Aufru
dev@stephanschlegel.de
Kann ich View innerhalb von UIView benutzen?

Ja, es ist möglich, SwiftUI-Ansichten innerhalb von UIViews zu verwenden. Dies kann erreicht werden, indem man einen UIViewRepresentable-Wrapper erstellt, der die SwiftUI-Ansicht in eine UIView kapselt und diese dann in die UIView-Hierarchie einbetten kann.

Hier ist ein Beispiel, wie man eine SwiftUI-Ansicht in eine UIView einbetten kann:

swift
<syntaxhighlight lang="switch">
struct SwiftUIView: View {
var body: some View {
Text("Hello, World!")
}
}

struct SwiftUIViewWrapper: UIViewRepresentable {
func makeUIView(context: Context) -> UIView {
return UIView()
}

func updateUIView(_ uiView: UIView, context: Context) {
let swiftUIView = SwiftUIView()
let swiftUIViewController = UIHostingController(rootView: swiftUIView)
swiftUIViewController.view.frame = uiView.bounds
uiView.addSubview(swiftUIViewController.view)
}
}
</syntaxhighlight>
Dann kann man diese WrapperView in einer UIViewController oder andere UIView Klasse nutzen.

<syntaxhighlight lang="switch">
class MyViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
let swiftUIViewWrapper = SwiftUIViewWrapper()
view.addSubview(swiftUIViewWrapper.view)
}
}
</syntaxhighlight>

Diese Technik ermöglicht es Ihnen, die Vorteile von SwiftUI und UIKit zu nutzen und eine gemischte App zu erstellen.

== Welches sind die Vorteile von SwiftUI und UIKit im Vergleich? ==

SwiftUI und UIKit sind beide Frameworks für die Erstellung von Benutzeroberflächen auf Apple-Plattformen, aber sie haben einige Unterschiede in Bezug auf ihre Funktionalität und Verwendung.

'''Vorteile von SwiftUI:'''

* Einfacheres und intuitiveres Design: SwiftUI bietet eine deklarative Syntax, die es Entwicklern erleichtert, die Benutzeroberfläche zu erstellen und zu verwalten. Es erfordert weniger Code, um dieselben Ergebnisse zu erzielen, und bietet eine höhere Abstraktionsebene.
* Plattformübergreifend: SwiftUI kann für iOS, iPadOS, macOS, watchOS und tvOS verwendet werden, was die Entwicklung von plattformübergreifenden Apps vereinfacht.
* Automatisierte Aktualisierungen: SwiftUI automatisiert das Aktualisieren der Ansicht, wenn sich die Daten ändern, was die Entwicklung von Apps mit dynamischen Benutzeroberflächen vereinfacht.

'''Vorteile von UIKit:'''

* Ausgereifte und erprobte Technologie: UIKit ist das seit langem etablierte Framework für die Erstellung von Benutzeroberflächen auf Apple-Plattformen und hat eine breite Unterstützung und eine große Anzahl von Ressourcen und Dokumentationen.
* Erweiterbarkeit: UIKit bietet Entwicklern eine breite Palette an vordefinierten UI-Elementen und die Möglichkeit, benutzerdefinierte Steuerelemente zu erstellen, was es ermöglicht, eine breite Palette von Anforderungen an die Benutzeroberfläche zu erfüllen.
* Rückwärtskompatibilität: Apps, die mit UIKit erstellt wurden, sind rückwärtskompatibel mit älteren Versionen von iOS und können daher auf eine größere Anzahl von Geräten ausgeführt werden.

Es gibt also keine universelle Lösung, sondern es hängt von den Anforderungen und Zielen des Projekts ab, welches Framework am besten geeignet ist. In den meisten Fällen kann man aber mit SwiftUI schneller und einfacher eine App erstellen, aber in bestimmten Fällen ist es nötig die Möglichkeiten von UIKit zu nutzen.

Swift - @state vars

2023-01-27T07:57:13Z

Steff: Die Seite wurde neu angelegt: „'''Hinweis''': @state ist nicht für UIView verfügbar sondern für die View Klasse. Nicht verwechseln. In SwiftUI ist eine @State Variable eine Variable, die…“

Swift (Programmiersprache)

2023-01-27T07:49:35Z

Steff: /* Funktionen und Eigenschaften */

Programmiersprache im Einsatz in der Apple Welt (MacOs, iOS, WatchOs...)

== Links ==
[[SwiftUI]]
https://www.swift.org/ - Dokumentation einfacher Verständlich als die offizielle von Apple
https://iosref.com/ - Cheatsheets, Statistiken zu OS Verbreitung und mehr

== Konzepte ==
=== Einfache Datentypen ===
[[Swift - Strings]]
[[Swift - Arrays]]
[[Swift - Optionals]]
[[Swift - Tuples]]

=== Collection Datatypes und komplexe Datentypen ===
[[Swift - Dictionaries]]
[[Swift - Structures (Struct)]]
[[Swift - Classes]]

=== Funktionen und Eigenschaften ===
[[Swift - Closures]]
[[Swift - Computed Properties]]
[[Swift - Internal & External Parameter Names]]
[[Swift - weak & strong vars]]
[[Swift - @state vars]]

==== Auswahl wichtiger Funktionen ====
[[Swift - map/reduce/filter]]

=== Extensions ===
[[Swift - Extension]]

== Loops ==
[[Swift Loops & Animations]]

== Networking ==
=== URLSession for Networking ===
[[Swift - URLSession]]

== Snippets ==
[[Swift - Snippets]]

== Frameworks ==
=== Building a Swift Framework ===
[[Building a Swift Framework]]

=== UIKit ===
UIKit stellt die meisten der gängigen iOS Bedienelemente bereit und ist das wichtigste Modul, wenn es um die Erstellung von iOS Apps geht.
[[UIKit Framework]]

=== Cocoapods Dependency Manager ===
[http://cocoapods.org cocoapods.org]
[[Cocoapods]]
Cocoapods ein Dependency Manager für Swift and Objective-C Cocoa Projekte. Es gibt hier für viele Zwecke freien Code von Programmierern. Über den Dependency Manager kann man dafür sorgen, dass man stets die aktuelle Version in seinen Projekten hat.

=== Google Firebase ===
Development platform für Apps, Spiele und Anbindung an Google Dienstleistungen.
https://firebase.google.com&
[[Swift & Firebase]]

== Assets ==
=== Dark Mode / Light Mode ===
'''System Colors''' verwenden oder '''Color Sets''' in den Assets anlegen.

Bilder können ebenfalls mehrere Versionen für Light und Dark bereitgestellt werden.
Appearances > Any, Light, Dark

=== Vektor Assets ===
Resizing > Preserve Vector Data
Scales > Single Scale (es wird nur eine Version benötigt)

=== Custom Assets ===
Todo

== Protocols & Delegates ==
[[Swift - Protocols]]
[[Swift - Decodable & Encodable]]
[[Swift - Delegate]]

== Daten speichern ==
[[Swift - Möglichkeiten Daten zu speichern]]

== Error Handling ==
[[Swift - Error Handling]]

== Swift - Audio ==
[[Swift - Audio Playback]]
[[AVAudioPlayerNode]] - geeignet für zeitkritisches Timing

== Swift - Location Data ==
[[Swift - CoreLocation]]

== Xcode ==
[[Xcode - Tipps & Tricks]]

== Best Practices ==
=== Constants File ===
[[Swift - Constants File]]

Swift - Audio Playback

2023-01-27T07:47:37Z

Steff:

TODO
== Links ==
[[Swift (Programmiersprache)]]

== Einführung ==
Es gibt untschiedliche Möglichkeiten Audio abzuspielen je nachdem was man möchte.

Jede Möglichkeit ist unterschiedlich aufwändig. Es gibt außerdem Klassen um den Systemmixer zu steuern oder das Verhalten wenn die App in den Hintergrund geht zu beeinflussen.

== Glossar ==
=== AVFoundation ===
==== AVAudioSession ====
AVAudioSession ist ein Singleton-Objekt, das die Audio-Sitzung für Ihre App verwaltet. Es ist verantwortlich für die '''Konfiguration der Audio-Routen''', wie dem Ausgabegerät (z.B. Lautsprecher oder Headset) und für die Verwaltung des Zustands der Audio-Sitzung (z.B. aktiv oder inaktiv). AVAudioSession bietet auch Methoden zur Steuerung der '''Eigenschaften der Audio-Sitzung''', wie der Lautstärke und der Audio-Kategorie.

==== AVAudioPlayerNode ====
AVAudioPlayerNode wird verwendet, um '''Audio-Puffer und -Dateien''' innerhalb eines AVAudioEngine-Graphen '''abzuspielen'''. Es kann verwendet werden, um das Abspielen von Audio-Puffern und -Dateien zu planen, die Wiedergabegeschwindigkeit, den Pan und die Lautstärke zu ändern und einen Rückruf bereitzustellen, wenn die Wiedergabe abgeschlossen ist.

'''Zusammengefasst wird AVAudioSession verwendet, um die Gesamt-Audio-Sitzung für Ihre App zu konfigurieren, während AVAudioPlayerNode verwendet wird, um spezifische Audio-Puffer und -Dateien innerhalb dieser Sitzung abzuspielen.'''

Swift - Möglichkeiten Daten zu speichern

2023-01-26T19:19:58Z

Steff: /* Einführung */

== Links ==
[[Swift (Programmiersprache)]]

== Einführung ==
Es gibt mehrere Möglichkeiten, Benutzerdaten wie Notizen oder Einkaufslisten in einer iPhone-App, die in Swift geschrieben ist, zu speichern. Einige der populärsten Optionen sind:

# '''User Defaults:''' Dies ist eine einfache und einfach zu verwendende Methode zum Speichern von kleinen Mengen an Benutzerdaten. Es speichert Daten im Schlüssel-Wert-Paar-Format und die Daten werden automatisch gespeichert, wenn die App geschlossen wird oder im Hintergrund läuft.
# '''Core Data:''' Core Data ist ein Framework für objektrelationales Mapping (ORM), mit dem Entwickler auf das Datenmodell der App zugreifen können. Es ist eine leistungsstarke und flexible Lösung zum Speichern und Abrufen großer Datenmengen und bietet Funktionen wie Rückgängig- und Wiederholen-Funktionen, Änderungsverfolgung und Datenvalidierung.
# '''Realm:''' Realm ist ein von Dritten bereitgestelltes ORM, das Core Data ähnlich ist, aber im Allgemeinen als leichter und schneller gilt.
# '''File I/O:''' Dies ist die traditionelle Methode zum Speichern von Daten in iOS-Apps. Entwickler können Daten mithilfe des Foundation-Frameworks von und auf das lokale Dateisystem der App lesen und schreiben.
# '''Cloud Service:''' Durch die Verwendung von Cloud-Service-Anbietern wie AWS, Firebase oder Firestore kann die Daten auf deren Servern gespeichert werden, anstatt auf dem lokalen Gerät. Dieser Ansatz eignet sich, wenn die Daten unter verschiedenen Benutzern geteilt werden oder auf mehreren Geräten zugänglich sein sollen.

[[Datei:Swift-ios-DatenSpeichern.jpg|rahmenlos|links]]

Letztlich hängt die Wahl der Methode zum Speichern von Daten von den spezifischen Anforderungen Ihrer App ab, einschließlich der Menge an zu speichernder Daten, der Komplexität des Datenmodells und den Anforderungen an die Datensynchronisierung und Sicherung.

== User Defaults ==
[[Swift - UserDefaults]]

In iOS ist UserDefaults eine bequeme Klasse zum Speichern von kleinen Mengen an benutzerspezifischen Daten. Es wird von einer plist-Datei unterstützt, die ein einfaches Schlüssel-Wert-Speicherformat ist.

== Beispiele ==
=== Speichern von JSON Daten mit File I/O ===
Siehe auch
[[Swift JSONEncoder]]
[[Swift & JSON]]
<syntaxhighlight lang="swift">
struct Setlist: Codable {
var title: String = "Default"
var songs = [Song]()

mutating func addSong(title: String, frequency: Float){
print("Setlist::addSong")
songs.append(Song(title:title, frequency: frequency))
}
}

struct Song: Codable {
let title: String
let frequency: Float
}

// convert Setlist to json Data
let setlist = Setlist()
setlist.addSong(title: "song1", frequency: 44.1)
let encoder = JSONEncoder()
guard let encoded = try? encoder.encode(setlist) else {
print("Encoding Failed")
return
}

// write json Data to file
let documentsURL = FileManager.default.urls(for: .documentDirectory, in: .userDomainMask).first!
let fileURL = documentsURL.appendingPathComponent("setlist.json")
do {
try encoded.write(to: fileURL, options: .atomic)
} catch {
print("Error saving file: \(error)")
}
</syntaxhighlight>

In diesem Beispiel wird die JSONEncoder Klasse verwendet, um eine Instanz des Structs Setlist in ein JSON-kodiertes Data-Objekt umzuwandeln. Das erzeugte JSON-kodierte Data wird in einer Datei gespeichert . In diesem Fall wird die Datei "setlist.json" im Dokumentenverzeichnis des Geräts gespeichert.
Es ist zu beachten, dass es je nach Anwendungsfall sinnvoll sein kann, die Daten an einem anderen Ort oder in einem anderen Format zu speichern.

==== JSON Data Objekt als String ausgeben ====
<syntaxhighlight lang="swift">
if let jsonString = String(data: encoded, encoding: .utf8) {
print(jsonString)
} else {
print("Could not convert encoded Data to String")
}
</syntaxhighlight>

Dieser Code verwendet encoded Data und wandelt es in einen String um, indem es es decodiert und UTF-8 als Encoding verwendet. Wenn die Konvertierung erfolgreich ist, wird der Inhalt des Strings auf der Konsole ausgegeben.
Es ist zu beachten, dass der JSON String nicht immer lesbar ausfällt, da die Reihenfolge der Werte innerhalb des Objekts oder des Arrays unvorhersehbar ist.

=== Speichern von Daten mit CoreData ===
Das Speichern von Instanzen des Structs Setlist in Core Data erfordert einige zusätzliche Schritte im Vergleich zu User Defaults, da Core Data ein umfangreicheres Framework ist. Hier ist ein Beispiel dafür, wie dies mit Swift und Core Data erreicht werden kann:
<syntaxhighlight lang="swift">
import CoreData

struct Setlist {
var title: String = "Default"
var songs = [Song]()
var objectID: NSManagedObjectID?

mutating func addSong(title: String, frequency: Float){
print("Setlist::addSong")
songs.append(Song(title:title, frequency: frequency))
}
}

struct Song {
let title: String
let frequency: Float
}

// To Save
func saveSetlist(_ setlist: Setlist) {
guard let appDelegate = UIApplication.shared.delegate as? AppDelegate else { return }
let managedContext = appDelegate.persistentContainer.viewContext
let setlistEntity = NSEntityDescription.entity(forEntityName: "SetlistEntity", in: managedContext)!
let setlistMO = NSManagedObject(entity: setlistEntity, insertInto: managedContext)
setlistMO.setValue(setlist.title, forKey: "title")

var songMOs = [NSManagedObject]()
for song in setlist.songs {
let songEntity = NSEntityDescription.entity(forEntityName: "SongEntity", in: managedContext)!
let songMO = NSManagedObject(entity: songEntity, insertInto: managedContext)
songMO.setValue(song.title, forKey: "title")
songMO.setValue(song.frequency, forKey: "frequency")
songMOs.append(songMO)
}
setlistMO.setValue(NSOrderedSet(array: songMOs), forKey: "songs")
setlist.objectID = setlistMO.objectID
do {
try managedContext.save()
} catch let error as NSError {
print("Could not save. \(error), \(error.userInfo)")
}
}

// To Retrieve
func fetchSetlist(with objectID: NSManagedObjectID) -> Setlist? {
guard let appDelegate = UIApplication.shared.delegate as? AppDelegate else { return nil }
let managedContext = appDelegate.persistentContainer.viewContext
let fetchRequest = NSFetchRequest<NSManagedObject>(entityName: "SetlistEntity")
fetchRequest.predicate = NSPredicate(format: "self == %@", objectID as CVarArg)
do {
let setlistMO = try managedContext.fetch(fetchRequest).first
guard let title = setlistMO?.value(forKey: "title") as? String, let songsMO = setlistMO?.value(forKey: "songs") as? Set<NSManagedObject> else {
return nil
}
var songs = [Song]()
forsongMO in songsMO {
let title = songMO.value(forKey: "title") as? String, let frequency = songMO.value(forKey: "frequency") as? Float else {
continue
}
songs.append(Song(title: title, frequency: frequency))
}
var setlist = Setlist(title: title, songs: songs)
setlist.objectID = objectID
return setlist
} catch let error as NSError {
print("Could not fetch. (error), (error.userInfo)")
return nil
}
}
</syntaxhighlight>
Dieses Beispiel verwendet Core Data, um Instanzen des Structs Setlist zu speichern und abzurufen. Es verwendet NSManagedObjects, um die Entitäten von Setlist und Song im Datenmodell darzustellen und die Beziehungen zwischen ihnen zu verwalten. Bitte beachten Sie, dass es hier nur um ein Beispiel geht und dass Core Data viele weitere Funktionen bietet, die je nach Anwendungsfall sinnvoll sein können.

=== Speichern mit SQLite und FMDB ===
Das Speichern von Instanzen des Structs Setlist in SQLite erfordert die Verwendung eines Wrapper-Libraries die eine einfachere Anbindung von SQLite Datenbanken in Swift ermöglicht, wie z.B FMDB. Hier ist ein Beispiel dafür, wie dies mit Swift und FMDB (OpenSoure Lib) erreicht werden kann:
<syntaxhighlight lang="swift">
import FMDB

struct Setlist {
var title: String = "Default"
var songs = [Song]()
var id: Int32?
mutating func addSong(title: String, frequency: Float){
print("Setlist::addSong")
songs.append(Song(title:title, frequency: frequency))
}
}

struct Song {
let title: String
let frequency: Float
}

let databaseQueue = FMDatabaseQueue(url: try! FileManager.default.url(for: .documentDirectory, in: .userDomainMask, appropriateFor: nil, create: true).appendingPathComponent("db.sqlite"))

func createTable() {
databaseQueue.inDatabase { db in
do {
try db.executeUpdate("CREATE TABLE Setlist (id INTEGER PRIMARY KEY, title TEXT);", values: nil)
try db.executeUpdate("CREATE TABLE Song (id INTEGER PRIMARY KEY, title TEXT, frequency REAL, setlist_id INTEGER, FOREIGN KEY(setlist_id) REFERENCES Setlist(id));", values: nil)
} catch {
print(error)
}
}
}

// To Save
func saveSetlist(_ setlist: Setlist) {
databaseQueue.inDatabase { db in
do {
try db.executeUpdate("INSERT INTO Setlist (title) VALUES (?);", values: [setlist.title])
setlist.id = db.lastInsertRowId
for song in setlist.songs {
try db.executeUpdate("INSERT INTO Song (title, frequency, setlist_id) VALUES (?, ?, ?);", values: [song.title, song.frequency,setlist.id])
}
} catch {
print(error)
}
}
}

// To Retrive
func fetchSetlist(with id: Int32) -> Setlist? {
var setlist: Setlist?
databaseQueue.inDatabase { db in
do {
let resultSetlist = try db.executeQuery("SELECT * FROM Setlist WHERE id = ?", values: [id])
if resultSetlist.next() {
setlist = Setlist(title: resultSetlist.string(forColumn: "title")!)
setlist!.id = id
let resultSongs = try db.executeQuery("SELECT * FROM Song WHERE setlist_id = ?", values: [id])
while resultSongs.next() {
let song = Song(title: resultSongs.string(forColumn: "title")!,frequency: resultSongs.double(forColumn: "frequency"))
setlist!.songs.append(song)
}
}
resultSetlist.close()
} catch {
print(error)
}
}
return setlist
}
</syntaxhighlight>
Dieses Beispiel verwendet FMDB, um eine Verbindung zur SQLite-Datenbank herzustellen und Abfragen auszuführen, um Instanzen des Structs Setlist zu speichern und abzurufen. Beachten Sie, dass die Beispielstrukturen und die Datenbanktabellen beide eine ID-Eigenschaft haben, um die Beziehungen zwischen Setlist und Song zu verwalten.
Es gibt auch andere Bibliotheken wie SQLite.swift die auch SQLite in Swift erleichtern.
Ich empfehle Ihnen, sich mit den Best Practices für die Verwendung von SQLite in iOS-Apps vertraut zu machen, um sicherzustellen, dass Ihre Anwendung sicher und performant ist.

Swift - Möglichkeiten Daten zu speichern

2023-01-26T19:19:18Z

Steff:

== Links ==
[[Swift (Programmiersprache)]]

== Einführung ==
Es gibt mehrere Möglichkeiten, Benutzerdaten wie Notizen oder Einkaufslisten in einer iPhone-App, die in Swift geschrieben ist, zu speichern. Einige der populärsten Optionen sind:

# '''User Defaults:''' Dies ist eine einfache und einfach zu verwendende Methode zum Speichern von kleinen Mengen an Benutzerdaten. Es speichert Daten im Schlüssel-Wert-Paar-Format und die Daten werden automatisch gespeichert, wenn die App geschlossen wird oder im Hintergrund läuft.
# '''Core Data:''' Core Data ist ein Framework für objektrelationales Mapping (ORM), mit dem Entwickler auf das Datenmodell der App zugreifen können. Es ist eine leistungsstarke und flexible Lösung zum Speichern und Abrufen großer Datenmengen und bietet Funktionen wie Rückgängig- und Wiederholen-Funktionen, Änderungsverfolgung und Datenvalidierung.
# '''Realm:''' Realm ist ein von Dritten bereitgestelltes ORM, das Core Data ähnlich ist, aber im Allgemeinen als leichter und schneller gilt.
# '''File I/O:''' Dies ist die traditionelle Methode zum Speichern von Daten in iOS-Apps. Entwickler können Daten mithilfe des Foundation-Frameworks von und auf das lokale Dateisystem der App lesen und schreiben.
# '''Cloud Service:''' Durch die Verwendung von Cloud-Service-Anbietern wie AWS, Firebase oder Firestore kann die Daten auf deren Servern gespeichert werden, anstatt auf dem lokalen Gerät. Dieser Ansatz eignet sich, wenn die Daten unter verschiedenen Benutzern geteilt werden oder auf mehreren Geräten zugänglich sein sollen.

Letztlich hängt die Wahl der Methode zum Speichern von Daten von den spezifischen Anforderungen Ihrer App ab, einschließlich der Menge an zu speichernder Daten, der Komplexität des Datenmodells und den Anforderungen an die Datensynchronisierung und Sicherung.
[[Datei:Swift-ios-DatenSpeichern.jpg|rahmenlos|links]]

== User Defaults ==
[[Swift - UserDefaults]]

In iOS ist UserDefaults eine bequeme Klasse zum Speichern von kleinen Mengen an benutzerspezifischen Daten. Es wird von einer plist-Datei unterstützt, die ein einfaches Schlüssel-Wert-Speicherformat ist.

== Beispiele ==
=== Speichern von JSON Daten mit File I/O ===
Siehe auch
[[Swift JSONEncoder]]
[[Swift & JSON]]
<syntaxhighlight lang="swift">
struct Setlist: Codable {
var title: String = "Default"
var songs = [Song]()

mutating func addSong(title: String, frequency: Float){
print("Setlist::addSong")
songs.append(Song(title:title, frequency: frequency))
}
}

struct Song: Codable {
let title: String
let frequency: Float
}

// convert Setlist to json Data
let setlist = Setlist()
setlist.addSong(title: "song1", frequency: 44.1)
let encoder = JSONEncoder()
guard let encoded = try? encoder.encode(setlist) else {
print("Encoding Failed")
return
}

// write json Data to file
let documentsURL = FileManager.default.urls(for: .documentDirectory, in: .userDomainMask).first!
let fileURL = documentsURL.appendingPathComponent("setlist.json")
do {
try encoded.write(to: fileURL, options: .atomic)
} catch {
print("Error saving file: \(error)")
}
</syntaxhighlight>

In diesem Beispiel wird die JSONEncoder Klasse verwendet, um eine Instanz des Structs Setlist in ein JSON-kodiertes Data-Objekt umzuwandeln. Das erzeugte JSON-kodierte Data wird in einer Datei gespeichert . In diesem Fall wird die Datei "setlist.json" im Dokumentenverzeichnis des Geräts gespeichert.
Es ist zu beachten, dass es je nach Anwendungsfall sinnvoll sein kann, die Daten an einem anderen Ort oder in einem anderen Format zu speichern.

==== JSON Data Objekt als String ausgeben ====
<syntaxhighlight lang="swift">
if let jsonString = String(data: encoded, encoding: .utf8) {
print(jsonString)
} else {
print("Could not convert encoded Data to String")
}
</syntaxhighlight>

Dieser Code verwendet encoded Data und wandelt es in einen String um, indem es es decodiert und UTF-8 als Encoding verwendet. Wenn die Konvertierung erfolgreich ist, wird der Inhalt des Strings auf der Konsole ausgegeben.
Es ist zu beachten, dass der JSON String nicht immer lesbar ausfällt, da die Reihenfolge der Werte innerhalb des Objekts oder des Arrays unvorhersehbar ist.

=== Speichern von Daten mit CoreData ===
Das Speichern von Instanzen des Structs Setlist in Core Data erfordert einige zusätzliche Schritte im Vergleich zu User Defaults, da Core Data ein umfangreicheres Framework ist. Hier ist ein Beispiel dafür, wie dies mit Swift und Core Data erreicht werden kann:
<syntaxhighlight lang="swift">
import CoreData

struct Setlist {
var title: String = "Default"
var songs = [Song]()
var objectID: NSManagedObjectID?

mutating func addSong(title: String, frequency: Float){
print("Setlist::addSong")
songs.append(Song(title:title, frequency: frequency))
}
}

struct Song {
let title: String
let frequency: Float
}

// To Save
func saveSetlist(_ setlist: Setlist) {
guard let appDelegate = UIApplication.shared.delegate as? AppDelegate else { return }
let managedContext = appDelegate.persistentContainer.viewContext
let setlistEntity = NSEntityDescription.entity(forEntityName: "SetlistEntity", in: managedContext)!
let setlistMO = NSManagedObject(entity: setlistEntity, insertInto: managedContext)
setlistMO.setValue(setlist.title, forKey: "title")

var songMOs = [NSManagedObject]()
for song in setlist.songs {
let songEntity = NSEntityDescription.entity(forEntityName: "SongEntity", in: managedContext)!
let songMO = NSManagedObject(entity: songEntity, insertInto: managedContext)
songMO.setValue(song.title, forKey: "title")
songMO.setValue(song.frequency, forKey: "frequency")
songMOs.append(songMO)
}
setlistMO.setValue(NSOrderedSet(array: songMOs), forKey: "songs")
setlist.objectID = setlistMO.objectID
do {
try managedContext.save()
} catch let error as NSError {
print("Could not save. \(error), \(error.userInfo)")
}
}

// To Retrieve
func fetchSetlist(with objectID: NSManagedObjectID) -> Setlist? {
guard let appDelegate = UIApplication.shared.delegate as? AppDelegate else { return nil }
let managedContext = appDelegate.persistentContainer.viewContext
let fetchRequest = NSFetchRequest<NSManagedObject>(entityName: "SetlistEntity")
fetchRequest.predicate = NSPredicate(format: "self == %@", objectID as CVarArg)
do {
let setlistMO = try managedContext.fetch(fetchRequest).first
guard let title = setlistMO?.value(forKey: "title") as? String, let songsMO = setlistMO?.value(forKey: "songs") as? Set<NSManagedObject> else {
return nil
}
var songs = [Song]()
forsongMO in songsMO {
let title = songMO.value(forKey: "title") as? String, let frequency = songMO.value(forKey: "frequency") as? Float else {
continue
}
songs.append(Song(title: title, frequency: frequency))
}
var setlist = Setlist(title: title, songs: songs)
setlist.objectID = objectID
return setlist
} catch let error as NSError {
print("Could not fetch. (error), (error.userInfo)")
return nil
}
}
</syntaxhighlight>
Dieses Beispiel verwendet Core Data, um Instanzen des Structs Setlist zu speichern und abzurufen. Es verwendet NSManagedObjects, um die Entitäten von Setlist und Song im Datenmodell darzustellen und die Beziehungen zwischen ihnen zu verwalten. Bitte beachten Sie, dass es hier nur um ein Beispiel geht und dass Core Data viele weitere Funktionen bietet, die je nach Anwendungsfall sinnvoll sein können.

=== Speichern mit SQLite und FMDB ===
Das Speichern von Instanzen des Structs Setlist in SQLite erfordert die Verwendung eines Wrapper-Libraries die eine einfachere Anbindung von SQLite Datenbanken in Swift ermöglicht, wie z.B FMDB. Hier ist ein Beispiel dafür, wie dies mit Swift und FMDB (OpenSoure Lib) erreicht werden kann:
<syntaxhighlight lang="swift">
import FMDB

struct Setlist {
var title: String = "Default"
var songs = [Song]()
var id: Int32?
mutating func addSong(title: String, frequency: Float){
print("Setlist::addSong")
songs.append(Song(title:title, frequency: frequency))
}
}

struct Song {
let title: String
let frequency: Float
}

let databaseQueue = FMDatabaseQueue(url: try! FileManager.default.url(for: .documentDirectory, in: .userDomainMask, appropriateFor: nil, create: true).appendingPathComponent("db.sqlite"))

func createTable() {
databaseQueue.inDatabase { db in
do {
try db.executeUpdate("CREATE TABLE Setlist (id INTEGER PRIMARY KEY, title TEXT);", values: nil)
try db.executeUpdate("CREATE TABLE Song (id INTEGER PRIMARY KEY, title TEXT, frequency REAL, setlist_id INTEGER, FOREIGN KEY(setlist_id) REFERENCES Setlist(id));", values: nil)
} catch {
print(error)
}
}
}

// To Save
func saveSetlist(_ setlist: Setlist) {
databaseQueue.inDatabase { db in
do {
try db.executeUpdate("INSERT INTO Setlist (title) VALUES (?);", values: [setlist.title])
setlist.id = db.lastInsertRowId
for song in setlist.songs {
try db.executeUpdate("INSERT INTO Song (title, frequency, setlist_id) VALUES (?, ?, ?);", values: [song.title, song.frequency,setlist.id])
}
} catch {
print(error)
}
}
}

// To Retrive
func fetchSetlist(with id: Int32) -> Setlist? {
var setlist: Setlist?
databaseQueue.inDatabase { db in
do {
let resultSetlist = try db.executeQuery("SELECT * FROM Setlist WHERE id = ?", values: [id])
if resultSetlist.next() {
setlist = Setlist(title: resultSetlist.string(forColumn: "title")!)
setlist!.id = id
let resultSongs = try db.executeQuery("SELECT * FROM Song WHERE setlist_id = ?", values: [id])
while resultSongs.next() {
let song = Song(title: resultSongs.string(forColumn: "title")!,frequency: resultSongs.double(forColumn: "frequency"))
setlist!.songs.append(song)
}
}
resultSetlist.close()
} catch {
print(error)
}
}
return setlist
}
</syntaxhighlight>
Dieses Beispiel verwendet FMDB, um eine Verbindung zur SQLite-Datenbank herzustellen und Abfragen auszuführen, um Instanzen des Structs Setlist zu speichern und abzurufen. Beachten Sie, dass die Beispielstrukturen und die Datenbanktabellen beide eine ID-Eigenschaft haben, um die Beziehungen zwischen Setlist und Song zu verwalten.
Es gibt auch andere Bibliotheken wie SQLite.swift die auch SQLite in Swift erleichtern.
Ich empfehle Ihnen, sich mit den Best Practices für die Verwendung von SQLite in iOS-Apps vertraut zu machen, um sicherzustellen, dass Ihre Anwendung sicher und performant ist.

Datei:Swift-ios-DatenSpeichern.jpg

2023-01-26T19:18:57Z

Steff:

Möglichkeiten in iOS Daten zu persistieren.

SPF (Sender Policy Framework)

2022-09-20T08:00:49Z

Steff:

SPF wird von vielen IT-lern als in der Praxis unwirksam angesehen. Wenn man Weiterleitungen über Newsletterdienstleister oder auch manuelle in der Praxis einbezieht, kann man praktisch nicht mehr hart blockieren (-all). Es kann allerdings als Beweis dafür gelten, das die Mail original ist, wenn sie tatsächlich über den Original-Server versendet wurde. Das ist aber nur dann sinnvoll, wenn dem Empfänger der Absender bekannt ist. Als reiner Schutz gegen Spam funktioniert das nicht, da auch ein Spammer sich eine Domain mit SPF Eintrag billig und Anonym zulegen kann.

Alternative [[DKIM]]

Siehe auch
== Links ==
https://wiki.stephanschlegel.de/index.php?title=E-Mail_Probleme_beheben#Beispiele
https://all-inkl.com/wichtig/anleitungen/kas/tools/dns-werkzeuge/spf_482.html
https://www.youtube.com/watch?v=T1d7wTgBi28
https://switchie.ch/was-bedeutet-spf-sender-policy-framework/# (Quelle dieses Artikels / Zugriff: 2018-01)

== Beispiel erklärt ==
=== Problem ===
Absender können gefälscht werden. Es darf jeder alles verschicken.
=== Lösung ???===
TXT (SPF) DNS Eintrag gibt vor wer versenden darf.
heinlein-support.de. IN TXT "v=spf1 ip4:213.203.238.0/25 ip4:195.10.208.0/24 mx include:jpberlin.de ?all"
Hier wird quasi hinterlegt wer versenden darf
v=spf1 -> Version (SPF-Record Version 1)
ip4:xxx:xxx:xxx:xxx/xx -> IP Bereich
include:... -> Ein SPF-Reord einer anderen Domain wird included
mx -> Server die auch als MX-Recrds definiert sind dürfen verschicken
?all -> Keine Aussage was andere Server dürfen (-all = kein anderer Server darf versenden, +all = alle anderen dürfen sind dann halt nicht verifiziert)

== Hinweise ==
* Die Einstellung TXT statt SPF ist wichtig, da TXT seit rfc7208 der einzig standardkonforme Record für SPF ist! Der dedizierte SPF-Record ist damit obsolet und wird daher nicht breitflächig unterstützt.

== Übersicht von switcher.ch ==
SPF (Sender Policy Framework) ist ein Protokoll, mit dem ein Halter einer DOMAIN festlegen kann, welche IP-Adressen E-Mails im Namen seiner DOMAINs verschicken dürfen und steht für „Sender Policy Framework“. Wenn jemand also eine E-Mail erhält, die behauptet von der DOMAIN ihr-unternehmen.ch versendet worden zu sein, so kann man mittels SPF prüfen, ob dies wirklich der Fall ist. Wenn die entsprechende IP-Adresse nicht durch den SPF-Eintrag autorisiert wurde, so ist die Wahrscheinlichkeit sehr gross, dass die versendete E-Mail ohne Zustimmung des Halter der DOMAIN verschickt wurde. Die Deutung dieser Information liegt letztlich immer im Verantwortungsbereich des Empfängers, ein fehlgeschlagener SPF-Test ist jedoch definitiv ein sehr deutliches Indiz für Spam.

== So funktioniert es ==

Die Funktionalität von SPF setzt zwei Bedingungen voraus:

Jeder Halter des DOMAINs sollte einen korrekten SPF-Eintrag für seine DOMAIN haben, um eine möglichst grosse Flächenabdeckung von SPF gewährleisten zu können.
Mailserver müssen die SPF-Prüfung durchführen.

Die Erstellung eines SPF-Eintrages für die DOMAIN kann problemlos über das Benutzerkonto vorgenommen werden. Der zweite Teil ist jedoch der kompliziertere Teil. Es gibt zwar immer mehr Mailserverbetreiber, die anfangen, SPF-Einträge zu prüfen, von einer flächendeckenden Installation kann jedoch momentan noch bei weitem keine Rede sein.

Trotz allem ist es sehr empfehlenswert, einen SPF-Eintrag für jede DOMAIN zu hinterlegen. Die Verbreitung von SPF nimmt stetig zu. Je mehr DOMAINs SPF-Einträge haben, umso schneller werden auch die Mailserver beginnen, diese Einträge auszuwerten!

Unter den folgenden Links können Sie weitere Informationen zum Thema SPF in Erfahrung bringen:

http://www.openspf.org
http://www.baschny.de/spf/

=== Kann SPF Spam verhindern ? ===

Auch SPF ist leider kein Allheilmittel gegen Spam. Indirekt kann SPF jedoch sehr viel hierzu beitragen. E-Mails werden mittels „Simple Mail Transfer Protocol“ (SMTP) versendet. Bei diesem Protokoll handelt es sich um einen mehr als 20 Jahre alten Standard, der aus einer Zeit stammt, in der es noch keinen Spam gab und man sich „gegenseitig vertrauen“ konnte. Deshalb verfügt das SMTP-Protokoll auch über kein Verfahren, E-Mails versendende Rechner entsprechend zu authentifizieren.

Genau an dieser Stelle setzt „SPF“ an: Bei Definition eines SPF-Eintrages für eine DOMAIN kann einwandfrei festgestellt werden, ob ein Rechner, von dem eine E-Mail versendet wurde, auch tatsächlich für die entsprechende DOMAIN autorisiert ist.

Dies heisst also, dass der SPF-Eintrag für Ihre DOMAIN keine Wirkung hat auf E-Mails die Sie empfangen. Der SPF-Eintrag ist für E-Mails, die Sie versenden. Wenn ein Empfänger eine E-Mail von Ihnen erhält und Ihre DOMAIN einen SPF-Eintrag besitzt, so kann der Empfänger dieser E-Mail prüfen, ob die E-Mail tatsächlich von Ihnen versendet wurde.
Kann ich überprüfen, ob mein SPF-Eintrag funktioniert ?

Ja, das ist möglich. Hier können Sie die Funktionalität des SPF-Eintrags überprüfen.
Wie lautet der SPF-Eintrag, wenn ich MAIL von switchplus nutze ?

Der SPF-Eintrag für das Versenden über die switchplus E-Mailkonten lautet:

v=spf1 a mx include:spf.switchplus-mail.ch ~all

Bitte kopieren Sie diesen mit genau dieser Syntax in die Eingabemaske und speichern Sie die Änderung.

Im unserem GUI können Sie „nur“ einen SPF-Record eintragen (es kann also kein zweiter SPF-Record erstellt werden). Sollten zwei Einträge gesetzt werden müssen, können Sie den SPF-Eintrag wie nachfolgendes Beispiel zeigt ergänzen (hier wird z.B. eine zusätzliche IP-Adresse hinzugefügt):
v=spf1 a mx include:spf.switchplus-mail.ch ip4:xxx.xxx.xxx.xxx ~all

=== Wie erstelle ich einen SPF-Eintrag für eine DOMAIN ? ===

Um für eine bestimmte DOMAIN einen SPF-Eintrag zu erstellen, gehen Sie bitte wie folgt vor:

Loggen Sie sich auf www.switchplus.ch in Ihr Benutzerkonto ein, klicken Sie links in der Navigationsleiste auf „Grundkonfiguration“. Gehen Sie anschliessend rechts am Zeilenende der jeweiligen DOMAIN auf das Editierungssymbol und wählen Sie „Nameserver editieren“. In der Folge-Maske finden Sie alle Records. Klicken Sie nun unten links auf „Eintrag hinzufügen“ und wählen Sie nun beim neu erschienenem Eintrag den Typ „SPF“. Klicken Sie danach auf das nun erschienene Auflistungs-Symbol rechts.

Folgende Konfigurationsmöglichkeiten stehen über die Eingabemaske (Auflistungs-Symbol) zur Verfügung:

1. Meine Webseiten verschicken E-Mails, z.B. über Formmailskripte oder als Teil der installierten Programme wie Forum, Shoplösung etc.
Geben Sie hier bitte an, ob E-Mails von Ihrer DOMAIN auch über Formmailer, Shopsoftware o.ä. Anwendungen verschickt werden. So können Sie bestimmen, ob die IP-Adresse des Webservers in den SPF-Eintrag aufgenommen werden soll.

2. Wenn ich E-Mails verschicke, verwende ich die SMTP-Server von switchplus
Definieren Sie hier, ob Sie beim Versand von E-Mails die Mailserver von switchplus verwenden. Sofern Sie keinen eigenen Mailserver in Ihrem Hause betreiben, ist hier standardmässig die Einstellung „JA“ vorzunehmen.

2a. Wenn Sie Frage 2 mit „Nein“ beantwortet haben:
Die folgende IP-Adresse versendet E-Mails für meine DOMAIN:
Bitte so eingeben: 123.46.78.0 oder 123.43.12.0/24
Sofern Sie für den Versand von E-Mails nicht die Mailserver von switchplus verwenden und bei der vorhergehenden Option „NEIN“ gewählt haben, so können Sie hier die IP-Adressen angeben, über welche Ihre E-Mails versendet werden.

3. Von anderen IP-Adressen werden niemals E-Mails für meine DOMAIN verschickt.
Hier können Sie bestimmen, ob neben den über die obigen Konfigurationsmöglichkeiten angegebenen Mailservern noch weitere Mailserver für den Versand Ihrer E-Mails zuständig sind.

Klicken Sie auf „speichern“, um den SPF-Eintrag für Ihre DOMAIN einzutragen und zu aktivieren.

===Wie kann ein bestehender SPF-Eintrag geändert werden ? ===

Loggen Sie sich auf www.switchplus.ch in Ihr Benutzerkonto ein und klicken Sie links in der Navigationsleiste auf „Grundkonfiguration“. Gehen Sie anschliessend rechts am Zeilenende der jeweiligen DOMAIN auf das Editierungssymbol und wählen Sie „Nameserver editieren“. In der Folge-Maske finden Sie alle Records. Beim bestehenden SPF-Record können Sie nun die gewünschten Einstellungen vornehmen in dem Sie auf das Auflistungs-Symbol klicken.
Der SPF-Assistent erzeugt einen korrekten SPF-Eintrag, den Sie nach Belieben ändern können. Sie sollten dies jedoch nur dann machen, wenn Sie SPF und seine Parameter wirklich kennen. Der SPF-Eintrag wird aber immer auf Korrektheit überprüft. Sollten Sie daher Fehler bei der individuellen Eingabe machen, werden Sie über die Fehler informiert und der Eintrag wird nicht aktiviert.

ProcessWire - Hanna Code (Module)

2022-09-16T06:35:42Z

Steff:

TextformatterHannaCode

Easily insert any complex HTML, Javascript or PHP output in your ProcessWire content by creating your own Hanna code tags.
https://github.com/ryancramerdesign/ProcessHannaCode#using-hanna-code-from-the-api

== Hanna Code Snippets ==
=== Image from RepeaterMatrix or Repeater ===
<syntaxhighlight lang="php">
<?php
// include a image from the parent page
if (!function_exists('getImagePage')) {

function getImagePage($myPage, $level=1){
// if in repeater or repeaterMatrix find the first parent ProcessWire\Page Page
$maxLevel=5;
if( get_class($myPage) == 'ProcessWire\RepeaterMatrixPage' || get_class($myPage) == 'ProcessWire\RepeaterPage') {
$level +=1;
if($level > $maxLevel) return false;
$forPage = $myPage->getForPage();
//var_dump( $myPage->getForPage());
//echo("<p>next Level: ".get_class($forPage)."</p>");
return $myPage = getImagePage($forPage);

}else if( get_class($myPage) == 'ProcessWire\Page'){

return $myPage;
}
}
}
$out = '';
$imagePage = getImagePage($page);
$images = $imagePage->images;
$imgTag = '';

if($images){
if(isset($file)){
isset($width) ? $image = $images->get($file)->width($width) : $image = $images->get($file);
$imgTag .= "<img src='$image->url'";
if(isset($width)) $imgTag .= " width='$width'";
if(isset($class)) $imgTag .= " class='$class'";
if(isset($style)) $imgTag .= " style='$style'";
$imgTag .= '>';
$out = $imgTag;
}else{
$out .= "<p>Gib einen Bildnamen an z.B.</p>";
foreach($images as $image){
$out .= '<p>[[image file="'.$image->name.'"]]</p>';
}
}
}else{
$out .= '<p>Keine Bilder auf der Seite gefunden</p>';

}
echo $out;
</syntaxhighlight>
=== Templates ===
<?php
echo(urls()->templates);

=== Video ===
Von chargercube - todo security / video field statt dateifeld
<syntaxhighlight lang="php">
<?php

// include a image from the parent page
if (!function_exists('getImagePage')) {

function getImagePage($myPage, $level=1){
// if in repeater or repeaterMatrix find the first parent ProcessWire\Page Page
$maxLevel=5;
if( get_class($myPage) == 'ProcessWire\RepeaterMatrixPage' || get_class($myPage) == 'ProcessWire\RepeaterPage') {
$level +=1;
if($level > $maxLevel) return false;
$forPage = $myPage->getForPage();
//var_dump( $myPage->getForPage());
//echo("<p>next Level: ".get_class($forPage)."</p>");
return $myPage = getImagePage($forPage);

}else if( get_class($myPage) == 'ProcessWire\Page'){

return $myPage;
}
}
}
$out = '';
$imagePage = getImagePage($page);
//var_dump($imagePage->name);
$files = $imagePage->files;
$videoTag = '';
$videoValid = false;
$styles = '';

if($files){
if(isset($file)){
$file = $files->get($file); // we need the file object not the file name
if(isset($width)) $styles = 'width: '.$width.'; max-width: 100%; height: auto;';
else $styles = 'width: 100%; height: auto;';
if($file){
$videoValid = true;
$videoTag .= '
<video style="'.$styles.'" preload="preload" playsinline="" controls="" uk-video="autoplay: false" aria-hidden="false">
<source src="'.$file->url.'" type="video/mp4">
Ihr Browser unterstützt kein Video Tag
</video>
';
$out = $videoTag;
}
}
if(!$videoValid){
$out .= "<p>Gib einen Dateinamen an. Dateien auf dieser Seite:.</p>";
foreach($files as $file){
$out .= '<p>[[video file="'.$file->name.'"]]</p>';
}
}
}else{
$out .= '<p>Keine Dateie auf der Seite gefunden</p>';
}

echo $out;

</syntaxhighlight>

=== Heading ===
Genbänkle

Attributes
tag=h2
heading
<pre>
<?php
echo($heading);
?>
</pre>

=== Next Events ===
Genbänkle
<syntaxhighlight lang="php">
<?php
$today = strtotime(date('Y-m-d'));
$eventPage = $pages->get('/termine/');
$mySelector = "template=event,limit=2,sort=event_date,event_date>=$today";
$events = $pages->find($mySelector);
$eventListMarkup = '';

foreach($events as $event){
$eventListMarkup .= '<div class="date uk-text-muted">'.$event->event_date.'</div>';
$eventListMarkup .= '<p><a href="'.$event->url().'">'.$event->title.'</a></p>';
}

echo $eventListMarkup;
</syntaxhighlight>

=== Childnavigation ===
<syntaxhighlight lang="php">
<?php namespace ProcessWire;
$out = '';
($attr['parent']) ? $parent = $pages->get($attr['parent']) : $parent = $page;
$children = $parent->children();
$out .= '<ul class="childnav">';
foreach ($children as $child){
$out .= '<li class="nav-item"><a class="nav-link" href="'.$child->url.'">'. $child->title . '</a></li>';
}
$out .= '</ul>';
echo $out;
</syntaxhighlight>

=== Social Media Icons über Repeater ===
<syntaxhighlight lang="php">
<?php namespace ProcessWire;

// SOCIALMEDIA
$socialmedia = '';
$p = $pages->get('/site-configuration/');
//bd($p->r_socialicons);
foreach($p->r_socialicons as $item){
if($item->link){
$socialmedia .= '<li><a href="'.$item->link.'" target="_blank" description="'.$item->text.'"><img src="'.$item->single_image->width(48)->url.'" uk-tooltip="'.$item->text.'" alt="'.$item->text.'" title="'.$item->text.'"></a></li>';
}
}

return '<ul class="nav socialicons uk-flex uk-flex-center@m nmb">'.$socialmedia.'</ul>';
</syntaxhighlight>

Puppeteer - NodeJS Scraping

2022-09-12T18:46:06Z

Steff:

== Puppeteer ==
Puppeteer Hauptseite.

== Links ==
https://pptr.dev/
https://www.youtube.com/watch?v=CngYXf9aeg8&list=PLGreOtbNU07rDURvnQpDaT3XokxlranUQ
https://blog.risingstack.com/pdf-from-html-node-js-puppeteer/
https://advancedweb.hu/how-to-speed-up-puppeteer-scraping-with-parallelization/
https://jsoverson.medium.com/using-chrome-devtools-protocol-with-puppeteer-737a1300bac0 *
== Quickstart ==
https://www.youtube.com/watch?v=Sag-Hz9jJNg
Voraussetzung: VisualStudioCode, NodeJS installiert

Ordner erstellen und NodeJS Projekt starten

Terminal
npm init -y
npm install puppeteer

Installiert auch Chromium. Schau mal in die package.json

Als Basis kommt fast immer ein Konstrukt ähnlich dem folgenden zum Einsatz. Im Wesentlichen passiert folgendes:

index.js erstellen. Puppeteer laden mit asynchroner Funktion. Diese Funktion

<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer"); //pup
(async () => {
const browser = await puppeteer.launch({headless: true}); // open a new browser - headless (default) or with displaying
const page = await browser.newPage(); // open a new tab
await page.goto("https://schlegel.media/"); // navigate to a url
// do s.th.
await browser.close(); // close the browser
}) ();
</syntaxhighlight>

Beispiel Screenshot von Seite anfertigen:
<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer");
(async () => {
const browser = await puppeteer.launch({headless: false}) // launch can launch headless or with displaying
const page = await browser.newPage() // open new tab in browser
await page.goto("https://schlegel.media")
await page.screenshot({path: "screenshot.png"})

await browser.close()
}) ();
</syntaxhighlight>

Starten mit
node index.js

== Beispiel Skripte ==
Hinweis: Da die Skripte in diesem Setup keine ES Module sind, gab es bei mir Probleme in Node wenn man die Strichpunkte weglässt.

=== DOM Elemente scrapen mit evaluate ===
Zum Scrapen bietet sich die evaluate Funk
<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer")
(async () => {
const browser = await puppeteer.launch({headless: false}) // launch can launch headless or with displaying
const page = await browser.newPage() // open new tab in browser
await page.goto("https://schlegel.media")

const grabSlogan = await page.evaluate( () => {
const slogan = document.querySelector(".uk-text-lead")
//return slogan.innerHTML // with html tags
return slogan.innerText // only the text
})

console.log(grabSlogan)
await browser.close()
}) ()
</syntaxhighlight>

// grab multiple elements
<syntaxhighlight lang="javascript">
//... wie oben
const grabList = await page.evaluate( () => {
const listTags = document.querySelectorAll(".uk-nav-default li")
let listItems = []
listTags.forEach((tag) => {
listItems.push(tag.innerText)
})

return listItems
})
console.log(grabList)
</syntaxhighlight>

Komplexere DOM-Zugriffe
<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer");
(async () => {
const browser = await puppeteer.launch({headless: false}); // launch can launch headless or with displaying
const page = await browser.newPage(); // open new tab in browser
await page.goto("https://quotes.toscrape.com/");

const grab = await page.evaluate( () => {
let arrElements = [];
const quotes = document.querySelectorAll(".quote");
quotes.forEach( (quote) => {
const quoteSpans = quote.querySelectorAll("span");
const quoteText = quoteSpans[0].innerHTML;
const quoteAuthor = quoteSpans[1].querySelector("small").innerHTML;
arrElements.push({'quote': quoteText, 'author': quoteAuthor});
});
return arrElements;
});

console.log(grab);
await browser.close();
}) ();
</syntaxhighlight>

=== User actions simulieren ===
<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer");
(async () => {
const browser = await puppeteer.launch({headless: false}); // launch can launch headless or with displaying
const page = await browser.newPage(); // open new tab in browser
await page.goto("https://quotes.toscrape.com/");

await page.click('a[href="/login"]'); // click login link
await page.type('#username','myUserName',{delay:300});
await page.type('#password','mySecret');
await page.click('input[type="submit"]');
//await browser.close();
}) ();
</syntaxhighlight>

=== Computed Styles von DOM Elementen auslesen ===
'''Styles eines DOM Elements''' finden. Hier nutzen wir mal die $eval Funktion.
<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer");
(async () => {

const browser = await puppeteer.launch({headless: true}); // launch can launch headless or with displaying
const page = await browser.newPage(); // open new tab in browser
await page.goto("https://schlegel.media/");

// get styles of element
const myStyles = await page.$eval('body', el => getComputedStyle(el).getPropertyValue('font-family')
);
console.log(myStyles);

await browser.close();
}) ();
</syntaxhighlight>
Hinweis: Handle Functions sind nicht so performant aber eher menschenähnlich. Bei einem Klick würde der Browser tatsächlich die Maus bewegen statt einfach einen Klick Event zu senden.

'''Evaluate Version''' - besser zu debuggen Unterschiede in der Ausführung. Siehe: https://stackoverflow.com/questions/55664420/page-evaluate-vs-puppeteer-methods
<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer");
(async () => {
const browser = await puppeteer.launch({headless: true}); // launch can launch headless or with displaying
const page = await browser.newPage(); // open new tab in browser
await page.goto("https://schlegel.media/");

// get styles of element
const getStyles = await page.evaluate( () =>{
const el = document.querySelector('body');
const myStyle = getComputedStyle(el).getPropertyValue('font-family');
return myStyle
});
console.log(getStyles);

await browser.close();
}) ();
</syntaxhighlight>

'''So kann man alle Styles auslesen:'''
<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer");
(async () => {

const browser = await puppeteer.launch({headless: true}); // launch can launch headless or with displaying
const page = await browser.newPage(); // open new tab in browser
await page.goto("https://schlegel.media/");

// get styles of element
const getStyles = await page.evaluate( () =>{
const el = document.querySelector('p');
//const myStyle = getComputedStyle(el).getPropertyValue('font-family'); // get a specific style
const stylesObject = getComputedStyle(el);
const myStyles = {};
for (const prop in stylesObject) {
if(stylesObject.hasOwnProperty(prop)){ // filter out
myStyles[prop] = stylesObject[prop];
}
}
//return myStyle;
return myStyles;
});
console.log(getStyles);

await browser.close();
}) ();
</syntaxhighlight>

=== PDF generieren ===
Siehe auch
https://blog.risingstack.com/pdf-from-html-node-js-puppeteer/

<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer");
(async () => {

const browser = await puppeteer.launch({headless: true}); // launch can launch headless or with displaying
const page = await browser.newPage(); // open new tab in browser
await page.goto("https://schlegel.media/");

// print pdf
await page.pdf({
path: "myWebsite.pdf", // mandatory - rest ist optional
format: 'A4', // default is letter
margin: {
top: '100px',
bottom: '100px'
},
printBackground: true,
displayHeaderFooter: true,
headerTemplate: `<p style="font-size: 10px; font-family: Arial, Helvetica, sans-serif; margin: 0 auto;"><span class="title"></span></p>`,
footerTemplate: `<p style="font-size:10px; font-family: Arial, Helvetica, sans-serif; margin: 0 auto;"><span class="pageNumber"></span> of <span class="totalPages"></span></p>`
})

await browser.close();
}) ();
</syntaxhighlight>
=== Crawl multiple pages ===
https://stackoverflow.com/questions/46293216/crawling-multiple-urls-in-a-loop-using-puppeteer
<syntaxhighlight lang="javascript">
page.setDefaultNavigationTimeout(0); // prevent timeout after 30s.
//...
urls = ['url','url','url'...]

for (let i = 0; i < urls.length; i++) {
const url = urls[i];
await page.goto(`${url}`);
await page.waitForNavigation({ waitUntil: 'networkidle2' });
}
</syntaxhighlight>

=== Input- und Output-Files ===
https://github.com/Zrce/puppeteer-coverage-report-test/blob/master/index.js
https://stackoverflow.com/questions/59981135/puppeteer-iterate-over-a-csv-file-and-screenshot-for-each-row

'''CSV Datei mit URLs abarbeiten - seriell/parallel'''
[[Puppeteer - CSV Datei sequentiell / parallel a abarbeiten (Beispiel)]]

<syntaxhighlight lang="javascript">

</syntaxhighlight>

=== Zertifikate und Puppeteer ===
[[Puppeteer - Zertifikate handeln]]

=== Network Request Control ===
https://github.com/puppeteer/puppeteer/blob/main/examples/block-images.js
[[Puppeteer - RequestInterception]]

Puppeteer - RequestInterception

2022-09-12T18:34:44Z

Steff: /* Snippets */

Der RequestInterceptor klinkt sich quasi ein, wenn die ganzen Resourcen der Webpage nachgeladen werden. So kann man direkt eingreifen. Der Ladevorgang der Resourcen geht erst weiter, wenn request.continue() oder request.abort() aufgerufen wird.
== Snippets ==
<syntaxhighlight lang="javascript">
page.on('request', (request) => {
if (/\.(png|jpg|jpeg|gif|webp)$/i.test(request.url)) {
request.abort();
} else if (request.url.startsWith(defaults.URL_INSTAGRAM_GRAPHQL_QUERY)) {
query_id = request.url.split('=')[1].split('&')[0];
} else {
request.continue();
}
});
</syntaxhighlight>

<syntaxhighlight lang="javascript">
'use strict';

const puppeteer = require('puppeteer');

(async () => {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.setRequestInterception(true);
page.on('request', request => {
if (request.resourceType() === 'image') {
request.abort();
} else {
request.continue();
}
});
await page.goto('https://news.google.com/news/');
await page.screenshot({path: 'news.png', fullPage: true});

await browser.close();
})();
</syntaxhighlight>

Puppeteer - RequestInterception

2022-09-12T18:34:01Z

Steff: /* Snippets */

Der RequestInterceptor klinkt sich quasi ein, wenn die ganzen Resourcen der Webpage nachgeladen werden. So kann man direkt eingreifen. Der Ladevorgang der Resourcen geht erst weiter, wenn request.continue() oder request.abort() aufgerufen wird.
== Snippets ==
<syntaxhighlight lang="javascript">
page.on('request', (request) => {
if (/\.(png|jpg|jpeg|gif|webp)$/i.test(request.url)) {
request.abort();
} else if (request.url.startsWith(defaults.URL_INSTAGRAM_GRAPHQL_QUERY)) {
query_id = request.url.split('=')[1].split('&')[0];
} else {
request.continue();
}
});
</syntaxhighlight>

<syntaxhighlight lang="javascript">
page.on('request', (request) => {
if (/\.(png|jpg|jpeg|gif|webp)$/i.test(request.url)) {
request.abort();
} else if (request.url.startsWith(defaults.URL_INSTAGRAM_GRAPHQL_QUERY)) {
query_id = request.url.split('=')[1].split('&')[0];
} else {
request.continue();
}
});
</syntaxhighlight>

Puppeteer - RequestInterception

2022-09-12T18:23:34Z

Steff: Die Seite wurde neu angelegt: „== Snippets == <syntaxhighlight lang="javascript"> page.on('request', (request) => { if (/\.(png|jpg|jpeg|gif|webp)$/i.test(request.url)) { r…“

== Snippets ==
<syntaxhighlight lang="javascript">
page.on('request', (request) => {
if (/\.(png|jpg|jpeg|gif|webp)$/i.test(request.url)) {
request.abort();
} else if (request.url.startsWith(defaults.URL_INSTAGRAM_GRAPHQL_QUERY)) {
query_id = request.url.split('=')[1].split('&')[0];
} else {
request.continue();
}
});
</syntaxhighlight>

Puppeteer - NodeJS Scraping

2022-09-12T18:23:03Z

Steff: /* Network Request Control */

== Puppeteer ==
Puppeteer Hauptseite.

== Links ==
https://pptr.dev/
https://www.youtube.com/watch?v=CngYXf9aeg8&list=PLGreOtbNU07rDURvnQpDaT3XokxlranUQ
https://blog.risingstack.com/pdf-from-html-node-js-puppeteer/
https://advancedweb.hu/how-to-speed-up-puppeteer-scraping-with-parallelization/
== Quickstart ==
https://www.youtube.com/watch?v=Sag-Hz9jJNg
Voraussetzung: VisualStudioCode, NodeJS installiert

Ordner erstellen und NodeJS Projekt starten

Terminal
npm init -y
npm install puppeteer

Installiert auch Chromium. Schau mal in die package.json

Als Basis kommt fast immer ein Konstrukt ähnlich dem folgenden zum Einsatz. Im Wesentlichen passiert folgendes:

index.js erstellen. Puppeteer laden mit asynchroner Funktion. Diese Funktion

<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer"); //pup
(async () => {
const browser = await puppeteer.launch({headless: true}); // open a new browser - headless (default) or with displaying
const page = await browser.newPage(); // open a new tab
await page.goto("https://schlegel.media/"); // navigate to a url
// do s.th.
await browser.close(); // close the browser
}) ();
</syntaxhighlight>

Beispiel Screenshot von Seite anfertigen:
<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer");
(async () => {
const browser = await puppeteer.launch({headless: false}) // launch can launch headless or with displaying
const page = await browser.newPage() // open new tab in browser
await page.goto("https://schlegel.media")
await page.screenshot({path: "screenshot.png"})

await browser.close()
}) ();
</syntaxhighlight>

Starten mit
node index.js

== Beispiel Skripte ==
Hinweis: Da die Skripte in diesem Setup keine ES Module sind, gab es bei mir Probleme in Node wenn man die Strichpunkte weglässt.

=== DOM Elemente scrapen mit evaluate ===
Zum Scrapen bietet sich die evaluate Funk
<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer")
(async () => {
const browser = await puppeteer.launch({headless: false}) // launch can launch headless or with displaying
const page = await browser.newPage() // open new tab in browser
await page.goto("https://schlegel.media")

const grabSlogan = await page.evaluate( () => {
const slogan = document.querySelector(".uk-text-lead")
//return slogan.innerHTML // with html tags
return slogan.innerText // only the text
})

console.log(grabSlogan)
await browser.close()
}) ()
</syntaxhighlight>

// grab multiple elements
<syntaxhighlight lang="javascript">
//... wie oben
const grabList = await page.evaluate( () => {
const listTags = document.querySelectorAll(".uk-nav-default li")
let listItems = []
listTags.forEach((tag) => {
listItems.push(tag.innerText)
})

return listItems
})
console.log(grabList)
</syntaxhighlight>

Komplexere DOM-Zugriffe
<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer");
(async () => {
const browser = await puppeteer.launch({headless: false}); // launch can launch headless or with displaying
const page = await browser.newPage(); // open new tab in browser
await page.goto("https://quotes.toscrape.com/");

const grab = await page.evaluate( () => {
let arrElements = [];
const quotes = document.querySelectorAll(".quote");
quotes.forEach( (quote) => {
const quoteSpans = quote.querySelectorAll("span");
const quoteText = quoteSpans[0].innerHTML;
const quoteAuthor = quoteSpans[1].querySelector("small").innerHTML;
arrElements.push({'quote': quoteText, 'author': quoteAuthor});
});
return arrElements;
});

console.log(grab);
await browser.close();
}) ();
</syntaxhighlight>

=== User actions simulieren ===
<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer");
(async () => {
const browser = await puppeteer.launch({headless: false}); // launch can launch headless or with displaying
const page = await browser.newPage(); // open new tab in browser
await page.goto("https://quotes.toscrape.com/");

await page.click('a[href="/login"]'); // click login link
await page.type('#username','myUserName',{delay:300});
await page.type('#password','mySecret');
await page.click('input[type="submit"]');
//await browser.close();
}) ();
</syntaxhighlight>

=== Computed Styles von DOM Elementen auslesen ===
'''Styles eines DOM Elements''' finden. Hier nutzen wir mal die $eval Funktion.
<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer");
(async () => {

const browser = await puppeteer.launch({headless: true}); // launch can launch headless or with displaying
const page = await browser.newPage(); // open new tab in browser
await page.goto("https://schlegel.media/");

// get styles of element
const myStyles = await page.$eval('body', el => getComputedStyle(el).getPropertyValue('font-family')
);
console.log(myStyles);

await browser.close();
}) ();
</syntaxhighlight>
Hinweis: Handle Functions sind nicht so performant aber eher menschenähnlich. Bei einem Klick würde der Browser tatsächlich die Maus bewegen statt einfach einen Klick Event zu senden.

'''Evaluate Version''' - besser zu debuggen Unterschiede in der Ausführung. Siehe: https://stackoverflow.com/questions/55664420/page-evaluate-vs-puppeteer-methods
<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer");
(async () => {
const browser = await puppeteer.launch({headless: true}); // launch can launch headless or with displaying
const page = await browser.newPage(); // open new tab in browser
await page.goto("https://schlegel.media/");

// get styles of element
const getStyles = await page.evaluate( () =>{
const el = document.querySelector('body');
const myStyle = getComputedStyle(el).getPropertyValue('font-family');
return myStyle
});
console.log(getStyles);

await browser.close();
}) ();
</syntaxhighlight>

'''So kann man alle Styles auslesen:'''
<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer");
(async () => {

const browser = await puppeteer.launch({headless: true}); // launch can launch headless or with displaying
const page = await browser.newPage(); // open new tab in browser
await page.goto("https://schlegel.media/");

// get styles of element
const getStyles = await page.evaluate( () =>{
const el = document.querySelector('p');
//const myStyle = getComputedStyle(el).getPropertyValue('font-family'); // get a specific style
const stylesObject = getComputedStyle(el);
const myStyles = {};
for (const prop in stylesObject) {
if(stylesObject.hasOwnProperty(prop)){ // filter out
myStyles[prop] = stylesObject[prop];
}
}
//return myStyle;
return myStyles;
});
console.log(getStyles);

await browser.close();
}) ();
</syntaxhighlight>

=== PDF generieren ===
Siehe auch
https://blog.risingstack.com/pdf-from-html-node-js-puppeteer/

<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer");
(async () => {

const browser = await puppeteer.launch({headless: true}); // launch can launch headless or with displaying
const page = await browser.newPage(); // open new tab in browser
await page.goto("https://schlegel.media/");

// print pdf
await page.pdf({
path: "myWebsite.pdf", // mandatory - rest ist optional
format: 'A4', // default is letter
margin: {
top: '100px',
bottom: '100px'
},
printBackground: true,
displayHeaderFooter: true,
headerTemplate: `<p style="font-size: 10px; font-family: Arial, Helvetica, sans-serif; margin: 0 auto;"><span class="title"></span></p>`,
footerTemplate: `<p style="font-size:10px; font-family: Arial, Helvetica, sans-serif; margin: 0 auto;"><span class="pageNumber"></span> of <span class="totalPages"></span></p>`
})

await browser.close();
}) ();
</syntaxhighlight>
=== Crawl multiple pages ===
https://stackoverflow.com/questions/46293216/crawling-multiple-urls-in-a-loop-using-puppeteer
<syntaxhighlight lang="javascript">
page.setDefaultNavigationTimeout(0); // prevent timeout after 30s.
//...
urls = ['url','url','url'...]

for (let i = 0; i < urls.length; i++) {
const url = urls[i];
await page.goto(`${url}`);
await page.waitForNavigation({ waitUntil: 'networkidle2' });
}
</syntaxhighlight>

=== Input- und Output-Files ===
https://github.com/Zrce/puppeteer-coverage-report-test/blob/master/index.js
https://stackoverflow.com/questions/59981135/puppeteer-iterate-over-a-csv-file-and-screenshot-for-each-row

'''CSV Datei mit URLs abarbeiten - seriell/parallel'''
[[Puppeteer - CSV Datei sequentiell / parallel a abarbeiten (Beispiel)]]

<syntaxhighlight lang="javascript">

</syntaxhighlight>

=== Zertifikate und Puppeteer ===
[[Puppeteer - Zertifikate handeln]]

=== Network Request Control ===
https://github.com/puppeteer/puppeteer/blob/main/examples/block-images.js
[[Puppeteer - RequestInterception]]

Puppeteer - Zertifikate handeln

2022-09-12T18:09:42Z

Steff:

https://thedavidbarton.github.io/blog/cert-expiry-puppeteer/
== Snippets ==
Zertifikatsdetails holen

<syntaxhighlight lang="javascript">
const browser = await puppeteer.launch();

const page = await browser.newPage();

const pageUrl = 'https://example.com/'
const response = await page.goto(pageUrl, {waitUntil: 'networkidle0'})
const securityDetails = await response.securityDetails()

console.log(securityDetails)
console.log(securityDetails.protocol())

await browser.close();
</syntaxhighlight>

Puppeteer - NodeJS Scraping

2022-09-12T18:08:59Z

Steff: /* Zertifikate und Puppeteer */

== Puppeteer ==
Puppeteer Hauptseite.

== Links ==
https://pptr.dev/
https://www.youtube.com/watch?v=CngYXf9aeg8&list=PLGreOtbNU07rDURvnQpDaT3XokxlranUQ
https://blog.risingstack.com/pdf-from-html-node-js-puppeteer/
https://advancedweb.hu/how-to-speed-up-puppeteer-scraping-with-parallelization/
== Quickstart ==
https://www.youtube.com/watch?v=Sag-Hz9jJNg
Voraussetzung: VisualStudioCode, NodeJS installiert

Ordner erstellen und NodeJS Projekt starten

Terminal
npm init -y
npm install puppeteer

Installiert auch Chromium. Schau mal in die package.json

Als Basis kommt fast immer ein Konstrukt ähnlich dem folgenden zum Einsatz. Im Wesentlichen passiert folgendes:

index.js erstellen. Puppeteer laden mit asynchroner Funktion. Diese Funktion

<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer"); //pup
(async () => {
const browser = await puppeteer.launch({headless: true}); // open a new browser - headless (default) or with displaying
const page = await browser.newPage(); // open a new tab
await page.goto("https://schlegel.media/"); // navigate to a url
// do s.th.
await browser.close(); // close the browser
}) ();
</syntaxhighlight>

Beispiel Screenshot von Seite anfertigen:
<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer");
(async () => {
const browser = await puppeteer.launch({headless: false}) // launch can launch headless or with displaying
const page = await browser.newPage() // open new tab in browser
await page.goto("https://schlegel.media")
await page.screenshot({path: "screenshot.png"})

await browser.close()
}) ();
</syntaxhighlight>

Starten mit
node index.js

== Beispiel Skripte ==
Hinweis: Da die Skripte in diesem Setup keine ES Module sind, gab es bei mir Probleme in Node wenn man die Strichpunkte weglässt.

=== DOM Elemente scrapen mit evaluate ===
Zum Scrapen bietet sich die evaluate Funk
<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer")
(async () => {
const browser = await puppeteer.launch({headless: false}) // launch can launch headless or with displaying
const page = await browser.newPage() // open new tab in browser
await page.goto("https://schlegel.media")

const grabSlogan = await page.evaluate( () => {
const slogan = document.querySelector(".uk-text-lead")
//return slogan.innerHTML // with html tags
return slogan.innerText // only the text
})

console.log(grabSlogan)
await browser.close()
}) ()
</syntaxhighlight>

// grab multiple elements
<syntaxhighlight lang="javascript">
//... wie oben
const grabList = await page.evaluate( () => {
const listTags = document.querySelectorAll(".uk-nav-default li")
let listItems = []
listTags.forEach((tag) => {
listItems.push(tag.innerText)
})

return listItems
})
console.log(grabList)
</syntaxhighlight>

Komplexere DOM-Zugriffe
<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer");
(async () => {
const browser = await puppeteer.launch({headless: false}); // launch can launch headless or with displaying
const page = await browser.newPage(); // open new tab in browser
await page.goto("https://quotes.toscrape.com/");

const grab = await page.evaluate( () => {
let arrElements = [];
const quotes = document.querySelectorAll(".quote");
quotes.forEach( (quote) => {
const quoteSpans = quote.querySelectorAll("span");
const quoteText = quoteSpans[0].innerHTML;
const quoteAuthor = quoteSpans[1].querySelector("small").innerHTML;
arrElements.push({'quote': quoteText, 'author': quoteAuthor});
});
return arrElements;
});

console.log(grab);
await browser.close();
}) ();
</syntaxhighlight>

=== User actions simulieren ===
<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer");
(async () => {
const browser = await puppeteer.launch({headless: false}); // launch can launch headless or with displaying
const page = await browser.newPage(); // open new tab in browser
await page.goto("https://quotes.toscrape.com/");

await page.click('a[href="/login"]'); // click login link
await page.type('#username','myUserName',{delay:300});
await page.type('#password','mySecret');
await page.click('input[type="submit"]');
//await browser.close();
}) ();
</syntaxhighlight>

=== Computed Styles von DOM Elementen auslesen ===
'''Styles eines DOM Elements''' finden. Hier nutzen wir mal die $eval Funktion.
<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer");
(async () => {

const browser = await puppeteer.launch({headless: true}); // launch can launch headless or with displaying
const page = await browser.newPage(); // open new tab in browser
await page.goto("https://schlegel.media/");

// get styles of element
const myStyles = await page.$eval('body', el => getComputedStyle(el).getPropertyValue('font-family')
);
console.log(myStyles);

await browser.close();
}) ();
</syntaxhighlight>
Hinweis: Handle Functions sind nicht so performant aber eher menschenähnlich. Bei einem Klick würde der Browser tatsächlich die Maus bewegen statt einfach einen Klick Event zu senden.

'''Evaluate Version''' - besser zu debuggen Unterschiede in der Ausführung. Siehe: https://stackoverflow.com/questions/55664420/page-evaluate-vs-puppeteer-methods
<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer");
(async () => {
const browser = await puppeteer.launch({headless: true}); // launch can launch headless or with displaying
const page = await browser.newPage(); // open new tab in browser
await page.goto("https://schlegel.media/");

// get styles of element
const getStyles = await page.evaluate( () =>{
const el = document.querySelector('body');
const myStyle = getComputedStyle(el).getPropertyValue('font-family');
return myStyle
});
console.log(getStyles);

await browser.close();
}) ();
</syntaxhighlight>

'''So kann man alle Styles auslesen:'''
<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer");
(async () => {

const browser = await puppeteer.launch({headless: true}); // launch can launch headless or with displaying
const page = await browser.newPage(); // open new tab in browser
await page.goto("https://schlegel.media/");

// get styles of element
const getStyles = await page.evaluate( () =>{
const el = document.querySelector('p');
//const myStyle = getComputedStyle(el).getPropertyValue('font-family'); // get a specific style
const stylesObject = getComputedStyle(el);
const myStyles = {};
for (const prop in stylesObject) {
if(stylesObject.hasOwnProperty(prop)){ // filter out
myStyles[prop] = stylesObject[prop];
}
}
//return myStyle;
return myStyles;
});
console.log(getStyles);

await browser.close();
}) ();
</syntaxhighlight>

=== PDF generieren ===
Siehe auch
https://blog.risingstack.com/pdf-from-html-node-js-puppeteer/

<syntaxhighlight lang="javascript">
const puppeteer = require("puppeteer");
(async () => {

const browser = await puppeteer.launch({headless: true}); // launch can launch headless or with displaying
const page = await browser.newPage(); // open new tab in browser
await page.goto("https://schlegel.media/");

// print pdf
await page.pdf({
path: "myWebsite.pdf", // mandatory - rest ist optional
format: 'A4', // default is letter
margin: {
top: '100px',
bottom: '100px'
},
printBackground: true,
displayHeaderFooter: true,
headerTemplate: `<p style="font-size: 10px; font-family: Arial, Helvetica, sans-serif; margin: 0 auto;"><span class="title"></span></p>`,
footerTemplate: `<p style="font-size:10px; font-family: Arial, Helvetica, sans-serif; margin: 0 auto;"><span class="pageNumber"></span> of <span class="totalPages"></span></p>`
})

await browser.close();
}) ();
</syntaxhighlight>
=== Crawl multiple pages ===
https://stackoverflow.com/questions/46293216/crawling-multiple-urls-in-a-loop-using-puppeteer
<syntaxhighlight lang="javascript">
page.setDefaultNavigationTimeout(0); // prevent timeout after 30s.
//...
urls = ['url','url','url'...]

for (let i = 0; i < urls.length; i++) {
const url = urls[i];
await page.goto(`${url}`);
await page.waitForNavigation({ waitUntil: 'networkidle2' });
}
</syntaxhighlight>

=== Input- und Output-Files ===
https://github.com/Zrce/puppeteer-coverage-report-test/blob/master/index.js
https://stackoverflow.com/questions/59981135/puppeteer-iterate-over-a-csv-file-and-screenshot-for-each-row

'''CSV Datei mit URLs abarbeiten - seriell/parallel'''
[[Puppeteer - CSV Datei sequentiell / parallel a abarbeiten (Beispiel)]]

<syntaxhighlight lang="javascript">

</syntaxhighlight>

=== Zertifikate und Puppeteer ===
[[Puppeteer - Zertifikate handeln]]

=== Network Request Control ===
https://github.com/puppeteer/puppeteer/blob/main/examples/block-images.js

Puppeteer - Zertifikate handeln

2022-09-12T12:57:32Z

Steff: Die Seite wurde neu angelegt: „ == Snippets == Zertifikatsdetails holen <syntaxhighlight lang="javascript"> const browser = await puppeteer.launch(); const page = await browser.newPage();…“

== Snippets ==
Zertifikatsdetails holen

<syntaxhighlight lang="javascript">
const browser = await puppeteer.launch();

const page = await browser.newPage();

const pageUrl = 'https://example.com/'
const response = await page.goto(pageUrl, {waitUntil: 'networkidle0'})
const securityDetails = await response.securityDetails()

console.log(securityDetails)
console.log(securityDetails.protocol())

await browser.close();
</syntaxhighlight>