[{"data":1,"prerenderedAt":37},["ShallowReactive",2],{"page:tool-canvas-id:de:48":3},{"id":4,"order":5,"published":6,"dateInserted":7,"publishDate":8,"dateChanged":9,"author":10,"ratings":5,"ratingAmount":5,"ratingAverage":5,"ratingOwn":5,"files":16,"videos":23,"documents":24,"postTexts":25,"script":34,"markUp":35,"style":36,"distance":5},48,0,true,"0001-01-01T00:00:00","2000-12-31T23:00:00","2023-04-10T15:06:41.8948121",{"id":11,"name":12,"surname":13,"nickName":14,"fullName":15},1,"Schaffer","Alexander","the boss","Schaffer Alexander",[17],{"blobImgUrlBig":18,"blobImgUrlSharing":19,"blobImgUrlMedium":20,"blobImgUrlSmall":21,"blobImgUrlMicro":22},"https:\u002F\u002Fmaheviblobs.blob.core.windows.net\u002Fimage\u002Fsurfing-85029742-8c33-4e78-afb6-f8c10ebd7043-big.webp?sv=2024-11-04&se=2026-09-18T09%3A36%3A58Z&sr=b&sp=r&sig=PfOfszoiVQAY%2FZrTZRB1jlwPcYjYcaywq%2B7X6bIDOG8%3D","https:\u002F\u002Fmaheviblobsunsec.blob.core.windows.net\u002Fimage\u002Fsurfing-85029742-8c33-4e78-afb6-f8c10ebd7043-sharing.jpeg?sv=2024-11-04&se=2026-09-18T09%3A36%3A58Z&sr=b&sp=r&sig=IVLIlgQ3L5Do3%2Fj96JpDUJDlrG6ld1HFy7tE0nNixD4%3D","https:\u002F\u002Fmaheviblobs.blob.core.windows.net\u002Fimage\u002Fsurfing-85029742-8c33-4e78-afb6-f8c10ebd7043-medium.webp?sv=2024-11-04&se=2026-09-18T09%3A36%3A58Z&sr=b&sp=r&sig=%2BgaIAxylP3rjKf0ONbgYeqGkRpZAWNAll8LlGgP2%2BHc%3D","https:\u002F\u002Fmaheviblobs.blob.core.windows.net\u002Fimage\u002Fsurfing-85029742-8c33-4e78-afb6-f8c10ebd7043-small.webp?sv=2024-11-04&se=2026-09-18T09%3A36%3A58Z&sr=b&sp=r&sig=tY0gbHiC%2Fh%2BhCpmtH4DFYvAsmcFkvwr9YUb1R52FuLE%3D","https:\u002F\u002Fmaheviblobs.blob.core.windows.net\u002Fimage\u002Fsurfing-85029742-8c33-4e78-afb6-f8c10ebd7043-micro.webp?sv=2024-11-04&se=2026-09-18T09%3A36%3A58Z&sr=b&sp=r&sig=8qRsQkm%2B2tiRgn1JYLl3Z7H5mU37doY2XqAJSEnPTzg%3D",[],[],[26],{"id":5,"locale":27,"header":28,"subHeader":29,"contentShort":30,"content":28,"contentShortHTML":31,"contentHTML":31,"slug":32,"postId":4,"languageId":33,"automaticTranslation":6},"de","Bildschirmschoner","Uhrzeit","schaltet sich beim ersten mal nach 2 Sekunden ein, danach nach 10 Sekunden","","bildschirmschoner",2,"\u003Cscript>\n\tvar timeout = null;\n    var clockDisplay = 12;\n    var daySplit = \"am\";\n    var hours = 12;\n    var minutes = 60;\n    var seconds = 60;\n    var hundreds = 100;\n    var months = ['Jänner', 'Februar', 'März', 'April', 'Mai', 'Juni',\n        'Juli', 'August', 'September', 'Oktober', 'Nov...', 'Dezember'];\n\n    var weekdays = ['Sonntag', 'Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag', 'Samstag'\n    ];\n\n    var cstyles = \"basic\";\n\n    var canvas = document.getElementById('clockcanvas');\n    var context = canvas.getContext('2d');\n\n    var circ = Math.PI * 2;\n    var quart = Math.PI \u002F 2;\n\n    var cproportion = 1;\n    var cstart = quart;\n    var textAlign = \"right\";\n\n    var chours = hours \u002F cproportion;\n    var cminutes = minutes \u002F cproportion;\n    var cseconds = seconds \u002F cproportion;\n    var chundreds = hundreds \u002F cproportion;\n\n    var x = canvas.width \u002F 2 \u002F cproportion;\n    var y = canvas.height \u002F 2;\n\n    var primaryColour = \"rgba(255, 255, 255, 1)\";\n    var secondaryColour = \"transparent\";\n    var hourColour = \"rgba(255, 255, 255, 1)\";\n    var minuteColour = \"rgba(255, 255, 255, 1)\";\n    var secondColour = \"rgba(255, 255, 255, 1)\";\n    var hundredColour = \"rgba(255, 255, 255, 1)\";\n\n    function centerclock() {\n        if (cproportion == 0.5) {\n            secondaryColour = \"#ffffff\";\n            cstart = quart;\n            textAlign = \"right\";\n        } else {\n            secondaryColour = \"transparent\";\n            cstart = -quart;\n            textAlign = \"center\";\n        }\n        \n        var elem = document.getElementById(\"cc-outer\");\n        elem.classList.add(\"maxscreen\");\n        elem.classList.remove(\"hidden\");\n        var elemc = document.getElementById(\"clockcanvas\");\n        elemc.classList.add(\"centerscreen\");\n        \n        initcenterclock();\n    };\n\n    function initcenterclock() {\n        x = canvas.width \u002F 2 \u002F cproportion;\n        y = canvas.height \u002F 2;\n\n        chours = hours \u002F cproportion;\n        cminutes = minutes \u002F cproportion;\n        cseconds = seconds \u002F cproportion;\n        chundreds = hundreds \u002F cproportion;\n    };\n\n    var radiushour = canvas.width \u002F 4;\n    var hsegDist = 100;\n    var hWidth = 6;\n    var hradDist = 4;\n\n    var radiusminute = canvas.width \u002F 4 - hWidth - 2;\n    var msegDist = 100;\n    var mWidth = 6;\n    var mradDist = 4;\n\n    var radiussecond = canvas.width \u002F 4 - hWidth - mWidth - 2;\n    var ssegDist = 100;\n    var sWidth = 2;\n    var sradDist = 4;\n\n    var radiushundred = canvas.width \u002F 4 - hWidth - mWidth - sWidth - 2;\n    var husegDist = 1000;\n    var huWidth = 2;\n    var huradDist = 1;\n\n    function set(hour, minute, second, hundred) {\n\n        context.clearRect(0, 0, canvas.width, canvas.height);\n\n        context.lineWidth = 2;\n        context.strokeStyle = primaryColour;\n\n        setCircle(1, 1, radiushour, 0, 0, 0, true, secondaryColour, \"fill\");\n\n        setCircle(chours, hour, radiushour, hWidth, hradDist, hsegDist, true, hourColour, \"\");\n\n        setCircle(cminutes, minute, radiusminute, mWidth, mradDist, msegDist, true, minuteColour, \"\");\n\n        setCircle(cseconds, second, radiussecond, sWidth, sradDist, ssegDist, true, secondColour, \"\");\n\n        setCircle(chundreds, hundred, radiushundred, huWidth, huradDist, husegDist, false, hundredColour, \"\");\n\n        context.strokeStyle = primaryColour;\n        context.fillStyle = primaryColour;\n\n        if (cproportion == 1) {\n            context.textAlign = textAlign;\n            context.textBaseline = \"middle\";\n            context.font = \"16px Nunito\";\n            context.fillText(\"move mouse or click\", x, y + 150);\n        }\n\n        context.textAlign = textAlign;\n        context.textBaseline = \"middle\";\n        context.font = \"12px Nunito\";\n        var monat = weekdays[new Date().getDay()];\n        context.fillText(monat, x, y - 26);\n\n        context.textAlign = textAlign;\n        context.textBaseline = \"middle\";\n        context.font = \"12px Nunito\";\n        var monat = months[new Date().getMonth()];\n        context.fillText(new Date().getDate() + \".\" + monat, x, y - 8);\n\n        context.textAlign = textAlign;\n        context.textBaseline = \"middle\";\n        context.font = \"32px Nunito\";\n        if (minute \u003C 10) { minute = \"0\" + minute; }\n        context.fillText(hour + \":\" + minute, x, y + 22);\n\n        context.textAlign = textAlign;\n        context.textBaseline = \"middle\";\n        context.font = \"20px Nunito\";\n        context.fillText(second, x, y + 54);\n\n        context.textAlign = textAlign;\n        context.textBaseline = \"middle\";\n        context.font = \"18px Nunito\";\n        context.fillText(daySplit, x, y - 48);\n    }\n\n    function setCircle(segments, segment, radius, lineWidth, radDist, segDist, cumul, colour, fill) {\n\n        var circleseg = segments;\n\n        for (i = 0; i \u003C circleseg * cproportion; i++) {\n            if (segment > i && cumul) {\n                context.lineWidth = lineWidth;\n                context.strokeStyle = colour;\n            }\n            else if (segment == i && !cumul) {\n                context.lineWidth = lineWidth;\n                context.strokeStyle = colour;\n            }\n            else {\n                context.lineWidth = lineWidth;\n                context.strokeStyle = secondaryColour;\n            };\n\n            if (fill === \"fill\") {\n                context.fillStyle = colour;\n                context.beginPath();\n                context.arc(x, y, radius, 0, 2 * Math.PI);\n                context.fill();\n            }\n\n            context.beginPath();\n            var outerstart = cstart + circ \u002F circleseg * i;\n            var outerend = outerstart + circ \u002F circleseg - (circ \u002F (segDist \u002F cproportion));\n            context.arc(x, y, radius + radDist, outerstart, outerend, false);\n            context.stroke();\n        };\n    };\n\n    var l = setInterval(function () {\n        var hour = new Date().getHours();\n        if (hour > clockDisplay) {\n            hour = hour - clockDisplay;\n            daySplit = \"pm\";\n        } else {\n            daySplit = \"am\";\n        };\n        var minute = new Date().getMinutes();\n        var second = new Date().getSeconds();\n        var millisecond = new Date().getMilliseconds();\n        set(hour, minute, second, Math.round(millisecond \u002F 10));\n    }, 10);\n\n    function inactivityTime () {\n    \tlet elemstart = document.getElementById(\"startscreensaver\");\n    \telemstart.addEventListener('click', function () {        \n            resetTimer(100);\n        }, true);\n        \n        let elemstop = document.getElementById(\"stopscreensaver\");\n    \telemstop.addEventListener('click', function () {        \n            resetTimer(60000);\n        }, true);\n        \n        window.addEventListener('beforeunload', function(event) {\n              let elemstart = document.getElementById(\"startscreensaver\");\n              elemstart.removeEventListener('click', function () {        \n              resetTimer(100);\n        \t}, true);\n            \n            let elemstop = document.getElementById(\"stopscreensaver\");\n              elemstop.removeEventListener('click', function () {        \n              resetTimer(60000);\n        \t}, true);\n      \t});        \n                \n        var events = ['mousemove', 'touchstart', 'click'];\n        events.forEach(function (name) {\n            document.addEventListener(name, function () {        \n                resetTimer(10000);\n            }, true);\n        });\n        \n        window.addEventListener('beforeunload', function(event) {\n          var events = ['mousemove', 'touchstart', 'click'];\n          events.forEach(function (name) {\n                document.removeEventListener(name, function () {        \n                    resetTimer(10000);\n                }, true);\n        \t});\n      \t});\n        \n\t\tresetTimer(2000);\n    };\n    \n    function resetTimer(waiting) {\n      var elem = document.getElementById(\"cc-outer\");\n      if (elem) {\n        elem.classList.remove(\"maxscreen\");\n        elem.classList.add(\"hidden\");\n        var elemc = document.getElementById(\"clockcanvas\");\n        elemc.classList.remove(\"centerscreen\");\n      }\n      \n      clearTimeout(timeout);\n      timeout = setTimeout(centerclock, waiting);\n    };\n    \n    inactivityTime();\n\u003C\u002Fscript>","\u003Cbutton id=\"startscreensaver\" class=\"butn m-1\">\n    start screensaver\n\u003C\u002Fbutton>\n\u003Cbutton id=\"stopscreensaver\" class=\"butn\">\n    stop screensaver\n\u003C\u002Fbutton>\n\u003Cdiv class=\"fixed hidden bg-saver-image\" id=\"cc-outer\">\n    \u003Ccanvas id=\"clockcanvas\" width=\"450\" height=\"450\" style=\"width:450px !important\">\u003C\u002Fcanvas>\n\u003C\u002Fdiv>","\u003Cstyle>\n.hidden {\n    visibility: hidden;\n}\n\n.fixed {\n    position: fixed;\n    right: 0px;\n    left: 0px;\n    bottom: 0px;\n    margin: auto;\n    cursor: pointer;\n    padding: 0 5px 20px 0;\n    z-index: 100;\n    height: 100vh;\n}\n\n.bg-saver-image {\n    background-image: url(\"https:\u002F\u002Fmaheviblobs.blob.core.windows.net\u002Fpublic\u002FHeideSurfenQuer.jpg\");\n    background-position: center;\n    background-repeat: no-repeat;\n    background-size: cover;\n}\n\u003C\u002Fstyle>",1789637818833]