Jump to content

vmars316

Members
  • Content Count

    373
  • Joined

  • Last visited

Community Reputation

5 Neutral

About vmars316

  • Rank
    Member

Profile Information

  • Location
    Brownsville, Tx

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. Thanks , I'll tinker with it . Just as I thunk .
  2. Ah yes , <style type="text/css"> #video1{ object-fit: initial; width: 800px; height: 600px; } </style> Works great ! THANKS PS: Here's what I am working on: http://vmars.us/freeware/HtmlCodeAssist/Html-Color-Names-Tutorial.html A friend asked me to help with an Acrobat prob : There is apparently no pdf-editor 'known to mankind' that can convert 'highlighted .pdf TEXT' into 'highlighted .html TEXT' , properly . Most turn text into images . Anyways , my little program HtmlCodeAssist.exe makes that task easier . As Always , Thanks for your help .
  3. Thanks Ingolme Sorry to hear that . I see you changed your avatar . I miss the old one . Do you draw these yourself ? Thanks
  4. Hello & Thanks ; When I issue Cntrl/F (this) in browser , the browser highlights all "this" occurences . If I saveas the webpage , all that highlighting is gone . How do I gain access to the area where this page is highlighted . Hopefully , I can capture the highlighted page . Thanks
  5. Hello & Thanks ; <video controls > <source src="./Html-Color-Names-Tutorial-Files/Html-Color-Names-Tutorial.html.mp4" type="video/mp4"> <source src="../Html-Color-Names-Tutorial-Files/Html-Color-Names-Tutorial.html.ogg" type="video/ogg"> Your browser does not support the video tag. </video> This video is so wide that I can not see it all without moving bottom bar . How can I specify width/height ? I see no such option in video controls . Thanks
  6. Ah , at last , it works: Ok Funce , I finally see what you meant . Thanks All . <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0"/> <meta charset="utf-8" /> <title>FreshDraft.StrippedDown></title> <style> @media print { .pageBreak{ page-break-after: always; } } </style> </head> <body id="bodyId" > <div> <br> <textarea class="copyFrom" spellcheck="false" rows="4" cols="12">textarea 1 line 1 textarea 1 line 2 </textarea> <br> <textarea class="copyFrom" spellcheck="false" rows="4" cols="12">textarea 2 line 1 textarea 2 line 2 </textarea> <br> <pre class="pageBreak">.</pre> <pre class="pageBreak">.</pre> </div> <br> <div> <br> <button id="printThisBtn" onclick="printAllThis()" style="display: block">Print This</button> </div> <script> var copyFrom = document.getElementsByClassName("copyFrom"); var pageBreak = document.getElementsByClassName("pageBreak"); var printThisBtn = document.querySelector("#printThisBtn"); function printAllThis() { collectedTextareas = ""; for (var i = 0; i < copyFrom.length; i++) { pageBreak[i].innerHTML = copyFrom[i].value ; } for (var i = 0; i < copyFrom.length; i++) { copyFrom[i].style.display = "none"; } printThisBtn.style.display = "none"; window.print(); console.log("window.printing"); for (var i = 0; i < copyFrom.length; i++) { copyFrom[i].style.display = "block"; } printThisBtn.style.display = "block"; } </script> </body></html>
  7. Thanks; Corrected , but still no go: <script> var printBox = document.querySelector('#printBox'); var collectedTextareas ; function printAllThis() { collectedTextareas = ""; copyFrom = document.getElementsByClassName("copyFrom"); for (var i = 0; i < copyFrom.length; i++) { collectedTextareas = collectedTextareas + copyFrom[i].value + pageBreak.innerHTML; } printBox.style.border = "none"; printBox.innerHTML = collectedTextareas ; window.print(); console.log("window.printing"); printBox.style.border = "solid"; } </script>
  8. I got rid of the Border around printBox , but still no multiple pages: https://www.w3schools.com/code/tryit.asp?filename=G80SDRE1RQ1M <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0"/> <meta charset="utf-8" /> <title>FreshDraft.StrippedDown></title> <!-- https://www.freeformatter.com/html-validator.html The saveAs Button , saves only html , no Links to images , no images ! The Browser more 'Tools / savepage as' option saves Links to images . http://vmars.us/ShowMe/ShortStory-Color-VM.html http://thiscouldbebetter.neocities.org/texteditor.html https://www.w3schools.com/code/tryit.asp?filename=G80SDRE1RQ1M --> <style> @media print { .copyFrom { page-break-after: always; } } @media print { #pageBreak{ page-break-after: always; } } @media print { #printBox{ page-break-after: always; } } </style> </head> <body id="bodyId" > <div> <br> <pre id="printBox"style="border-style: solid;">printBox</pre> <br> <textarea class="copyFrom" spellcheck="false" rows="4" cols="12">This is textarea 1 line 1 textarea 1 line 2 </textarea> <br> <textarea class="copyFrom" spellcheck="false" rows="4" cols="12">textarea 2 line 1 textarea 2 line 2 </textarea> <br> <pre id="pageBreak" style="border-style: dotted;">pre pageBreak area line 1 pre pageBreak area line 2 </pre> </div> <br> <div> <br> <button id="printThis" onclick="printAllThis()" >Print This</button> <button id="cancelPrint" onclick="cancelAllPrint()" >Cancel</button> </div> <script> var printBox = document.querySelector('#printBox'); var collectedTextareas ; function printAllThis() { copyFrom = document.getElementsByClassName("copyFrom"); for (var i = 0; i < copyFrom.length; i++) { collectedTextareas = collectedTextareas + copyFrom[i].value + pageBreak.innerHTML; } printBox.style.border = "none"; printBox.innerHTML = collectedTextareas ; window.print(); console.log("window.printing"); printBox.style.border = "solid"; } </script> <script> function cancelAllPrint() { console.log("Nuttin to cancel !"); } </script> </body></html> Thanks
  9. Hmm... Cant seem to get this puppy going , need help . <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0"/> <meta charset="utf-8" /> <title>FreshDraft.StrippedDown></title> <!-- https://www.freeformatter.com/html-validator.html The saveAs Button , saves only html , no Links to images , no images ! The Browser more 'Tools / savepage as' option saves Links to images . http://vmars.us/ShowMe/ShortStory-Color-VM.html http://thiscouldbebetter.neocities.org/texteditor.html https://www.w3schools.com/code/tryit.asp?filename=G807IALLC2Y6 --> <style> @media print { .copyFrom { page-break-after: always; } } @media print { #pageBreak{ page-break-after: always; } } @media print { #printBox{ page-break-after: always; } } </style> </head> <body id="bodyId" > <div> <br> <pre id="printBox"style="border-style: solid;">printBox</pre> <br> <textarea class="copyFrom" spellcheck="false" rows="4" cols="12">This is textarea 1 textarea 1 line 2 </textarea> <br> <textarea class="copyFrom" spellcheck="false" rows="4" cols="12">textarea 2 line 1 textarea 2 line 2 </textarea> <br> <pre id="pageBreak" style="border-style: dotted;">pre pageBreak area line 1 pre pageBreak area line 2 </pre> </div> <br> <div> <br> <button id="printThis" onclick="printAllThis()" >Print This</button> <button id="cancelPrint" onclick="cancelAllPrint()" >Cancel</button> </div> <script> var printBox = document.querySelector('#printBox'); var collectedTextareas ; function printAllThis() { copyFrom = document.getElementsByClassName("copyFrom"); for (var i = 0; i < copyFrom.length; i++) { collectedTextareas = collectedTextareas + copyFrom[i].value + pageBreak.innerHTML; } printBox.innerHTML = collectedTextareas ; window.print(); console.log("window.printing"); } </script> <script> function cancelAllPrint() { return; } </script> </body></html> https://www.w3schools.com/code/tryit.asp?filename=G807IALLC2Y6 Thanks
  10. Hello & Thanks: I have several <textarea> s and I am using 'window.print();' to print them out as .pdf . So I dump them all into a <pre> area . Problem is , I want to print each as a 'new page' . In '.txt' files I can use a character sequence 'CRLF' to force a 'new line' . ? Is there a character sequence I can insert into <pre> to force a 'new page' for 'window.print();' ? That would surely make things a lot easier Thanks
  11. Hello & Thanks; Here is a ' mini-Tutorial: moving text to & from <textarea> & <pre> ' http://vmars.us/ShowMe/Tutorial-Textarea-Save-CopyTo-RestoreFrom-onLoad-Restore-RO-VM.html I'll also put code here for safekeeping : <!DOCTYPE html> <html> <head> <!-- https://www.freeformatter.com/html-validator.html http://vmars.us/ShowMe/Tutorial-Textarea-Save-CopyTo-RestoreFrom-onLoad-Restore-RO-VM.html --> <title id="titleId"></title> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta charset="UTF-8"> <style> </style> </head> <body onload="documentURL() , onloadRestoreTextarea()" > <br> <button onclick="saveAs(filename, allHtml)">Save This Page</button> <br><br> <div id="inlineDiv" style="display: inline-block;"> <div style="border-style: solid; align-text: center; border-width: 1px; display: inline-block;"> <button onclick="sendToConcoleLog ()">sendToConcoleLog</button> <br><br> <textarea id="toConsoleLogId" rows="4" cols="12">:</textarea> </div> <div style="border-style: solid; align-text: center; border-width: 1px; display: inline-block;"> <button onclick="saveItAll()">Copy this into PRE</button> <br> <textarea class="copyFrom" rows="4" cols="12"></textarea> </div> <div style="border-style: solid; align-text: center; border-width: 1px; display: inline-block;"> <button onclick="restoreItAll()">Restore this from Pre</button> <br> <pre contenteditable="true" class="pasteInto" ></pre> </div> </div> <!-- id="inlineBlock"> --> <div style="border-style: dotted; align-text: center; border-width: 1px;"> <pre> Thought I would make a turorial so I remember what I learned from you all , and to pass on your wisdom. Hope this helps someone :) Try this: ------------------------------------------------------------------------------------------------------------------------ 1) Type something into "Copy this into Pre" textarea box . Then click "Copy this into Pre" Button . Text is copied into "Restore this from Pre" "pre area ' . And "Copy this into Pre" textarea box , is Cleared . Study This : function saveItAll() ------------------------------------------------------------------------------------------------------------------------ 2) The click on "Restore this from Pre" Button , Text is copied from "Restore this from Pre" area into "Copy this into Pre" area . And "Restore this from Pre" area , is Cleared . Study This: function restoreItAll() ------------------------------------------------------------------------------------------------------------------------ 3) Now Type something into "Copy this into Pre" textarea box Again . Then click "Copy this into Pre" Button . Text is copied into "Restore this from Pre" pre area . And "Copy this into Pre" textarea box , is Cleared . But this time , click the "Save This Page" Button . Study This: function saveAs(filename, allHtml) This .html page will be saved in your Browser's download area . Since the "Restore this from Pre" pre area , is coded as contenteditable="true" , the downloaded page will save the "pre area" text as innerHTML . A nifty feature of 'contenteditable' is that upon opening the saved-page the content of "pre area" is now " hardCoded " into page . Study This: function onloadRestoreTextarea() ------------------------------------------------------------------------------------------------------------------------ See code : So in the ' body ' tag we have : "onloadRestoreTextarea()" which runs the " function onloadRestoreTextarea() " code , when page is loaded . Which copies text from "pre area" to " textarea" box . Also at ' body onload="documentURL() ' page load time: The function: function documentURL() is run , which copies ' this .html ' file's address into the ' title ' tag . BTW: for example (see code) and note that : IF you want to copy what’s typed in the box use .value . console.log(toConsoleLogId.value); IF you want what was hardcoded into the text box’s HTML , use .innerHTML . console.log(toConsoleLogId.innerHTML); Hope this helps someone.... http://vmars.us/ShowMe/Tutorial-Textarea-Save-CopyTo-RestoreFrom-onLoad-Restore-RO-VM.html </pre> </div> <script> var copyFromVar = "one"; function saveItAll() { var blankVar = ""; var fromList; // = document.getElementsByClassName("copyFrom"); var intoList; // = document.getElementsByClassName("pasteInto"); fromList = document.getElementsByClassName("copyFrom"); intoList = document.getElementsByClassName("pasteInto"); for (var i = 0; i < fromList.length; i++) { copyFromVar = fromList[i].value ; intoList[i].innerHTML = copyFromVar; fromList[i].innerHTML = blankVar; fromList[i].value = blankVar; } }// </script> <script> var copyFromVarTwo = "two"; function restoreItAll() { var blankVar = ""; var fromListTwo; // = document.getElementsByClassName("copyFrom"); var intoListTwo; // = document.getElementsByClassName("pasteInto"); intoListTwo = document.getElementsByClassName("copyFrom"); fromListTwo = document.getElementsByClassName("pasteInto"); for (var i = 0; i < fromListTwo.length; i++) { copyFromVarTwo = fromListTwo[i].innerHTML ; intoListTwo[i].value = copyFromVarTwo; copyFromVarTwo = fromListTwo[i].innerHTML ; intoListTwo[i].value = copyFromVarTwo; fromListTwo[i].innerHTML = blankVar; fromListTwo[i].value = blankVar; } } </script> <script> var copyFromVarOnload = "three"; function onloadRestoreTextarea() { var fromListTwo; // = document.getElementsByClassName("copyFrom"); var intoListTwo; // = document.getElementsByClassName("pasteInto"); var blankVar = ""; intoListTwo = document.getElementsByClassName("copyFrom"); fromListTwo = document.getElementsByClassName("pasteInto"); for (var i = 0; i < fromListTwo.length; i++) { copyFromVarTwo = fromListTwo[i].innerHTML ; intoListTwo[i].value = copyFromVarTwo; copyFromVarTwo = fromListTwo[i].innerHTML ; intoListTwo[i].value = copyFromVarTwo; fromListTwo[i].innerHTML = blankVar; fromListTwo[i].value = blankVar; } } // reloadTextarea </script> <script> function sendToConcoleLog() { var var01 = toConsoleLogId.value; console.log(var01); // alert(var01); var var01 = toConsoleLogId.innerHTML; console.log("If nothing after : Then no nothing was typed into this textarea => " + var01); alert("If nothing after : Then no nothing was typed into this textarea => " + var01); console.log(toConsoleLogId.value); console.log(toConsoleLogId.innerHTML); /* should be console.log(toConsoleLogId.value); if you want what’s typed in the box, or console.log(toConsoleLogId.innerHTML); if you want what was hardcoded into the text box’s HTML. */ } </script> <script> var filename = ""; function documentURL() { document_URL = document.URL; document.getElementById("titleId").innerHTML = document_URL; } </script> <script> var filename = "Textarea-Save-CopyTo-RestoreFrom-onLoad-Restore.html"; var allHtml = document.documentElement.outerHTML; function saveAs(filename, allHtml) { allHtml = document.documentElement.outerHTML; var blob = new Blob([allHtml], {type: 'text/csv'}); if(window.navigator.msSaveOrOpenBlob) { window.navigator.msSaveBlob(blob, filename); } else{ var elem = window.document.createElement('a'); elem.href = window.URL.createObjectURL(blob); elem.download = filename; document.body.appendChild(elem); elem.click(); document.body.removeChild(elem); } } </script> </body> </html>
  12. Oops yes , the first console.log() works , then no more . I am running chrome . Is there a way to turn on/off console in all browsers ? I am guessing it's always running . Thanks
  13. Oops... The 1st and 2nd alert()s both work but no console.log()s work . And no errors show up on the console . Run code from here: http://vmars.us/ShowMe/changeImage-Drag-Create-Restore.html Thanks
×
×
  • Create New...