Merge pull request #219 from lambiengcode/docs/add-stargazers

docs(): add stargazers list in README.md

Author: lambiengcode

README.md

@@ -1,58 +1,70 @@
-[![codecov](https://codecov.io/gh/lambiengcode/waterbus/branch/main/graph/badge.svg?token=7KEMH26LHZ)](https://codecov.io/gh/lambiengcode/waterbus)[![CodeFactor](https://www.codefactor.io/repository/github/lambiengcode/waterbus/badge)](https://www.codefactor.io/repository/github/lambiengcode/waterbus)[![Quality Gate Status](https://sonarcloud.io/api/project_badges/measure?project=lambiengcode_waterbus&metric=alert_status)](https://sonarcloud.io/summary/new_code?id=lambiengcode_waterbus)![GitHub Workflow Status (with event)](https://img.shields.io/github/actions/workflow/status/lambiengcode/waterbus/ci.yml)![GitHub issues](https://img.shields.io/github/issues/lambiengcode/waterbus)[![libwebrtc](https://img.shields.io/badge/libwebrtc-120.6099.19-yellow.svg)](https://chromium.googlesource.com/external/webrtc/+/branch-heads/6099)![Cocoapods Version](https://img.shields.io/cocoapods/v/KaiRTC)
-[![Twitter Follow](https://img.shields.io/twitter/follow/waterbus.tech?style=social)](https://twitter.com/lambiengcode)[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat&logo=github)](https://github.com/lambiengcode)
-
-[![Banner](./screenshots/banner-dark.png)](https://docs.waterbus.tech#gh-dark-mode-only)
-[![Banner](./screenshots/banner.png)](https://docs.waterbus.tech#gh-light-mode-only)
-
-# [Waterbus](https://docs.waterbus.tech): Online Meeting App using Flutter and WebRTC SFU (Selective Forwarding Unit)
-
-<p align="justify">
-<img src="https://github.com/lambiengcode/waterbus/blob/main/screenshots/launcher_icon_rounded.png?raw=true" width="180px" height=auto align="right" alt="Computador"/>
-This is an Online Meeting App that utilizes Flutter and WebRTC technologies to provide users with a platform to conduct virtual meetings, conferences, and webinars. The app is built to provide seamless audio and video communication, as well as screen sharing, chat functionality, and file sharing.
-
-The Waterbus concept has been used for physical transportation, but it can also be applied to online meeting platforms. A virtual Waterbus platform would allow users to travel along a virtual route and stop at designated locations to attend meetings. The platform could also incorporate gamification elements for increased engagement. This approach provides a unique and fun way for remote teams to collaborate while acknowledging the trend of using waterways for transportation.
+<p align="center">
+  <img src="https://github.com/lambiengcode/waterbus/blob/main/screenshots/launcher_icon_rounded.png?raw=true" width="180px" height=auto alt="Computador"/>
+</p>
 
+<h1 align="center"><a href="https://docs.waterbus.tech">Waterbus</a></h1>
+<h3 align="center">Online Meeting App using Flutter and WebRTC SFU (Selective Forwarding Unit)</h3>
+<p align="center">
+  🤙 This is an Online Meeting App that utilizes Flutter and WebRTC technologies to provide users with a platform to conduct virtual meetings, conferences, and webinars. The app is built to provide seamless audio and video communication, as well as screen sharing, chat functionality, and file sharing.
+</p>
+<div class="badges" align="center">
+<p><a href="https://codecov.io/gh/lambiengcode/waterbus"><img src="https://codecov.io/gh/lambiengcode/waterbus/branch/main/graph/badge.svg?token=7KEMH26LHZ" alt="codecov"></a><a href="https://www.codefactor.io/repository/github/lambiengcode/waterbus"><img src="https://www.codefactor.io/repository/github/lambiengcode/waterbus/badge" alt="CodeFactor"></a><a href="https://sonarcloud.io/summary/new_code?id=lambiengcode_waterbus"><img src="https://sonarcloud.io/api/project_badges/measure?project=lambiengcode_waterbus&amp;metric=alert_status" alt="Quality Gate Status"></a><img src="https://img.shields.io/github/actions/workflow/status/lambiengcode/waterbus/ci.yml" alt="GitHub Workflow Status (with event)"><img src="https://img.shields.io/github/issues/lambiengcode/waterbus" alt="GitHub issues"><a href="https://chromium.googlesource.com/external/webrtc/+/branch-heads/6099"><img src="https://img.shields.io/badge/libwebrtc-120.6099.19-yellow.svg" alt="libwebrtc"></a><img src="https://img.shields.io/cocoapods/v/KaiRTC" alt="Cocoapods Version">
+<a href="https://twitter.com/lambiengcode"><img src="https://img.shields.io/twitter/follow/waterbus.tech?style=social" alt="Twitter Follow"></a><a href="https://github.com/lambiengcode"><img src="https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat&amp;logo=github" alt="PRs Welcome"></a></p>
+</div>
+
+<p align="center">
+  <a href="https://docs.waterbus.tech">Website</a> &bull;
+  <a href="https://github.com/lambiengcode/waterbus/wiki">Wiki</a> &bull;
+  <a href="https://github.com/lambiengcode/waterbus/blob/main/LICENSE">License</a>
 </p>
 
-### 📺 Demo Video on Youtube
+[![Banner](./screenshots/banner-dark.png)](https://docs.waterbus.tech#gh-dark-mode-only)
+[![Banner](./screenshots/banner.png)](https://docs.waterbus.tech#gh-light-mode-only)
+<h3 align="center">👉 The Virtual Background feature supports both Android and iOS</h3>
+<br/>
+<div align="center">
+<p><a href="https://youtube.com/shorts/Ms4avix05uY"><img src="https://ytcards.demolab.com/?id=Ms4avix05uY&amp;title=Virtual%20Background%20on%20iOS%20%28VisionKit%20for%20Person%20segment%29&amp;lang=en&amp;timestamp=1709774408&amp;background_color=%230d1117&amp;title_color=%23ffffff&amp;stats_color=%23dedede&amp;max_title_lines=2&amp;width=250&amp;border_radius=10&amp;duration=21" alt="Virtual Background on iOS (VisionKit for Person segment)" title="Virtual Background on iOS (VisionKit for Person segment"></a>
+<a href="https://youtube.com/shorts/PDIDbVoHT5o"><img src="https://ytcards.demolab.com/?id=PDIDbVoHT5o&amp;title=Virtual%20Background%20on%20Android%20%28Mediapipe%20for%20Image%20segment%29&amp;lang=en&amp;timestamp=1709774408&amp;background_color=%230d1117&amp;title_color=%23ffffff&amp;stats_color=%23dedede&amp;max_title_lines=2&amp;width=250&amp;border_radius=10&amp;duration=27" alt="Virtual Background on Android (Mediapipe for Image segment)" title="Virtual Background on Android (Mediapipe for Image segment"></a></p>
+</div>
 
-[![Virtual Background on iOS (VisionKit for Person segment)](https://ytcards.demolab.com/?id=Ms4avix05uY&title=Virtual%20Background%20on%20iOS%20%28VisionKit%20for%20Person%20segment%29&lang=en&timestamp=1709774408&background_color=%230d1117&title_color=%23ffffff&stats_color=%23dedede&max_title_lines=2&width=250&border_radius=10&duration=21 "Virtual Background on iOS (VisionKit for Person segment")](https://youtube.com/shorts/Ms4avix05uY)
-[![Virtual Background on Android (Mediapipe for Image segment)](https://ytcards.demolab.com/?id=PDIDbVoHT5o&title=Virtual%20Background%20on%20Android%20%28Mediapipe%20for%20Image%20segment%29&lang=en&timestamp=1709774408&background_color=%230d1117&title_color=%23ffffff&stats_color=%23dedede&max_title_lines=2&width=250&border_radius=10&duration=27 "Virtual Background on Android (Mediapipe for Image segment")](https://youtube.com/shorts/PDIDbVoHT5o)
 
-## Current supported features
+### ⚡ Current supported features
 
 | Feature | Subscribe/Publish | Screen Sharing | Picture in Picture | Virtual Background | End to End Encryption | Record Media |
 | :-----: | :---------------: | :------------: | :----------------: | :----------------: | :-------------------: | :----------: |
 |   iOS   |        🟢         |       🟢       |         🟢         |         🟢         |          🟢           |      🟡      |
 | Android |        🟢         |       🟢       |         🟢         |         🟢         |          🟢           |      🟡      |
 
-## Codec supported
+### 💥 Codec supported
 | Codec | VP8 | VP9 | H264 | H265 | AV1 |
 | :-----: | :---------------: | :------------: | :------------: | :----------------: | :--------------------------------: |
 |   iOS   |        🟢         |       🟢       |       🟢       |         🟢         |         🟢         |
 | Android |        🟢         |       🟢       |       🟢       |         🟢         |         🟢         |
 
-### Notes:
-> [!NOTE]  
-> `AV1` supported on iOS 14 and above, Android 14 and above.
-> `E2EE` only supported `H264`, `VP8` and `VP9`
-> Video codec Android supported: Check at [Google Site](https://developer.android.com/guide/topics/media/platform/supported-formats#video-codecs)
-
-> [!WARNING]  
-> `Virtual Background` is still in beta so it will not be stable. It is developed using [MediaPipe](https://developers.google.com/mediapipe) for `Android` and [VisionKit](https://developer.apple.com/documentation/vision/vngeneratepersoninstancemaskrequest) for `iOS`
-
 🟢 = Available
 
 🟡 = Coming soon (Work in progress)
 
 🔴 = Not currently available (Possibly in the future)
 
-## Online Meeting Diagram
+> [!NOTE]  
+> - `AV1` supported on iOS 14 and above, Android 14 and above.
+> - `E2EE` only supported `H264`, `VP8` and `VP9`
+> - Video codec Android supported: Check at [Google Site](https://developer.android.com/guide/topics/media/platform/supported-formats#video-codecs)
+
+> [!WARNING]  
+> `Virtual Background` is still in beta so it will not be stable. It is developed using [MediaPipe](https://developers.google.com/mediapipe) for `Android` and [VisionKit](https://developer.apple.com/documentation/vision/vngeneratepersoninstancemaskrequest) for `iOS`
+
+<details>
+<summary> 🖼️ Online Meeting Diagram</summary>
 
 [![Diagram](./screenshots/waterbus-diagram-dark.png)](https://docs.waterbus.tech#gh-dark-mode-only)
 [![Diagram](./screenshots/waterbus-diagram.png)](https://docs.waterbus.tech#gh-light-mode-only)
 
-## 📂 Repository Structure
+</details>
+
+<details>
+<summary> 📂 Repository Structure</summary>
 
 ```sh
 └── waterbus/
@@ -174,6 +186,8 @@ The Waterbus concept has been used for physical transportation, but it can also
 
 ```
 
+</details>
+
 ## 🚀 Getting Started
 
 ### 🔧 Installation
@@ -193,7 +207,7 @@ cd waterbus
 flutter pub get
 ```
 
-### 🤖 Running waterbus
+### 🤖 Run flutter app
 
 ```sh
 flutter run
@@ -206,7 +220,7 @@ flutter test
 
 ---
 
-## Usage
+## 🔥 Usage
 
 1. Sign up for an account
 2. Create a new meeting
@@ -219,24 +233,21 @@ flutter test
 - [WebRTC SFU Server](https://github.com/waterbustech/waterbus-sfu-meeting)
 - [Waterbus Docs](https://docs.waterbus.tech)
 
-## Benchmarking
+## ⏲️ Benchmarking
 
 - This part is benchmarking video codecs within a 60-second duration of an online meeting on an iPhone 13 running iOS 17.0.2. The codecs included in the benchmark are VP8, VP9, H.264, H.265, and AV1.
 - The benchmark aims to quickly compare the performance differences between these codecs during a short online meeting session.
 
-[![Benchmark](./benchmark/h265-benchmark-plot.png)](https://docs.waterbus.tech#gh-dark-mode-only)
-[![Benchmark](./benchmark/h265-benchmark-plot-light.png)](https://docs.waterbus.tech#gh-light-mode-only)
-
-### Device Specifications
+#### 📱 Device Specifications
 
 - **Model:** iPhone 13
 - **Operating System:** iOS 17.0.2
 
-### Results
+#### 🎯 Results
 
 You can view the benchmark results in the generated plots and data files. Here's how you can interpret the results:
 
-<details open>
+<details>
   <summary>VP8</summary>
   - Total encode time: 9325 (µs) in 60s call
 
@@ -282,16 +293,16 @@ You can view the benchmark results in the generated plots and data files. Here's
   </picture>
 </details>
 
+## Enjoying this project? 💙
 
-## Roadmap
-
-- Check at [Roadmap](./roadmap.md)
+[![Stargazers repo roster for @lambiengcode/waterbus](https://reporoster.com/stars/notext/dark/lambiengcode/waterbus)](https://github.com/lambiengcode/waterbus/stargazers/#lambiengcode/waterbus&Date#gh-dark-mode-only)
+[![Stargazers repo roster for @lambiengcode/waterbus](https://reporoster.com/stars/notext/lambiengcode/waterbus)](https://github.com/lambiengcode/waterbus/stargazers/#gh-light-mode-only)
 
-## Enjoying this project? 💙
+Support it by joining [stargazers](https://github.com/lambiengcode/waterbus/stargazers) for this repository. ⭐
 
-Show your support by [starring](https://github.com/lambiengcode/waterbus/stargazers) and following [maintainers](https://github.com/lambiengcode) on GitHub for more awesome content! ⭐️🚀
+Also, follow [maintainers](https://github.com/lambiengcode) on GitHub for our next creations!
 
-## Star History
+### Stars History
 
 [![Star History Chart](https://api.star-history.com/svg?repos=lambiengcode/waterbus&type=Date&theme=dark)](https://star-history.com/#lambiengcode/waterbus&Date#gh-dark-mode-only)
 [![Star History Chart](https://api.star-history.com/svg?repos=lambiengcode/waterbus&type=Date)](https://star-history.com/#lambiengcode/waterbus&Date#gh-light-mode-only)
@@ -303,33 +314,3 @@ Contributions are welcome! Please feel free to submit a pull request or open an
 ## Contact Information
 
 If you have any questions or suggestions related to this application, please contact me via email: `lambiengcode@waterbus.tech` or `lambiengcode@gmail.com`.
-
-## License
-
-```terminal
-MIT License
-
-Copyright (c) 2023 lambiengcode
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
-```
-
-## Keywords
-
-Online Meeting, Flutter, WebRTC, Audio Communication, Video Communication, Screen Sharing, Chat Functionality, File Sharing, Firebase, Virtual Meetings, Conferences, Webinars, AV1 Codec, H264, H265, VP9, VP8, Noise Suppresion.