summaryrefslogtreecommitdiff
path: root/id/server/doc/htmlTemplates/BKU-selection.html
diff options
context:
space:
mode:
Diffstat (limited to 'id/server/doc/htmlTemplates/BKU-selection.html')
-rw-r--r--id/server/doc/htmlTemplates/BKU-selection.html850
1 files changed, 850 insertions, 0 deletions
diff --git a/id/server/doc/htmlTemplates/BKU-selection.html b/id/server/doc/htmlTemplates/BKU-selection.html
new file mode 100644
index 000000000..9d6ad4085
--- /dev/null
+++ b/id/server/doc/htmlTemplates/BKU-selection.html
@@ -0,0 +1,850 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
+
+ <!-- MOA-ID 2.x BKUSelection Layout CSS -->
+ <style type="text/css">
+ @media screen and (min-width: 650px) {
+
+ body {
+ margin:0;
+ padding:0;
+ color : #000;
+ background-color : #fff;
+ text-align: center;
+ background-color: #6B7B8B;
+ }
+
+ #localBKU p {
+ font-size: 0.7em;
+ }
+
+ #localBKU input{
+ font-size: 0.7em;
+ /*border-radius: 5px;*/
+ }
+
+ #bkuselectionarea input[type=button] {
+ font-size: 0.85em;
+ /*border-radius: 7px;*/
+ margin-bottom: 25px;
+ min-width: 80px;
+ }
+
+ #mandateLogin {
+ font-size: 0.85em;
+ }
+
+ #bku_header h2 {
+ font-size: 0.8em;
+ }
+
+
+ #page {
+ display: block;
+ border: 2px solid rgb(0,0,0);
+ width: 650px;
+ height: 460px;
+ margin: 0 auto;
+ margin-top: 5%;
+ position: relative;
+ border-radius: 25px;
+ background: rgb(255,255,255);
+ }
+
+ #page1 {
+ text-align: center;
+ }
+
+ #main {
+ /* clear:both; */
+ position:relative;
+ margin: 0 auto;
+ width: 250px;
+ text-align: center;
+ }
+
+ .OA_header {
+ /* background-color: white;*/
+ font-size: 20pt;
+ margin-bottom: 25px;
+ margin-top: 25px;
+ }
+
+ #leftcontent {
+ /*float:left; */
+ width:250px;
+ margin-bottom: 25px;
+ text-align: left;
+ border: 1px solid rgb(0,0,0);
+ }
+
+ #selectArea {
+ font-size: 15px;
+ padding-bottom: 65px;
+ }
+
+ #leftcontent {
+ width: 300px;
+ margin-top: 30px;
+ }
+
+ #bku_header {
+ height: 5%;
+ padding-bottom: 3px;
+ padding-top: 3px;
+ }
+
+ #bkulogin {
+ overflow:hidden;
+ min-width: 190px;
+ min-height: 180px;
+ /*height: 260px;*/
+ }
+
+ h2#tabheader{
+ font-size: 1.1em;
+ padding-left: 2%;
+ padding-right: 2%;
+ position: relative;
+ }
+
+ #stork h2 {
+ font-size: 1.0em;
+ margin-bottom: 2%;
+ }
+
+ .setAssertionButton_full {
+ background: #efefef;
+ cursor: pointer;
+ margin-top: 15px;
+ width: 100px;
+ height: 30px
+ }
+
+ #leftbutton {
+ width: 30%;
+ float:left;
+ margin-left: 40px;
+ }
+
+ #rightbutton {
+ width: 30%;
+ float:right;
+ margin-right: 45px;
+ text-align: right;
+ }
+
+ button {
+ height: 25px;
+ width: 75px;
+ margin-bottom: 10px;
+ }
+
+ #validation {
+ position: absolute;
+ bottom: 0px;
+ margin-left: 270px;
+ padding-bottom: 10px;
+ }
+
+ }
+
+ @media screen and (max-width: 205px) {
+ #localBKU p {
+ font-size: 0.6em;
+ }
+
+ #localBKU input {
+ font-size: 0.6em;
+ min-width: 60px;
+ /* max-width: 65px; */
+ min-height: 1.0em;
+ /* border-radius: 5px; */
+ }
+
+ #bkuselectionarea input[type=button] {
+ font-size: 0.7em;
+ min-width: 55px;
+ /*min-height: 1.1em;
+ border-radius: 5px;*/
+ margin-bottom: 2%
+ }
+
+ #mandateLogin {
+ font-size: 0.65em;
+ }
+
+ #bku_header h2 {
+ font-size: 0.8em;
+ margin-top: -0.4em;
+ padding-top: 0.4em;
+ }
+
+ #bkulogin {
+ min-height: 150px;
+ }
+ }
+
+ @media screen and (max-width: 249px) and (min-width: 206px) {
+ #localBKU p {
+ font-size: 0.7em;
+ }
+
+ #localBKU input {
+ font-size: 0.7em;
+ min-width: 70px;
+ /* max-width: 75px; */
+ min-height: 0.95em;
+ /* border-radius: 6px; */
+ }
+
+ #bkuselectionarea input[type=button] {
+ font-size: 0.75em;
+ min-width: 60px;
+ /* min-height: 0.95em;
+ border-radius: 6px; */
+ margin-bottom: 5%
+ }
+
+ #mandateLogin {
+ font-size: 0.75em;
+ }
+
+ #bku_header h2 {
+ font-size: 0.9em;
+ margin-top: -0.45em;
+ padding-top: 0.45em;
+ }
+
+ #bkulogin {
+ min-height: 180px;
+ }
+ }
+
+ @media screen and (max-width: 299px) and (min-width: 250px) {
+ #localBKU p {
+ font-size: 0.9em;
+ }
+
+ #localBKU input {
+ font-size: 0.8em;
+ min-width: 70px;
+ /* max-width: 75px; */
+ /* border-radius: 6px; */
+ }
+
+ #bkuselectionarea input[type=button] {
+ font-size: 0.85em;
+ /* min-height: 1.05em;
+ border-radius: 7px; */
+ margin-bottom: 10%;
+ }
+
+ #mandateLogin {
+ font-size: 1em;
+ }
+
+ #bku_header h2 {
+ font-size: 1.0em;
+ margin-top: -0.50em;
+ padding-top: 0.50em;
+ }
+ }
+
+ @media screen and (max-width: 399px) and (min-width: 300px) {
+ #localBKU p {
+ font-size: 0.9em;
+ }
+
+ #localBKU input {
+ font-size: 0.8em;
+ min-width: 70px;
+ /* max-width: 75px; */
+ /* border-radius: 6px; */
+ }
+
+ #bkuselectionarea input[type=button] {
+ font-size: 0.9em;
+ /* min-height: 1.2em;
+ border-radius: 8px; */
+ margin-bottom: 10%;
+ max-width: 80px;
+ }
+
+ #mandateLogin {
+ font-size: 1em;
+ }
+
+ #bku_header h2 {
+ font-size: 1.1em;
+ margin-top: -0.55em;
+ padding-top: 0.55em;
+ }
+ }
+
+ @media screen and (max-width: 649px) and (min-width: 400px) {
+ #localBKU p {
+ font-size: 0.9em;
+ }
+
+ #localBKU input {
+ font-size: 0.8em;
+ min-width: 70px;
+ /* max-width: 80px; */
+ /* border-radius: 6px; */
+ }
+
+ #bkuselectionarea input[type=button] {
+ font-size: 1.0em;
+ /* min-height: 1.3em;
+ border-radius: 10px; */
+ margin-bottom: 10%;
+ max-width: 85px;
+ }
+
+ #mandateLogin {
+ font-size: 1.2em;
+ }
+
+ #bku_header h2 {
+ font-size: 1.3em;
+ margin-top: -0.65em;
+ padding-top: 0.65em;
+ }
+ }
+
+
+
+ @media screen and (max-width: 649px) {
+
+ body {
+ margin:0;
+ padding:0;
+ color : #000;
+ text-align: center;
+ font-size: 100%;
+ background-color: #MAIN_BACKGOUNDCOLOR#;
+ }
+
+ #page {
+ visibility: hidden;
+ margin-top: 0%;
+ }
+
+ #page1 {
+ visibility: hidden;
+ }
+
+ #main {
+ visibility: hidden;
+ }
+
+ #validation {
+ visibility: hidden;
+ display: none;
+ }
+
+ .OA_header {
+ margin-bottom: 0px;
+ margin-top: 0px;
+ font-size: 0pt;
+ visibility: hidden;
+ }
+
+ #leftcontent {
+ visibility: visible;
+ margin-bottom: 0px;
+ text-align: left;
+ border:none;
+ vertical-align: middle;
+ min-height: 173px;
+ min-width: 204px;
+
+ }
+
+ #bku_header {
+ height: 10%;
+ min-height: 1.2em;
+ margin-top: 1%;
+ }
+
+ h2#tabheader{
+ padding-left: 2%;
+ padding-right: 2%;
+ position: relative;
+ top: 50%;
+ }
+
+ #stork h2 {
+ font-size: 0.9em;
+ margin-bottom: 2%;
+ }
+
+ #bkulogin {
+ min-width: 190px;
+ min-height: 155px;
+ }
+
+ .setAssertionButton_full {
+ background: #efefef;
+ cursor: pointer;
+ margin-top: 15px;
+ width: 70px;
+ height: 25px;
+ }
+
+ input[type=button] {
+/* height: 11%; */
+ width: 70%;
+ }
+ }
+
+ * {
+ margin: 0;
+ padding: 0;
+ font-family: #FONTTYPE#;
+ }
+
+ #selectArea {
+ padding-top: 10px;
+ padding-bottom: 55px;
+ padding-left: 10px;
+ }
+
+ .setAssertionButton {
+ background: #efefef;
+ cursor: pointer;
+ margin-top: 15px;
+ width: 70px;
+ height: 25px;
+ }
+
+ #leftbutton {
+ width: 35%;
+ float:left;
+ margin-left: 15px;
+ }
+
+ #rightbutton {
+ width: 35%;
+ float:right;
+ margin-right: 25px;
+ text-align: right;
+ }
+
+ #stork {
+ /*margin-bottom: 10px;*/
+ /* margin-top: 5px; */
+ }
+
+ #mandateLogin {
+ padding-bottom: 4%;
+ padding-top: 4%;
+ height: 10%;
+ position: relative;
+ text-align: center;
+ }
+
+ .verticalcenter {
+ vertical-align: middle;
+ }
+
+ #mandateLogin div {
+ clear: both;
+ margin-top: -1%;
+ position: relative;
+ top: 50%;
+ }
+
+ #bkuselectionarea {
+ position: relative;
+ display: block;
+ }
+
+ #localBKU {
+ padding-left: 5%;
+ padding-right: 2%;
+ padding-bottom: 4%;
+ /*padding-top: 4%;*/
+ position: relative;
+ clear: both;
+ }
+
+ #bkukarte {
+ float:left;
+ text-align:center;
+ width:40%;
+ min-height: 70px;
+ padding-left: 5%;
+ padding-top: 2%;
+ }
+
+ #bkuhandy {
+ float:right;
+ text-align:center;
+ width:40%;
+ min-height: 90px;
+ padding-right: 5%;
+ padding-top: 2%;
+ }
+
+ .bkuimage {
+ width: 90%;
+ height: auto;
+ }
+
+ #mandate{
+ text-align:center;
+ padding : 5px 5px 5px 5px;
+ }
+
+/* input[type=button], .sendButton {
+ background: #BUTTON_BACKGROUNDCOLOR#;
+ color: #BUTTON_COLOR#;
+/* border:1px solid #000; */
+/* cursor: pointer;
+/* box-shadow: 3px 3px 3px #222222; */
+/* }
+
+/* button:hover, button:focus, button:active,
+ .sendButton:hover , .sendButton:focus, .sendButton:active,
+ #mandateCheckBox:hover, #mandateCheckBox:focus, #mandateCheckBox:active {
+ background: #BUTTON_BACKGROUNDCOLOR_FOCUS#;
+ color: #BUTTON_COLOR#;
+/* border:1px solid #000; */
+/* cursor: pointer;
+/* box-shadow: -1px -1px 3px #222222; */
+/* }
+
+*/
+ input {
+ /*border:1px solid #000;*/
+ cursor: pointer;
+ }
+
+ #localBKU input {
+/* color: #BUTTON_COLOR#; */
+ border: 0px;
+ display: inline-block;
+
+ }
+
+ #localBKU input:hover, #localBKU input:focus, #localBKU input:active {
+ text-decoration: underline;
+ }
+
+ #installJava, #BrowserNOK {
+ clear:both;
+ font-size:0.8em;
+ padding:4px;
+ }
+
+ .selectText{
+
+ }
+
+ .selectTextHeader{
+
+ }
+
+ .sendButton {
+ width: 30%;
+ margin-bottom: 1%;
+ }
+
+ #leftcontent a {
+ text-decoration:none;
+ color: #000;
+ /* display:block;*/
+ padding:4px;
+ }
+
+ #leftcontent a:hover, #leftcontent a:focus, #leftcontent a:active {
+ text-decoration:underline;
+ color: #000;
+ }
+
+ .infobutton {
+ background-color: #005a00;
+ color: white;
+ font-family: serif;
+ text-decoration: none;
+ padding-top: 2px;
+ padding-right: 4px;
+ padding-bottom: 2px;
+ padding-left: 4px;
+ font-weight: bold;
+ }
+
+ .hell {
+ background-color : #MAIN_BACKGOUNDCOLOR#;
+ color: #MAIN_COLOR#;
+ }
+
+ .dunkel {
+ background-color: #HEADER_BACKGROUNDCOLOR#;
+ color: #HEADER_COLOR#;
+ }
+
+ .main_header {
+ color: black;
+ font-size: 32pt;
+ position: absolute;
+ right: 10%;
+ top: 40px;
+
+ }
+
+ </style>
+<!-- MOA-ID 2.x BKUSelection JavaScript fucnctions-->
+<script type="text/javascript">
+ function isIE() {
+ return (/MSIE (\d+\.\d+);/.test(navigator.userAgent));
+ }
+ function isFullscreen() {
+ try {
+ return ((top.innerWidth == screen.width) && (top.innerHeight == screen.height));
+ } catch (e) {
+ return false;
+ }
+ }
+ function isActivexEnabled() {
+ var supported = null;
+ try {
+ supported = !!new ActiveXObject("htmlfile");
+ } catch (e) {
+ supported = false;
+ }
+ return supported;
+ }
+ function isMetro() {
+ if (!isIE())
+ return false;
+ return !isActivexEnabled() && isFullscreen();
+ }
+ window.onload=function() {
+ document.getElementById("localBKU").style.display="block";
+ return;
+ }
+ function bkuOnlineClicked() {
+ if (isMetro())
+ document.getElementById("metroDetected").style.display="block";
+ document.getElementById("localBKU").style.display="block";
+/* if (checkMandateSSO())
+ return; */
+
+ setMandateSelection();
+/* setSSOSelection(); */
+
+ var iFrameURL = "#AUTH_URL#" + "?";
+ iFrameURL += "bkuURI=" + "#ONLINE#";
+ iFrameURL += "&useMandate=" + document.getElementById("useMandate").value;
+/* iFrameURL += "&SSO=" + document.getElementById("useSSO").value; */
+ iFrameURL += "&MODUL=" + "#MODUL#";
+ iFrameURL += "&ACTION=" + "#ACTION#";
+ iFrameURL += "&MOASessionID=" + "#SESSIONID#";
+ generateIFrame(iFrameURL);
+ }
+ function bkuHandyClicked() {
+ document.getElementById("localBKU").style.display="none";
+/* if (checkMandateSSO())
+ return; */
+
+ setMandateSelection();
+/* setSSOSelection(); */
+
+ var iFrameURL = "#AUTH_URL#" + "?";
+ iFrameURL += "bkuURI=" + "#HANDY#";
+ iFrameURL += "&useMandate=" + document.getElementById("useMandate").value;
+/* iFrameURL += "&SSO=" + document.getElementById("useSSO").value; */
+ iFrameURL += "&MODUL=" + "#MODUL#";
+ iFrameURL += "&ACTION=" + "#ACTION#";
+ iFrameURL += "&MOASessionID=" + "#SESSIONID#";
+ generateIFrame(iFrameURL);
+ }
+ function storkClicked() {
+ document.getElementById("localBKU").style.display="none";
+/* if (checkMandateSSO())
+ return; */
+
+ setMandateSelection();
+/* setSSOSelection(); */
+
+ var ccc = "AT";
+ var countrySelection = document.getElementById("cccSelection");
+ if (countrySelection != null) {
+ ccc = document.getElementById("cccSelection").value;
+ }
+ var iFrameURL = "#AUTH_URL#" + "?";
+ iFrameURL += "bkuURI=" + "#ONLINE#";
+ iFrameURL += "&useMandate=" + document.getElementById("useMandate").value;
+ iFrameURL += "&CCC=" + ccc;
+/* iFrameURL += "&SSO=" + document.getElementById("useSSO").value; */
+ iFrameURL += "&MODUL=" + "#MODUL#";
+ iFrameURL += "&ACTION=" + "#ACTION#";
+ iFrameURL += "&MOASessionID=" + "#SESSIONID#";
+ generateIFrame(iFrameURL);
+ }
+ function generateIFrame(iFrameURL) {
+ var el = document.getElementById("bkulogin");
+ var width = el.clientWidth;
+ var heigth = el.clientHeight - 20;
+ var parent = el.parentNode;
+
+ iFrameURL += "&heigth=" + heigth;
+ iFrameURL += "&width=" + width;
+
+ var iframe = document.createElement("iframe");
+ iframe.setAttribute("src", iFrameURL);
+ iframe.setAttribute("width", el.clientWidth - 1);
+ iframe.setAttribute("height", el.clientHeight - 1);
+ iframe.setAttribute("frameborder", "0");
+ iframe.setAttribute("scrolling", "no");
+ iframe.setAttribute("title", "Login");
+ parent.replaceChild(iframe, el);
+ }
+ function setMandateSelection() {
+ document.getElementById("moaidform").action = "#AUTH_URL#";
+ document.getElementById("useMandate").value = "false";
+ var checkbox = document.getElementById("mandateCheckBox");
+ if (checkbox != null) {
+ if (document.getElementById("mandateCheckBox").checked) {
+ document.getElementById("useMandate").value = "true";
+ }
+ }
+ }
+ function onChangeChecks() {
+ if (top.innerWidth < 650) {
+ document.getElementById("moaidform").setAttribute("target","_parent");
+ } else {
+ document.getElementById("moaidform").removeAttribute("target");
+ }
+
+ }
+/* function setSSOSelection() {
+ document.getElementById("useSSO").value = "false";
+ var checkbox = document.getElementById("SSOCheckBox");
+ if (checkbox != null) {
+ if (document.getElementById("SSOCheckBox").checked) {
+ document.getElementById("useSSO").value = "true";
+ }
+ }
+ } */
+
+/* function checkMandateSSO() {
+ var sso = document.getElementById("SSOCheckBox");
+ var mandate = document.getElementById("mandateCheckBox");
+
+
+ if (sso.checked && mandate.checked) {
+ alert("Anmeldung in Vertretung in kombination mit Single Sign-On wird aktuell noch nicht unterstützt!")
+ mandate.checked = false;
+ sso.checked = false;
+ return true;
+ } else {
+ return false;
+ }
+ } */
+ </script>
+<title>Anmeldung mittels Bürgerkarte oder Handy-Signatur</title>
+</head>
+<body onload="onChangeChecks();" onresize="onChangeChecks();">
+ <div id="page">
+ <div id="page1" class="case selected-case" role="main">
+ <h2 class="OA_header" role="heading">Anmeldung an: #OAName#</h2>
+ <div id="main">
+ <div id="leftcontent" class="hell" role="application">
+ <div id="bku_header" class="dunkel">
+ <h2 id="tabheader" class="dunkel" role="heading">#HEADER_TEXT#</h2>
+ </div>
+ <div id="bkulogin" class="hell" role="form">
+ <div id="mandateLogin" style="">
+ <div>
+ <input tabindex="1" type="checkbox" name="Mandate"
+ id="mandateCheckBox" class="verticalcenter" role="checkbox"
+ onClick='document.getElementById("mandateCheckBox").setAttribute("aria-checked", document.getElementById("mandateCheckBox").checked);'#MANDATECHECKED#>
+ <label for="mandateCheckBox" class="verticalcenter">in
+ Vertretung anmelden</label>
+ <!--a href="info_mandates.html"
+ target="_blank"
+ class="infobutton verticalcenter"
+ tabindex="5">i</a-->
+ </div>
+ </div>
+ <div id="bkuselectionarea">
+ <div id="bkukarte">
+ <img class="bkuimage" src="#CONTEXTPATH#/img/online-bku.png"
+ alt="OnlineBKU" /> <input name="bkuButtonOnline" type="button"
+ onClick="bkuOnlineClicked();" tabindex="2" role="button"
+ value="Karte" />
+ </div>
+ <div id="bkuhandy">
+ <img class="bkuimage" src="#CONTEXTPATH#/img/mobile-bku.png"
+ alt="HandyBKU" /> <input name="bkuButtonHandy" type="button"
+ onClick="bkuHandyClicked();" tabindex="3" role="button"
+ value="HANDY" />
+ </div>
+ </div>
+ <div id="localBKU">
+ <form method="get" id="moaidform" action="#AUTH_URL#"
+ class="verticalcenter" target="_parent">
+ <input type="hidden" name="bkuURI" value="#LOCAL#"> <input
+ type="hidden" name="useMandate" id="useMandate"> <input
+ type="hidden" name="SSO" id="useSSO"> <input
+ type="hidden" name="CCC" id="ccc"> <input type="hidden"
+ name="MODUL" value="#MODUL#"> <input type="hidden"
+ name="ACTION" value="#ACTION#"> <input type="hidden"
+ name="MOASessionID" value="#SESSIONID#"> <input
+ type="submit" value=">lokale Bürgerkartenumgebung" tabindex="4"
+ role="button" class="hell">
+ <!--p>
+ <small>Alternativ können Sie eine lokal installierte BKU verwenden.</small>
+ </p-->
+ </form>
+ </div>
+
+ <div id="stork" align="center" style="#STORKVISIBLE#">
+ <h2 id="tabheader" class="dunkel">Home Country Selection</h2>
+ <p>
+ <select name="cccSelection" id="cccSelection" size="1" style="width: 120px; margin-right: 5px;" >
+ <option value="BE">Belgi&euml;/Belgique</option>
+ <option value="EE">Eesti</option>
+ <option value="ES">Espa&ntilde;a</option>
+ <option value="IS">&Iacute;sland</option>
+ <option value="IT">Italia</option>
+ <option value="LI">Liechtenstein</option>
+ <option value="LT">Lithuania</option>
+ <option value="PT">Portugal</option>
+ <option value="SI">Slovenija</option>
+ <option value="FI">Suomi</option>
+ <option value="SE">Sverige</option>
+ </select>
+ <button name="bkuButton" type="button" onClick="storkClicked();">Proceed</button>
+ <a href="info_stork.html" target="_blank" class="infobutton" style="color:#FFF">i</a>
+ </p>
+ </div>
+
+ <div id="metroDetected" style="display: none">
+ <p>Anscheinend verwenden Sie Internet Explorer im
+ Metro-Modus. Wählen Sie bitte "Auf dem Desktop anzeigen" aus den
+ Optionen um die Karten-Anmeldung starten zu können.</p>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div id="validation">
+ <a href="http://validator.w3.org/check?uri="> <img
+ style="border: 0; width: 88px; height: 31px"
+ src="#CONTEXTPATH#/img/valid-html5-blue.png" alt="HTML5 ist valide!" />
+ </a> <a href="http://jigsaw.w3.org/css-validator/"> <img
+ style="border: 0; width: 88px; height: 31px"
+ src="http://jigsaw.w3.org/css-validator/images/vcss-blue"
+ alt="CSS ist valide!" />
+ </a>
+ </div>
+ </div>
+</body>
+</html> \ No newline at end of file
generated by cgit v1.2.3 (git 2.39.1) at 2025-10-31 06:13:07 +0000