Peppa Pig Transcript Viewer

View Peppa Pig episode transcripts

Info

Created On: July 13, 2023

Created By: @CalculatorTools

AI

Model: gpt-3.5-turbo-16k-0613

Time: 16 seconds

Prompt Tokens: 956

Completion Tokens: 1046

Total Token Cost: 2002

Get This App On Your Website

<iframe src="https://calculators.tools/prompt/802e29e0ca35eafd408e598c90a68727/iframe/" width="100%" height="100%" frameborder="0" scrolling="yes" allowfullscreen="true" webkitallowfullscreen="true" mozallowfullscreen="true" allow="midi; geolocation; microphone; camera; display-capture; encrypted-media; clipboard-read; clipboard-write; notifications; payment-handler; persistent-storage; background-sync; ambient-light-sensor; accessibility-events;" sandbox="allow-modals allow-forms allow-scripts allow-same-origin allow-popups allow-downloads allow-presentation allow-pointer-lock allow-orientation-lock" allowfullscreen="true" allowpaymentrequest="true" frameborder="0"></iframe><br><a href="https://calculator.tools/prompt/1553/" target="_blank" style="font-size: 12px; text-decoration: none;" alt="Create any app, calculator, tools, tracker, or game instantly using AI! - Calculator Tools" title="Create any app, calculator, tools, tracker, or game instantly using AI! - Calculator Tools">Powered by Calculator Tools</a>

1. Copy the code above with the iframe and link.
2. Paste the code into your website.
3. Resize the iframe to fit your website.

Javascript, HTML, CSS Code

                    

<html>

<head>

		<script type="text/javascript"> window.addEventListener('error', function(event) { var message = JSON.parse(JSON.stringify(event.message)); var source = event.filename; var lineno = event.lineno; var colno = event.colno; var error = event.error; window.parent.postMessage({ type: 'iframeError', details: { message: message, source: source, lineno: lineno, colno: colno, error: error ? error.stack : '' } }, '*'); }); window.addEventListener('unhandledrejection', function(event) { window.parent.postMessage({ type: 'iframePromiseRejection', details: { reason: event.reason } }, '*'); }); </script>



    <meta charset="utf-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width,initial-scale=1">



    <title>Peppa Pig Transcript Viewer</title>

    <meta name="description" content="View Peppa Pig episode transcripts">

    <meta name="keywords" content="Peppa Pig, transcript, episode">



    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"

            integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">

    <link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">



    <style>

        body {

            font-family: 'Arial', sans-serif;

            background-color: #f5f5f5;

        }



        .container {

            max-width: 600px;

            margin: 0 auto;

            padding: 20px;

            background-color: #fff;

            border-radius: 5px;

            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);

        }



        h1 {

            font-size: 24px;

            margin-bottom: 20px;

            text-align: center;

        }



        .episode-list {

            margin-bottom: 20px;

        }



        .episode-list li {

            list-style: none;

            margin-bottom: 10px;

        }



        .transcript {

            display: none;

            margin-bottom: 20px;

        }



        .btn {

            display: block;

            width: 100%;

            margin-bottom: 10px;

        }

    </style>



    <script type="text/javascript">

        $(document).ready(function () {

            var episodes = [

                "Penny Polar Bear's Come to Playgroup",

                "Numbers",

                "The Playgroup",

                "Best Friend",

                "Pedro's Cough",

                "The Museum",

                "Washing",

                "1 to 100",

                "Dates (Penny Polar Bear Character, The Second One is Months Added)",

                "Months (Penny Polar Bear Added)"

            ];



            var currentEpisode = "";



            $(".btn-choose-episode").click(function () {

                var episode = prompt("Enter the episode name:");

                if (episode && episode.trim() !== "") {

                    currentEpisode = episode;

                    $(".episode-name").text(currentEpisode);

                }

            });



            $(".btn-show").click(function () {

                if (currentEpisode !== "") {

                    $(".transcript").show();

                }

            });



            function updateEpisodeCount() {

                var totalEpisodes = episodes.length;

                var remainingEpisodes = totalEpisodes - 1;

                $(".episode-count").text(totalEpisodes);

                $(".remaining-count").text(remainingEpisodes);

            }



            updateEpisodeCount();

        });

    </script>



	<link rel="canonical" href="https://calculator.tools/prompt/1553/">

	<meta charset="utf-8">

</head>

<body>

<div id="main-container" class="container">

    <h1>Peppa Pig Transcript Viewer</h1>



    <div class="episode-list">

        <h3>Choose the Episode (10/100 to go)</h3>

        <ul>

            <li>Penny Polar Bear's Come to Playgroup</li>

            <li>Numbers</li>

            <li>The Playgroup</li>

            <li>Best Friend</li>

            <li>Pedro's Cough</li>

            <li>The Museum</li>

            <li>Washing</li>

            <li>1 to 100</li>

            <li>Dates (Penny Polar Bear Character, The Second One is Months Added)</li>

            <li>Months (Penny Polar Bear Added)</li>

        </ul>

    </div>



    <div class="episode-selection">

        <button class="btn btn-choose-episode">Choose the Episode</button>

        <span class="episode-name"></span>

    </div>



    <button class="btn btn-show">Show</button>



    <div class="transcript">

        <h3>Transcript</h3>

        <p>This is the transcript for episode <span class="episode-name"></span>.</p>

    </div>

</div>

        <script type="text/javascript"> var localStoragePrefix = "ct-{{ cachebreaker }}"; var lastSave = 0; function saveLocal(data) { if (Date.now() - lastSave < 1000) { return; } let cookie = localStoragePrefix + "=" + JSON.stringify(data) + "; path=" + window.location.pathname +  "'; SameSite=Strict"; cookie += "; expires=" + new Date(Date.now() + 1000 * 60 * 60 * 24 * 365 * 1000).toUTCString(); document.cookie = cookie; lastSave = Date.now(); } function loadLocal() { var cookiePrefix = localStoragePrefix + "="; var cookieStart = document.cookie.indexOf(cookiePrefix); if (cookieStart > -1) { let cookieEnd = document.cookie.indexOf(";", cookieStart); if (cookieEnd == -1) { cookieEnd = document.cookie.length; } var cookieData = document.cookie.substring(cookieStart + cookiePrefix.length, cookieEnd); return JSON.parse(cookieData); } } </script>



        <script type="text/javascript"> window.addEventListener('load', function() { var observer = new MutationObserver(function() { window.parent.postMessage({height: document.documentElement.scrollHeight || document.body.scrollHeight},"*"); }); observer.observe(document.body, {attributes: true, childList: true, subtree: true}); window.parent.postMessage({height: document.documentElement.scrollHeight || document.body.scrollHeight},"*"); }); </script>

</body>

</html>

Peppa Pig Transcript Viewer

Info

Tags

AI

Get This App On Your Website

Javascript, HTML, CSS Code

IMAGE TO APP (New!)

SCREENSHOT TO APP (New!)

FAQ

What is Calculator Tools?

What Do You Mean Make An App?

Does This Use ChatGPT?

Calculator Tools

Want Better Apps?