Skip to content

Commit

Permalink
Merge pull request #4 from Klettner/development
Browse files Browse the repository at this point in the history
Upgrade to v1.0.3
  • Loading branch information
Klettner committed Sep 21, 2020
2 parents b2b834b + 3895a10 commit 49ef6d5
Show file tree
Hide file tree
Showing 18 changed files with 1,595 additions and 1,023 deletions.
1 change: 1 addition & 0 deletions .github/workflows/main.yml
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ jobs:
flutter-version: '1.12.13+hotfix.8'
- run: flutter pub get
- run: flutter build apk --split-per-abi
- run: flutter build apk
- name: Create a Release APK
uses: ncipollo/release-action@v1
with:
Expand Down
90 changes: 57 additions & 33 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,54 +1,78 @@
## MM-Remote
# MM-Remote
[![Build and Release apk](https://github.com/Klettner/MM-Remote/workflows/Build%20and%20Release%20apk/badge.svg)](https://GitHub.com/Klettner/MM-Remote/releases/)
[![GitHub release](https://img.shields.io/github/release/Klettner/MM-Remote)](https://GitHub.com/Klettner/MM-Remote/releases/)
[![GitHub license](https://img.shields.io/github/license/Klettner/MM-Remote)](https://github.com/Klettner/MM-Remote/blob/master/LICENSE)


MM-Remote is an Android app to control your **MagicMirror** via smartphone.
MM-Remote is an Android app to control your **MagicMirror** remotly via smartphone :iphone:.

![](assets/MMRemote.png)
![](assets/currentDeviceHomeTab.png)

### Features ###
* Change the brightness
* Play, stop and skip image of a slideshow
## Features ##
* Change the monitor brightness :high_brightness:
* Send alerts to the mirror
* Shutdown and reboot the mirror
* Turn monitor on and off
* Switch between pages
* Turn the monitor on and off
* Play, stop and skip images :camera: of a photo-slideshow
* Switch between UI-pages
* Create your own custom commands

### v1.0.3 ###
* Start a timer on the mirror
* Start a stop-watch :hourglass_flowing_sand: on the mirror
* Hide and reorder default commands on the Home-tab

### Dependencies ###
* [MMM-BackgroundSlideshow](https://github.com/darickc/MMM-BackgroundSlideshow)
* [MMM-Pages](https://github.com/edward-shen/MMM-pages)
* [MMM-Remote-Control](https://github.com/Jopyth/MMM-Remote-Control)

The communication between app and MagicMirror relies on [MMM-Remote-Control](https://github.com/Jopyth/MMM-Remote-Control), **the app won't work without it!**
The app will still work without the other dependencies, but this will limit its functionality.
## Dependencies ##

 
## Set-up (easy) ##
Click [here](https://github.com/Klettner/MM-Remote/releases) and choose the latest release. There are three different .apk files available (the file which will install the app on your phone). Pick the .apk file which is compatible with your phone and download it. If you don't know which one to choose you can simply download all three .apk files and try the following steps which each of them.
Once the file is downloaded to your phone, click on it to install. A warning will popup as this app was not downloaded from the app store. If you ignore the warning, the app will install and your done. If there is an error message, the .apk file is most likely not compatible with you phone and you need to try one of the other remaining .apk file.
Once the app is installed you can delete the .apk files, these are not needed anymore.
### Required :warning: (the app won't work without it): ###
* [MMM-Remote-Control](https://github.com/Jopyth/MMM-Remote-Control) (used for communication with the mirror)

### Optional (without these, some default commands won't work): ###
* [MMM-BackgroundSlideshow](https://github.com/darickc/MMM-BackgroundSlideshow) (controlling a photo-slideshow on the mirror)
* [MMM-Pages](https://github.com/edward-shen/MMM-pages) (switching between different UI-pages)
* [MMM-StopwatchTimer](https://github.com/klettner/MMM-StopwatchTimer) (controlling a timer/stop-watch on the mirror)

After starting the MM-Remote app, tab on the `+` on the bottom-right to add you MagicMirror.
- Give your mirror an arbitrary name.
If you do not use all the optional dependencies some of the default commands won't work, but such commands can be hidden in the settings.

 
## Set-up ##
### Option 1 (easiest) ###
Click [here](https://github.com/Klettner/MM-Remote/releases) and choose the latest release. There are four different .apk files available (the file which will install the app on your phone :iphone:). Pick the **app-release.apk** file and download :arrow_down: it. This file should be compatible with every android phone (but takes a little bit more storage than set-up option 2). Once the file is downloaded to your phone, click it to install the app. A warning will popup as this app was not downloaded from the app store. If you ignore this warning, the app will install and your done.
Once the app is installed you can delete the .apk file, it is not needed anymore.

### Option 2 (uses less storage) ###
Click [here](https://github.com/Klettner/MM-Remote/releases) and choose the latest release. There are four different .apk files available (the file which will install the app on your phone :iphone:). Pick the .apk file which is compatible with your phone and download :arrow_down: it (not the app-release.apk as this file is basically the other three files combined and therefore takes more storage). If you don't know which one to choose you can simply download all three .apk files and try the following whith each of them.
Once the file is downloaded to your phone, click on it to install. A warning will popup as this app was not downloaded from the app store. If you ignore this warning, the app will install and your done. If there is an error message, the .apk file is most likely not compatible with you phone and you need to try one of the other remaining .apk file.
Once the app is installed you can delete the .apk files, these are not needed anymore.

### Option 3 (compile the app by yourselfe) ###
First you need to clone this repository with Git. The app is written in **Dart** with the help of googles **Flutter** framework. To compile the app you need to setup Flutter if you haven't done so already. If you have never used Flutter before, there is a good [installation guide and documentation](https://flutter.dev/docs/get-started/install) available. After Flutter is set-up, run ```flutter build apk``` or ```flutter build apk --split-per-abi``` in your terminal to create the apk files.

## Getting started ##
After starting the MM-Remote app, tab on the :heavy_plus_sign: on the bottom-right to add you MagicMirror.
- Give your mirror a name.
- Add it's IP-address to the next field (e.g. something like 192.168.0.0). You can get the IP-address by typing `ipconfig` in the console of the raspberry pi. In the output after *inet addr:* you will find the ip-adress.
- Put the port in the last field (e.g. 8080) and click on create.

Now you should be able to remote control your mirror. But keep in mind, if you don't use all the modules mentioned under dependencies, some of the buttons might not work (e.g. changing the displayed pages of your mirror via the left and right arrows on the bottom only works if you are using the MMM-Pages module). But you can always create you own commands in the **CUSTOM-COMMANDS** tab.
Now you should be able to remote control your mirror. If you want to reorder or hide some of the default commands displayed in the **HOME** tab, go to settings and check :white_check_mark: the default command boxes in the order in which these commands should be displayed. Keep in mind, if you don't use all the modules mentioned under dependencies, some of the buttons might not work (e.g. changing the displayed UI-pages of your mirror via the left and right arrows on the bottom only works if you are using the MMM-Pages module). You can always create you own commands in the **CUSTOM-COMMANDS** tab to extend the functionalities of the app. If there are any MagicMirror modules for which it is impractical to create your own **CUSTOM-COMMANDS** (e.g. because you need text input fileds, a slider or many buttons) let me know, I might consider creating :wrench: a default command for it in future releases.

 
## Trouble shooting ##
- If you have performed the above steps but the mirror still does not respond, have a look at you *config.js* file. Usually at the beginning of the file there is someting called the `ipWhitelist:`. Add the IP-address of your smartphone here to allow it sending commands to your mirror. If you don't know how to find out the IP-address of your smartphone a quick search with your favorite search engine will help.
## :bulb: Trouble shooting :bulb: ##
- If you have performed the above steps but the mirror still does not respond, have a look at you *config.js* file. Usually at the beginning of the file there is something called the `ipWhitelist:`. Add the IP-address of your smartphone here to allow it sending commands to your mirror. If you don't know how to find out the IP-address of your smartphone a quick search with your favorite search engine will help.
- Check if the port you have specified in your *config.js* file is the same as in the app.

 
## Set-up (hard) ##
You can also clone the repository and compile the code by yourself instead of downloading the .apk files. It is written in **Dart** with the help of googles **Flutter** framework. If you have never used Flutter before, there is a good [documentation](https://flutter.dev/docs/get-started/install) available.
- If a command is not working even though you are using all the required dependencies (e.g. toggling the monitor on/off might not work if you are using a TV instead of a pc-monitor) you can overwrite the shell-command which is used with a command that is working for you. To do this, open your **config.js** file and add the **customCommand** section to the module [MMM-Remote-Control](https://github.com/Jopyth/MMM-Remote-Control).
```
module: 'MMM-Remote-Control',
config: {
customCommand: {
monitorOnCommand: 'Shell command that is working for you, to turn your monitor on',
monitorOff: 'Shell command that is working for you, to turn your monitor off',
},
},
```

 
## Final words ##
This is the first app I have coded, therefore I would be happy about some feedback.
If you have any ideas for improvements, bugs or feature requests feel free to write an issue.
If you want to contribute yourself, please create a pull request.
## Final words :tada: ##
This is the first app I have created, therefore I would be happy about some feedback.
If you have any feature requests, bugs or ideas for improvements please create an issue.
If you want to contribute yourself, feel free to make a pull request.
Binary file removed assets/MMRemote.png
Binary file not shown.
Binary file added assets/currentDeviceDrawer.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/currentDeviceHomeTab.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 3 additions & 1 deletion lib/main.dart
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
import 'package:flutter/material.dart';
import 'package:mmremotecontrol/screens/help.dart';
import 'package:mmremotecontrol/screens/settings.dart';

import 'screens/currentDevice.dart';
import 'screens/currentDevice/cdMain.dart';
import 'screens/chooseDevice.dart';
import 'screens/addDevice.dart';
import 'package:mmremotecontrol/shared/colors.dart';
Expand All @@ -22,6 +23,7 @@ class MirrorApp extends StatelessWidget {
AddDevicePage.routeName: (context) => AddDevicePage(),
StartPage.routeName: (context) => StartPage(),
HelpPage.routeName: (context) => HelpPage(),
SettingsPage.routeName: (context) => SettingsPage(),
},
);
}
Expand Down
15 changes: 15 additions & 0 deletions lib/models/mirrorStateArguments.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
class MirrorStateArguments {
String deviceName;
String brightness;
String alertDuration;
String monitorStatus;

MirrorStateArguments(this.deviceName, this.brightness, this.alertDuration, this.monitorStatus);

MirrorStateArguments.fromMap(Map map) {
deviceName = map[deviceName];
brightness = map[brightness];
alertDuration = map[alertDuration];
monitorStatus = map[monitorStatus];
}
}
32 changes: 17 additions & 15 deletions lib/models/settingArguments.dart
Original file line number Diff line number Diff line change
@@ -1,15 +1,17 @@
class SettingArguments {
String deviceName;
String brightness;
String alertDuration;
String monitorStatus;

SettingArguments(this.deviceName, this.brightness, this.alertDuration, this.monitorStatus);

SettingArguments.fromMap(Map map) {
deviceName = map[deviceName];
brightness = map[brightness];
alertDuration = map[alertDuration];
monitorStatus = map[monitorStatus];
}
}
class SettingArguments {
int alertDuration;
List<DefaultCommand> defaultCommands;

SettingArguments(this.defaultCommands, this.alertDuration);

SettingArguments.fromMap(Map map) {
alertDuration = map[alertDuration];
defaultCommands = map[defaultCommands];
}
}

enum DefaultCommand {
MonitorBrightness,
PhotoSlideshow,
StopwatchTimer
}
24 changes: 22 additions & 2 deletions lib/screens/chooseDevice.dart
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:mmremotecontrol/models/mirrorStateArguments.dart';

import 'currentDevice.dart';
import 'currentDevice/cdMain.dart';
import 'addDevice.dart';
import 'package:mmremotecontrol/shared/colors.dart';
import 'package:mmremotecontrol/models/deviceArguments.dart';
Expand Down Expand Up @@ -104,6 +105,8 @@ class _StartPageState extends State<StartPage> {
Card _newDevice = _createDevice(_deviceArguments.deviceName, _deviceArguments.ip,
_deviceArguments.port, true);
_initializeDevice(_newDevice);
_initializeDefaultCommands(_deviceArguments.deviceName);
_initializeSettings(_deviceArguments.deviceName);
}

void _initializeDevice(Card _newDevice) {
Expand All @@ -113,7 +116,7 @@ class _StartPageState extends State<StartPage> {

setState(() {
_devices = _devicesTemp;
});
}) ;
}

Future<void> _deleteDeviceDialog(BuildContext context, String deviceName) async {
Expand Down Expand Up @@ -234,4 +237,21 @@ class _StartPageState extends State<StartPage> {
var dbHelper = SqLite();
dbHelper.saveDevice(device);
}

void _initializeDefaultCommands(String deviceName) {
// delete already existing defaultCommands for this device
var dbHelper = SqLite();
dbHelper.deleteAllDefaultCommands(deviceName);
dbHelper.saveDefaultCommand(deviceName, "PhotoSlideshow");
dbHelper.saveDefaultCommand(deviceName, "MonitorBrightness");
dbHelper.saveDefaultCommand(deviceName, "StopwatchTimer");
}

void _initializeSettings(String deviceName) {
var setting = MirrorStateArguments(
deviceName, '200', '10', 'ON');
var dbHelper = SqLite();
dbHelper.deleteSettings(deviceName);
dbHelper.saveSetting(setting);
}
}

0 comments on commit 49ef6d5

Please sign in to comment.