# scribbled.space ## Posts - [Photo Sorter Overview / Integration guide.](https://scribbled.space/photo-sorter-overview-integration-guide/): Workflow: Guest uploads old Friendster photos Scraper downloads/processes locally Saves to /imported/ Llama captions old photos Merges with cruise photos All stays on boat (private) --- ## COMPLETE ARCHITECTURE ┌──────────────────────────────────────────────┐ │ ONLINE (Internet Required) │ ├──────────────────────────────────────────────┤ │ │ │ dragonladysf.com/sarahs-party-2025 │ │ ├─ Event info page (static) │ │ ├─ Waiver (posts to Google Sheets) │ │ ├─ Old photo upload │ │ └─ Pre-charter checklist │ │ │ │ Backend: │ │ • Google Apps Script (waiver) │ │ • Google Sheets (data storage) │ │ • Static file host (Hostinger VPS) │ │ │ └──────────────────────────────────────────────┘ ↓ [Guest uploads […] - [Shortcode Ultimate – Examples / Code](https://scribbled.space/shortcode-ultimate-examples-code/): Basic Code Wrapper – Prismatic https://prismjs.com/examples.html <pre><code class=”language-javascript”>CODE </code></pre> pick a language – wrap code in it “language-markup” / “language-html” / “language-mathml” PLUGINS:: Adding tags to page – tags are added to body_class so they style the prism area as well rainbow-braces line-numbers match-braces no-brace-hover <pre><code class="language-javascript"> var myObject = { property1: "something", property2: 5, property3: true }; {{{{{{{{}}}}}}}} [[[[[[[[]]]]]]]] ((((((((((())))))))))) [ ] &lbrack; and &rbrack; </code></pre> JavaScript Copy Edit Shortcode RESOURCES TOPRESOURCESHEADONE EntryOne EntryTwo EntryThree TOPRESOURCESHEADTWO SubListEntryOne SubListEntryTwo SubListEntryThree SubListEntryFour [su_top_resources] <!-- ||||||||||||||||||| TopOfPageResources --> <div class="TOPResources EditusIgnore"> <h2>RESOURCES</h2> <ul class="topr-list"> <li class="TRSubHead">TOPRESOURCESHEADONE</li> <li>EntryOne</li> <li>EntryTwo</li> <li>EntryThree</li> <li class="topr-presublist-li"> <ul […] - [Speaking Morse Code](https://scribbled.space/speaking-morse-code/): For learning Morse code it is recommended to use this reference, but if you like, the dots and dashes are available too. If you click on any of the highlighted letters or symbols the Morse sound will be played. If the duration of a dot is taken to be one unit then that of a dash is three units. The space between the components of one character is one unit, between characters is three units and between words seven units (see more on Morse code timing). The prosigns are combinations of two letters sent together with no space in between. […] - [AI Photo Sorter](https://scribbled.space/ai-photo-sorter/): THE REALIZATION HTML Builder creates structured data ↓ Module JSON ↓ Known structure ↓ Can be converted to: - Static HTML ✅ (already doing this) - React components ✅ (WHY NOT?!) - Vue components 🤔 (future) - Native apps 🤔 (future) Why This Makes Perfect Sense 1. Same Data, Different Output javascript // HTML Builder Module Data: { type: 'hero', title: 'Welcome', subtitle: 'Amazing Product', image: 'hero.jpg', button: { text: 'Get Started', url: '/signup' } } // Can Export As: // HTML: <section class="hero"> <h1>Welcome</h1> <p>Amazing Product</p> <img src="hero.jpg"> <a href="/signup">Get Started</a> </section> // React: <Hero title="Welcome" subtitle="Amazing Product" image="hero.jpg" […] - [AI On A Boat](https://scribbled.space/ai-on-a-boat/): Dragon Lady – NOW WITH AI The Complete Dragon Lady Experience Workflow: Guest uploads old Friendster photos Scraper downloads/processes locally Saves to /imported/ Llama captions old photos Merges with cruise photos All stays on boat (private) [aesop_image force_fullwidth=”off” lightbox=”off” captionposition=”left” captionsrc=”custom” align=”center” imgwidth=”100%” img=”https://scribbled.space/wp-content/uploads/2026/01/workflow.jpg&#8221; panorama=”off”] 1. BOOKING → Custom Link Created Jerry books "Sarah's 40th Birthday Party" System generates: dragonladysf.com/sarahs-party-2025 This link controls EVERYTHING for this charter 2. PRE-CHARTER: Guest Info Portal Guests visit: dragonladysf.com/sarahs-party-2025 They see: ┌─────────────────────────────────────┐ │ Sarah's 40th Birthday Cruise │ │ Dragon Lady - June 15, 2025 │ ├─────────────────────────────────────┤ │ YOUR TRIP INFORMATION │ │ │ […] - [Ergonomics](https://scribbled.space/ergonomics/): [aesop_image force_fullwidth=”off” lightbox=”off” captionposition=”left” captionsrc=”custom” align=”center” imgwidth=”100%” img=”https://scribbled.space/wp-content/uploads/2026/01/ergonomics-scaled.jpg&#8221; panorama=”off”] adfasdfasdfdsaf - [Ultimate Site Parser](https://scribbled.space/ultimate-site-parser/): ⏺ 🎯 ULTIMATE SITE PARSER OVERVIEW The Ultimate Site Import → Edit → Export Pipeline 🌊 The Complete Flow ┌─────────────────────────────────────────────────────────────────┐ │ ULTIMATE SITE PARSER │ │ Import ANY website → Convert to ACCID format │ └─────────────────────────────────────────────────────────────────┘ ↓ ┌─────────────────────────────────────────────────────────────────┐ │ ACCID HTML BUILDER │ │ Edit visually → Add content → Update metadata │ └─────────────────────────────────────────────────────────────────┘ ↓ ┌─────────────────────────────────────────────────────────────────┐ │ STATIC HTML EXPORT │ │ ZIP download → FTP upload → Fully portable sites │ └─────────────────────────────────────────────────────────────────┘ 1️⃣ ULTIMATE SITE PARSER – The Importer What It Does Imports ANY website and converts it to editable ACCID format Core Components A. Content Discovery (core.py:30-130) Finds […] - [New Normal Post](https://scribbled.space/new-normal-post/): Where does it come from? Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source. Lorem Ipsum comes from sections 1.10.32 and 1.10.33 of “de Finibus Bonorum et Malorum” (The Extremes of Good and Evil) by Cicero, written in 45 […] - [Handbrake – Best Settings](https://scribbled.space/handbrake-best-settings/): Let’s compress some video.    For compressing a 900MB, 20-minute long sunset video using HandBrake while retaining good color quality, you can use the following settings: Video Settings  1. Video Codec: H.265 (x265) or H.264 (x264) • H.265 (HEVC) generally provides better compression at the same quality compared to H.264, which helps to keep file size smaller without significant loss in quality. 2. Framerate (FPS): Same as source • Make sure to match the framerate to the original to maintain the smoothness of the video. 3. Constant Quality (RF): 18–20 for H.264, or 20–22 for H.265 • The RF (Rate Factor) […] - [Tabletcheck](https://scribbled.space/tabletcheck/): [aesop_image srId=”1″ overlay_revealfx=”inplaceslow” revealfx=”frombelow” overlay_content=”Click” force_fullwidth=”off” lightbox=”off” captionposition=”left” captionsrc=”custom” align=”center” imgwidth=”100%” img=”https://scribbled.space/wp-content/uploads/2022/12/fr2-page5-snaps-400w.png&#8221; panorama=”off”] so how well dos this work on the tablet? se ems to work pretty well actually! [aesop_quote type=”block” quote=”The Universe is made of stories, not of atoms.” size=”1″ align=”center” height=”auto” text=”#000000″ background=”#00ff00″ width=”100%”] [aesop_chapter srId=”4″ overlay_revealfx=”frombelow” video_autoplay=”on” revealfx=”inplaceslow” force_fullwidth=”off” maxheight=”50%” minheight=”169px” bgcolor=”#000000″ full=”on” alternate_img=”https://scribbled.space/wp-content/uploads/2022/01/info_icon.png&#8221; img=”https://scribbled.space/wp-content/uploads/2022/01/info_icon.png&#8221; bgtype=”img” subtitle=”It Begins” title=”Chapter One”] [aesop_timeline_stop num=”2014″ title=”Title”] [aesop_collection order=”default” showexcerpt=”on” loadmore=”off” limit=”-1″ columns=”1″ collection=”1″] [aesop_parallax floaterspeed=”1″ lightbox=”on” captionposition=”bottom-left” caption=”zoom ” floaterdirection=”up” floaterposition=”right” floater=”on” parallaxbg=”on” parallaxspeed=”10″ img=”https://scribbled.space/wp-content/uploads/2021/07/editus.png”%5D space - [Feros-No-Tabs](https://scribbled.space/feros-no-tabs/): Ferocious Butterfly The Setup – EDITABLE – yes! To ensure your server is properly configured for running both Laravel and a headless WordPress setup, there are a few key configurations you’ll need to check and set up: 1. General Server Requirements Both Laravel and WordPress have specific system requirements, and you’ll want to make sure your server is prepared to handle them. Here’s a breakdown: Operating System Ensure you’re using a Linux-based server like Ubuntu or AlmaLinux (which you’re already using). Make sure the server is up to date: sudo yum update # For AlmaLinux PHP Requirements Both Laravel and […] - [Ferosious-ReadONly](https://scribbled.space/ferosious-readonly/) - [Ferocious Butterfly](https://scribbled.space/ferocious-butterfly/) - [Pizza Dough – 90 Min – Stretched & Balled](https://scribbled.space/pizza-dough-90-min-stretched-balled/): Pizza Dough – 90 min – stretched and balled https://youtu.be/VJu3YCykO_0?feature=shared RECIPE – Makes 4 Pizzas ▪400g (1 2/3c) Warm Water, 86F/30C▪20g (1 1/2T) Extra virgin olive oil▪7g (2t) Instant Yeast▪15g (1T) Salt▪20g (2T) granulated sugar▪680g (5 3/4c) All-purpose flour: Instructions: Mix warm water with olive oil, yeast, salt, and sugar then use a sturdy spook to gradually add 680g (about 5 1/3 cups) of all-purpose flour to the bowl and combine until flour has hydrated and has formed into a clump of dough. At this point, switch to mixing using your soaking wet hand. Grab and squeeze the dough repeatedly […] - [Video Tracking – Stages With Code](https://scribbled.space/video-tracking-stages-with-code/): Going to try to keep this short and simple. However, feel free to ask additional questions / thoughts, etc. There’s a lot to digest and share. So, I may not have hit every point exactly but again, don’t hesitate to ask additional questions, what to do a deeper dive in a topic etc. This just became a very long response that I could probably have continued with an even longer response. Thanks. Video Metrics I haven’t seen your video metrics so it’s a little difficult to weigh in. However, if the majority are simply play, stop, maybe length watched, those […] - [SignUp Event – Sept 24 Notes](https://scribbled.space/signup-event-sept-24-notes/): 1. Cookie Management and Initialization: You’ve set up the getCookie and setCookie functions globally, which is great for consistency. Just ensure that window.domain (or singleWhiteLabelCookieDomain) is correctly populated to handle cross-subdomain cookies. function setCookie(name, value, days) { var expires = ""; if (days) { var date = new Date(); date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000)); expires = "; expires=" + date.toUTCString(); } document.cookie = name + "=" + (value || "") + expires + "; path=/; domain=" + window.domain + ";max-age=31536000;secure;SameSite=Lax;";} 2. User ID Handling: You’ve correctly defined the function to generate or retrieve the […] - [Dit-Dah](https://scribbled.space/dit-dah/): modify rules /etc/nginx/nginx.conf Sites cd /usr/share/nginx/html/localtransporter.space/ cd /usr/share/nginx/html/spiffydesign.com/ cd /usr/share/nginx/html/dit-dah.click To hide the .env file using Nginx and prevent it from being served publicly, you can add a specific rule in your Nginx configuration that denies access to this file. Here’s how to do it: Step-by-step instructions: Open your Nginx configuration file:You can either add this rule to your main Nginx configuration file (e.g., /etc/nginx/nginx.conf) or to the server block configuration for your site (e.g., /etc/nginx/conf.d/localtransporter.space.conf). Example: sudo nano /etc/nginx/conf.d/localtransporter.space.conf Add the following rule to block access to the .env file:Insert this block inside your server block configuration: server { […] - [Automaton Dab Rig](https://scribbled.space/automaton-dab-rig/): https://store.thedabbingspecialists.com/products/automaton-dab-rig Automaton Dab Rig $49.95 Automaton Dab Rig [click to view our shipping policies] Description for Part Number 1170 Scroll Thru Images to See a Function Video! If you’re looking for a super cool banger hanger with a mini form factor, and incredible function, then look no further! These are super cool in the hand and almost look like they’ll smoke themselves automatically. The fresh bright colors and stylish design really make these captivating to look at. The function on this is very strong with solid airflow and the showerhead percolator hung low in the bottom of the base. Showerhead […] - [Javascript Notes Dec 2022](https://scribbled.space/javascript-notes-dec-2022/): https://courses.reactbootcamp.com/courses/927296/lectures/17117784 Sloppy Strict Javascript has 2 modes – generally set to sloppy. to set strict for entire file  'use strict'; // just add to top of file - [Sella - Speed Test](https://scribbled.space/sella-speed-test/): ROUND 1 OK – so first went through and compressed the images (we were getting some "huge network load" warnings in the HIGH warning area at first) I also implemented LAZY LOADING on the external images – so that they are not loading til the user scrolls down to that screen – saving us that time on initial load. Lazy Loading SO no initial load – not ALL SITE images are being loaded at first. Image Compression This is an example of 1 image and how much it could be compressed – Initial – 760 K 155K after running through […] - [Redeem - Approval Page + Approval Email + Cancel Email
currently using standard template](https://scribbled.space/redeem-approval-page-approval-email-cancel-emailcurrently-using-standard-template/): Membership Approved Page Membership Approved Email Membership Ending Email - [Redeem Coupon
Page redeemer inputs coupon code + signs up](https://scribbled.space/redeem-coupon/): https://join.huntformen.com/track/MTA0NjQ0LjMxLjguMTM4LjAuMC4wLjAuMA/joinTEST COUPON: HUNTFRIENDGIFT STEP 1: Setup a Username / PW for your gift account STEP 2: Enter your gift code (STEP 3 – gift join option pops up (above promo fields)– they select option– then hit start watching) - [HUNTFORMEN
Nats Pages](https://scribbled.space/huntformen-nats-pages/): This content is password-protected. To view it, please enter the password below. Password: - [BuyForFriend Pick Gift – Signup Page](https://scribbled.space/join-pagenonmember-sign-up-pick-gift-page/): http://join.huntformen.com/track/MTA0NjQ0LjMxLjguMTM5LjAuMC4wLjAuMA/join [aesop_image force_fullwidth=”off” lightbox=”off” captionposition=”left” captionsrc=”custom” align=”center” imgheight=”20%” imgwidth=”25″ img=”https://scribbled.space/wp-content/uploads/2022/01/info_icon.png&#8221; panorama=”off”] (Buy for friend sales copy) Part 1: Pick a Gift Membership: select a gift for a friend Fill in YOUR information for YOUR free day on NakedSword.com (see YOUR 1 DAY BONUS specific steps below) (Buy for friend gift options – currently only 1) 1-DAY 49.95 /MONTH For Friend Part 2: Finalize Gift + Get a FREE DAY for YOU (sales copy free 1 day to nakedsword – OUR GIFT TO YOU: just for buying friend a membership select a gift for a friend (above) NOW SET UP YOUR MEMBERSHIP […] - [mail-member-cancelled-html – cancel coming email](https://scribbled.space/mail-member-cancelled-htmlemail-they-are-sent-reminding-about-1-day-membership/):   SUBJECT LINE FOR EMAIL: 1 Day?! Better start watching at HuntForMen.com! JUST A REMINDER – YOU MEMBERSHIP ONLY LASTS FOR 1 DAY! Hello (MemberFirstName),   Be sure to make the most of your membership at HuntForMen.com, and we hope you won’t leave us for good!   With exclusive NakedSword Originals content you won’t find anywhere else, plus two new content updates every day, from studios like Treasure Island, Gayhoopla, Dark Alley, and hundreds of other super hot studios, there’s never been a better time to stick with HuntForMen.com.   To reactivate your membership go to https://huntformen.com and resume watching the hottest gay porn […] - [BuyForFriend NonMember Confirm Email](https://scribbled.space/mail-member-joined-html/): SUBJECT LINE FOR EMAIL: HuntforMen.com – SAVE THIS EMAIL – Gift Code + Your FREE 1 day!   Hello (MemberFirstName), YOUR GIFT MEMBERSHIP – SAVE THIS EMAIL Thank you for getting a GIFT MEMBERSHIP! This is all your friend needs to activate his FREE membership: LINK: https://join.huntformen.com/track/MTA0NjQ0LjMxLjguMTM4LjAuMC4wLjAuMA/join COUPON CODE: GIFTXXXXXX YOUR FREE 1 DAY MEMBERSHIP And as a special thank you for you – below are the details of your 1 day account: Hop on and find something to watch! Your Membership   Username: XXXXXX Password: XXXXXX   Your Billing Data Site Name: HuntForMen.com Biller Name: RocketGate Biller Subscription ID: […] - [BuyForFriend Approval Page](https://scribbled.space/buyforfriend-approval-pagepage-after-rocketgate-transaction-goes-through/):   Hello (MemberFirstName), DETAILS FOR GIFT MEMBERSHIP Grab the code for your friend from the approval email you will receive (this email also confirms YOUR 1 day membership). SAVE the email / or copy the gift code – it is the only copy. All gift memberships must be redeemed within 45 days of purchase.   DETAILS OF YOUR 1 DAY MEMBERSHIP And as a special thank you for you – below are the details of your 1 day account: Hop on and find something to watch!    YOUR MEMBER INFO:  Username: YYYYYYY (auto generated)  Password: ZZZZZZZ (auto generated) S ite […] - [FrontEndEditor Test Page – Base](https://scribbled.space/frontendeditor-test-page-base/): Code Test var myObject = { property1: "something", property2: 5, property3: true }; {{{{{{{{}}}}}}}} [[[[[[[[]]]]]]]] ((((((((((())))))))))) [ ] Copy Code Test – w/EditusIgnore var myObject = { property1: "something", property2: 5, property3: true }; {{{{{{{{}}}}}}}} [[[[[[[[]]]]]]]] ((((((((((())))))))))) [ ] Copy here’s some tping – it’s fun!!! Tabs with Editus Ignore Tabs – NO – Editus Ignore - [Canonlyaddestrasonce](https://scribbled.space/canonlyaddestrasonce/): caption then try to add another image: dfsxg - [Editus – FrontEnd Test](https://scribbled.space/editus-frontend-test/): Code Test – wrap code block with div=”EditusIgnoreSave” (should be hidden/unchanged) var myObject = { property1: "something", property2: 5, property3: true }; {{{{{{{{}}}}}}}} [[[[[[[[]]]]]]]] ((((((((((())))))))))) [ ] Code Test – wrap code block with div=”EditusReadOnly” (shown/changed) var myObject = { property1: "something", property2: 5, property3: true }; {{{{{{{{}}}}}}}} [[[[[[[[]]]]]]]] ((((((((((())))))))))) [ ] Code Test no wrapping var myObject = { property1: "something", property2: 5, property3: true }; {{{{{{{{}}}}}}}} [[[[[[[[]]]]]]]] ((((((((((())))))))))) [ ] Tabs with Editus Ignore Tabs – NO – Editus Ignore - [Aesop-](https://scribbled.space/aesop/): kladsjfl;kadsjf sldkfj - [Ivan-Questions](https://scribbled.space/ivan-questions/): faq / tos / privacy – getting variables into pages I can see the {{siteName}} is being pulled from: updateSiteName.js there was a translation.json file that had a number of variables on it – but that no longer seems to be part of the project – I have a list below with what is missing? I updated:terms-of-service-blueprint.xml, frequently-asked-questions-blueprint.xml, privacy-policy-blueprint.xml – with the calls to the variables so hopefuly the missing vars can be re-added and it will populate: privacy-policy.xml, frequently-asked-questions.xml and terms-of-service.xml. I created a component “ButtonMailtoLink” to handle the mailto: but it is not integrating with the xml – […] - [Httrack](https://scribbled.space/httrack/) - [React Router Dom](https://scribbled.space/react-router-dom/): Install react-router-dom using the following command npm install --save react-router-dom create a new file (MainRouter) in your project directory import { BrowserRouter, Route, Link } from "react-router-dom"; //import the package import SignIn from "../SignIn" //import your signIn page import SignUp from "../SignUp" //import your signUp page function MainRouter(){ return( <BrowserRouter> <div className="container"> <Switch> <Route path="/signIn" component={SignIn} /> <Route path="/signUp" component={SignUP} /> </Switch> </div> </BrowserRouter> ) } export default MainRouter Why you need this react-router-dom package allows you to dynamically navigate the pages in your browser(client side) without refreshing the page,it a nice way to handle navigation in single page application - [Components And Props](https://scribbled.space/components-and-props/): opy https://teamtreehouse.com/library/react-basics-2/introducing-props/components-and-props Components and Props An important detail to remember about props is that they are “read only” (or immutable), which means that a component can only read the props given to it, never change them. The (parent) component higher in the tree owns and controls the property values. For example, if you try to set or change a prop value like this: const Header = (props) => { return ( <header> <h1>{ props.title = 'Fun Board' }</h1> </header> ); } Copy React will throw the error: // Cannot assign to read only property 'title' of object. As stated in […] - [Arrow Functions – Ways To Write](https://scribbled.space/arrow-functions-ways-to-write/): Arrow Function Expression: all means same thing – Example One const Header = () => ( return ( <h1>scoreboard</h1> <span className="stats">Players: 1</span> </header> );} Simplified const Header = () => (<h1>scoreboard</h1><span className="stats">Players: 1</span></header>); Further simplified const Header = () => <h1>scoreboard</h1><span className="stats">Players: 1</span></header> - [React – Comments](https://scribbled.space/react-comments/): Comments In React https://stackoverflow.com/questions/30766441/how-to-use-comments-in-react#comment103855263_30766542 Within the render method comments are allowed, but in order to use them within JSX, you have to wrap them in braces and use multi-line style comments. <div className="dropdown"> {/* whenClicked is a property not an event, per se. */} <Button whenClicked={this.handleClick} className="btn-default" title={this.props.title} subTitleClassName="caret"></Button> <UnorderedList /></div> Copy You can read more about how comments work in JSX here. And something like {/* comment */} creates error. comment must be in a new line. - [React – Post Form Data To Api](https://scribbled.space/react-post-form-data-to-api/): Post form data to api endpoint You need to build your request body using the FormData API. The FormData interface provides a way to easily construct a set of key/value pairs representing form fields and their values, which can then be easily sent using the XMLHttpRequest.send() method. It uses the same format a form would use if the encoding type were set to “multipart/form-data”. const myFile = document.querySelector("input[type=file]").files[0];const data = new FormData(); data.append("myFile", myFile); data.append("otherStuff", "stuff from a text input"); fetch(target, { method: "POST", body: data }); Copy https://stackoverflow.com/questions/49222008/react-how-to-post-form-data-to-an-api-endpoint However i’m stuck trying to take the form data from the component, […] - [Add Parameters To Form Action](https://scribbled.space/add-parameters-to-form-action/): I need to the add a JavaScript variable to a link in action form. Is that possible? JavaScript function: <script> function parameter() { function getUrlVars() { var vars = {}; var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function (m, key, value) { vars[key] = value; }); return vars; } var vpid = getUrlVars()["pid"]; } //var link = "second_02.html" + pid.toString(); </script> Copy And in my form I need to add the variable ‘link’ to a form action, as follows: <form action='second_02.html + ?pid=vpid&' id="sky-form" class="sky-form"> Copy You’ll need to do that programmatically via JavaScript. After this line… var vpid = getUrlVars()["pid"]; Copy Add […] - [React – Cheatsheet](https://scribbled.space/react-cheatsheet/): => The React script allows us to write React components => The ReactDOM script allows us to place our components and work with them in the context of the DOM ReactDOM.render(<Greeting />, document.getElementById('root')); Copy Translating the line of code above to English would sound something like this; Use ReactDOM’s render method to render the Greeting element into the DOM in a container with the id of root. When naming a React component, it is convention to capitalize the first letter. This is important because it enables React to differentiate between the native HTML tags such as div, h1, span etc […] - [React – ES6 – Commonly Used](https://scribbled.space/react-es6-commonly-used/): Commonly used ES6 Features Throughout the rest of this book, a number of ES6 features will be used consistently. If you do not have prior experience with ES6 features, this brief introduction will come in handy. If you’re comfortable with ES6 features, skip this section and head to chapter 2 to get started writing your first component. let and const let and const are two new keywords that were introduced in ES6 for declaring variables. When used to declare variables, they are scoped to the block and not the function; this means they are only available within that block. Variables […] - [Add “_blank”](https://scribbled.space/add-_blank/): /* here are two different ways to do this */ //using jquery: $(document).ready(function(){ $('#link_other a').attr('target', '_blank'); }); // not using jquery window.onload = function(){ var anchors = document.getElementById('link_other').getElementsByTagName('a'); for (var i=0; i<anchors.length; i++){ anchors[i].setAttribute('target', '_blank'); }} // jquery is prettier. :-) Copy You could also add a title tag to notify the user that you are doing this, to warn them, because as has been pointed out, it’s not what users expect: $('#link_other a').attr('target', '_blank').attr('title','This link will open in a new window.'); Copy adding “_blank” to data-href could be done like this: jQuery: JSFiddle 1 $('.table-row').each(function() { var $th = […] - [Uncaught Reference Error](https://scribbled.space/uncaught-reference-error/): app.js "use strict";var tb = { rahmen: { eigenschaften: [ "hochwertig", "verwindungssteif", "vergleichsweise verwindungssteif", "sehr verwindungssteif", "sehr hohe Verwindungssteifigkeit", "hohe Steifigkeit" ] }}; index.html <!DOCTYPE html><html lang="en"><head> ((Some Head-Tags)) <script src="dist/app.js" defer></script> ((Some Head-Tags))</head><body> <div class="container"> <section> <h1>Test</h1> <script> console.log(tb.rahmen.eigenschaften[3]); </script> </section> </div></body></html> Error Message Uncaught ReferenceError: tb is not defined The problem It must be something simple, but after reading many posts I still have no clue. Why is my Javascript-Object still undefined. The reason for the error is that you have defer on your script tag for app.js, so that code isn’t run until after all the HTML […] - [JS To Insert CSS Into Page](https://scribbled.space/js-to-insert-css-into-page/): u can also do this using DOM Level 2 CSS interfaces (MDN): var sheet = window.document.styleSheets[0]; sheet.insertRule(‘strong { color: red; }’, sheet.cssRules.length);  …on all but (naturally) IE8 and prior, which uses its own marginally-different wording: sheet.addRule(‘strong’, ‘color: red;’, -1);  There is a theoretical advantage in this compared to the createElement-set-innerHTML method, in that you don’t have to worry about putting special HTML characters in the innerHTML, but in practice style elements are CDATA in legacy HTML, and ‘<’ and ‘&’ are rarely used in stylesheets anyway.You do need a stylesheet in place before you can started appending to it like […] - [DocReady – Javascript Style](https://scribbled.space/docready-javascript-style/): https://stackoverflow.com/questions/9899372/pure-javascript-equivalent-of-jquerys-ready-how-to-call-a-function-when-t The simplest thing to do in the absence of a framework that does all the cross-browser compatibility for you is to just put a call to your code at the end of the body. This is faster to execute than an onload handler because this waits only for the DOM to be ready, not for all images to load. And, this works in every browser. <!doctype html><html><head></head><body>Your HTML here<script>// self executing function here(function() { // your page initialization code here // the DOM will be available here})();</script></body></html> Copy For modern browsers (anything from IE9 and newer and any version […] - [CSS Functions](https://scribbled.space/css-functions/): https://css-tricks.com/complete-guide-to-css-functions/ Like any other programming language, CSS has functions. They can be inserted where you’d place a value, or in some cases, accompanying another value declaration. Some CSS functions even let you nest other functions within them! More In programming, functions are a named portion of code that performs a specific task. An example of this could be a function written in JavaScript called sayWoof(): function sayWoof() { console.log("Woof!"); } We can use this function later in our code, after we have defined our desired behavior. For this example, any time you type sayWoof() in your website or web app’s JavaScript it will […] - [CSS Line Height](https://scribbled.space/css-line-height/): ALL DEAD: https://seek-oss.github.io/capsize/ https://github.com/seek-oss/capsize NEW KING –  <hr> https://michaeltaranto.github.io/slides-teach-css-to-talk-design/ https://css-tricks.com/how-to-tame-line-height-in-css/ In CSS, line-height is probably one of the most misunderstood, yet commonly-used attributes. As designers and developers, when we think about line-height, we might think about the concept of leading from print design — a term, interestingly enough, that comes from literally putting pieces of lead between lines of type. Leading and line-height, however similar, have some important differences. To understand those differences, we first have to understand a bit more about typography. An overview of typography terms In traditional Western type design, a line of text is comprised of […] - [WP2Static Overview](https://scribbled.space/wp2static-overview/): https://wp2static.com/thanks-for-supporting Thanks for supporting Leon, who maintains this project and keeps it open source! Please find the latest stable installers for WP2Static below: WP2Static core 7.1.7 (MD5: 9935068259fe4d88487efb52fe5e9f6a) WP2Static Zip Deployment Addon 1.0.1 (MD5: 2328f9defa1780d834428eaa0897b20b) WP2Static Netlify Deployment Addon 1.0.1 (MD5: 99a7cff3261ff4dc346e87e4e74fb113) WP2Static S3 Deployment Addon 1.0 (MD5: 2cd94d0c5044dd237d003d0f1e2bb3dc) Currently uploading other add-ons’ latest builds. Contact me if you need a specific one in the meantime and I’ll send it to you. Developing a static site generator for WordPress Webserver setup WP2Static should work on any web server setup, see System Requirements for the least you should consider. I’m developing […] - [Chrome DevTools – OFFICIAL DOCS](https://scribbled.space/chrome-devtools-official-docs/): official dev tools docs - [su_boxes - adding link to header](https://scribbled.space/su_boxes-adding-link-to-header/): https://www.techiedelight.com/dynamically-generate-anchor-tag-javascript/ Dynamically generate an anchor tag with JavaScript/jQuery 1. Using JavaScript In vanilla JavaScript, you can use the document.createElement() method, which programmatically creates the specified HTML element. The following example creates a new anchor tag with desired attributes and appends it to a div element using the Node.appendChild() method. JS document.getElementById('generate').onclick = function() { var a = document.createElement('a'); a.target = '_blank'; a.href = 'https://www.techiedelight.com/'; a.innerText = 'Techie Delight'; var container = document.getElementById('container'); container.appendChild(a); container.appendChild(document.createElement('br')); } HTML <!doctype html> <html lang="en"> <body> <div id="container"></div> <div> <button id="generate">Generate Hyperlink</button> </div> </body> </html> JQuery With jQuery, you can use the .append() method to […] - [SU Ultim – Adding Pagination To SU-POSTS](https://scribbled.space/su-ultim-adding-pagination-to-su-posts/): https://getshortcodes.com/docs/posts/  Template editing Do not edit templates in the plugin folder, since all your changes will be lost after plugin update. To modify a built-in template you should copy it to your theme directory first. For convenience, you can copy the whole templates folder from the plugin folder. You can rename the copied folder, it doesn’t have to be templates. Resulting path to template files should look like so: /wp-content/themes/THEME-NAME/templates/ Now you can edit copied template files. Use the template attribute to change the template used by shortcode. The value of this attribute must be a template file path relative […] - [CORS – Fixing Errors](https://scribbled.space/coors-fixing-errors/): https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS/Errors CORS error messages Firefox’s console displays messages in its console when requests fail due to CORS. Part of the error text is a “reason” message that provides added insight into what went wrong. The reason messages are listed below; click the message to open an article explaining the error in more detail and offering possible solutions. Reason: CORS disabled Reason: CORS request did not succeed Reason: CORS header ‘Origin’ cannot be added Reason: CORS request external redirect not allowed Reason: CORS request not http Reason: CORS header ‘Access-Control-Allow-Origin’ missing Reason: CORS header ‘Access-Control-Allow-Origin’ does not match ‘xyz’ Reason: Credential […] - [API – Overview](https://scribbled.space/api-overview/): Once upon a time… - [Sass Style Guide – CSS Tricks](https://scribbled.space/sass-style-guide-css-tricks/): https://css-tricks.com/sass-style-guide/ Use Your Regular CSS Formatting Rules / Style Guide This post is about Sass-specific stuff, but as a base to this, you should follow a whatever good CSS formatting guidelines you are already following. If you aren’t yet, this roundup of style guides may help you. This includes things like: Be consistant with indentation Be consistant about where spaces before/after colons/braces go One selector per line, One rule per line List related properties together Have a plan for class name naming Don’t use ID’s #hotdrama etc List @extend(s) First .weather { @extend %module; ...} Knowing right off the bat […] - [Styleguides – Major Sites](https://scribbled.space/styleguides-major-sites/): GitHub https://styleguide.github.com/ Google https://google.github.io/styleguide/ SASS https://sass-guidelin.es/ CSS Idiomatic https://github.com/necolas/idiomatic-css CSS Wizardry https://csswizardry.com/2012/04/my-html-css-coding-style/ Smashing Magazine https://www.smashingmagazine.com/2008/05/improving-code-readability-with-css-styleguides/ ThinkUP https://github.com/ginatrapani/ThinkUp/wiki/Code-Style-Guide:-CSS Wordpress https://make.wordpress.org/core/handbook/coding-standards/css/ Jonathan Snook’s Scalable and Modular Architecture for CSS http://smacss.com/ - [Sass – Notes](https://scribbled.space/sass-notes/): Concatenating Selectors Together For concatenating selectors together when nesting, you need to use (&) to specify the parent selector. .class { margin:20px; &:hover { color:yellow; } } p { margin: 2em auto; > a { color: red; } &:before { content: ""; } &:after { content: "* * *"; } } Target elements inside an element You just need to specify the direct child relationship of the top label SASS.loginField { > label { color:red; } & form{ /* note the space */ label{ color:green } } } CSS .loginField > label { color: red; } .loginField form label { […] - [Landing Page - With Comments (test)](https://scribbled.space/landing-page-with-comments-test/): https://scribbled.space/all-scribbled-broken-by-comments/ - [No Comments In Pages](https://scribbled.space/no-comments-in-pages/): if using editus – it screws with it’s ability to hide / ignore parts of the page. Got a response back from editus: Thank you for letting me know. I will look into it further. Here are workaround you can try. Add the following PHP code: (Either using a PHP code injection plugin or adding to your theme’s function.php) remove_filter( ‘the_content’, ‘lasso_wrap_shortcodes’); If that doesn’t work, comment out the following lineadd_filter( ‘the_content’, ‘lasso_wrap_shortcodes’, 9 ); found in editus/public/includes/wrap_shortcodes.php - [XFinity - Port Forwarding - Need app for security settings](https://scribbled.space/xfinity-port-forwarding/): Appp for security settings https://www.portchecktool.com/ Port 25 is blocked – which I guess isn’t a good sign XFI ADVANCED SECURITY What is xFi Advanced Security? xFi Advanced Security gives added peace of mind for your home network by preventing you from inadvertently visiting malicious sites or downloading dangerous files, as well as blocking remote access to smart devices from known dangerous sources. Advanced Security monitors devices real-time and will alert you when devices are behaving in unusual ways that could indicate a network threat. It will also adapt to your home network and get smarter over time to keep up […] - [Port Forward | No-IP setup](https://scribbled.space/port-forward-no-ip-setup/): https://www.noip.com/support/knowledgebase/general-port-forwarding-guide/ How to Port Forward – General Guide to Multiple Router Brands Here’s a great video that explains the basics of port forwarding: https://www.youtube.com/watch?v=CLunOJZqmc0 If you have a router at home or your office, you will need to forward ports in order for outside traffic to get into your network. Think of your router as being a huge electric fence or wall, with a few doors or openings. This electric fence or wall serves as your barrier and security blanket from the scary outside Internet world. Your router comes preconfigured with a few of those doors (or ports) open to […] - [NAS - Access control - Share Folder Settings](https://scribbled.space/nas-access-control-share-folder-settings/): https://www.asustor.com/en-gb/online/College_topic?topic=110 COURSE OBJECTIVES Upon completion of this course you should be able to: \1. Create and manage users, groups, shared folders and privileges on an ASUSTOR NAS \2. How to set up and use Access Control PREREQUISITES *Course Prerequisites:* None *Students are expected to have a working knowledge of:* None OUTLINE 1. Introducing Access Control 1.1 What is Access Control? 1.2 What are the differences between admin rights and user rights? 2. How to set up Access Control? 2.1 Local Users 2.2 Local Groups 2.3 AD /LDAP 2.4 Shared Folders 2.5 App Privileges 1. Introducing Access Control 1.1 What is […] - [https on NAS](https://scribbled.space/https-on-nas/): https://www.asustor.com/online/College_topic?topic=324 COURSE OBJECTIVES Upon completion of this course you should be able to: \1. Install a certificate to your ASUSTOR NAS. \2. Use HTTPS to ensure communication security between your NAS and client devices. PREREQUISITES *Course Prerequisites:* None *Students are expected to have a working knowledge of:* N/A OUTLINE 1. Introduction 2. Enabling HTTPS 2.1 Enabling HTTPS for the ADM management interface 2.2 Enabling HTTPS for the Web server 3. Adding a Signed Certificate 3.1 Manually importing a certificate 3.2 Getting a certificate from Let's Encrypt 1. Introduction HTTPS (also called HTTP over TLS, HTTP over SSL, and HTTP Secure) […] - [Networking Austor Nas](https://scribbled.space/networking-austor-nas/) - [AWS – Iam | Billing & Cost Management *](https://scribbled.space/aws-iam-billing-cost-management/): https://docs.aws.amazon.com/awsaccountbilling/latest/aboutv2/billing-permissions-ref.html#managed-policies Allows full access to AWS Budgets including budgets actions Managed policy name: AWSBudgetsActionsWithAWSResourceControlAccess Using identity-based policies (IAM policies) for Billing and Cost Management This topic provides examples of identity-based policies that demonstrate how an account administrator can attach permissions policies to IAM identities (users, groups, and roles) and thereby grant permissions to perform operations on Billing and Cost Management resources. For a full discussion of AWS accounts and IAM users, see What Is IAM? in the IAM User Guide. For information on how you can update customer managed policies, see Editing customer managed policies (console) in the IAM User […] - [Javascript – Numbers](https://scribbled.space/javascript-numbers/): 9e-6 Scientific notation uses the letter ‘e’ to represent an exponential value. This number is the same as 9 times 10 to the negative 6 power: 9 * 10^-6 or 0.000009 ++++++++ Numbers in JavaScript are as straightforward as they sound; you don’t need any special syntax for numbers, you write them straight into JavaScript. In JavaScript, numbers can be whole numbers (called integers). For example: 50-1009999 Or numbers with decimal points to represent fractions of a whole number like: 3.14-9.88888.0000009 Numbers like these with decimal points are also called “floating point numbers.” JavaScript even lets you use scientific notation to […] - [ACE Editor - Setup / Usage](https://scribbled.space/ace-editor-setup-usage/): Create syntax highlighter: https://ace.c9.io/#nav=higlighter themes: https://github.com/ajaxorg/ace/tree/master/lib/ace/theme Embedding Ace in Your Site https://ace.c9.io/#nav=embedding Ace can be easily embedded into a web page. Get prebuilt version of ace from ace-builds repository and use the code below: <!DOCTYPE html> <html lang="en"> <head> <title>ACE in Action</title> <style type="text/css" media="screen"> #editor { position: absolute; top: 0; right: 0; bottom: 0; left: 0; } </style> </head> <body> <div id="editor">function foo(items) { var x = "All this is syntax highlighted"; return x; }</div> <script src="/ace-builds/src-noconflict/ace.js" type="text/javascript" charset="utf-8"></script> <script> var editor = ace.edit("editor"); editor.setTheme("ace/theme/monokai"); editor.session.setMode("ace/mode/javascript"); </script> </body> </html> Now check out the How-To Guide for instructions on common […] - [MAC – Python (Keeping Up To Date)](https://scribbled.space/mac-python-keeping-up-to-date/): PYTHON (do a time machine backup first) The default Python on OS X shouldn’t be messed with as it’s used by the OS itself. If your default is 2.6.1 then you must have Snow Leopard. If you just install from the standard 3.1 disk image then you can invoke it using python3.1 from the terminal (you don’t have to do any extra steps for this to work) and you can leave the plain python as 2.6.1. ❯ python –version (shows mac default)Python 2.7.16 python3 –version (shows python 3 installed version)Python 3.8.2 If you don’t then go ahead and install it […] - [Simple-Useful-Function-Adds](https://scribbled.space/simple-useful-function-adds/): https://www.dreamhost.com/wordpress/guide-to-wp-functions/ Your Guide to the WordPress Functions.php File In this article, we’ll take an in-depth look at the WordPress functions file. We’ll discuss how it works and where you can find it. Finally, we’ll show you some interesting tweaks you can make to your functions.php file. To get involved in WordPress development, you first need to understand how the platform’s most important files work. WordPress makes it pretty easy to begin tinkering with your site. However, it can be difficult to know where to start — or predict what your changes will actually do. A perfect place to learn is […] - [Dev-Setup – Multiple Languages](https://scribbled.space/dev-setup-multiple-languages/): https://www.stuartellis.name/articles/mac-setup/ How to Set up an Apple Mac for Software Development December 23, 2020 devops, programming PAGE CONTENT Do This First!Configuring a User AccountConfiguring The TrackpadCreating a Private Applications FolderSecuring the Safari BrowserConfiguring SecurityBasic SettingsDisable SpotlightEnable File Vault NOWSet a Firmware PasswordSetting Up Time Machine BackupsSetting Up for DevelopmentGetting XcodeSetting Up HomebrewEnabling Auto Completion of CommandsInstalling the Git Version Control SystemText EditorsVisual Studio CodeNeovimSetting The EDITOR Environment VariableSetting Up A Directory Structure for ProjectsCreating SSH KeysProgramming LanguagesJavaScript Development: Node.jsGo DevelopmentSetting a GOPATHJava Development: AdoptOpenJDKPython Development: pipenvRust Development: rustupRuby Development: RVMKubernetes: MinikubeSQL DatabasesInstalling PostgreSQLInstalling MariaDB or MySQLDatabase Management ToolsOnline Resources A […] - [Javascript – How To Code](https://scribbled.space/javascript-how-to-code/): https://www.digitalocean.com/community/tutorial_series/how-to-code-in-javascript How To Code in JavaScript by Lisa Tagliaferri and Tania Rascia JavaScript is a high-level, object-based, dynamic scripting language popular as a tool for making webpages interactive. How To Use the JavaScript Developer Console June 27, 2017 This tutorial will go over how to work with the Console in JavaScript within the context of a browser, and provide an overview of other built-in development tools you may use as part of your web development process. How To Add JavaScript to HTML February 4, 2021 This tutorial will go over how to incorporate JavaScript into your web files, both inline […] - [June-8-Notes](https://scribbled.space/june-8-notes/): An extra comma. That was the entire issue. UGH! - [GGL - All Quickstarts | How To's](https://scribbled.space/ggl-all-quickstarts-how-tos/): QUICKSTARTS: https://cloud.google.com/resource-manager/docs/quickstarts Javascript QuickStart: https://developers.google.com/calendar/quickstart/js CREATE PROJECT ENABLE API: https://developers.google.com/workspace/guides/create-project CREATE CREDENTIALS: https://developers.google.com/workspace/guides/create-credentials GITHUB: https://github.com/google/google-api-javascript-client ADDITIONAL INFO::: CREATE AN ACCOUNT WITH DOMAIN WIDE CREDENTIALS: https://developers.google.com/workspace/guides/create-credentials#createsvc GGL Calendar   In this document, continue with the documentation that corresponds to your app type: Create Web application credentials (client-side JavaScript). Use to this section for the JavaScript quickstart. Create Web application credentials (web server app). Create Desktop application credentials. Use this section for non-JavaScript quickstarts. Create Chrome app credentials. Create Android application credentials. Create iOS application credentials. Create TVs and limited input device credentials. Create Universal Windows Platform (UWP) credentials.     Create Web application […] - [Setting Up Google API Project (notes)](https://scribbled.space/setting-up-google-api-project-notes/): Once upon a time… - [Open Coding Post](https://scribbled.space/open-coding-post/): Open Coding Post – - [Open Notes Post](https://scribbled.space/open-notes-post/): Start off text – - [javascript notes - backup](https://scribbled.space/javascript-notes-backup/): list of declared keywords. GOOD BASIC STEPS TO REMEMBER // 1. Declare variables and capture input. const adjective = prompt("Give me a compliment"); console.log( adjective ); // 2. Combine the input with other words to create a story. const compliment = `<p>You are so right I am: ${adjective} just the so ...</p>`; console.log( compliment ); // 3. Display the story as a <p> inside the <main> element. let wordvomit = compliment + "LIES LIES LIES!!!"; let spreadwordvomit = wordvomit; console.log( spreadwordvomit ); document.querySelector('main').innerHTML = spreadwordvomit ; TO STRING LITERAL const flavor = "Blueberry"; const type = "Smoothie"; const price = […] - [Purus Quam](https://scribbled.space/purus-quam/): Ok editus are you going to fuck this all up? Why did the title disappear –  I guess – show ignore items fixed that.  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ut neque at mauris tristique ultrices. Sed ut augue convallis, pharetra nisl in, pulvinar augue. Curabitur purus quam, gravida eleifend bibendum vel, ultricies eget nibh. Morbi finibus dui arcu, a congue dui tempus vulputate. Cras metus dolor, bibendum quis diam a, fringilla accumsan nulla. Morbi faucibus, metus a maximus ornare, nunc sapien consectetur augue, vitae euismod erat dui a tellus. Orci varius natoque penatibus et magnis dis […] - [Lorum Ipsum](https://scribbled.space/lorum-ipsum/): code stuff from editusLorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ut neque at mauris tristique ultrices. Sed ut augue convallis, pharetra nisl in, pulvinar augue. Curabitur purus quam, gravida eleifend bibendum vel, ultricies eget nibh. Morbi finibus dui arcu, a congue dui tempus vulputate. Cras metus dolor, bibendum quis diam a, fringilla accumsan nulla. Morbi faucibus, metus a maximus ornare, nunc sapien consectetur augue, vitae euismod erat dui a tellus. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Sed quis neque commodo, condimentum massa eget, dictum ex. Maecenas iaculis, justo eget facilisis faucibus, nisi […] - [Javascript Notes - One](https://scribbled.space/javascript-notes-one/): List of declared keywords. Good basic steps to remember // 1. Declare variables and capture input. const adjective = prompt("Give me a compliment"); console.log( adjective ); // 2. Combine the input with other words to create a story. const compliment = `<p>You are so right I am: ${adjective} just the so ...</p>`; console.log( compliment ); // 3. Display the story as a <p> inside the <main> element. let wordvomit = compliment + "LIES LIES LIES!!!"; let spreadwordvomit = wordvomit; console.log( spreadwordvomit ); document.querySelector('main').innerHTML = spreadwordvomit ; to string literal const flavor = "Blueberry"; const type = "Smoothie"; const price = […] ## Pages - [all scribbled](https://scribbled.space/all-scribbled-2/) - [all scribbled - broken by comments](https://scribbled.space/all-scribbled-broken-by-comments/): Added the filter from editus – test to see if comments can work remove_filter( 'the_content', 'lasso_wrap_shortcodes'); - [blank page](https://scribbled.space/blank-page/) - [all scribbled](https://scribbled.space/) - [login to scribbled](https://scribbled.space/login-to-scribbled/): [wpforms id=”553″ title=”false” description=”false”] - [Privacy Policy](https://scribbled.space/privacy-policy/): Who we are Suggested text: Our website address is: https://scribbled-space.shawneee.com. Comments Suggested text: When visitors leave comments on the site we collect the data shown in the comments form, and also the visitor’s IP address and browser user agent string to help spam detection. An anonymized string created from your email address (also called a hash) may be provided to the Gravatar service to see if you are using it. The Gravatar service privacy policy is available here: https://automattic.com/privacy/. After approval of your comment, your profile picture is visible to the public in the context of your comment. Media Suggested […] - [posts](https://scribbled.space/posts/) - [landing](https://scribbled.space/landing/) [comment]: # (Generated by Hostinger Tools Plugin)