├── .gitignore ├── img └── readme │ ├── Step-1.png │ ├── Step-2.png │ ├── Step-3.png │ ├── Step-4.png │ ├── Step-5.png │ └── MMM-Coinbase.png ├── node_helper.js ├── package.json ├── css └── styles.css ├── LICENSE ├── MMM-Coinbase.js └── README.md /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | package-lock.json 3 | .gitignore 4 | .DS_Store 5 | -------------------------------------------------------------------------------- /img/readme/Step-1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mlbonniec/MMM-Coinbase/HEAD/img/readme/Step-1.png -------------------------------------------------------------------------------- /img/readme/Step-2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mlbonniec/MMM-Coinbase/HEAD/img/readme/Step-2.png -------------------------------------------------------------------------------- /img/readme/Step-3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mlbonniec/MMM-Coinbase/HEAD/img/readme/Step-3.png -------------------------------------------------------------------------------- /img/readme/Step-4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mlbonniec/MMM-Coinbase/HEAD/img/readme/Step-4.png -------------------------------------------------------------------------------- /img/readme/Step-5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mlbonniec/MMM-Coinbase/HEAD/img/readme/Step-5.png -------------------------------------------------------------------------------- /img/readme/MMM-Coinbase.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mlbonniec/MMM-Coinbase/HEAD/img/readme/MMM-Coinbase.png -------------------------------------------------------------------------------- /node_helper.js: -------------------------------------------------------------------------------- 1 | const NodeHelper = require("node_helper"); 2 | const {Client} = require("coinbase"); 3 | 4 | module.exports = NodeHelper.create({ 5 | start: () => {}, 6 | socketNotificationReceived: function(notification, payload) { 7 | const client = new Client({apiKey: payload.apiKey, apiSecret: payload.apiSecret, strictSSL: false}); 8 | switch(notification) { 9 | case "GET_ACCOUNTS": 10 | const helper = this; 11 | client.getAccounts({}, (err, accounts) => { 12 | if(err) 13 | throw err; 14 | 15 | helper.sendSocketNotification("ACCOUNTS", accounts.filter(a => payload.wallet.includes(a.currency))); 16 | }); 17 | 18 | break; 19 | } 20 | }, 21 | }); 22 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "mmm-coinbase", 3 | "version": "1.0.0", 4 | "description": "A module for MagicMirror 2 displaying the balance of Coinbase account.", 5 | "main": "MMM-Coinbase.js", 6 | "repository": { 7 | "type": "git", 8 | "url": "git+https://github.com/mlbonniec/MMM-Coinbase.git" 9 | }, 10 | "keywords": [ 11 | "magic", 12 | "mirror", 13 | "coinbase", 14 | "module", 15 | "mmm", 16 | "mmm-magic-mirror" 17 | ], 18 | "author": "Mathis Lebonniec", 19 | "license": "ISC", 20 | "engines": { 21 | "node": ">=12.0.0" 22 | }, 23 | "bugs": { 24 | "url": "https://github.com/mlbonniec/MMM-Coinbase/issues" 25 | }, 26 | "homepage": "https://github.com/mlbonniec/MMM-Coinbase#readme", 27 | "dependencies": { 28 | "coinbase": "^2.0.8" 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /css/styles.css: -------------------------------------------------------------------------------- 1 | /**************************************************** 2 | * Magic Mirror * 3 | * MMM-Coinbase CSS * 4 | * * 5 | * By Mathis Le Bonniec * 6 | * https://github.com/mlbonniec * 7 | * * 8 | * Edit this file ONLY if you know what you're doing * 9 | ****************************************************/ 10 | 11 | .icon {display: inline-block; margin: 0;} 12 | .wallet {margin: 0;} 13 | 14 | span {line-height: 1;} 15 | 16 | .right {float: right;} 17 | .row {display: flex; flex-direction: row; flex-wrap: wrap; width: 100%; margin-bottom: .5rem;} 18 | .row:last-child {margin-bottom: 0;} 19 | .column {display: flex; flex-direction: column; flex-basis: 33%; flex: 1; margin: 0;} 20 | .fab {font-family: 'FontAwesome'; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; line-height: 1;} 21 | .currency-name {margin: 0;} -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2020 Mathis Le Bonniec 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /MMM-Coinbase.js: -------------------------------------------------------------------------------- 1 | Module.register("MMM-Coinbase", { 2 | 3 | defaults: { 4 | apiKey: "", 5 | apiSecret: "", 6 | wallet: ["BTC"], 7 | icons: true, // currently only Bitcoin and Ethereum supported 8 | label: false 9 | // updateInterval: 1 10 | }, 11 | 12 | getStyles: function() { 13 | return [this.file("css/styles.css")]; 14 | }, 15 | 16 | start: function() { 17 | this.icons = { 18 | "BTC": "bitcoin", 19 | "ETH": "ethereum" 20 | }; 21 | this.balance = 0; 22 | this.currency = ""; 23 | this.cryptoData = []; 24 | }, 25 | 26 | getHeader: function() { 27 | return this.data.header + "" + this.balance + " " + this.currency + ""; 28 | }, 29 | 30 | getDom: function() { 31 | const elem = document.createElement("div"); 32 | elem.id = "accountWrapper"; 33 | 34 | const module = this; 35 | const config = this.config; 36 | const icons = this.icons; 37 | 38 | this.cryptoData.forEach((accts) => { 39 | module.balance += parseInt(accts.native_balance.amount); 40 | 41 | // check if currency is in config 42 | if(config.wallet.indexOf(accts.currency) > -1) { 43 | // add div ROW for currency 44 | const rowElement = document.createElement("div"); 45 | rowElement.className = "row"; 46 | rowElement.id = accts.currency + "Counter"; 47 | 48 | // Create column for icon if icons have been activated 49 | if (config.icons) { 50 | const columnIconElement = document.createElement("div"); 51 | columnIconElement.className = "column icon"; 52 | 53 | if(icons.hasOwnProperty(accts.currency)) 54 | columnIconElement.innerHTML = ""; 55 | else 56 | columnIconElement.innerHTML = "" + accts.currency.toUpperCase() + ""; 57 | 58 | rowElement.appendChild(columnIconElement); 59 | } 60 | 61 | if (config.label) { 62 | const columnCurrencyElement = document.createElement("div"); 63 | columnCurrencyElement.className = "column"; 64 | columnCurrencyElement.innerHTML = "" + accts.currency + ""; 65 | rowElement.appendChild(columnCurrencyElement); 66 | } 67 | 68 | const columnAmountElement = document.createElement("div"); 69 | columnAmountElement.className = "column"; 70 | columnAmountElement.innerHTML = "" + accts.balance.amount + ""; 71 | 72 | rowElement.appendChild(columnAmountElement); 73 | elem.appendChild(rowElement); 74 | } 75 | 76 | }); 77 | 78 | return elem; 79 | }, 80 | 81 | notificationReceived: function(notification) { 82 | switch(notification) { 83 | case "DOM_OBJECTS_CREATED": 84 | setInterval(() => { 85 | this.sendSocketNotification("GET_ACCOUNTS", {apiKey: this.config.apiKey, apiSecret: this.config.apiSecret, wallet: this.config.wallet}); 86 | }, 5000); 87 | 88 | break; 89 | } 90 | }, 91 | 92 | socketNotificationReceived: function(notification, payload) { 93 | switch(notification) { 94 | case "ACCOUNTS": 95 | this.cryptoData = payload; 96 | this.currency = payload[0].native_balance.currency; 97 | this.updateDom(); 98 | this.balance = 0; 99 | 100 | break; 101 | } 102 | }, 103 | }); 104 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # MMM-Coinbase 2 | A module for Michael Teeuw's MagicMirror project that displays your crypto-currency Coinbase balance. 3 | The module is now compatible with all crypto-currencies available on Coinbase. 4 | However, only Bitcoin and Ethereum icons are available. For the other crypto-currencies, the currency symbol is displayed. (e.g. LTC for Litecoin) 5 | 6 | ## How it works 7 | After installing the module and configuring the Coinbase API with your account, the module displays your crypto-currency balance in real time. It is updated every 5 seconds. 8 | 9 | ## Screenshot 10 |

11 | 12 |

13 | 14 | ## Prerequisites 15 | * MagicMirror2 16 | * Node.js 17 | * npm 18 | * Coinbase account 19 | 20 | ## Installing 21 | Installing the module is quite straight forward 22 | ### Step 1 - Install the module 23 | ```javascript 24 | cd ~/MagicMirror/modules 25 | git clone https://github.com/mlbonniec/MMM-Coinbase.git 26 | cd MMM-Coinbase 27 | npm install 28 | ``` 29 | ### Step 2 - Create your coinbase API keys 30 | |!["Step-1"](https://github.com/mlbonniec/MMM-Coinbase/blob/master/img/readme/Step-1.png "Step-1")|!["Step-2"](https://github.com/mlbonniec/MMM-Coinbase/blob/master/img/readme/Step-2.png "Step-2")|!["Step-3"](https://github.com/mlbonniec/MMM-Coinbase/blob/master/img/readme/Step-3.png "Step-3")| 31 | |-------------|-------------|-------------| 32 | |

Go to API Access

|

Click `+ New API Key`

|

Check `BTC Wallet` (or `LTC Wallet`, `ETH` ...) and `wallet:accounts:read`

| 33 | 34 | |!["Step-4"](https://github.com/mlbonniec/MMM-Coinbase/blob/master/img/readme/Step-4.png "Step-4")|!["Step-5"](https://github.com/mlbonniec/MMM-Coinbase/blob/master/img/readme/Step-5.png "Step-5")| 35 | |-------------|-------------| 36 | |

Click `Create`

|

Copy `API Key` and `API Secret Key`

| 37 | 38 | ### Step 3 - Add module to `~MagicMirror/config/config.js` 39 | Add this configuration into `config.js` file's 40 | ```javascript 41 | { 42 | module: "MMM-Coinbase", 43 | position: "top_left", // put it where you want it 44 | header: "Coinbase", // optional 45 | config: { 46 | apiKey: "YOUR API KEY", // the key previously copied 47 | apiSecret: "YOUR API SECRET KEY", 48 | wallet: ["BTC", "LTC"], // list of currencies to display 49 | icons: true, // currently only Ethereum and Bitcoin supported 50 | label: false // shows currency labels (e.g. BTC, ETH and so on) 51 | } 52 | } 53 | ``` 54 | ## Updating 55 | Go to the module’s folder inside MagicMirror modules folder and pull the latest version from GitHub and install: 56 | ``` 57 | git pull 58 | npm install 59 | ``` 60 | ## Configuring 61 | Here is the configurable part of the module 62 | 63 | |Option|Description| 64 | |------|-----------| 65 | |`apiKey`|API Key from Coinbase.

**Type:** `string` **REQUIRED**
**Example:**`1iO5VjY2bdC3HucJ`
**Default value:** none| 66 | |`apiSecret`|API Secret Key from Coinbase.

**Type:** `string` **REQUIRED**
**Example:**`OwABcDaA5fxK3QTV3gjwvOk358juuXti`
**Default value:** none| 67 | 68 | ## Use 69 | Now you can fully use MagicMirror and the MMM-Coinbase module to display your wallets ! Enjoy it well ! 70 | 71 | ## Contributing 72 | If you find any problems, bugs or have questions, please [open a GitHub issue](https://github.com/mlbonniec/MMM-Coinbase/issues) in this repository. 73 | 74 | ## Contributors 75 | * [nabbl](https://github.com/nabbl) thank you for your great work! 76 | --------------------------------------------------------------------------------