GithubHelp home page GithubHelp logo

andreasonny83 / online-board Goto Github PK

View Code? Open in Web Editor NEW
4.0 4.0 1.0 2.67 MB

Create and share interactive boards online

Home Page: https://online-board.firebaseapp.com

License: MIT License

TypeScript 64.80% JavaScript 17.29% HTML 11.11% CSS 6.79%
angular firebase angularfire2 online-board

online-board's Introduction

Online Board

Build Status CircleCI Coverage Status Commitizen friendly

This project is running Live at onlineboard.sonnywebdesign.com

Note

If you are updating from a version <= 0.1.0, you must reinstall all the npm dependencies with:

$ npm cache clean
$ npm install

# Or using Yarn

$ yarn upgrade

Prerequisites

The project has dependencies that require Node 6.9.0 or higher, together with NPM 3 or higher.

Development server

Run npm start for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

Build

Run npm run build to build the project. The build artifacts will be stored in the dist/ directory.

Running unit tests

Run npm test to execute the unit tests via Karma.

Running end-to-end tests

Run npm run e2e to execute the end-to-end tests via Protractor. Before running the tests make sure you are serving the app via npm start.

Deploying to Firebase

Prerequisites

  1. Create a free Firebase account at https://firebase.google.com
  2. Create a project from your Firebase account console
  3. Configure the authentication providers for your Firebase project from your Firebase account console

Configure this app with your project-specific details

// .firebaserc

{
  "projects": {
    "default": "your-project-id"
  }
}
// src/firebase/index.ts

const firebaseConfig = {
  apiKey: 'your api key',
  authDomain: 'your-project-id.firebaseapp.com',
  databaseURL: 'https://your-project-id.firebaseio.com',
  storageBucket: 'your-project-id.appspot.com'
};

Install firebase-tools

$ npm install -g firebase-tools

Build and deploy the app

$ npm run build
$ firebase login
$ firebase use default
$ firebase deploy

Contributing

This package is using the AngularJS commit messages as default way to contribute with Commitizen node package integrated in this repository.

  1. Fork it!
  2. Create your feature branch: git checkout -b my-new-feature
  3. Add your changes: git add .
  4. Commit your changes: npm run commit
  5. Push to the branch: git push origin my-new-feature
  6. Submit a pull request ๐Ÿ˜Ž

Changelog

Changelog available here

License

MIT License ยฉ Andrea SonnY

online-board's People

Contributors

andreasonny83 avatar grumpycatcode avatar

Stargazers

 avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

Forkers

claudia-codes

online-board's Issues

Splash screen

Display a splash screen / loading bar to replace the loading... text while the Angular app is bootstrapping

Invite collaborators button

While the logic for sending the email invitation it is still waiting for a server response, it is still possible to submit the invitation form multiple times. Only when the email has been sent, the form resets avoiding sending multiple server requests.
Ideally, the button should be disabled after the first submission and it should display a loading spinner inside.

CI

Integrate TravisCI for running TSLinters, unit and E2E tests

Edit cards

All the collaborators should be able to edit the cards in the board

Drag-n-drop

Enable drag-and-drop support to move the sticky nots around the board.
On mobile devices consider using HammerJS library with AngularMaterial2 support

Slideshow mode

Add feature for enabling a presentation mode to go through the posts in a slideshow mode to show one post after another so people can discuss one topic at a time, the go to the next one during the retrospective meeting

Push notifications

Spread push notifications on mobile and desktop when something changes on one of the following boards

Delete multiple boards

When offline and trying to delete multiple boards from inside the user's dashboard, the loading spinner is displayed only on the latest deleted element where it should be displayed to all the boards waiting for being deleted

Footer

The main footer is rendered only when the user is signed in where it should be always visible.

Changelog

Display a changelog in a pop-up dialog every time a new version is released.

Email addresses not recognised correctly

When inviting collaborators into a specific board, the email address is case sensitive so, only when the email submitted verify the same case sensitivity as the user's email provided during the registration phase, the user is correctly added as a collaborator, otherwise the logic is not detecting the user as the same one.

Forgotten password

Dismissing the forgotten password dialog, displays a "email sent" notification.

Concurrency issue

While editing a post on a board, if another use aport changes to the same board, the active changes get discarded because of the change detection triggered by Firebase.

UI bug

An horizontal scrollbar is present on mobile devices whrn the "back" button is present in the header panel.
The version number is not displaying in the footer are.
Some ui bugs around the footer component on mobile devices.

Responsive layout

The app layout should be developed with mobile-first in mind. Make sure to upgrade all the existing components to follow this guideline.

Delete post

Add feature for deleting a post if the user is the creator

Better delete post

On deleting a post from a board, the element should be immediately binned and the post information stored in a local variable for the Undo logic to recreate it back if required.

Forgotten password

Display a forgotten password link in the login page for resetting the user password when forgotten.

Offline notification

Display an offline status bar every time the user is running out of internet connection.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.