How to use the @firebase/app.database function in @firebase/app

To help you get started, we’ve selected a few @firebase/app examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github areiterer / hackernews-client / src / api.js View on Github external
import rebase from "re-base";
import firebase from "@firebase/app";
import "@firebase/database";

const HN_DATABASE_URL = "https://hacker-news.firebaseio.com";
const HN_VERSION = "v0";

firebase.initializeApp({ databaseURL: HN_DATABASE_URL });
let db = firebase.database();
let base = rebase.createClass(db);

// Api is a wrapper around base, to include the version child path to the binding automatically.
const Api = {
  /**
   * One way data binding from Firebase to a component's state.
   * @param {string} endpoint
   * @param {object} options
   * @return {object} An object which you can pass to 'removeBinding' if you want to remove the
   * listener while the component is still mounted.
   */
  bindToState(endpoint, options) {
    return base.bindToState(`/${HN_VERSION}${endpoint}`, options);
  },

  /**
github pubpub / pubpub-editor / src / addons / Collaborative / collaborativePlugin.js View on Github external
this.props = {
			decorations: this.decorations
		};

		/* Check for firebaseConfig */
		if (!firebaseConfig) {
			throw new Error('Did not include a firebase config');
		}

		/* Connect to firebase app */
		const existingApp = firebase.apps.reduce((prev, curr)=> {
			if (curr.name === editorKey) { return curr; }
			return prev;
		}, undefined);
		this.firebaseApp = existingApp || firebase.initializeApp(firebaseConfig, editorKey);
		this.database = firebase.database(this.firebaseApp);
		this.firebaseRef = this.database.ref(editorKey);

		/* Set user status and watch for status changes */
		this.database.ref('.info/connected').on('value', (snapshot)=> {
			if (snapshot.val() === true) {
				this.onStatusChange('connected');
			} else {
				this.onStatusChange('disconnected');
			}
		});
	}
github augustskare / krypto.cash / source / javascript / views / Sync.js View on Github external
handleSubmit(event) {
    event.preventDefault();
    this.offerConnection = false;

    const id = event.target.querySelector('input[type="text"]').value.toLowerCase();
    this.dbRef = firebase.database().ref(`sync/${id}`);
    this.dbRef.on('value', this.onDatabaseChange);

    this.setState({ connected: false })

    this.peerConnection.addEventListener('datachannel', ({channel}) => {
      channel.onmessage = event => {
        const data = JSON.parse(event.data);
        store.add(data);
        this.setState({
          newItems: data,
        })
        channel.send('sync-done');
      }
      channel.onopen = event => this.setState({ connected: true });
    });
  }
github augustskare / krypto.cash / source / javascript / views / Sync.js View on Github external
handleNewConnection() {
    this.offerConnection = true;
    const connectionID = Math.random().toString(36).replace(/[^a-z]+/g, '').substr(0, 5).toLowerCase();
    this.dbRef = firebase.database().ref(`sync/${connectionID}`);
    this.dbRef.on('value', this.onDatabaseChange);

    this.connectionChannel = this.peerConnection.createDataChannel('dataChannel');
    this.connectionChannel.addEventListener('open', event => {
      this.setState({ connected: true });
    });
    this.connectionChannel.addEventListener('message', event => {
      if (event.data === 'sync-done') {
        this.setState({ syncComplete: true });
      }
    });

    this.peerConnection.createOffer().then(offer => this.peerConnection.setLocalDescription(offer))
      .then(() => {
        this.dbRef.set({ sdp: this.peerConnection.localDescription.toJSON() });
github augustskare / krypto.cash / source / javascript / views / Sync.js View on Github external
constructor() {
    super();

    this.database = firebase.database();

    this.handleNewConnection = this.handleNewConnection.bind(this);
    this.handleSubmit = this.handleSubmit.bind(this);
    this.onIcecandidate = this.onIcecandidate.bind(this);
    this.onDatabaseChange = this.onDatabaseChange.bind(this);
    this.handleConnect = this.handleConnect.bind(this);
    this.handleSync = this.handleSync.bind(this); 

    this.peerConnection = new RTCPeerConnection();
    this.peerConnection.addEventListener('icecandidate', this.onIcecandidate);
  }