{"id":94,"date":"2025-11-29T18:04:00","date_gmt":"2025-11-29T18:04:00","guid":{"rendered":"https:\/\/cashflowmindset.cash\/?page_id=94"},"modified":"2025-12-15T17:25:41","modified_gmt":"2025-12-15T17:25:41","slug":"videos","status":"publish","type":"page","link":"https:\/\/cashflowmindset.cash\/?page_id=94","title":{"rendered":"Videos"},"content":{"rendered":"\n\n\n<style>\r\n  :root {\r\n    --yt-text-main: #ffffff;      \/* White title *\/\r\n    --yt-text-sub: #aaaaaa;       \/* Grey date *\/\r\n    --yt-card-bg: #1e1e1e;        \/* Dark card background *\/\r\n    --yt-accent: #ff0000;         \/* YouTube Red *\/\r\n  }\r\n\r\n  \/* Grid Layout *\/\r\n  .yt-pro-grid {\r\n    display: grid;\r\n    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));\r\n    gap: 25px;\r\n    font-family: 'Segoe UI', sans-serif;\r\n    margin-bottom: 30px;\r\n  }\r\n\r\n  \/* Video Card *\/\r\n  .yt-pro-card {\r\n    background-color: var(--yt-card-bg); \r\n    border-radius: 12px;\r\n    overflow: hidden;\r\n    transition: transform 0.3s ease, box-shadow 0.3s ease;\r\n    cursor: pointer;\r\n    border: 1px solid #333; \/* Subtle border for dark mode definition *\/\r\n  }\r\n\r\n  .yt-pro-card:hover {\r\n    transform: translateY(-5px);\r\n    box-shadow: 0 10px 20px rgba(0,0,0,0.5); \/* Deep shadow *\/\r\n    border-color: var(--yt-accent);\r\n  }\r\n\r\n  \/* Thumbnail Container *\/\r\n  .yt-thumb-wrapper {\r\n    position: relative;\r\n    padding-top: 56.25%; \/* 16:9 Aspect Ratio *\/\r\n    overflow: hidden;\r\n  }\r\n\r\n  .yt-pro-img { \r\n    position: absolute;\r\n    top: 0;\r\n    left: 0;\r\n    width: 100%; \r\n    height: 100%; \r\n    object-fit: cover;\r\n    transition: opacity 0.3s;\r\n  }\r\n\r\n  \/* Play Icon Overlay *\/\r\n  .yt-play-icon {\r\n    position: absolute;\r\n    top: 50%;\r\n    left: 50%;\r\n    transform: translate(-50%, -50%);\r\n    width: 50px;\r\n    height: 50px;\r\n    background: rgba(0,0,0,0.7);\r\n    border-radius: 50%;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    opacity: 0;\r\n    transition: opacity 0.3s;\r\n  }\r\n  .yt-play-icon::after {\r\n    content: '&#x25b6;';\r\n    color: white;\r\n    font-size: 20px;\r\n    margin-left: 3px; \r\n  }\r\n  .yt-pro-card:hover .yt-play-icon { opacity: 1; }\r\n\r\n  \/* Text Content *\/\r\n  .yt-pro-info { padding: 15px; }\r\n  \r\n  .yt-pro-title { \r\n    color: var(--yt-text-main);\r\n    font-weight: 600; \r\n    font-size: 16px; \r\n    line-height: 1.4;\r\n    margin-bottom: 8px;\r\n    display: -webkit-box;\r\n    -webkit-line-clamp: 2; \/* Limit to 2 lines *\/\r\n    -webkit-box-orient: vertical;\r\n    overflow: hidden;\r\n  }\r\n\r\n  .yt-pro-date {\r\n    color: var(--yt-text-sub);\r\n    font-size: 13px;\r\n  }\r\n\r\n  \/* Load More Button *\/\r\n  #yt-load-more {\r\n    display: block;\r\n    margin: 0 auto;\r\n    padding: 12px 30px;\r\n    background: transparent;\r\n    color: var(--yt-text-main);\r\n    border: 2px solid var(--yt-text-main);\r\n    border-radius: 50px;\r\n    cursor: pointer;\r\n    font-weight: bold;\r\n    transition: all 0.3s;\r\n  }\r\n  #yt-load-more:hover {\r\n    background: var(--yt-text-main);\r\n    color: #000;\r\n  }\r\n  #yt-load-more.hidden { display: none; }\r\n\r\n  \/* Lightbox \/ Modal Styling *\/\r\n  .yt-modal {\r\n    display: none; \r\n    position: fixed; \r\n    z-index: 9999; \r\n    left: 0; top: 0; \r\n    width: 100%; height: 100%; \r\n    background-color: rgba(0,0,0,0.9);\r\n    align-items: center;\r\n    justify-content: center;\r\n  }\r\n  .yt-modal-content {\r\n    position: relative;\r\n    width: 80%;\r\n    max-width: 900px;\r\n    aspect-ratio: 16\/9;\r\n    background: #000;\r\n    box-shadow: 0 0 20px rgba(255,255,255,0.1);\r\n  }\r\n  .yt-close {\r\n    position: absolute;\r\n    top: -40px;\r\n    right: 0;\r\n    color: #fff;\r\n    font-size: 30px;\r\n    font-weight: bold;\r\n    cursor: pointer;\r\n  }\r\n  .yt-close:hover { color: var(--yt-accent); }\r\n<\/style>\r\n\r\n<div id=\"video-container\" class=\"yt-pro-grid\"><\/div>\r\n<button id=\"yt-load-more\" class=\"hidden\" onclick=\"fetchVideos()\">Load More Videos<\/button>\r\n\r\n<div id=\"yt-modal-window\" class=\"yt-modal\" onclick=\"closeModal()\">\r\n  <div class=\"yt-modal-content\" onclick=\"event.stopPropagation()\">\r\n    <span class=\"yt-close\" onclick=\"closeModal()\">&times;<\/span>\r\n    <iframe loading=\"lazy\" id=\"yt-player-frame\" width=\"100%\" height=\"100%\" src=\"\" frameborder=\"0\" allow=\"autoplay; encrypted-media\" allowfullscreen><\/iframe>\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\n  \/\/ --- CONFIGURATION ---\r\n  const API_KEY = 'AIzaSyCna5NMQkZHrgmAOJUgIIvsNFxrFRhdWJI'; \/\/ <--- Paste Key Here\r\n  const UPLOADS_PLAYLIST_ID = 'UUCeb8w9cOVNytDAGlK8OWLg'; \/\/ Already set for @CashflowMindset-100\r\n  const MAX_RESULTS = 12; \/\/ Videos per batch (try 12, 24, or 50)\r\n  \r\n  \/\/ --- STATE ---\r\n  let nextPageToken = '';\r\n  const container = document.getElementById('video-container');\r\n  const loadMoreBtn = document.getElementById('yt-load-more');\r\n\r\n  \/\/ --- FUNCTION: Fetch Videos ---\r\n  async function fetchVideos() {\r\n    let url = `https:\/\/www.googleapis.com\/youtube\/v3\/playlistItems?part=snippet&playlistId=${UPLOADS_PLAYLIST_ID}&maxResults=${MAX_RESULTS}&key=${API_KEY}`;\r\n    \r\n    if (nextPageToken) {\r\n      url += `&pageToken=${nextPageToken}`;\r\n    }\r\n\r\n    try {\r\n      const response = await fetch(url);\r\n      const data = await response.json();\r\n\r\n      if (data.error) {\r\n        console.error('API Error:', data.error);\r\n        container.innerHTML += `<p style=\"color:red; grid-column: 1\/-1;\">Error: ${data.error.message}<\/p>`;\r\n        return;\r\n      }\r\n\r\n      \/\/ Handle Pagination Token\r\n      nextPageToken = data.nextPageToken || '';\r\n      if (nextPageToken) {\r\n        loadMoreBtn.classList.remove('hidden');\r\n      } else {\r\n        loadMoreBtn.classList.add('hidden'); \/\/ Hide if no more videos\r\n      }\r\n\r\n      \/\/ Render Items\r\n      data.items.forEach(item => {\r\n        const snippet = item.snippet;\r\n        const videoId = snippet.resourceId.videoId;\r\n        const title = snippet.title;\r\n        \/\/ Get highest quality thumbnail available\r\n        const img = (snippet.thumbnails.maxres || snippet.thumbnails.high || snippet.thumbnails.medium).url;\r\n        const date = new Date(snippet.publishedAt).toLocaleDateString('en-US', {\r\n           year: 'numeric', month: 'short', day: 'numeric'\r\n        });\r\n\r\n        \/\/ Create Card HTML\r\n        const card = document.createElement('div');\r\n        card.className = 'yt-pro-card';\r\n        card.onclick = () => openModal(videoId);\r\n        \r\n        card.innerHTML = `\r\n            <div class=\"yt-thumb-wrapper\">\r\n              <img decoding=\"async\" src=\"${img}\" class=\"yt-pro-img\" loading=\"lazy\" alt=\"${title}\">\r\n              <div class=\"yt-play-icon\"><\/div>\r\n            <\/div>\r\n            <div class=\"yt-pro-info\">\r\n              <div class=\"yt-pro-title\">${title}<\/div>\r\n              <div class=\"yt-pro-date\">${date}<\/div>\r\n            <\/div>\r\n        `;\r\n        container.appendChild(card);\r\n      });\r\n\r\n    } catch (err) {\r\n      console.error(err);\r\n    }\r\n  }\r\n\r\n  \/\/ --- FUNCTION: Lightbox Control ---\r\n  const modal = document.getElementById('yt-modal-window');\r\n  const player = document.getElementById('yt-player-frame');\r\n\r\n  function openModal(videoId) {\r\n    player.src = `https:\/\/www.youtube.com\/embed\/${videoId}?autoplay=1&rel=0`;\r\n    modal.style.display = \"flex\";\r\n  }\r\n\r\n  function closeModal() {\r\n    modal.style.display = \"none\";\r\n    player.src = \"\"; \/\/ Stop video playback\r\n  }\r\n\r\n  \/\/ Initial Load\r\n  fetchVideos();\r\n<\/script>\n\n\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"pagelayer_contact_templates":[],"_pagelayer_content":"","pmpro_default_level":"","footnotes":""},"class_list":["post-94","page","type-page","status-publish","hentry","pmpro-has-access"],"_links":{"self":[{"href":"https:\/\/cashflowmindset.cash\/index.php?rest_route=\/wp\/v2\/pages\/94","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cashflowmindset.cash\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/cashflowmindset.cash\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/cashflowmindset.cash\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/cashflowmindset.cash\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=94"}],"version-history":[{"count":5,"href":"https:\/\/cashflowmindset.cash\/index.php?rest_route=\/wp\/v2\/pages\/94\/revisions"}],"predecessor-version":[{"id":211,"href":"https:\/\/cashflowmindset.cash\/index.php?rest_route=\/wp\/v2\/pages\/94\/revisions\/211"}],"wp:attachment":[{"href":"https:\/\/cashflowmindset.cash\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=94"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}