{"id":114,"date":"2025-08-17T08:16:05","date_gmt":"2025-08-17T08:16:05","guid":{"rendered":"https:\/\/www.nayttely.fi\/laskin\/?page_id=114"},"modified":"2025-08-17T10:32:20","modified_gmt":"2025-08-17T10:32:20","slug":"paspislaskuri","status":"publish","type":"page","link":"https:\/\/www.nayttely.fi\/laskin\/paspislaskuri\/","title":{"rendered":"Paspislaskuri"},"content":{"rendered":"\n<figure class=\"wp-block-image size-full\" style=\"margin-top:var(--wp--preset--spacing--30);margin-bottom:var(--wp--preset--spacing--30)\"><img loading=\"lazy\" decoding=\"async\" width=\"744\" height=\"528\" src=\"https:\/\/www.nayttely.fi\/laskin\/wp-content\/uploads\/2025\/08\/Ripustuslaskin_paspis-1.png\" alt=\"\" class=\"wp-image-117\" srcset=\"https:\/\/www.nayttely.fi\/laskin\/wp-content\/uploads\/2025\/08\/Ripustuslaskin_paspis-1.png 744w, https:\/\/www.nayttely.fi\/laskin\/wp-content\/uploads\/2025\/08\/Ripustuslaskin_paspis-1-300x213.png 300w\" sizes=\"auto, (max-width: 744px) 100vw, 744px\" \/><\/figure>\n\n\n\n<head>\n  <meta charset=\"UTF-8\">\n  <style>\n    body {\n      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n      background-color: #f4f4f4;\n      margin: 0;\n      padding: 15px;\n    }\n    .container {\n      max-width: 612px;\n      margin: auto;\n      background: white;\n      padding: 30px;\n      border-radius: 8px;\n      box-shadow: 0 0 10px rgba(0,0,0,0.1);\n    }\n    h1 {\n      text-align: center;\n      color: #333;\n    }\n    label {\n      display: block;\n      margin-top: 15px;\n      font-weight: bold;\n    }\n    input[type=\"number\"] {\n      width: 100%;\n      padding: 10px;\n      margin-top: 5px;\n      box-sizing: border-box;\n      border: 1px solid #ccc;\n      border-radius: 4px;\n    }\n    .frame-widths input {\n      margin-bottom: 10px;\n    }\n    .radio-group {\n      margin-top: 20px;\n    }\n    .radio-group label {\n      font-weight: normal;\n      margin-right: 15px;\n    }\n    button {\n      margin-top: 40px;\n      padding: 12px 20px;\n      background-color:#bbbbbb;\n      color: white;\n      border: 1px solid #9a9a9a;\n      border-radius: 4px;\n      cursor: pointer;\n      font-size: 16px;\n    }\n    button:hover {\n      background-color: #005fa3;\n    }\n    #result {\n      margin-top: 20px;\n      font-weight: bold;\n      color: #333;\n    }\n  <\/style>\n<\/head>\n\n<body>\n     <div class=\"container\">\n        <div class=\"form-container\">\n            <div class=\"form-group\">\n\n  <label for=\"frameWidth\">Paspiksen leveys (mm):<\/label>\n  <input type=\"number\" id=\"frameWidth\" placeholder=\"esim. 300\">\n <\/div>\n<div class=\"form-group\">\n  <label for=\"frameHeight\">Paspiksen korkeus (mm):<\/label>\n  <input type=\"number\" id=\"frameHeight\" placeholder=\"esim. 400\">\n <\/div>\n<div class=\"form-group\">\n  <label for=\"openingWidth\">Aukon leveys (mm):<\/label>\n  <input type=\"number\" id=\"openingWidth\" placeholder=\"esim. 200\">\n\n<div class=\"form-group\">\n  <label for=\"openingHeight\">Aukon korkeus (mm):<\/label>\n  <input type=\"number\" id=\"openingHeight\" placeholder=\"esim. 300\">\n\n  <div class=\"radio-group\">\n    <span>Aukon sijoittelu:<\/span>\n    <label><input type=\"radio\" name=\"placement\" value=\"center\" checked> Keskitetty<\/label>\n    <label><input type=\"radio\" name=\"placement\" value=\"top\"> Yl\u00e4painotteinen (yl\u00e4reuna = sivut)<\/label>\n  <\/div>\n\n  <button onclick=\"calculatePosition()\">Laske aukon sijainti<\/button>\n\n  <div class=\"result\" id=\"result\"><\/div>\n  <div id=\"preview\"><\/div>\n\n  <script>\n    function calculatePosition() {\n      const frameWidth = parseFloat(document.getElementById('frameWidth').value);\n      const frameHeight = parseFloat(document.getElementById('frameHeight').value);\n      const openingWidth = parseFloat(document.getElementById('openingWidth').value);\n      const openingHeight = parseFloat(document.getElementById('openingHeight').value);\n      const placement = document.querySelector('input[name=\"placement\"]:checked').value;\n\n      const resultDiv = document.getElementById('result');\n      const previewDiv = document.getElementById('preview');\n      previewDiv.innerHTML = \"\";\n\n      if (isNaN(frameWidth) || isNaN(frameHeight) || isNaN(openingWidth) || isNaN(openingHeight)) {\n        resultDiv.textContent = \"Sy\u00f6t\u00e4 kaikki arvot oikein.\";\n        return;\n      }\n\n      const marginLeft = (frameWidth - openingWidth) \/ 2;\n      let marginTop;\n\n      if (placement === \"center\") {\n        marginTop = (frameHeight - openingHeight) \/ 2;\n      } else if (placement === \"top\") {\n        marginTop = marginLeft;\n      }\n\n      const marginRight = marginLeft;\n      const marginBottom = frameHeight - openingHeight - marginTop;\n\n      if (marginLeft < 1 || marginTop < 1 || marginRight < 1 || marginBottom < 1) {\n        resultDiv.textContent = \"Virhe: Aukko ei mahdu kehyksen sis\u00e4\u00e4n. Tarkista mitat.\";\n        return;\n      }\n\n      resultDiv.textContent =\n        `Aukon sijainti kehyksess\u00e4:\nVasen reuna: ${marginLeft.toFixed(1)} mm\nYl\u00e4reuna: ${marginTop.toFixed(1)} mm\nOikea reuna: ${marginRight.toFixed(1)} mm\nAlareuna: ${marginBottom.toFixed(1)} mm`;\n\n    }\n  <\/script>\n<\/body>\n\n\n","protected":false},"excerpt":{"rendered":"<p>Paspiksen leveys (mm): Paspiksen korkeus (mm): Aukon leveys (mm): Aukon korkeus (mm): Aukon sijoittelu: Keskitetty Yl\u00e4painotteinen (yl\u00e4reuna = sivut) Laske aukon sijainti<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-114","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.nayttely.fi\/laskin\/wp-json\/wp\/v2\/pages\/114","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.nayttely.fi\/laskin\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.nayttely.fi\/laskin\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.nayttely.fi\/laskin\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.nayttely.fi\/laskin\/wp-json\/wp\/v2\/comments?post=114"}],"version-history":[{"count":9,"href":"https:\/\/www.nayttely.fi\/laskin\/wp-json\/wp\/v2\/pages\/114\/revisions"}],"predecessor-version":[{"id":131,"href":"https:\/\/www.nayttely.fi\/laskin\/wp-json\/wp\/v2\/pages\/114\/revisions\/131"}],"wp:attachment":[{"href":"https:\/\/www.nayttely.fi\/laskin\/wp-json\/wp\/v2\/media?parent=114"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}