rebrand to campfire!
							
								
								
									
										24
									
								
								README.md
									
										
									
									
									
								
							
							
						
						|  | @ -1,17 +1,14 @@ | ||||||
| # space social | # Campfire | ||||||
| 
 | 
 | ||||||
| social media for the galaxy-wide-web! 🌌 | social media for the galaxy-wide-web! 🌌 | ||||||
| 
 | 
 | ||||||
| this is a neat experiment in building as much of a fediverse-compatible | this is a *very experimental* frontend for browsing the fediverse, built | ||||||
| software stack as i can (at least before the crippling weight of the full | from the ground up in svelte! | ||||||
| activitypub spec finally cripples me) |  | ||||||
| 
 |  | ||||||
| starting, of course, with a nice frontend! ✨ |  | ||||||
| 
 | 
 | ||||||
| should you choose to play around with this yourself, just know that *many | should you choose to play around with this yourself, just know that *many | ||||||
| things are bound not to work!* notably, this has only been tested on iceshrimp | things are bound not to work!* notably, campfire is currently only being | ||||||
| and mastodon API-compliant instances. anything beyond this will likely be | battle-tested on mastodon API-compliant instances. anything beyond this | ||||||
| incompatible, and the web console will get very upset. | will likely be incompatible, and the web console will get very upset. | ||||||
| 
 | 
 | ||||||
| ## features | ## features | ||||||
| 
 | 
 | ||||||
|  | @ -34,10 +31,17 @@ incompatible, and the web console will get very upset. | ||||||
| - fast account switching | - fast account switching | ||||||
| - post editing/deletion | - post editing/deletion | ||||||
| - push notifications | - push notifications | ||||||
|  | - ...and potentially much more as development continues! | ||||||
| 
 | 
 | ||||||
| ## try it out! | ## try it out! | ||||||
| 
 | 
 | ||||||
| - `git clone` this repo | - `git clone` this repo | ||||||
| - `npm install` the dependencies | - `npm install` the dependencies | ||||||
| - `npm run dev` to spin up the dev environment | - `npm run dev` to spin up the dev environment | ||||||
| - have fun! ✨ | 
 | ||||||
|  | if you wish to run this in production, you need only `npm run build` and | ||||||
|  | place the static files somewhere accessible by a static webhost, such as | ||||||
|  | nginx or apache! **note:** your web server should attempt to reach | ||||||
|  | `/fallback.html` before erroring out. | ||||||
|  | 
 | ||||||
|  | have fun! ✨ | ||||||
|  |  | ||||||
							
								
								
									
										
											BIN
										
									
								
								res/campfire-favicon.afdesign
									 (Stored with Git LFS)
										
									
									
									
										Normal file
									
								
							
							
						
						
							
								
								
									
										
											BIN
										
									
								
								res/campfire-logo.afdesign
									 (Stored with Git LFS)
										
									
									
									
										Normal file
									
								
							
							
						
						
							
								
								
									
										
											BIN
										
									
								
								res/spacesocial-favicon.afdesign
									 (Stored with Git LFS)
										
									
									
									
								
							
							
						
						
							
								
								
									
										
											BIN
										
									
								
								res/spacesocial-logo.afdesign
									 (Stored with Git LFS)
										
									
									
									
								
							
							
						
						
							
								
								
									
										16
									
								
								src/app.html
									
										
									
									
									
								
							
							
						
						|  | @ -5,21 +5,21 @@ | ||||||
|         <link rel="icon" type="image/png" href="/favicon.png"> |         <link rel="icon" type="image/png" href="/favicon.png"> | ||||||
|         <meta name="viewport" content="width=device-width, initial-scale=1"> |         <meta name="viewport" content="width=device-width, initial-scale=1"> | ||||||
| 
 | 
 | ||||||
|         <title>Space Social</title> |         <title>Campfire</title> | ||||||
|         <meta name="description" content="Social media for the galaxy-wide-web!"> |         <meta name="description" content="Social media for the galaxy-wide-web!"> | ||||||
| 
 | 
 | ||||||
|         <meta property="og:url" content="https://spacesocial.arimelody.me"> |         <meta property="og:url" content="https://campfire.bliss.town"> | ||||||
|         <meta property="og:type" content="website"> |         <meta property="og:type" content="website"> | ||||||
|         <meta property="og:title" content="Space Social"> |         <meta property="og:title" content="Campfire"> | ||||||
|         <meta property="og:description" content="Social media for the galaxy-wide-web!"> |         <meta property="og:description" content="Social media for the galaxy-wide-web!"> | ||||||
|         <meta property="og:image" content="https://spacesocial.arimelody.me/favicon.png"> |         <meta property="og:image" content="https://campfire.bliss.town/favicon.png"> | ||||||
| 
 | 
 | ||||||
|         <meta name="twitter:card" content="summary_large_image"> |         <meta name="twitter:card" content="summary_large_image"> | ||||||
|         <meta property="twitter:domain" content="spacesocial.arimelody.me"> |         <meta property="twitter:domain" content="campfire.bliss.town"> | ||||||
|         <meta property="twitter:url" content="https://spacesocial.arimelody.me"> |         <meta property="twitter:url" content="https://campfire.bliss.town"> | ||||||
|         <meta name="twitter:title" content="Space Social"> |         <meta name="twitter:title" content="Campfire"> | ||||||
|         <meta name="twitter:description" content="Social media for the galaxy-wide-web!"> |         <meta name="twitter:description" content="Social media for the galaxy-wide-web!"> | ||||||
|         <meta name="twitter:image" content="https://spacesocial.arimelody.me/favicon.png"> |         <meta name="twitter:image" content="https://campfire.bliss.town/favicon.png"> | ||||||
| 
 | 
 | ||||||
|         %sveltekit.head% |         %sveltekit.head% | ||||||
|     </head> |     </head> | ||||||
|  |  | ||||||
							
								
								
									
										5
									
								
								src/img/CampfireLogo.svelte
									
										
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 14 KiB | 
							
								
								
									
										7
									
								
								src/img/campfire-logo.svg
									
										
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 14 KiB | 
|  | @ -1,29 +0,0 @@ | ||||||
| <?xml version="1.0" encoding="UTF-8" standalone="no"?> |  | ||||||
| <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> |  | ||||||
| <svg width="100%" height="100%" viewBox="0 0 226 89" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"> |  | ||||||
|     <g transform="matrix(0.0592476,0,0,0.0592476,19.3835,-44.4646)"> |  | ||||||
|         <g> |  | ||||||
|             <clipPath id="_clip1"> |  | ||||||
|                 <path d="M3471.16,750.487L3471.16,2249.51L-327.161,2249.51L-327.161,750.487L3471.16,750.487ZM2317.49,1260.74L1795.39,1260.74L1795.39,1763.02L2317.49,1763.02L2317.49,1260.74Z"/> |  | ||||||
|             </clipPath> |  | ||||||
|             <g clip-path="url(#_clip1)"> |  | ||||||
|                 <g transform="matrix(3.12421,0,0,3.12421,13.4825,-77.5092)"> |  | ||||||
|                     <g id="spinner"> |  | ||||||
|                         <path d="M380,380C476.218,283.782 659.849,234.849 710,285C760.151,335.151 756.844,478.156 634,601C511.156,723.844 358.099,784.099 291,717C249.901,675.901 257.955,619 257.955,619C260.181,637.245 251.818,720.443 352.404,720.443C452.989,720.443 530.426,645.937 610.046,566.318C689.665,486.699 778.651,275.064 635.273,275.064C491.896,275.064 380,380 380,380Z" style="fill:#e2dfe3;"/> |  | ||||||
|                     </g> |  | ||||||
|                 </g> |  | ||||||
|                 <g transform="matrix(44.394,0.545455,-44.394,0.545455,899.136,728.049)"> |  | ||||||
|                     <g id="star-shine" serif:id="star shine"> |  | ||||||
|                         <rect x="383" y="377" width="11" height="11" style="fill:#e2dfe3;"/> |  | ||||||
|                     </g> |  | ||||||
|                 </g> |  | ||||||
|                 <g id="star" transform="matrix(1.45161,0,0,1.45161,531.871,522.581)"> |  | ||||||
|                     <path d="M436.5,384L449.059,417.941L483,430.5L449.059,443.059L436.5,477L423.941,443.059L390,430.5L423.941,417.941L436.5,384Z" style="fill:#e2dfe3;"/> |  | ||||||
|                 </g> |  | ||||||
|             </g> |  | ||||||
|         </g> |  | ||||||
|     </g> |  | ||||||
|     <g transform="matrix(2.67689,0,0,2.67689,-0.655394,55.5404)"> |  | ||||||
|         <text x="0px" y="0px" style="font-family:'Inter-BoldItalic', 'Inter';font-weight:700;font-style:italic;font-size:13.636px;fill:#e2dfe3;">space social</text> |  | ||||||
|     </g> |  | ||||||
| </svg> |  | ||||||
| Before Width: | Height: | Size: 2.2 KiB | 
|  | @ -1,29 +0,0 @@ | ||||||
| <?xml version="1.0" encoding="UTF-8" standalone="no"?> |  | ||||||
| <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> |  | ||||||
| <svg width="100%" height="100%" viewBox="0 0 226 89" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"> |  | ||||||
|     <g transform="matrix(0.0592476,0,0,0.0592476,19.3835,-44.4646)"> |  | ||||||
|         <g> |  | ||||||
|             <clipPath id="_clip1"> |  | ||||||
|                 <path d="M3471.16,750.487L3471.16,2249.51L-327.161,2249.51L-327.161,750.487L3471.16,750.487ZM2317.49,1260.74L1795.39,1260.74L1795.39,1763.02L2317.49,1763.02L2317.49,1260.74Z"/> |  | ||||||
|             </clipPath> |  | ||||||
|             <g clip-path="url(#_clip1)"> |  | ||||||
|                 <g transform="matrix(3.12421,0,0,3.12421,13.4825,-77.5092)"> |  | ||||||
|                     <g id="spinner"> |  | ||||||
|                         <path d="M380,380C476.218,283.782 659.849,234.849 710,285C760.151,335.151 756.844,478.156 634,601C511.156,723.844 358.099,784.099 291,717C249.901,675.901 257.955,619 257.955,619C260.181,637.245 251.818,720.443 352.404,720.443C452.989,720.443 530.426,645.937 610.046,566.318C689.665,486.699 778.651,275.064 635.273,275.064C491.896,275.064 380,380 380,380Z" style="fill:#322e1f;"/> |  | ||||||
|                     </g> |  | ||||||
|                 </g> |  | ||||||
|                 <g transform="matrix(44.394,0.545455,-44.394,0.545455,899.136,728.049)"> |  | ||||||
|                     <g id="star-shine" serif:id="star shine"> |  | ||||||
|                         <rect x="383" y="377" width="11" height="11" style="fill:#322e1f;"/> |  | ||||||
|                     </g> |  | ||||||
|                 </g> |  | ||||||
|                 <g id="star" transform="matrix(1.45161,0,0,1.45161,531.871,522.581)"> |  | ||||||
|                     <path d="M436.5,384L449.059,417.941L483,430.5L449.059,443.059L436.5,477L423.941,443.059L390,430.5L423.941,417.941L436.5,384Z" style="fill:#322e1f;"/> |  | ||||||
|                 </g> |  | ||||||
|             </g> |  | ||||||
|         </g> |  | ||||||
|     </g> |  | ||||||
|     <g transform="matrix(2.67689,0,0,2.67689,-0.655394,55.5404)"> |  | ||||||
|         <text x="0px" y="0px" style="font-family:'Inter-BoldItalic', 'Inter';font-weight:700;font-style:italic;font-size:13.636px;fill:#322e1f;">space social</text> |  | ||||||
|     </g> |  | ||||||
| </svg> |  | ||||||
| Before Width: | Height: | Size: 2.2 KiB | 
|  | @ -58,7 +58,7 @@ a:hover { | ||||||
|     text-decoration: underline; |     text-decoration: underline; | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| #spacesocial-app { | #app { | ||||||
|     margin: auto 0; |     margin: auto 0; | ||||||
|     padding: 0 16px; |     padding: 0 16px; | ||||||
|     display: flex; |     display: flex; | ||||||
|  |  | ||||||
|  | @ -7,10 +7,10 @@ import { get } from 'svelte/store'; | ||||||
| 
 | 
 | ||||||
| export async function createApp(host) { | export async function createApp(host) { | ||||||
|     let form = new FormData(); |     let form = new FormData(); | ||||||
|     form.append("client_name", "space social"); |     form.append("client_name", "Campfire"); | ||||||
|     form.append("redirect_uris", `${location.origin}/callback`); |     form.append("redirect_uris", `${location.origin}/callback`); | ||||||
|     form.append("scopes", "read write push"); |     form.append("scopes", "read write push"); | ||||||
|     form.append("website", "https://spacesocial.arimelody.me"); |     form.append("website", "https://campfire.bliss.town"); | ||||||
| 
 | 
 | ||||||
|     const res = await fetch(`https://${host}/api/v1/apps`, { |     const res = await fetch(`https://${host}/api/v1/apps`, { | ||||||
|         method: "POST", |         method: "POST", | ||||||
|  |  | ||||||
|  | @ -4,7 +4,7 @@ import { get, writable } from 'svelte/store'; | ||||||
| 
 | 
 | ||||||
| let client = writable(false); | let client = writable(false); | ||||||
| 
 | 
 | ||||||
| const save_name = "spacesocial"; | const save_name = "campfire"; | ||||||
| 
 | 
 | ||||||
| export class Client { | export class Client { | ||||||
|     instance; |     instance; | ||||||
|  |  | ||||||
|  | @ -1,6 +1,5 @@ | ||||||
| <script> | <script> | ||||||
|     import LogoLight from '$lib/../img/spacesocial-logo-light.svg'; |     import Logo from '$lib/../img/CampfireLogo.svelte'; | ||||||
|     import LogoDark from '$lib/../img/spacesocial-logo-dark.svg'; |  | ||||||
|     import Button from './Button.svelte'; |     import Button from './Button.svelte'; | ||||||
|     import Feed from './Feed.svelte'; |     import Feed from './Feed.svelte'; | ||||||
|     import { Client } from '$lib/client/client.js'; |     import { Client } from '$lib/client/client.js'; | ||||||
|  | @ -45,8 +44,7 @@ | ||||||
|         </header> |         </header> | ||||||
|     {:else} |     {:else} | ||||||
|         <header class="instance-header"> |         <header class="instance-header"> | ||||||
|             <img class="app-icon light-only" src={LogoLight} width="320px" aria-label="Space Social"/> |             <Logo /> | ||||||
|             <img class="app-icon dark-only" src={LogoDark} width="320px" aria-label="Space Social"/> |  | ||||||
|         </header> |         </header> | ||||||
|     {/if} |     {/if} | ||||||
| 
 | 
 | ||||||
|  | @ -91,7 +89,7 @@ | ||||||
|     </div> |     </div> | ||||||
|     {/if} |     {/if} | ||||||
|     <span class="version"> |     <span class="version"> | ||||||
|         space social v{VERSION} |         campfire v{VERSION} | ||||||
|         <br> |         <br> | ||||||
|         <ul> |         <ul> | ||||||
|             <li><a href="https://git.arimelody.me/ari/spacesocial-client">source</a></li> |             <li><a href="https://git.arimelody.me/ari/spacesocial-client">source</a></li> | ||||||
|  | @ -129,7 +127,7 @@ | ||||||
|         border-radius: 8px; |         border-radius: 8px; | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     .app-icon { |     :global(.app-logo) { | ||||||
|         max-width: 80%; |         max-width: 80%; | ||||||
|         max-height: 80%; |         max-height: 80%; | ||||||
|         margin: auto; |         margin: auto; | ||||||
|  |  | ||||||
|  | @ -1,12 +1,10 @@ | ||||||
| <script> | <script> | ||||||
|     import '$lib/app.css'; |     import '$lib/app.css'; | ||||||
|     import LogoLight from '$lib/../img/spacesocial-logo-light.svg'; |  | ||||||
|     import LogoDark from '$lib/../img/spacesocial-logo-dark.svg'; |  | ||||||
|     import Navigation from '$lib/ui/Navigation.svelte'; |     import Navigation from '$lib/ui/Navigation.svelte'; | ||||||
|     import Widgets from '$lib/ui/Widgets.svelte'; |     import Widgets from '$lib/ui/Widgets.svelte'; | ||||||
| </script> | </script> | ||||||
| 
 | 
 | ||||||
| <div id="spacesocial-app"> | <div id="app"> | ||||||
| 
 | 
 | ||||||
|     <header> |     <header> | ||||||
|         <Navigation /> |         <Navigation /> | ||||||
|  |  | ||||||
|  | @ -1,6 +1,5 @@ | ||||||
| <script> | <script> | ||||||
|     import LogoLight from '$lib/../img/spacesocial-logo-light.svg'; |     import Logo from '$lib/../img/CampfireLogo.svelte'; | ||||||
|     import LogoDark from '$lib/../img/spacesocial-logo-dark.svg'; |  | ||||||
|     import Feed from '$lib/ui/Feed.svelte'; |     import Feed from '$lib/ui/Feed.svelte'; | ||||||
|     import { Client } from '$lib/client/client.js'; |     import { Client } from '$lib/client/client.js'; | ||||||
|     import User from '$lib/user/user.js'; |     import User from '$lib/user/user.js'; | ||||||
|  | @ -53,8 +52,7 @@ | ||||||
|     <Feed /> |     <Feed /> | ||||||
| {:else} | {:else} | ||||||
|     <form on:submit={log_in} id="login-form"> |     <form on:submit={log_in} id="login-form"> | ||||||
|         <img class="app-icon light-only" src={LogoLight} width="320px" aria-label="Space Social"/> |         <Logo /> | ||||||
|         <img class="app-icon dark-only" src={LogoDark} width="320px" aria-label="Space Social"/> |  | ||||||
|         <p>Welcome, fediverse user!</p> |         <p>Welcome, fediverse user!</p> | ||||||
|         <p>Please enter your instance domain to log in.</p> |         <p>Please enter your instance domain to log in.</p> | ||||||
|         <div class="input-wrapper"> |         <div class="input-wrapper"> | ||||||
|  | @ -73,7 +71,7 @@ | ||||||
|                               If that's all cool with you, welcome aboard! |                               If that's all cool with you, welcome aboard! | ||||||
|         </small></p> |         </small></p> | ||||||
| 
 | 
 | ||||||
|         <p class="form-footer">made with ❤️ by <a href="https://arimelody.me">ari melody</a>, 2024</p> |         <p class="form-footer">made with ❤ by <a href="https://bliss.town">bliss town</a>, 2024</p> | ||||||
|     </form> |     </form> | ||||||
| {/if} | {/if} | ||||||
| 
 | 
 | ||||||
|  | @ -214,7 +212,8 @@ | ||||||
|         gap: 8px; |         gap: 8px; | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     .app-icon { |     :global(.app-logo) { | ||||||
|  |         height: auto; | ||||||
|         width: 320px; |         width: 320px; | ||||||
|         margin: 8px; |         margin: 8px; | ||||||
|     } |     } | ||||||
|  |  | ||||||
| Before Width: | Height: | Size: 25 KiB After Width: | Height: | Size: 33 KiB | 
							
								
								
									
										
											BIN
										
									
								
								static/icon/campfire-icon.png
									
										
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 28 KiB |