{"id":41,"date":"2020-02-29T13:22:12","date_gmt":"2020-02-29T12:22:12","guid":{"rendered":"http:\/\/188.40.141.249\/?page_id=41"},"modified":"2022-12-26T11:43:20","modified_gmt":"2022-12-26T10:43:20","slug":"beispiel","status":"publish","type":"page","link":"https:\/\/www.schultermine.de\/index.php\/beispiel\/","title":{"rendered":"Beispiel"},"content":{"rendered":"<p>[et_pb_section fb_built=&#8220;1&#8243; _builder_version=&#8220;4.16&#8243; global_colors_info=&#8220;{}&#8220;][et_pb_row _builder_version=&#8220;4.16&#8243; global_colors_info=&#8220;{}&#8220;][et_pb_column type=&#8220;4_4&#8243; _builder_version=&#8220;4.16&#8243; global_colors_info=&#8220;{}&#8220;][et_pb_text _builder_version=&#8220;4.16&#8243; global_colors_info=&#8220;{}&#8220;]<\/p>\n<h1>Das k\u00f6nnte Ihre Homepage sein<\/h1>\n<p>Hier sehen sie ein Beispiel, wie sie Ihre Schultermine automatisch auf ihrer Schul-Homepage darstellen k\u00f6nnen<\/p>\n<p>[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row _builder_version=&#8220;4.16&#8243; custom_padding=&#8220;||1px|||&#8220; hover_enabled=&#8220;0&#8243; global_colors_info=&#8220;{}&#8220; sticky_enabled=&#8220;0&#8243;][et_pb_column type=&#8220;4_4&#8243; _builder_version=&#8220;4.16&#8243; global_colors_info=&#8220;{}&#8220;][et_pb_image src=&#8220;https:\/\/www.schultermine.de\/wp-content\/uploads\/2020\/02\/header.jpg&#8220; force_fullwidth=&#8220;on&#8220; _builder_version=&#8220;4.17.6&#8243; hover_enabled=&#8220;0&#8243; global_colors_info=&#8220;{}&#8220; title_text=&#8220;kind zeigt mit dem finger auf die tafel&#8220; sticky_enabled=&#8220;0&#8243;][\/et_pb_image][\/et_pb_column][\/et_pb_row][et_pb_row column_structure=&#8220;1_4,3_4&#8243; _builder_version=&#8220;4.16&#8243; min_height=&#8220;357px&#8220; global_colors_info=&#8220;{}&#8220;][et_pb_column type=&#8220;1_4&#8243; _builder_version=&#8220;4.16&#8243; global_colors_info=&#8220;{}&#8220;][et_pb_text _builder_version=&#8220;4.16&#8243; text_text_color=&#8220;#ffffff&#8220; header_text_color=&#8220;#ffffff&#8220; header_2_text_color=&#8220;#ffffff&#8220; header_3_text_color=&#8220;#ffffff&#8220; background_color=&#8220;#032b35&#8243; custom_margin=&#8220;-19px||||false|false&#8220; custom_padding=&#8220;3px||15px|10px|false|false&#8220; global_colors_info=&#8220;{}&#8220;]<\/p>\n<h3>Men\u00fc<\/h3>\n<p>[\/et_pb_text][et_pb_text _builder_version=&#8220;4.16&#8243; background_color=&#8220;#d6d6d6&#8243; custom_margin=&#8220;-50px|||||&#8220; custom_padding=&#8220;|||10px|false|false&#8220; global_colors_info=&#8220;{}&#8220;]<\/p>\n<blockquote><\/blockquote>\n<p>Homepage<br \/> &#8230;<br \/> &#8230;<br \/> &#8230;<br \/> Termine<br \/> &#8230;<br \/> &#8230;<br \/> Anleitung<\/p>\n<p>[\/et_pb_text][\/et_pb_column][et_pb_column type=&#8220;3_4&#8243; _builder_version=&#8220;4.16&#8243; global_colors_info=&#8220;{}&#8220;][et_pb_text _builder_version=&#8220;4.16&#8243; custom_margin=&#8220;-28px|||||&#8220; global_colors_info=&#8220;{}&#8220;]<\/p>\n<h2>Termine der Beispielschule<\/h2>\n<p>Die folgenden Termine gelten f\u00fcr das laufende Schuljahr. Bitte beachten Sie, dass einzelne Termine noch ver\u00e4nderlich sind.<\/p>\n<p>Wir unterst\u00fctzen schultermine.de. Teilnehmer erhalten \u00c4nderungen automatisch durch eine Benachrichtigung auf ihr Mobilger\u00e4t. Wenden Sie sich an ihren Klassenlehrer um die Zugangsdaten f\u00fcr die Klasse ihres Kindes zu erhalten.<\/p>\n<p>[\/et_pb_text][et_pb_code _builder_version=&#8220;4.16&#8243; global_colors_info=&#8220;{}&#8220;]<!-- sample Style for time table --><!-- [et_pb_line_break_holder] -->   <\/p>\n<style type=\"text\/css\"><!-- [et_pb_line_break_holder] -->      table, th, td {<!-- [et_pb_line_break_holder] -->         border: 1px solid green;<!-- [et_pb_line_break_holder] -->      } <!-- [et_pb_line_break_holder] -->      table {<!-- [et_pb_line_break_holder] -->         table-layout: auto;<!-- [et_pb_line_break_holder] -->         border-collapse: collapse;<!-- [et_pb_line_break_holder] -->         width: 100%;<!-- [et_pb_line_break_holder] -->      }<!-- [et_pb_line_break_holder] -->      th {<!-- [et_pb_line_break_holder] -->         text-align: left;<!-- [et_pb_line_break_holder] -->         background-color: green;<!-- [et_pb_line_break_holder] -->         color: white !important;<!-- [et_pb_line_break_holder] -->         padding: 10px;<!-- [et_pb_line_break_holder] -->         width:1%;<!-- [et_pb_line_break_holder] -->      }<!-- [et_pb_line_break_holder] -->      td {<!-- [et_pb_line_break_holder] -->         padding: 10px;<!-- [et_pb_line_break_holder] -->         width:1%;<!-- [et_pb_line_break_holder] -->      }<!-- [et_pb_line_break_holder] -->      table .absorbing-column {<!-- [et_pb_line_break_holder] -->         width: 100%;<!-- [et_pb_line_break_holder] -->      }<!-- [et_pb_line_break_holder] -->   <\/style>\n<p><!-- [et_pb_line_break_holder] --><\/p>\n<div id=\"termine\">Lade Termine&#8230;<\/div>\n<p><!-- [et_pb_line_break_holder] --><script><!-- [et_pb_line_break_holder] -->jQuery(document).ready(function(){<!-- [et_pb_line_break_holder] -->  \/\/<!-- [et_pb_line_break_holder] -->     \/\/ Important: The school access code is required and passed as parameter to the service<!-- [et_pb_line_break_holder] -->     \/\/<!-- [et_pb_line_break_holder] -->     var stdataURL = \"https:\/\/www.schultermine.de\/ServiceV1\/RestService\/GetSchoolTimes\/?school=CDU6KA\";<!-- [et_pb_line_break_holder] -->     var returnData = \"\";<!-- [et_pb_line_break_holder] -->     jQuery.ajax({<!-- [et_pb_line_break_holder] -->         type: \"GET\",<!-- [et_pb_line_break_holder] -->         dataType: \"json\",<!-- [et_pb_line_break_holder] -->         async: true,<!-- [et_pb_line_break_holder] -->         url: stdataURL,<!-- [et_pb_line_break_holder] -->         error: function(request, status, error) { alert(request.responseText) },<!-- [et_pb_line_break_holder] -->         success: function(data) {<!-- [et_pb_line_break_holder] -->             jQuery(\"div#termine\").html(\" \");<!-- [et_pb_line_break_holder] -->             returnData = \"<\/p>\n<table>\n<tr>\n<th>Termin<\/th>\n<th>Veranstaltung<\/th>\n<th class=\\\"absorbing-column\\\">Bemerkung<\/th>\n<\/tr>\n<p>\";<!-- [et_pb_line_break_holder] -->             var temp = document.createElement('div');<!-- [et_pb_line_break_holder] -->             for (var i = 0; i < data.length; i++) {<!-- [et_pb_line_break_holder] -->               var date=new Date(data[i][\"date\"])<!-- [et_pb_line_break_holder] -->               let hoursDiff = date.getHours() - date.getTimezoneOffset() \/ 60;<!-- [et_pb_line_break_holder] -->               let minutesDiff = (date.getHours() - date.getTimezoneOffset()) % 60;<!-- [et_pb_line_break_holder] -->               date.setHours(hoursDiff);<!-- [et_pb_line_break_holder] -->               date.setMinutes(minutesDiff);<!-- [et_pb_line_break_holder] -->               var newdate=date.getDate()+'.'+(date.getMonth()+1)+'.'+date.getFullYear();<!-- [et_pb_line_break_holder] -->                temp.textContent = data[i][\"name\"];<!-- [et_pb_line_break_holder] -->                var name=temp.innerHTML;<!-- [et_pb_line_break_holder] -->                temp.textContent = data[i][\"description\"];<!-- [et_pb_line_break_holder] -->                var description=temp.innerHTML;<!-- [et_pb_line_break_holder] -->                returnData += \"<\/p>\n<tr>\n<td>\" + newdate <!-- [et_pb_line_break_holder] -->                           + \"<\/td>\n<td>\" + name + \"<\/td>\n<td>\"<!-- [et_pb_line_break_holder] -->                          + description + \"<\/td>\n<\/tr>\n<p>\";<!-- [et_pb_line_break_holder] -->             }<!-- [et_pb_line_break_holder] -->             returnData = returnData + \"<\/table>\n<p>\";<!-- [et_pb_line_break_holder] -->             jQuery(\"div#termine\").html(returnData);<!-- [et_pb_line_break_holder] -->         }<!-- [et_pb_line_break_holder] -->     });<!-- [et_pb_line_break_holder] -->     return (false);<!-- [et_pb_line_break_holder] -->});<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><\/script>[\/et_pb_code][et_pb_button button_url=&#8220;https:\/\/www.schultermine.de\/Portal\/#\/login?username=Demo&#038;password=Demo&#8220; url_new_window=&#8220;on&#8220; button_text=&#8220;Termine \u00e4ndern&#8220; button_alignment=&#8220;right&#8220; _builder_version=&#8220;4.16&#8243; global_colors_info=&#8220;{}&#8220;][\/et_pb_button][et_pb_text _builder_version=&#8220;4.16&#8243; global_colors_info=&#8220;{}&#8220;]<\/p>\n<p><span>Diese Termine wurden direkt aus dem schultermine-Portal geladen und hier dargestellt. Klicken sie auf die folgende Schaltfl\u00e4che, um die technischen Details zu erfahren.<\/span><\/p>\n<p>[\/et_pb_text][et_pb_code _builder_version=&#8220;4.16&#8243; global_colors_info=&#8220;{}&#8220;]<\/p>\n<style type=\"text\/css\"><!-- [et_pb_line_break_holder] -->.rv_button.closed:after {content:\"\\33\";}<!-- [et_pb_line_break_holder] -->.rv_button.opened:after{content:\"\\32\";}<!-- [et_pb_line_break_holder] --><\/style>\n<p><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><script type=\"text\/javascript\"><!-- [et_pb_line_break_holder] --> jQuery(document).ready(function() {<!-- [et_pb_line_break_holder] -->\/\/ Hide the div<!-- [et_pb_line_break_holder] -->jQuery('#reveal').hide();<!-- [et_pb_line_break_holder] -->jQuery('.rv_button').click(function(e){<!-- [et_pb_line_break_holder] -->e.preventDefault();jQuery(\"#reveal\").slideToggle();<!-- [et_pb_line_break_holder] -->jQuery('.rv_button').toggleClass('opened closed');<!-- [et_pb_line_break_holder] -->});<!-- [et_pb_line_break_holder] -->});<!-- [et_pb_line_break_holder] --><\/script>[\/et_pb_code][et_pb_button button_text=&#8220;Wie es funktioniert&#8220; module_class=&#8220;rv_button closed&#8220; _builder_version=&#8220;4.16&#8243; global_colors_info=&#8220;{}&#8220;][\/et_pb_button][\/et_pb_column][\/et_pb_row][et_pb_row module_id=&#8220;reveal&#8220; _builder_version=&#8220;4.16&#8243; global_colors_info=&#8220;{}&#8220;][et_pb_column type=&#8220;4_4&#8243; _builder_version=&#8220;4.16&#8243; global_colors_info=&#8220;{}&#8220;][et_pb_text _builder_version=&#8220;4.16&#8243; global_colors_info=&#8220;{}&#8220;]<\/p>\n<p>Die Anzeige der Schultermine auf der Homepage ist sehr einfach. Ihr Webmaster wird damit keine Probleme haben. Der folgende Codeabschnitt demonstriert, wie die Daten aus dem Portal geladen und dargestellt werden k\u00f6nnen.<\/p>\n<p>Hierzu wird zun\u00e4chst ein div-Element ben\u00f6tigt, in das die Daten geladen werden<\/p>\n<p>[\/et_pb_text][et_pb_dmb_code_snippet code=&#8220;PGRpdiBpZD0idGVybWluZSI+TGFkZSBUZXJtaW5lLi4uPC9kaXY+&#8220; language=&#8220;html&#8220; style=&#8220;atelier-seaside-light&#8220; linenums=&#8220;on&#8220; _builder_version=&#8220;4.16&#8243; body_font_size=&#8220;13px&#8220; body_line_height=&#8220;1em&#8220; global_colors_info=&#8220;{}&#8220;][\/et_pb_dmb_code_snippet][et_pb_text _builder_version=&#8220;4.16&#8243; global_colors_info=&#8220;{}&#8220;]<\/p>\n<p><span>Als n\u00e4chstes wird ein JavaScript Baustein erstellt, der die Daten vom Webservice l\u00e4dt und eine HTML-Tabelle aufbaut. Nat\u00fcrlich kann diese dann individuell gestaltet werden.<\/span><\/p>\n<p>[\/et_pb_text][et_pb_dmb_code_snippet code=&#8220;alF1ZXJ5KGRvY3VtZW50KS5yZWFkeShmdW5jdGlvbigpewogICAgIC8vCiAgICAgLy8gSW1wb3J0YW50OiBUaGUgc2Nob29sIGFjY2VzcyBjb2RlIGlzIHJlcXVpcmVkIGFuZCBwYXNzZWQgYXMgcGFyYW1ldGVyIHRvIHRoZSBzZXJ2aWNlCiAgICAgLy8KICAgICB2YXIgc3RkYXRhVVJMID0gImh0dHBzOi8vd3d3LnNjaHVsdGVybWluZS5kZS9TZXJ2aWNlVjEvUmVzdFNlcnZpY2UvR2V0U2Nob29sVGltZXMvP3NjaG9vbD1DRFU2S0EiOwogICAgIHZhciByZXR1cm5EYXRhID0gIiI7CiAgICAgalF1ZXJ5LmFqYXgoewogICAgICAgICB0eXBlOiAiR0VUIiwKICAgICAgICAgZGF0YVR5cGU6ICJqc29uIiwKICAgICAgICAgYXN5bmM6IHRydWUsCiAgICAgICAgIHVybDogc3RkYXRhVVJMLAogICAgICAgICBlcnJvcjogZnVuY3Rpb24ocmVxdWVzdCwgc3RhdHVzLCBlcnJvcikgeyBhbGVydChyZXF1ZXN0LnJlc3BvbnNlVGV4dCkgfSwKICAgICAgICAgc3VjY2VzczogZnVuY3Rpb24oZGF0YSkgewogICAgICAgICAgICAgalF1ZXJ5KCJkaXYjdGVybWluZSIpLmh0bWwoIiAiKTsKICAgICAgICAgICAgIHZhciB0ZW1wID0gZG9jdW1lbnQuY3JlYXRlRWxlbWVudCgnZGl2Jyk7CiAgICAgICAgICAgICByZXR1cm5EYXRhID0gIjx0YWJsZT48dHI+PHRoPlRlcm1pbjwvdGg+PHRoPlZlcmFuc3RhbHR1bmc8L3RoPjx0aD5CZW1lcmt1bmc8L3RoPjwvdHI+IjsKICAgICAgICAgICAgIGZvciAodmFyIGkgPSAwOyBpIDwgZGF0YS5sZW5ndGg7IGkrKykgewogICAgICAgICAgICAgICB2YXIgZGF0ZT1uZXcgRGF0ZShkYXRhW2ldWyJkYXRlIl0pCiAgICAgICAgICAgICAgIGxldCBob3Vyc0RpZmYgPSBkYXRlLmdldEhvdXJzKCkgLSBkYXRlLmdldFRpbWV6b25lT2Zmc2V0KCkgLyA2MDsKICAgICAgICAgICAgICAgbGV0IG1pbnV0ZXNEaWZmID0gKGRhdGUuZ2V0SG91cnMoKSAtIGRhdGUuZ2V0VGltZXpvbmVPZmZzZXQoKSkgJSA2MDsKICAgICAgICAgICAgICAgZGF0ZS5zZXRIb3Vycyhob3Vyc0RpZmYpOwogICAgICAgICAgICAgICBkYXRlLnNldE1pbnV0ZXMobWludXRlc0RpZmYpOwogICAgICAgICAgICAgICB2YXIgbmV3ZGF0ZT1kYXRlLmdldERhdGUoKSsnLicrKGRhdGUuZ2V0TW9udGgoKSsxKSsnLicrZGF0ZS5nZXRGdWxsWWVhcigpOwogICAgICAgICAgICAgICB0ZW1wLnRleHRDb250ZW50ID0gZGF0YVtpXVsibmFtZSJdOwogICAgICAgICAgICAgICB2YXIgbmFtZT10ZW1wLmlubmVySFRNTDsKICAgICAgICAgICAgICAgdGVtcC50ZXh0Q29udGVudCA9IGRhdGFbaV1bImRlc2NyaXB0aW9uIl07CiAgICAgICAgICAgICAgIHZhciBkZXNjcmlwdGlvbj10ZW1wLmlubmVySFRNTDsKICAgICAgICAgICAgICAgcmV0dXJuRGF0YSArPSAiPHRyPjx0ZD4iICsgbmV3ZGF0ZSAKICAgICAgICAgICAgICAgICAgICAgICAgICAgKyAiPC90ZD48dGQ+IiArIG5hbWUgKyAiPC90ZD48dGQ+IgogICAgICAgICAgICAgICAgICAgICAgICAgICsgZGVzY3JpcHRpb24gKyAiPC90ZD48L3RyPiI7CiAgICAgICAgICAgICB9CiAgICAgICAgICAgICByZXR1cm5EYXRhID0gcmV0dXJuRGF0YSArICI8L3RhYmxlPiI7CiAgICAgICAgICAgICBqUXVlcnkoImRpdiN0ZXJtaW5lIikuaHRtbChyZXR1cm5EYXRhKTsKICAgICAgICAgfQogICAgIH0pOwogICAgIHJldHVybiAoZmFsc2UpOwp9KTs=&#8220; language=&#8220;javascript&#8220; style=&#8220;atelier-seaside-light&#8220; linenums=&#8220;on&#8220; _builder_version=&#8220;4.16&#8243; body_font_size=&#8220;13px&#8220; body_line_height=&#8220;1em&#8220; global_colors_info=&#8220;{}&#8220;][\/et_pb_dmb_code_snippet][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=&#8220;1&#8243; _builder_version=&#8220;4.16&#8243; global_colors_info=&#8220;{}&#8220;][et_pb_row _builder_version=&#8220;4.16&#8243; global_colors_info=&#8220;{}&#8220;][et_pb_column type=&#8220;4_4&#8243; _builder_version=&#8220;4.16&#8243; global_colors_info=&#8220;{}&#8220;][et_pb_text _builder_version=&#8220;4.16&#8243; global_colors_info=&#8220;{}&#8220;]<\/p>\n<p style=\"text-align: right;\"><span>Beispiel Website \u00a9\u00a0<\/span><a href=\"https:\/\/www.schultermine.de\/\" target=\"_blank\" rel=\"noopener noreferrer\">schultermine.de<\/a><\/p>\n<p>[\/et_pb_text][\/et_pb_column][\/et_pb_row][\/et_pb_section]<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Das k\u00f6nnte Ihre Homepage sein Hier sehen sie ein Beispiel, wie sie Ihre Schultermine automatisch auf ihrer Schul-Homepage darstellen k\u00f6nnenMen\u00fc Homepage &#8230; &#8230; &#8230; Termine &#8230; &#8230; AnleitungTermine der Beispielschule Die folgenden Termine gelten f\u00fcr das laufende Schuljahr. Bitte beachten Sie, dass einzelne Termine noch ver\u00e4nderlich sind. Wir unterst\u00fctzen schultermine.de. Teilnehmer erhalten \u00c4nderungen automatisch durch [&hellip;]<\/p>\n","protected":false},"author":2962,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"class_list":["post-41","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.schultermine.de\/index.php\/wp-json\/wp\/v2\/pages\/41","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.schultermine.de\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.schultermine.de\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.schultermine.de\/index.php\/wp-json\/wp\/v2\/users\/2962"}],"replies":[{"embeddable":true,"href":"https:\/\/www.schultermine.de\/index.php\/wp-json\/wp\/v2\/comments?post=41"}],"version-history":[{"count":44,"href":"https:\/\/www.schultermine.de\/index.php\/wp-json\/wp\/v2\/pages\/41\/revisions"}],"predecessor-version":[{"id":775,"href":"https:\/\/www.schultermine.de\/index.php\/wp-json\/wp\/v2\/pages\/41\/revisions\/775"}],"wp:attachment":[{"href":"https:\/\/www.schultermine.de\/index.php\/wp-json\/wp\/v2\/media?parent=41"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}