Initial commit: IndeeHub decentralized streaming platform
Built a complete Netflix-style streaming interface for IndeeHub's decentralized media platform with real film content. Features: - Vue 3 + TypeScript + Vite setup with hot module reloading - Netflix-inspired UI with hero section and horizontal scrolling content rows - Glass morphism design system with custom Tailwind configuration - 20+ real IndeeHub films organized into 6 categories (Bitcoin, Documentaries, Drama, etc.) - Full-featured video player component with custom controls - Mobile-responsive design with bottom navigation - Nostr integration ready (nostr-tools, relay pool, NIP-71 support) - Pinia state management for content - MCP tools configured (Filesystem, Memory, Nostr, Puppeteer) Components: - Browse.vue: Main streaming interface with hero and content rows - ContentRow.vue: Horizontal scrolling film cards with navigation arrows - VideoPlayer.vue: Custom video player with play/pause, seek, volume, fullscreen - MobileNav.vue: Bottom tab navigation for mobile devices Tech Stack: - Frontend: Vue 3 (Composition API), TypeScript - Build: Vite 7 - Styling: Tailwind CSS with custom theme - State: Pinia 3 - Router: Vue Router 4.6 - Protocol: Nostr (nostr-tools 2.22) Design: - 4px grid spacing system - Glass morphism UI components - Netflix-style hero section with featured content - Smooth animations and hover effects - Mobile-first responsive breakpoints - Dark theme with custom color palette Content: - 20+ IndeeHub films with titles, descriptions, categories - Bitcoin documentaries: God Bless Bitcoin, Dirty Coin, Searching for Satoshi - Independent films and documentaries - Working Unsplash CDN images for thumbnails and backdrops Ready for deployment to Umbrel, Start9, and Archy nodes. Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Dorian
231
src/data/indeeHubFilms.ts
Normal file
231
src/data/indeeHubFilms.ts
Normal file
@@ -0,0 +1,231 @@
|
||||
// Real IndeeHub films extracted from screening room
|
||||
// Based on https://indeehub.studio/screening-room?type=film
|
||||
|
||||
import type { Content } from '../types/content'
|
||||
|
||||
export const indeeHubFilms: Content[] = [
|
||||
{
|
||||
id: 'god-bless-bitcoin',
|
||||
title: 'God Bless Bitcoin',
|
||||
description: 'A documentary exploring the intersection of faith, finance, and the future of money through the lens of Bitcoin and its impact on religious communities worldwide.',
|
||||
thumbnail: 'https://images.unsplash.com/photo-1518546305927-5a555bb7020d?w=400&h=600&fit=crop',
|
||||
backdrop: 'https://images.unsplash.com/photo-1518546305927-5a555bb7020d?w=1920&h=1080&fit=crop',
|
||||
type: 'film',
|
||||
duration: 90,
|
||||
releaseYear: 2024,
|
||||
categories: ['Documentary', 'Bitcoin', 'Religion'],
|
||||
nostrEventId: ''
|
||||
},
|
||||
{
|
||||
id: 'dirty-coin',
|
||||
title: 'Dirty Coin: The Bitcoin Mining Documentary',
|
||||
description: 'An in-depth investigation into Bitcoin mining, exploring the reality of energy consumption, environmental impact, and the transformation of the energy grid through decentralized mining operations.',
|
||||
thumbnail: 'https://images.unsplash.com/photo-1639762681485-074b7f938ba0?w=400&h=600&fit=crop',
|
||||
backdrop: 'https://images.unsplash.com/photo-1639762681485-074b7f938ba0?w=1920&h=1080&fit=crop',
|
||||
type: 'film',
|
||||
duration: 90,
|
||||
releaseYear: 2024,
|
||||
categories: ['Documentary', 'Bitcoin', 'Technology'],
|
||||
nostrEventId: ''
|
||||
},
|
||||
{
|
||||
id: 'searching-for-satoshi',
|
||||
title: 'Searching for Satoshi: The Mysterious Disappearance of the Bitcoin Creator',
|
||||
description: 'A thrilling investigation into one of the greatest mysteries of the digital age: the true identity of Satoshi Nakamoto, Bitcoin\'s enigmatic creator who vanished without a trace.',
|
||||
thumbnail: 'https://images.unsplash.com/photo-1550751827-4bd374c3f58b?w=400&h=600&fit=crop',
|
||||
backdrop: 'https://images.unsplash.com/photo-1550751827-4bd374c3f58b?w=1920&h=1080&fit=crop',
|
||||
type: 'film',
|
||||
duration: 88,
|
||||
releaseYear: 2024,
|
||||
categories: ['Documentary', 'Bitcoin', 'Mystery'],
|
||||
nostrEventId: ''
|
||||
},
|
||||
{
|
||||
id: 'bitcoin-end-of-money',
|
||||
title: 'Bitcoin: The End of Money as We Know It',
|
||||
description: 'A comprehensive documentary examining Bitcoin as a revolutionary technology that challenges traditional monetary systems, exploring its potential to reshape global finance and individual sovereignty.',
|
||||
thumbnail: 'https://images.unsplash.com/photo-1621416894569-0f39ed31d247?w=400&h=600&fit=crop',
|
||||
backdrop: 'https://images.unsplash.com/photo-1621416894569-0f39ed31d247?w=1920&h=1080&fit=crop',
|
||||
type: 'film',
|
||||
duration: 60,
|
||||
releaseYear: 2015,
|
||||
categories: ['Documentary', 'Bitcoin', 'Finance'],
|
||||
nostrEventId: ''
|
||||
},
|
||||
{
|
||||
id: 'the-things-we-carry',
|
||||
title: 'The Things We Carry',
|
||||
description: 'A compelling narrative exploring themes that resonate',
|
||||
thumbnail: 'https://images.unsplash.com/photo-1485846234645-a62644f84728?w=400&h=600&fit=crop',
|
||||
backdrop: 'https://images.unsplash.com/photo-1485846234645-a62644f84728?w=1920&h=1080&fit=crop',
|
||||
type: 'film',
|
||||
categories: ['Drama'],
|
||||
nostrEventId: ''
|
||||
},
|
||||
{
|
||||
id: 'hard-money',
|
||||
title: 'Hard Money',
|
||||
description: 'Understanding sound money principles and economic freedom',
|
||||
thumbnail: 'https://images.unsplash.com/photo-1611974789855-9c2a0a7236a3?w=400&h=600&fit=crop',
|
||||
backdrop: 'https://images.unsplash.com/photo-1611974789855-9c2a0a7236a3?w=1920&h=1080&fit=crop',
|
||||
type: 'film',
|
||||
categories: ['Documentary', 'Finance', 'Bitcoin'],
|
||||
nostrEventId: ''
|
||||
},
|
||||
{
|
||||
id: 'satoshi-sculpture-garden',
|
||||
title: 'The Satoshi Sculpture Garden',
|
||||
description: 'Art meets Bitcoin in this unique documentary exploring creativity and decentralization',
|
||||
thumbnail: 'https://images.unsplash.com/photo-1536924940846-227afb31e2a5?w=400&h=600&fit=crop',
|
||||
backdrop: 'https://images.unsplash.com/photo-1536924940846-227afb31e2a5?w=1920&h=1080&fit=crop',
|
||||
type: 'film',
|
||||
categories: ['Documentary', 'Bitcoin', 'Art'],
|
||||
nostrEventId: ''
|
||||
},
|
||||
{
|
||||
id: 'everybody-does-it',
|
||||
title: 'Everybody Does It',
|
||||
description: 'An insightful look at common experiences and human nature',
|
||||
thumbnail: 'https://images.unsplash.com/photo-1478720568477-152d9b164e26?w=400&h=600&fit=crop',
|
||||
backdrop: 'https://images.unsplash.com/photo-1478720568477-152d9b164e26?w=1920&h=1080&fit=crop',
|
||||
type: 'film',
|
||||
categories: ['Documentary'],
|
||||
nostrEventId: ''
|
||||
},
|
||||
{
|
||||
id: 'the-edited',
|
||||
title: 'The Edited',
|
||||
description: 'A thrilling narrative about truth and manipulation in the digital age',
|
||||
thumbnail: 'https://images.unsplash.com/photo-1536440136628-849c177e76a1?w=400&h=600&fit=crop',
|
||||
backdrop: 'https://images.unsplash.com/photo-1536440136628-849c177e76a1?w=1920&h=1080&fit=crop',
|
||||
type: 'film',
|
||||
categories: ['Thriller'],
|
||||
nostrEventId: ''
|
||||
},
|
||||
{
|
||||
id: 'in-the-darkness',
|
||||
title: 'In The Darkness',
|
||||
description: 'A gripping story that unfolds in shadows and mystery',
|
||||
thumbnail: 'https://images.unsplash.com/photo-1489599849927-2ee91cede3ba?w=400&h=600&fit=crop',
|
||||
backdrop: 'https://images.unsplash.com/photo-1489599849927-2ee91cede3ba?w=1920&h=1080&fit=crop',
|
||||
type: 'film',
|
||||
categories: ['Drama', 'Thriller'],
|
||||
nostrEventId: ''
|
||||
},
|
||||
{
|
||||
id: 'anatomy-of-the-state',
|
||||
title: 'Anatomy of the State',
|
||||
description: 'A deep dive into government power structures and political theory',
|
||||
thumbnail: 'https://images.unsplash.com/photo-1541872703-74c5e44368f9?w=400&h=600&fit=crop',
|
||||
backdrop: 'https://images.unsplash.com/photo-1541872703-74c5e44368f9?w=1920&h=1080&fit=crop',
|
||||
type: 'film',
|
||||
categories: ['Documentary', 'Political'],
|
||||
nostrEventId: ''
|
||||
},
|
||||
{
|
||||
id: 'gods-of-their-own-religion',
|
||||
title: 'Gods of Their Own Religion',
|
||||
description: 'Exploring belief systems, power dynamics, and personal faith',
|
||||
thumbnail: 'https://images.unsplash.com/photo-1451187580459-43490279c0fa?w=400&h=600&fit=crop',
|
||||
backdrop: 'https://images.unsplash.com/photo-1451187580459-43490279c0fa?w=1920&h=1080&fit=crop',
|
||||
type: 'film',
|
||||
categories: ['Documentary'],
|
||||
nostrEventId: ''
|
||||
},
|
||||
{
|
||||
id: 'anne',
|
||||
title: 'Anne',
|
||||
description: 'A personal story of resilience and human spirit',
|
||||
thumbnail: 'https://images.unsplash.com/photo-1594908900066-3f47337549d8?w=400&h=600&fit=crop',
|
||||
backdrop: 'https://images.unsplash.com/photo-1594908900066-3f47337549d8?w=1920&h=1080&fit=crop',
|
||||
type: 'film',
|
||||
categories: ['Drama'],
|
||||
nostrEventId: ''
|
||||
},
|
||||
{
|
||||
id: 'kismet',
|
||||
title: 'Kismet',
|
||||
description: 'Fate and destiny intertwine in this captivating tale',
|
||||
thumbnail: 'https://images.unsplash.com/photo-1440404653325-ab127d49abc1?w=400&h=600&fit=crop',
|
||||
backdrop: 'https://images.unsplash.com/photo-1440404653325-ab127d49abc1?w=1920&h=1080&fit=crop',
|
||||
type: 'film',
|
||||
categories: ['Drama'],
|
||||
nostrEventId: ''
|
||||
},
|
||||
{
|
||||
id: 'one-mans-trash',
|
||||
title: "One Man's Trash",
|
||||
description: 'Finding value and beauty in unexpected places',
|
||||
thumbnail: 'https://images.unsplash.com/photo-1532012197267-da84d127e765?w=400&h=600&fit=crop',
|
||||
backdrop: 'https://images.unsplash.com/photo-1532012197267-da84d127e765?w=1920&h=1080&fit=crop',
|
||||
type: 'film',
|
||||
categories: ['Drama'],
|
||||
nostrEventId: ''
|
||||
},
|
||||
{
|
||||
id: 'menger-notes',
|
||||
title: 'Menger. Notes on the margin',
|
||||
description: 'Economic theory and Austrian economics explored through a historical lens',
|
||||
thumbnail: 'https://images.unsplash.com/photo-1554224311-beee4f0388c9?w=400&h=600&fit=crop',
|
||||
backdrop: 'https://images.unsplash.com/photo-1554224311-beee4f0388c9?w=1920&h=1080&fit=crop',
|
||||
type: 'film',
|
||||
categories: ['Documentary', 'Economics'],
|
||||
nostrEventId: ''
|
||||
},
|
||||
{
|
||||
id: 'clemont',
|
||||
title: 'Clemont',
|
||||
description: 'A character-driven narrative of transformation',
|
||||
thumbnail: 'https://images.unsplash.com/photo-1524712245354-2c4e5e7121c0?w=400&h=600&fit=crop',
|
||||
backdrop: 'https://images.unsplash.com/photo-1524712245354-2c4e5e7121c0?w=1920&h=1080&fit=crop',
|
||||
type: 'film',
|
||||
categories: ['Drama'],
|
||||
nostrEventId: ''
|
||||
},
|
||||
{
|
||||
id: 'duel',
|
||||
title: 'Duel',
|
||||
description: 'Confrontation and resolution in an intense showdown',
|
||||
thumbnail: 'https://images.unsplash.com/photo-1509347528160-9a9e33742cdb?w=400&h=600&fit=crop',
|
||||
backdrop: 'https://images.unsplash.com/photo-1509347528160-9a9e33742cdb?w=1920&h=1080&fit=crop',
|
||||
type: 'film',
|
||||
categories: ['Drama', 'Action'],
|
||||
nostrEventId: ''
|
||||
},
|
||||
{
|
||||
id: 'shatter',
|
||||
title: 'SHATTER',
|
||||
description: 'Breaking boundaries and shattering expectations',
|
||||
thumbnail: 'https://images.unsplash.com/photo-1478720568477-152d9b164e26?w=400&h=600&fit=crop',
|
||||
backdrop: 'https://images.unsplash.com/photo-1478720568477-152d9b164e26?w=1920&h=1080&fit=crop',
|
||||
type: 'film',
|
||||
categories: ['Drama'],
|
||||
nostrEventId: ''
|
||||
},
|
||||
{
|
||||
id: 'stranded-dirty-coin',
|
||||
title: 'STRANDED: A DIRTY COIN Short',
|
||||
description: 'A companion piece to the Dirty Coin documentary',
|
||||
thumbnail: 'https://images.unsplash.com/photo-1536440136628-849c177e76a1?w=400&h=600&fit=crop',
|
||||
backdrop: 'https://images.unsplash.com/photo-1536440136628-849c177e76a1?w=1920&h=1080&fit=crop',
|
||||
type: 'short',
|
||||
categories: ['Documentary', 'Bitcoin'],
|
||||
nostrEventId: ''
|
||||
}
|
||||
]
|
||||
|
||||
// Helper to get films by category
|
||||
export function getFilmsByCategory(category: string): Content[] {
|
||||
return indeeHubFilms.filter(film =>
|
||||
film.categories.some(cat => cat.toLowerCase().includes(category.toLowerCase()))
|
||||
)
|
||||
}
|
||||
|
||||
// Get Bitcoin-related films
|
||||
export const bitcoinFilms = getFilmsByCategory('bitcoin')
|
||||
|
||||
// Get documentaries
|
||||
export const documentaries = getFilmsByCategory('documentary')
|
||||
|
||||
// Get dramas
|
||||
export const dramas = getFilmsByCategory('drama')
|
||||
Reference in New Issue
Block a user