{"id":1205,"date":"2024-02-03T04:24:53","date_gmt":"2024-02-03T04:24:53","guid":{"rendered":"https:\/\/beams-experiments.com\/?page_id=1205"},"modified":"2025-01-19T07:41:56","modified_gmt":"2025-01-19T07:41:56","slug":"experimentnogpt","status":"publish","type":"page","link":"https:\/\/beams-experiments.com\/index.php\/experimentnogpt\/","title":{"rendered":"Human Only Task"},"content":{"rendered":"\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n    <meta charset=\"UTF-8\">\n    <title>Task Instructions Frame<\/title>\n    <script src=\"https:\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/3.5.1\/jquery.min.js\"><\/script>\n    <style>\n        body {\n            margin: 0;\n            padding: 20px;\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            justify-content: center;\n            min-height: 100vh;\n            box-sizing: border-box;\n        }\n        #chatInputArea {\n            width: 90%;\n            height: 40vh;\n            border: 1px solid #000;\n            padding: 5px;\n            overflow-y: auto;\n            margin: 20px 0;\n        }\n        #chatInputArea textarea {\n            width: 100%;\n            height: 95%;\n            box-sizing: border-box;\n        }\n        #nextButton {\n    display: block; \/* Ensures the button is a block-level element *\/\n    padding: 10px 20px;\n    background-color: #007bff;\n    color: white;\n    border: none;\n    border-radius: 5px;\n    cursor: not-allowed; \/* Cursor style when disabled *\/\n    opacity: 0.5; \/* Opacity when disabled *\/\n    margin: 10px auto; \/* Auto margins for horizontal centering *\/\n    width: fit-content; \/* Adjusts width to fit the content *\/\n    position: relative; \/* Needed for positioning the timer *\/\n\n}\n       #timer {\n    font-size: 2em;\n    color: red;\n    position: absolute;\n    top: 80%;\n    transform: translateY(-50%);\n    right: 50px; \/* Initially positioned *\/\n}\n        #progressBarContainer {\n            width: 90%;\n            background-color: #e0e0e0;\n            border-radius: 5px;\n            margin-top: 10px;\n        }\n        #progressBar {\n            height: 10px;\n            background-color: #007bff;\n            border-radius: 5px;\n            width: 88%;\n        }\n        #progressText {\n            text-align: center;\n            margin-top: 5px;\n        }\n        #taskInstructions {\n            width: 90%;\n            height: 30vh;\n            overflow-y: auto;\n            border: 1px solid #000;\n            padding: 10px;\n            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);\n            margin-bottom: 20px;\n        }\n    <\/style>\n<\/head>\n<body>\n   \n    <\/div>\n    <div id=\"timer\">00:00<\/div> <!-- Timer Display -->\n    <div id=\"chatInputArea\">\n        <textarea id=\"userMessage\" placeholder=\"Start typing your ideas here...\"><\/textarea>\n    <\/div>\n    <button id=\"nextButton\" disabled>Next Page<\/button>\n <div id=\"taskInstructions\">\n        <h2>Task Guidelines<\/h2>\n        <div id=\"instructionsText\">Loading instructions&#8230;<\/div>\n    <\/div>\n <!-- Progress Bar -->\n    <div id=\"progressBarContainer\">\n        <div id=\"progressBar\"><\/div>\n    <\/div>\n    <div id=\"progressText\">Page 8 out of 9<\/div>\n\n     <script>\n        $(document).ready(function() {\n             \/\/show alert at top of the screen\nalert(\"You MUST follow the instructions located at the bottom, use your own ideas and experiences, and persist in trying to get better results; otherwise, your submission might be rejected. When the set time elapses, you'll be allowed to click 'Next Page'.\");\n\n\n\/\/ Retrieve task instructions from local storage\n        var taskInstructions = localStorage.getItem('completeTask');\n        \n        if (taskInstructions) {\n            \/\/ Display the instructions in the designated element\n            $('#instructionsText').html(taskInstructions);\n        } else {\n            \/\/ Display an error message if the instructions are not found\n            $('#instructionsText').html('Task instructions not found.');\n        }\n     \n\/\/track time screen not attended by user\n\nlet timePageNotVisibleStart = 0;\nlet totalTimeNotVisible = 0; \/\/ initialize totalTimeNotVisible\n\nfunction updateTotalTimeNotVisible() {\n    if (document.visibilityState === 'hidden' && timePageNotVisibleStart !== 0) {\n        \/\/ Calculate time page was not visible and reset start time\n        const notVisibleDuration = Date.now() - timePageNotVisibleStart;\n        totalTimeNotVisible += Math.round(notVisibleDuration \/ 1000);\n        timePageNotVisibleStart = 0;\n    }\n    \/\/ Optionally log the updated total time here for debugging\n}\n\ndocument.addEventListener('visibilitychange', () => {\n    \/\/console.log('Visibility changed to:', document.visibilityState);\n    if (document.visibilityState === 'visible') {\n        if (timePageNotVisibleStart !== 0) {\n            const notVisibleDuration = Date.now() - timePageNotVisibleStart;\n           \/\/ console.log('Not visible duration (ms):', notVisibleDuration);\n            totalTimeNotVisible += Math.round(notVisibleDuration \/ 1000); \/\/ Convert ms to seconds and accumulate\n            \/\/console.log('Total time not visible (s):', totalTimeNotVisible);\n            timePageNotVisibleStart = 0; \/\/ Reset the start time\n        }\n    } else {\n        timePageNotVisibleStart = Date.now();\n    }\n});\n  \n \/\/ start of timer code\n var timerDuration;\n \/\/ Fetch timer duration from getTimer.php\n    $.get('https:\/\/beams-experiments.com\/getTimer.php', function(data) {\n         timerDuration = parseInt(data); \/\/ Assuming the duration is in seconds\n        startTimer(timerDuration);\n\/\/console.log ('time is: ', timerDuration);\n\n\n    });\n    \/\/ Start the timer\n    function startTimer(duration) {\n        var timer = duration, minutes, seconds;\nif (typeof window.timerInterval !== 'undefined') {\n        clearInterval(window.timerInterval);\n    }\n        var interval = setInterval(function() {\n            minutes = parseInt(timer \/ 60, 10);\n            seconds = parseInt(timer % 60, 10);\n\n            minutes = minutes < 10 ? \"0\" + minutes : minutes;\n            seconds = seconds < 10 ? \"0\" + seconds : seconds;\n\n\/\/ Update UI with time\n        if (timer >= 0) {\n            $('#timer').text(minutes + \":\" + seconds);\n        }\n           if (timer === 300) { \/\/ When there are five minutes left, remind users to list final ideas\n            alert(\"You still have five minutes to finish. Make sure to clearly list your final 10 different idea concepts for a new shoe. If you do not provide this list, your submission will be rejected!\");\n        }\n\n\nif (localStorage.getItem('chatLog')) {\n    \/\/ If 'chatLog' already exists\n      \/\/alert ('You already did this section!');\n     \/\/window.location.href = 'https:\/\/beams-experiments.com\/index.php\/post-task-questionnaire-human-only\/';\n\/\/ Disable all input and textarea elements within #chatInputArea\n        $('#chatInputArea').find('input, textarea').prop('disabled', true);\n        clearInterval(interval);\n        $('#nextButton').removeAttr('disabled').css({\n            'cursor': 'pointer',\n            'opacity': '1.0'\n        });\n}\n  \n           if (timer < 0) {\n    clearInterval(window.timerInterval); \/\/ Stop the timer\n    \/\/ Call fetchTimerAlert only if it hasn't been called yet\n    if (typeof window.timerAlertCalled === 'undefined' || !window.timerAlertCalled) {\n        fetchTimerAlert(); \/\/ Trigger the alert function\n        window.timerAlertCalled = true; \/\/ Mark that the alert has been called to prevent future calls\n       \/\/store the total unattended time \n        localStorage.setItem('finalTotalTimeNotVisible', totalTimeNotVisible.toString());\n       \/\/ console.log(`Final total time not visible saved: ${totalTimeNotVisible} seconds.`);\n        \n        \/\/ Disable all input and textarea elements within #chatInputArea\n        $('#chatInputArea').find('input, textarea').prop('disabled', true);\n\n        $('#nextButton').removeAttr('disabled').css({\n            'cursor': 'pointer',\n            'opacity': '1.0'\n        });\n    }\n\n    \/\/ Ensure timer text is set to 00:00 once it goes below 0\n    $('#timer').text(\"00:00\");\n    return; \/\/ Exit the function to avoid further execution\n}\n        --timer; \/\/ Decrement timer\n    }, 1000);\n}\n    \/\/ Fetch and show the timer alert\n    function fetchTimerAlert() {\n        $.get('https:\/\/beams-experiments.com\/getTimerAlert.php', function(alertMsg) {\n            alert(alertMsg); \/\/ Show alert message\n        });\n    }\n\/\/end of timer code\n\n\n\n            $('#nextButton').click(function() {\n                var chatLog = $('#userMessage').val();\n\/\/ Check if 'chatLog' is not already stored in localStorage\nif (!localStorage.getItem('chatLog')) {\n    \/\/ If 'chatLog' does not exist, store it\n       localStorage.setItem('chatLog', chatLog);\n\n} else {\n    \/\/ Optional: Handle the case where 'chatLog' is already set, if needed\n}\n                 \n\/\/ Ensure the timer value doesn't go below zero and is in the format \"MM:SS\"\n    var timerParts = $('#timer').text().split(':');\n  \n        var minutes = parseInt(timerParts[0], 10);\n        var seconds = parseInt(timerParts[1], 10);\n\n        var remainingTimeInSeconds = (minutes * 60) + seconds;\n        remainingTimeInSeconds = Math.max(remainingTimeInSeconds, 0);\n\n        \/\/ Calculate the elapsed chat time in seconds\n        var chatTime = timerDuration - remainingTimeInSeconds;\n\n\/\/ Store the chat time in local storage\n        localStorage.setItem('chatTime', chatTime);\n\n       \/\/ Fetch researcherID and experimentID\n    $.get('https:\/\/beams-experiments.com\/getResearcherAndExperimentID.php')\n    .done(function(data) {\n        var ids = JSON.parse(data);\n\/\/ researcherID, and experimentID locally\n                localStorage.setItem('researcherID', ids.researcherID);\n                localStorage.setItem('experimentID', ids.experimentID);\n            \/\/ Redirect to the post-task questionnaire page\n            window.location.href = 'https:\/\/beams-experiments.com\/index.php\/post-task-questionnaire-human-only\/';\n        })\n        .fail(function(jqXHR, textStatus, errorThrown) {\n        console.error('Error fetching researcher and experiment IDs:', textStatus, errorThrown);\n            });\n        });\n });\n    <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Task Instructions Frame 00:00 Next Page Task Guidelines Loading instructions&#8230; Page 8 out of 9<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"om_disable_all_campaigns":false,"footnotes":""},"class_list":["post-1205","page","type-page","status-publish","hentry"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/beams-experiments.com\/index.php\/wp-json\/wp\/v2\/pages\/1205","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/beams-experiments.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/beams-experiments.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/beams-experiments.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/beams-experiments.com\/index.php\/wp-json\/wp\/v2\/comments?post=1205"}],"version-history":[{"count":47,"href":"https:\/\/beams-experiments.com\/index.php\/wp-json\/wp\/v2\/pages\/1205\/revisions"}],"predecessor-version":[{"id":6132,"href":"https:\/\/beams-experiments.com\/index.php\/wp-json\/wp\/v2\/pages\/1205\/revisions\/6132"}],"wp:attachment":[{"href":"https:\/\/beams-experiments.com\/index.php\/wp-json\/wp\/v2\/media?parent=1205"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}