mirror of
https://github.com/amark/gun.git
synced 2025-03-30 15:08:33 +00:00
Mark Nadal
GitHub
commit
60d94180e2
193
examples/Main.js
Normal file
193
examples/Main.js
Normal file
@ -0,0 +1,193 @@
|
||||
import { render } from './iris/js/lib/preact.js';
|
||||
import { Router, route } from './iris/js/lib/preact-router.es.js';
|
||||
import { createHashHistory } from './iris/js/lib/history.production.min.js';
|
||||
import { Component } from './iris/js/lib/preact.js';
|
||||
|
||||
import Helpers from './iris/js/Helpers.js';
|
||||
import { html } from './iris/js/Helpers.js';
|
||||
import QRScanner from './iris/js/QRScanner.js';
|
||||
import PeerManager from './iris/js/PeerManager.js';
|
||||
import Session from './iris/js/Session.js';
|
||||
import PublicMessages from './iris/js/PublicMessages.js';
|
||||
import { translate as t } from './iris/js/Translation.js';
|
||||
|
||||
import Settings from './iris/js/components/Settings.js';
|
||||
import LogoutConfirmation from './iris/js/components/LogoutConfirmation.js';
|
||||
import ChatView from './iris/js/components/ChatView.js';
|
||||
import StoreView from './iris/js/components/StoreView.js';
|
||||
import CheckoutView from './iris/js/components/CheckoutView.js';
|
||||
import ProductView from './iris/js/components/ProductView.js';
|
||||
import Login from './iris/js/components/Login.js';
|
||||
import Profile from './iris/js/components/Profile.js';
|
||||
import Header from './iris/js/components/Header.js';
|
||||
import Footer from './iris/js/components/Footer.js';
|
||||
import MessageView from './iris/js/components/MessageView.js';
|
||||
import FollowsView from './iris/js/components/FollowsView.js';
|
||||
import FeedView from './iris/js/components/FeedView.js';
|
||||
import ExplorerView from './iris/js/components/ExplorerView.js';
|
||||
import VideoCall from './iris/js/components/VideoCall.js';
|
||||
import Identicon from './iris/js/components/Identicon.js';
|
||||
import State from './iris/js/State.js';
|
||||
import Icons from './iris/js/Icons.js';
|
||||
|
||||
const userAgent = navigator.userAgent.toLowerCase();
|
||||
const isElectron = (userAgent.indexOf(' electron/') > -1);
|
||||
if (!isElectron && ('serviceWorker' in navigator)) {
|
||||
window.addEventListener('load', function() {
|
||||
navigator.serviceWorker.register('iris/serviceworker.js')
|
||||
.catch(function(err) {
|
||||
// registration failed :(
|
||||
console.log('ServiceWorker registration failed: ', err);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
const peers = [`${window.location.protocol}//${window.location.host}/gun`];
|
||||
State.init({peers});
|
||||
Session.init({autologin: true});
|
||||
PeerManager.init();
|
||||
PublicMessages.init();
|
||||
|
||||
Helpers.checkColorScheme();
|
||||
|
||||
function handleRoute(e) {
|
||||
document.title = 'GUN — the database for freedom fighters';
|
||||
const activeRoute = e.url;
|
||||
if (!activeRoute && window.location.hash) {
|
||||
return route(window.location.hash.replace('#', '')); // bubblegum fix back navigation
|
||||
}
|
||||
const activeProfile = activeRoute.indexOf('/profile') === 0 ? activeRoute.replace('/profile/', '') : null;
|
||||
localState.get('activeRoute').put(activeRoute);
|
||||
QRScanner.cleanupScanner();
|
||||
}
|
||||
|
||||
const APPLICATIONS = [ // TODO: move editable shortcuts to localState gun
|
||||
{url: '/', text: t('home'), icon: Icons.home},
|
||||
{url: '/settings', text: t('settings'), icon: Icons.settings},
|
||||
{url: '/explorer', text: t('explorer'), icon: Icons.folder},
|
||||
{url: '/chat', text: t('messages'), icon: Icons.chat},
|
||||
{url: '/feed', text: t('feed'), icon: Icons.feed},
|
||||
// {url: '/store', text: t('store'), icon: Icons.store}, // restore when it works!
|
||||
{},
|
||||
{url: '../stats.html', text: 'Gun node stats'},
|
||||
{url: '../iris/index.html', text: 'Iris', icon: html`<img src="iris/img/icon128.png" width=24/>`},
|
||||
{url: '../infinite-scroll/index.html', text: 'Infinite scroll'},
|
||||
{url: '../chat/index.html', text: 'Chat'},
|
||||
{url: '../game/space.html', text: 'Space'},
|
||||
{},
|
||||
{url: 'https://gun.eco/docs/', text: 'Gun documentation'},
|
||||
{url: 'https://examples.iris.to/components/', text: 'Iris web components'}
|
||||
];
|
||||
|
||||
const HomeView = () => {
|
||||
return html`
|
||||
<div class="main-view">
|
||||
<div class="centered-container public-messages-view">
|
||||
<h1>Hello, world!</h1>
|
||||
<p>Here you can find sample applications and utilities for <a href="https://github.com/amark/gun">GUN</a>.</p>
|
||||
<p>If you need any help, please feel free to join the GUN community chat: <a href="http://chat.gun.eco">http://chat.gun.eco</a></p>
|
||||
<a href="/explorer" class="msg"><div class="msg-content">
|
||||
<b>Explorer</b>
|
||||
<p>Explore the data saved on the GUN database. Open to the side while using an application and see the data change in real-time.</p>
|
||||
</div></a>
|
||||
<a class="msg" href="game/space.html"><div class="msg-content">
|
||||
<div class="img-container"><img src="iris/img/space-game.jpg"/></div>
|
||||
<b>Space</b>
|
||||
<p>Spaceflight game. Open in 2 or more browser windows.</p>
|
||||
</div></a>
|
||||
<a class="msg" href="/iris/index.html"><div class="msg-content">
|
||||
<div class="img-container"><img src="iris/img/screenshot.png"/></div>
|
||||
<b>Iris</b>
|
||||
<p>Decentralized Twitter/Instagram. Provides modular components that can be reused in other applications (including this one).</p>
|
||||
</div></a>
|
||||
<a native class="msg" href="/chat/index.html"><div class="msg-content">
|
||||
<div class="img-container"><img src="iris/img/gun-chat.jpg"/></div>
|
||||
<b>Chat</b>
|
||||
<p>Shoutbox!</p>
|
||||
</div></a>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
};
|
||||
|
||||
class MenuView extends Component {
|
||||
componentDidMount() {
|
||||
State.local.get('showMenu').on(showMenu => this.setState({showMenu}));
|
||||
}
|
||||
|
||||
render() {
|
||||
const pub = Session.getPubKey();
|
||||
return html`
|
||||
<div class="application-list ${this.state.showMenu ? 'menu-visible-xs' : ''}">
|
||||
<a href="/profile/${pub}">
|
||||
<span class="icon"><${Identicon} str=${pub} width=40/></span>
|
||||
<span class="text" style="font-size: 1.2em;border:0;margin-left: 7px;"><iris-text user="${pub}" path="profile/name" editable="false"/></span>
|
||||
</a>
|
||||
<br/><br/>
|
||||
${APPLICATIONS.map(a => {
|
||||
if (a.url) {
|
||||
return html`
|
||||
<a href=${a.url}>
|
||||
<span class="icon">${a.icon || Icons.circle}</span>
|
||||
<span class="text">${a.text}</span>
|
||||
</a>`;
|
||||
} else {
|
||||
return html`<br/><br/>`;
|
||||
}
|
||||
})}
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
};
|
||||
|
||||
class Main extends Component {
|
||||
constructor() {
|
||||
super();
|
||||
this.showMenu = false;
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
localState.get('loggedIn').on(loggedIn => this.setState({loggedIn}));
|
||||
}
|
||||
|
||||
render() {
|
||||
const content = this.state.loggedIn ? html`
|
||||
<div class="visible-xs-flex" style="border-bottom:var(--sidebar-border-right)">
|
||||
<svg onClick=${() => State.local.get('showMenu').put(this.showMenu = !this.showMenu)} style="padding: 5px;cursor:pointer;" viewBox="0 -53 384 384" width="40px"><path d="m368 154.667969h-352c-8.832031 0-16-7.167969-16-16s7.167969-16 16-16h352c8.832031 0 16 7.167969 16 16s-7.167969 16-16 16zm0 0"/><path d="m368 32h-352c-8.832031 0-16-7.167969-16-16s7.167969-16 16-16h352c8.832031 0 16 7.167969 16 16s-7.167969 16-16 16zm0 0"/><path d="m368 277.332031h-352c-8.832031 0-16-7.167969-16-16s7.167969-16 16-16h352c8.832031 0 16 7.167969 16 16s-7.167969 16-16 16zm0 0"/></svg>
|
||||
</div>
|
||||
<section class="main" style="flex-direction: row;">
|
||||
<${MenuView}/>
|
||||
<div style="flex: 3; display: flex">
|
||||
<${Router} history=${createHashHistory()} onChange=${e => handleRoute(e)}>
|
||||
<${HomeView} path="/"/>
|
||||
<${FeedView} path="/feed"/>
|
||||
<${Login} path="/login"/>
|
||||
<${ChatView} path="/chat/:id?"/>
|
||||
<${MessageView} path="/message/:hash"/>
|
||||
<${Settings} path="/settings" showSwitchAccount=${true}/>
|
||||
<${LogoutConfirmation} path="/logout"/>
|
||||
<${Profile.Profile} path="/profile/:id?"/>
|
||||
<${StoreView} path="/store/:store?"/>
|
||||
<${CheckoutView} path="/checkout/:store"/>
|
||||
<${ProductView} path="/product/:product/:store"/>
|
||||
<${ProductView} path="/product/new" store=Session.getPubKey()/>
|
||||
<${ExplorerView} path="/explorer/:node"/>
|
||||
<${ExplorerView} path="/explorer"/>
|
||||
<${FollowsView} path="/follows/:id"/>
|
||||
<${FollowsView} followers=${true} path="/followers/:id"/>
|
||||
</${Router}>
|
||||
</div>
|
||||
</section>
|
||||
<${VideoCall}/>
|
||||
` : '';
|
||||
return html`
|
||||
<div id="main-content">
|
||||
${content}
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
}
|
||||
|
||||
render(html`<${Main}/>`, document.body);
|
||||
|
||||
$('body').css('opacity', 1); // use opacity because setting focus on display: none elements fails
|
||||
10047
examples/angular/package-lock.json
generated
Normal file
10047
examples/angular/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
59
examples/basic/screen.html
Normal file
59
examples/basic/screen.html
Normal file
@ -0,0 +1,59 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<video id="video" width="100%"></video>
|
||||
<center>
|
||||
<button id="record">Record</button>
|
||||
<button id="play">Play</button>
|
||||
</center>
|
||||
|
||||
<script src="../jquery.js"></script>
|
||||
<script src="../../../gun/gun.js"></script>
|
||||
|
||||
<script>
|
||||
var gun = Gun(location.origin + '/gun');
|
||||
var record = {recorder: null, recording: false};
|
||||
|
||||
$('#record').on('click', ()=>{
|
||||
if(!record.ing){ return record.stream() }
|
||||
$('#record').text("Record");
|
||||
if(record.ing.stop){ record.ing.stop() }
|
||||
record.ing = false;
|
||||
})
|
||||
|
||||
record.stream = function(){
|
||||
navigator.mediaDevices.getDisplayMedia({ video: true }).then(stream => {
|
||||
var chunks = []; // we have a stream, we can record it
|
||||
record.ing = new MediaRecorder(stream);
|
||||
record.ing.ondataavailable = eve => chunks.push(eve.data);
|
||||
record.ing.onstop = eve => record.save(new Blob(chunks));
|
||||
record.ing.start()
|
||||
$('#record').text("End");
|
||||
}, err => { console.log(err) });
|
||||
}
|
||||
|
||||
record.save = function(data){
|
||||
record.file = record.file || new FileReader();
|
||||
record.file.readAsDataURL(data);
|
||||
record.file.onloadend = function(){
|
||||
var b64 = record.file.result;
|
||||
b64 = "data:video/webm" + b64.slice(b64.indexOf(';'));
|
||||
gun.get('test').get('screen').put(b64);
|
||||
}
|
||||
}
|
||||
|
||||
$('#play').on('click', ()=>{
|
||||
if(record.playing){
|
||||
$('#play').text("Play")
|
||||
$('#video').get(0).stop();
|
||||
record.playing = false;
|
||||
return;
|
||||
}
|
||||
$('#play').text("Stop");
|
||||
record.playing = true;
|
||||
gun.get('test').get('screen').once((data)=>{
|
||||
if(!data){ return }
|
||||
$('#video').get(0).src = data;
|
||||
$('#video').get(0).play()
|
||||
})
|
||||
})
|
||||
</script>
|
||||
@ -143,7 +143,7 @@
|
||||
}
|
||||
s.x = d.x + d.vx * dt;
|
||||
s.y = d.y + d.vy * dt;
|
||||
|
||||
|
||||
s.x = s.x % area.x;
|
||||
if(s.x < 0){
|
||||
s.x += area.x;
|
||||
@ -159,7 +159,6 @@
|
||||
}
|
||||
return s;
|
||||
}
|
||||
localStorage.clear();
|
||||
game.sync = function(shoot){
|
||||
var me = game.me;
|
||||
if(!me || me.boom){ return }
|
||||
@ -274,4 +273,4 @@
|
||||
left: -50px;
|
||||
}
|
||||
</style>
|
||||
</html>
|
||||
</html>
|
||||
|
||||
@ -1,28 +1,57 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>gun examples</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- h1>Examples Directory <button style="float: right;" onclick="localStorage.clear()">Clear Local Storage</button></h1 -->
|
||||
<style>
|
||||
html, body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
iframe {
|
||||
width: 100%;
|
||||
height: 50%;
|
||||
border: none;
|
||||
b-order-top: ridge 2em skyblue;
|
||||
border: none;
|
||||
}
|
||||
</style>
|
||||
<a href="/todo/index.html"><iframe src="/todo/index.html" style="height: 100%;"></iframe></a>
|
||||
<!-- a href="/json/index.html"><iframe src="/json/index.html"></iframe></a -->
|
||||
<!-- a href="/chat/index.html"><iframe src="/chat/index.html"></iframe></a --> <!-- removing until DOM bug fixed -->
|
||||
<!-- script src="../gun.js"></script -->
|
||||
</body>
|
||||
|
||||
<head>
|
||||
<title>GUN — the database for freedom fighters</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="description" content="GUN is a distributed, offline-first, realtime graph database engine with built-in encryption.">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<meta property="og:title" content="GUN — the database for freedom fighters">
|
||||
<meta property="og:description" content="GUN is a distributed, offline-first, realtime graph database engine with built-in encryption.">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:image" content="iris/img/gun-og-image.png">
|
||||
|
||||
<meta name="twitter:card" content="summary"></meta>
|
||||
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="./iris/img/apple-touch-icon.png">
|
||||
<link rel="icon" href="iris/img/gun-48x48.png">
|
||||
<link rel="manifest" href="./iris/site.webmanifest">
|
||||
<link rel="mask-icon" href="./iris/img/safari-pinned-tab.svg" color="#74d5f1">
|
||||
<link rel="shortcut icon" href="iris/img/gun-48x48.png">
|
||||
<meta name="msapplication-TileColor" content="#74d5f1">
|
||||
<meta name="msapplication-config" content="./iris/browserconfig.xml">
|
||||
<meta name="theme-color" content="#74d5f1">
|
||||
|
||||
<link rel="stylesheet" type="text/css" href="./iris/css/cropper.min.css">
|
||||
|
||||
<link rel="stylesheet" href="./iris/css/dark.css" media="(prefers-color-scheme: dark)">
|
||||
<link rel="stylesheet" href="./iris/css/light.css" media="(prefers-color-scheme: no-preference), (prefers-color-scheme: light)">
|
||||
<!-- The main stylesheet -->
|
||||
<link rel="stylesheet" type="text/css" href="./iris/css/style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<script src="./iris/js/lib/jquery.js"></script>
|
||||
<script src="./iris/js/lib/cropper.min.js"></script>
|
||||
<script src="./iris/js/lib/pica.min.js"></script>
|
||||
<script src="./iris/js/lib/underscore-min.js"></script>
|
||||
<script src="./iris/js/lib/gun.js"></script>
|
||||
<script src="./iris/js/lib/open.js"></script>
|
||||
<script src="./iris/js/lib/sea.js"></script>
|
||||
<script src="./iris/js/lib/nts.js"></script>
|
||||
<script src="./iris/js/lib/radix.js"></script>
|
||||
<script src="./iris/js/lib/radisk.js"></script>
|
||||
<script src="./iris/js/lib/store.js"></script>
|
||||
<script src="./iris/js/lib/rindexed.js"></script>
|
||||
<script src="./iris/js/lib/iris.js"></script>
|
||||
<script src="./iris/js/lib/emoji-button.js"></script>
|
||||
<script src="./iris/js/lib/Autolinker.min.js"></script>
|
||||
<script src="./iris/js/lib/qrcode.min.js"></script>
|
||||
<script src="./iris/js/lib/qr.zxing.js"></script>
|
||||
<script src="./iris/js/lib/webtorrent.min.js"></script>
|
||||
<script type="module" src="./Main.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
||||
1
examples/iris
Symbolic link
1
examples/iris
Symbolic link
@ -0,0 +1 @@
|
||||
../node_modules/iris-messenger/src
|
||||
11
lib/serve.js
11
lib/serve.js
@ -7,6 +7,9 @@ function CDN(dir){
|
||||
return function(req, res){
|
||||
req.url = (req.url||'').replace(dot,'').replace(slash,'/');
|
||||
if(serve(req, res)){ return } // filters GUN requests!
|
||||
if (req.url.slice(-3) === '.js') {
|
||||
res.writeHead(200, {'Content-Type': 'text/javascript'});
|
||||
}
|
||||
fs.createReadStream(path.join(dir, req.url)).on('error',function(tmp){ // static files!
|
||||
fs.readFile(path.join(dir, 'index.html'), function(err, tmp){
|
||||
try{ res.writeHead(200, {'Content-Type': 'text/html'});
|
||||
@ -16,7 +19,9 @@ function CDN(dir){
|
||||
}
|
||||
|
||||
function serve(req, res, next){ var tmp;
|
||||
if(typeof req === 'string'){ return CDN(req) }
|
||||
if(typeof req === 'string'){
|
||||
return CDN(req);
|
||||
}
|
||||
if(!req || !res){ return false }
|
||||
next = next || serve;
|
||||
if(!req.url){ return next() }
|
||||
@ -43,8 +48,8 @@ function serve(req, res, next){ var tmp;
|
||||
if(tmp = tmp[(((req.url||'').slice(1)).split('/')[0]||'').split('.')[0]]){
|
||||
try{ return tmp(req, res, next) }catch(e){ console.log(req.url+' crashed with '+e) }
|
||||
}
|
||||
}
|
||||
}
|
||||
return next();
|
||||
}
|
||||
|
||||
module.exports = serve;
|
||||
module.exports = serve;
|
||||
|
||||
5
package-lock.json
generated
5
package-lock.json
generated
@ -741,6 +741,11 @@
|
||||
"integrity": "sha1-vd7XARQpCCjAoDnnLvJfWq7ENUo=",
|
||||
"dev": true
|
||||
},
|
||||
"iris-messenger": {
|
||||
"version": "github:irislib/iris-messenger#6245a49326cfabf3084f91a3662af8b5f7a4f07e",
|
||||
"from": "github:irislib/iris-messenger",
|
||||
"dev": true
|
||||
},
|
||||
"is-buffer": {
|
||||
"version": "2.0.4",
|
||||
"resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-2.0.4.tgz",
|
||||
|
||||
@ -60,9 +60,9 @@
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"@peculiar/webcrypto": "^1.1.1",
|
||||
"text-encoding": "^0.7.0",
|
||||
"buffer": "^5.4.3",
|
||||
"emailjs": "^2.2.0",
|
||||
"buffer": "^5.4.3"
|
||||
"text-encoding": "^0.7.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"bufferutil": "^4.0.1",
|
||||
@ -80,6 +80,7 @@
|
||||
"mocha": "^6.2.0",
|
||||
"panic-manager": "^1.2.0",
|
||||
"panic-server": "^1.1.1",
|
||||
"iris-messenger": "github:irislib/iris-messenger",
|
||||
"uglify-js": "^3.6.0"
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user