From 037b1843049fa56b3c223536de4931d27b299ac9 Mon Sep 17 00:00:00 2001 From: Keep Creating Online <53631862+PR0M3TH3AN@users.noreply.github.com> Date: Wed, 8 Jan 2025 19:20:57 -0500 Subject: [PATCH] update --- src/about.html | 163 +++++++++++++++++++++++++++++++++ src/content/about.md | 50 ++++++++++ src/content/getting-started.md | 72 +++++++++++++++ src/css/markdown.css | 111 ++++++++++++++++++++++ src/css/style.css | 32 ++++--- src/getting-started.html | 163 +++++++++++++++++++++++++++++++++ src/index.html | 8 +- to-do_list.md | 21 +++-- 8 files changed, 591 insertions(+), 29 deletions(-) create mode 100644 src/about.html create mode 100644 src/content/about.md create mode 100644 src/content/getting-started.md create mode 100644 src/css/markdown.css create mode 100644 src/getting-started.html diff --git a/src/about.html b/src/about.html new file mode 100644 index 0000000..98c551d --- /dev/null +++ b/src/about.html @@ -0,0 +1,163 @@ + + + + + + bitvid | About + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
+
+ + + BitVid Logo + +
+
+ + +
+ +
+

Loading Content...

+
+
+ + + +
+ + + + + + + + + diff --git a/src/content/about.md b/src/content/about.md new file mode 100644 index 0000000..7424a4a --- /dev/null +++ b/src/content/about.md @@ -0,0 +1,50 @@ +![](https://bitvid.netlify.app/assets/jpg/bitvid.jpg) + +# About bitvid: Decentralized Video Sharing + +Welcome to **bitvid**, a platform where video sharing meets the power of decentralization. **bitvid** is more than just a video-sharing site—it's a groundbreaking way to share, discover, and enjoy content, leveraging the latest in blockchain, peer-to-peer, and privacy-centric technologies. + +--- + +## **How Does It Work?** + +At its core, **bitvid** combines two powerful technologies: + +1. **WebTorrent**: This enables seamless streaming directly from peers using magnet links. Videos aren't hosted on centralized servers but are distributed across a network of peers. This ensures scalability, faster downloads, and freedom from server outages. +2. **Nostr Integration**: **bitvid** uses the Nostr protocol to manage video metadata, user authentication, and secure publishing. This means your account and content are not tied to a single platform or server. Your public key is your identity. + +Together, these technologies create a decentralized and censorship-resistant platform. + +--- + +## **Why is bitvid Different?** + +1. **No Centralized Servers**: Traditional platforms store videos on centralized servers, giving them control over content availability. **bitvid** flips the script by allowing users to host and share videos directly with one another. + +2. **Ownership and Privacy**: + + - With Nostr, you retain full control of your identity and data. No email addresses or passwords are required—your cryptographic key is your gateway. + - Share public videos with the world or private ones encrypted for specific viewers. + +3. **Open and Transparent**: **bitvid** runs on open-source code, ensuring transparency and inviting collaboration from the global community. + +4. **Freedom of Speech**: Decentralization makes censorship nearly impossible. Your content belongs to you and can't be removed by external forces. + +5. **Efficient and Scalable**: **bitvid**'s peer-to-peer streaming ensures that popular content becomes faster to access, not slower. The more people watch, the more efficient the network becomes. + +--- + +## **What Can You Do on **bitvid**?** + +- **Share Videos**: Upload your video using a magnet link and provide additional details like title, thumbnail, and description. +- **Stream Effortlessly**: Play videos directly in your browser without the need for bulky downloads or external players. +- **Support Creators**: Use zaps or donations to directly support your favorite creators, without intermediaries taking a cut. +- **Own Your Experience**: Customize your privacy settings, edit or delete content anytime, and maintain control over your videos. + +--- + +## **Why Choose **bitvid**?** + +**bitvid** represents a shift from traditional, centralized platforms to a decentralized, user-first model. By using blockchain principles and peer-to-peer technology, it offers a free, open, and secure environment for sharing and consuming videos. Whether you're a creator looking for a censorship-resistant platform or a viewer who values privacy and speed, **bitvid** is here for you. + +**Join the revolution. Decentralize your videos.** diff --git a/src/content/getting-started.md b/src/content/getting-started.md new file mode 100644 index 0000000..5a2197b --- /dev/null +++ b/src/content/getting-started.md @@ -0,0 +1,72 @@ +![](https://bitvid.netlify.app/assets/jpg/bitvid.jpg) + +# **Getting Started with bitvid** + +BTC DNS: [bitvid.btc.us](https://bitvid.btc.us) +ETH DNS: [bitvid.eth.limo](https://bitvid.eth.limo) + +**_IPNS: k51qzi5uqu5dgwr4oejq9rk41aoe9zcupenby6iqecsk5byc7rx48uecd133a1_** + +Welcome to **bitvid**, a decentralized platform for video sharing that puts you in control. Using cutting-edge technologies like **Nostr** and **WebTorrent**, bitvid allows creators to share, stream, and manage video content directly through peer-to-peer connections, ensuring privacy, freedom, and ownership. + +## What is bitvid? + +bitvid is a video-sharing platform that decentralizes content delivery: + +1. **Nostr Integration**: User authentication and video metadata are managed using Nostr, a decentralized messaging protocol. Log in with a Nostr-compatible browser extension to add, edit, or remove video posts. +2. **WebTorrent Streaming**: Videos are streamed using magnet links and WebTorrent technology. This allows viewers to fetch and play video content directly from peers in their browser without central servers. + +## How Does It Work? + +#### For Viewers + +- Simply browse the bitvid site to discover available videos. +- Click on a video to stream it directly from other peers using WebTorrent. No additional downloads are required for playback. + +#### For Creators + +1. **Login with Nostr**: Use a Nostr extension like Alby or Nos2x to log in. This step connects your Nostr public key to your bitvid account. +2. **Share Videos**: + - Use the “Share a Video” form to submit a magnet link for your content. + - Add a title, optional thumbnail, and description to make your post more engaging. +3. **Seed Your Content**: + - Download [WebTorrent Desktop](https://webtorrent.io/desktop/). + - Open your video file in WebTorrent Desktop to generate a magnet link and seed it. Seeding ensures your video stays available for others to download and stream. + +## Key Features + +1. **Complete Control Over Content**: + + - You can **edit** or **delete** your posts directly through the bitvid interface. + - Mark videos as private, encrypting their magnet links, so only you can access them. + +2. **Peer-to-Peer Streaming**: + + - Videos are streamed directly between viewers and seeders, avoiding censorship or central points of failure. + +3. **Decentralized Authentication**: + - Nostr ensures secure, decentralized login without traditional user accounts. + +### Requirements for Creators + +- **Nostr Extension**: Install a Nostr extension to log in and manage your content. +- **WebTorrent Desktop**: Use it to seed your video files and generate magnet links. Without seeding, your videos won’t be accessible to others. + +## Why Use bitvid? + +bitvid eliminates the reliance on central servers, giving creators and viewers full control over their content. Whether you’re a content creator, privacy advocate, or decentralization enthusiast, bitvid provides a secure, resilient platform for sharing videos. + +Start today by logging in with your Nostr extension and sharing your first video! For help or feedback, visit our [GitHub](https://github.com/PR0M3TH3AN/bitvid) or connect with us on Nostr. + +--- + +**Disclaimer** +bitvid is a decentralized platform, and as such, we do not moderate or control the content shared by users. All videos and materials are the sole responsibility of their respective creators. We cannot be held liable for any issues arising from the use or sharing of content on this platform. Please use the service responsibly and adhere to applicable laws in your jurisdiction. + +**A Work in Progress** +bitvid is still in its early stages. It currently has many bugs and lacks certain features that could make the platform more user-friendly and secure. Your feedback and contributions are vital to improving the platform. + +**Join Us** +Are you a developer or someone with a technical background? We’d love to have your help! bitvid relies on community support to grow and evolve. Whether it’s improving security, adding new features, or fixing bugs, your input can make a big difference. + +Check out the [GitHub repository](https://github.com/PR0M3TH3AN/bitvid) to get involved. Let’s build a better decentralized video-sharing platform together! diff --git a/src/css/markdown.css b/src/css/markdown.css new file mode 100644 index 0000000..50c9d17 --- /dev/null +++ b/src/css/markdown.css @@ -0,0 +1,111 @@ +/* markdown.css */ + +/* + Give the markdown container a standard text color + that is easy to read on a white background +*/ +#markdown-container { + color: #333; + line-height: 1.6; + /* Padding & border radius come from your inline Tailwind classes */ +} + +/* Headings */ +#markdown-container h1 { + font-size: 1.875rem; /* ~ text-2xl in Tailwind */ + font-weight: 700; + margin-bottom: 1rem; + margin-top: 0.5rem; + color: #111; +} + +#markdown-container h2 { + font-size: 1.5rem; /* ~ text-xl */ + font-weight: 700; + margin-bottom: 0.75rem; + margin-top: 1.25rem; + color: #222; +} + +#markdown-container h3 { + font-size: 1.25rem; /* ~ text-lg */ + font-weight: 600; + margin-bottom: 0.75rem; + margin-top: 1rem; +} + +#markdown-container h4, +#markdown-container h5, +#markdown-container h6 { + font-weight: 600; + margin-top: 0.75rem; + margin-bottom: 0.5rem; +} + +/* Paragraphs */ +#markdown-container p { + margin-bottom: 1rem; +} + +/* Lists */ +#markdown-container ul, +#markdown-container ol { + margin-left: 1.25rem; + margin-bottom: 1rem; +} + +#markdown-container li { + margin-bottom: 0.5rem; +} + +/* Blockquotes */ +#markdown-container blockquote { + border-left: 4px solid #ccc; + padding-left: 1rem; + margin: 1rem 0; + color: #555; +} + +/* Inline code */ +#markdown-container code { + background-color: #f6f8fa; + color: #d63384; + padding: 0.2rem 0.4rem; + border-radius: 0.25rem; + font-family: Menlo, Monaco, "Courier New", monospace; + font-size: 0.875rem; +} + +/* Code blocks */ +#markdown-container pre { + background-color: #f6f8fa; + color: #333; + padding: 1rem; + border-radius: 0.25rem; + overflow-x: auto; + margin-bottom: 1rem; +} + +/* Links */ +#markdown-container a { + color: #bf5af2; /* pick a link color or use var(--color-primary) if you like */ + text-decoration: none; +} + +#markdown-container a:hover { + text-decoration: underline; +} + +/* Horizontal Rule */ +#markdown-container hr { + border: 0; + border-top: 1px solid #e5e7eb; + margin: 2rem 0; +} + +/* Images */ +#markdown-container img { + max-width: 100%; + height: auto; + margin-bottom: 1rem; +} diff --git a/src/css/style.css b/src/css/style.css index fe6b99f..598c381 100644 --- a/src/css/style.css +++ b/src/css/style.css @@ -1,4 +1,3 @@ -```css /* css/style.css */ :root { @@ -26,19 +25,19 @@ header { padding: 1rem 0; display: flex; justify-content: flex-start; - } +} header img { height: 6rem; width: auto; max-width: none; - } - - .container { - max-width: 1480px; - margin: 0 auto; - padding: 1rem; - } +} + +.container { + max-width: 1480px; + margin: 0 auto; + padding: 1rem; +} /* Video Grid */ #videoList { @@ -127,7 +126,8 @@ header img { } /* Forms & Inputs */ -input, textarea { +input, +textarea { width: 100%; padding: 0.75rem; background-color: var(--color-bg); @@ -137,7 +137,8 @@ input, textarea { transition: border-color 0.2s; } -input:focus, textarea:focus { +input:focus, +textarea:focus { outline: none; border-color: var(--color-primary); ring: 2px var(--color-primary); @@ -176,7 +177,8 @@ button:focus { } /* Notifications */ -#errorContainer, #successContainer { +#errorContainer, +#successContainer { border-radius: 0.5rem; padding: 1rem; margin-bottom: 1rem; @@ -197,7 +199,8 @@ button:focus { } /* Modal Display */ -#playerSection, #playerModal { +#playerSection, +#playerModal { display: none; } @@ -211,7 +214,7 @@ button:focus { grid-template-columns: 1fr; gap: 1rem; } - + .container { padding: 0.75rem; } @@ -230,4 +233,3 @@ footer a { footer a:hover { text-decoration: underline; } -``` \ No newline at end of file diff --git a/src/getting-started.html b/src/getting-started.html new file mode 100644 index 0000000..aecd88a --- /dev/null +++ b/src/getting-started.html @@ -0,0 +1,163 @@ + + + + + + bitvid | Getting Started + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
+
+ + + BitVid Logo + +
+
+ + +
+ +
+

Loading Content...

+
+
+ + + +
+ + + + + + + + + diff --git a/src/index.html b/src/index.html index 48b9957..b83214a 100644 --- a/src/index.html +++ b/src/index.html @@ -355,17 +355,17 @@ Blog Getting Started About diff --git a/to-do_list.md b/to-do_list.md index 0554fbc..142dac9 100644 --- a/to-do_list.md +++ b/to-do_list.md @@ -3,14 +3,15 @@ - add "copy magnet" button - fix issue with editing videos failing - fix issue where after you play a video, close the video player and pick that same video again it doesn't open -- add "publish" last step to the video edits process - Fix error after playing video "Video playback error: MEDIA_ELEMENT_ERROR: Empty src attribute" -- add ability to set custom relays setting stored as local cache -- adjust CSS for app.js modals +- fix "dev mode" publishing "live mode" notes. Make posts posted in devmode have a special devmode flag +- add a npub "whitelist" for logging in +- add ability to set custom relays setting stored as local cache +- add "publish" last step to the video edits process - convert "logged in as" from public key to profile image, username and noun as fallback -- add comments to video modal +- add comments to video modal - add "adult content" flag for note submission -- add #tags to the submission spec and form +- add #tags to the submission spec and form - add block/unblock list with import and export features so users can share their lists - add unique URL to each video - add profile modal for each user/profile @@ -18,10 +19,10 @@ - add side bar for more UI flexibility - add customized home screen content via algorithms for better feeds - make logo/brand -- improve UI/UX CSS -- bug test video edits and submissions thoroughly -- add zaps to videos and profiles and comments -- add intro tutorial info to explain how to use the site -- add custom color themes and toggle light and dark mode +- add zaps to videos and profiles and comments +- add intro tutorial info to explain how to use the site +- add custom color themes and toggle light and dark mode - Add multi-language support for content posts and filtration - add setting menu to store local account relay, adult content, theme/color and language settings +- improve UI/UX CSS +- bug test video edits and submissions thoroughly