B"H
<br>
<link rel="stylesheet" href="./sifareem/toyareem.css">
<title>Mitoorgimawn - AWTSMOOS</title>
<a href="https://awtsmoos.com">
<h1>
    AWTSOOS
    Mitoorgimawn
</h1></a>
<h3>(translator)</h3>
<a href="./sifareem"><h4>
    Awtsmoos Sifareem (translated books)
    in progress
</h4></a>

<a target="_blank" href="https://platform.openai.com/account/api-keys">
<h4>Your OpenAi API key:</h4></a>
<p>(Will not be sent anywhere except the OpenAI api,
    check source code if u want to verify)
</p>
<input type="text" id="apiKey">
<br>
<input type="checkbox" id="rm">
<label for="rm">
    Remember my API key on this computer
    (can be cleared in cache)
</label>
<br>
<br>
<input type="checkbox" id="splitP">
<label for="splitP">
    Split text by paragraph (every 2 line breaks (\n))
    and process each in separate popup
</label>
<br>
<br>
<input type="checkbox" id="custP">
<label for="custP">
    Make your own custom prompt instead of
    relying on the default one
    (note: wouldn't automatically translate text, just ChatGPT in general)
</label>

<br>
<br>
<input type="checkbox" id="roots">
<label for="roots">
   include roots/prefixes etc. in translation, 
   as opposed to just word for word
</label>
<br>
<br>
<br>
<h3>Content of Hebrew paragraph to translate word for word:</h3>
<textarea id="ok" rows="15" cols="40"></textarea>
<br>
<button id="well">Translate</button>
<p id="out" contenteditable>

</p>
<br>
<br>
<button id="prs" disabled>Parse Output as JSON</button>

<h3 id="titl" style="display:none">(Or just use the OpenAI playground or ChatGPT etc.
    with the following prompt per paragraph (paste hebrew text after):
</h3>
<p id="promptInfo" contenteditable>

</p>
<br>

<script>


//B"H
var prompt = ()=>`B"H

Please translate the following Hebrew text into English, 

providing a word-by-word translation

${roots.checked ? `with the root, 
prefixes/suffixes 
and any other relevant information for each word` : ""}. 

this word for word translation should be in list format, for example

{Hebrew Word}: "meaning" ${roots.checked?`, root: {root}, prefixes/suffixes: ל - to`
:""} 


${roots.checked?`
(replace with actual values^^, that's just an example)

remember, after saying the meaning of the word
 in quotes like "meaning", say afterwards (in short hand if u need to) 

then give me the root of the word

then say the hebrew letter of them followed by their meaning, like ל - to.
`:""}

Please first break up each paragraph into smaller phrases before providing a word-by-word translation for each phrase.

In general you can decide when to break up the text, but if there is a paragraph break in the original, it should be broken there always.

When you are breaking up the text into smaller parts, then provide the natural language summary after each part (collection of words) rather than at the end of the entire translation etc..


After each general phrase (which is itself a collection of words), please provide a summary of the meaning of the phrase in natural language.


Remember the steps:
    first, in your head, before writing anything out,
    break up the section into smaller phrases that are easier to handle

    then, go through each phrase, and write it out as a word for word
    translation like above

    after translating each word for that particular seciton, summarize the section

    don't label anything by number, just do it.


`
roots.onchange = () => {
    titl.style.display="";
    promptInfo.innerText=prompt();
}


if(localStorage._awtsmoosApiToorgimawn) {
    if(!apiKey.value) {
        apiKey.value = localStorage._awtsmoosApiToorgimawn
    }
}

well.onclick = () => {
    if(!apiKey.value) {
        var ms = "You need an API key!"
        console.log(ms)
        out.innerHTML = ms;
        return;
    }

    if(rm.checked) {
        localStorage._awtsmoosApiToorgimawn
        =
        apiKey.value;
    }
    
    function doOne() {
        out.innerHTML = "<br>"
        txt(ok.value, r => {
            console.log("DONE!")
            out.innerHTML = r.choices[0].message.content
        }, e=>{
            out.innerHTML += "{There was an error:}"+e
        }, prog => {
            prog = prog.split("\r").join("<br>")
                .split("\n").join("<br>")
            out.innerHTML += prog
        })
    }
    window.onmessage = msg;

    function msg(e) {
        var js = JSON.parse(e.data);
        var par = paragraphResults[js.winNum];
        if(!par) return;
        onChawlonPoysayawch(par,js)
    }

    function onChawlonPoysayawch (par,info) {
        if(!par.opened) {
            par.opened=false;
            par.window.blur();
        }
        if(info.progress) {
            par.progress += info.progress
            par.subParagraph.innerHTML += info.progress;
        }

        if(info.finishedResult) {

            par.finishedResult = info.finishedResult;
            par.window.close()

            if(isFinished()) {
                prs.disabled = false;
                prs.onclick = () => {
                    out.innerText = JSON.stringify(
                        paragraphResults.map(q=>({
                            section: q.paragraph,
                            result: q.finishedResult
                        }))
                    )
                };
            }
        }

    }
    

    function isFinished() {
        return !!!window.paragraphResults
            .find(q=>!q.finishedResult)
    }
    function doMany() {
        out.innerHTML = "";
        var paragraphs = ok
            .value
            .split("\n\n").filter(w=>w);
        /*
            first
            get same styles 
            as this page
        */

        


        window.paragraphResults = []

        

        paragraphs.forEach((w,i)=> {

            var subP = document.createElement("p")
            
            paragraphResults[i] = {
                paragraph: w,
                progress: "",
                subParagraph:subP
            }
            subP.className="subP";
            subP.innerHTML = "Section "+(i+1)+":<br>";
            out.appendChild(subP);
            var win=window.open("",
            "_blank",
           // "height=400,width=600,status=yes,toolbar=no,scrollbars=yes,menubar=no,location=no"
            
            );
            win.document.write(/*html*/`
            B"H
            <br>
            <meta charset="utf-8">
            <link rel="stylesheet" href="${location.origin}/sifareem/toyareem.css">
            <style>
                .fixt {
                    position:fixed;
                    overflow:scroll;
                    left:0;
                    top:0;
                    width:100%;
                    height:15%;
                }
            </style>
            <p class="fixt">
            B"H

            Hi! welcome to reality. 
            Here we will attempt to generate
            the paragraph you asked, while
            others may be processing
            in other windows at the same time.

            Message this window is processing iy"H:

            <p>
                ${w}
            
            </p>
            <br>
            <h4>Output:</h4>
            
            <p contenteditable id="yoyts"></p>
            <script>
                var apiKey = {
                    value: "${apiKey.value}"
                };

                var roots = {
                    checked: ${roots.checked}
                }
                var prompt = ${prompt};

                var msg = \`${w}\`

                var custP = {
                    checked: ${custP.checked}
                }

                ${txt}

                txt(
                    msg,
                    done => {
                        window
                        .opener
                        .postMessage(JSON.stringify({
                            winNum: ${i},
                            finishedResult: 
                                done
                        }), "*")
                    },
                    er => {
                        yoyts.innerHTML += "{Error: "
                        +er+"}"
                    },
                    progress => {
                        yoyts.innerHTML += progress;

                        window
                        .scrollTo(0, document.body.scrollHeight);


                        window
                        .opener
                        .postMessage(JSON.stringify({
                            winNum: ${i},
                            progress
                        }), "*")
                    }
                );


                onmessage = (e) => {
                    yoyts.innerHTML += e.data;
                    window.scrollTo(0, document.body.scrollHeight);
                }
                window.blur();
                window.opener.postMessage("${i}", "*")
            </`+`script>
            `);


            win.document.close();

            paragraphResults[i].window = win;

        })
    }

    if(!splitP.checked) {
        doOne()
    } else {
        doMany()
    }
   
};

function txt(choot, cb=()=>{}, er=()=>{}, prog=()=>{}) {
    
    console.log("processing", choot, "with API key", apiKey.value)
    //B"H

    fetch("https://api.openai.com/v1/chat/completions", {
            headers: {
                "Authorization": "Bearer " + apiKey.value,
                "Content-Type":"application/json",
            },
            method: "POST",
            body: JSON.stringify({
                model: "gpt-3.5-turbo",
                stream:true,
                messages: [
                    {
                        role: "user",
                        content: `
                        B"H
                        ${custP.checked ? "":prompt()}


                        ${choot}
                        `
                    }
                ]
            })
        }).then(async r=>{
            console.log("HI!")
            var itt = await r.body.getReader()
            var dn,vl,txt,js;
            var allTxt = ""
            var te = new TextDecoder()
            while(!dn) {
                var red = await itt.read()
                vl = red.value
                if(!vl)  {
                    dn = true;
                    return allTxt;
                }

                dn = vl.done;
                txt = te.decode(vl)
                var lines = txt.split("\n").filter(q=>q);

                lines.forEach(w => {
                    var newText = w.replace("data: ","")
                try {
                    if(newText == "[DONE]") {
                        cb(allTxt)
                        dn=true;
                        return allTxt;
                    }
                    js = JSON.parse(newText)
                    if(js.choices[0].finish_reason == "stop") {
                        cb(allTxt)
                        dn=true;
                        return allTxt;
                    }
                    var cnt = js.choices[0].delta.content
                        || ""
                    cnt = cnt.split("\n")
                        .join("<br>")
                        .split("\r")
                        .join("<br>");

                    prog(cnt)
                    allTxt+=cnt;
                    console.log(cnt,js)
                } catch(e) {
                    console.log("COuldn't parse",e,newText)
                }
                })
                
            }
            return allTxt;
            
        })
        .then(g=>{
            w=g;
            console.log(g)
            cb(g)
        })


}
</script>