Merge branch 'master' of ghostdub.de:mpvremote

master
Dario Ernst 9 years ago
commit e5fd5049f5

@ -88,6 +88,7 @@ height: 50px;
</head> </head>
<body layout="row" ng-controller="MpvRemote"> <body layout="row" ng-controller="MpvRemote">
<div layout="column" class="relative" layout-fill role="main"> <div layout="column" class="relative" layout-fill role="main">
<md-toolbar> <md-toolbar>
<div class="md-toolbar-tools"> <div class="md-toolbar-tools">
@ -104,9 +105,15 @@ height: 50px;
<md-content flex md-scroll-y> <md-content flex md-scroll-y>
<ui-view layout="column" layout-fill layout-padding> <ui-view layout="column" layout-fill layout-padding>
<md-button class="md-raised md-primary" ng-click="togglePlay()"> <section layout="row" layout-align="center center" layout-wrap>
Play/Pause <md-button class="md-fab" aria-label="Play" ng-click="">
<md-icon class="material-icons" ng-hide="isPlaying" ng-click="togglePlay()">play_arrow</md-icon>
<md-icon class="material-icons" ng-show="isPlaying" ng-click="togglePlay()">pause</md-icon>
</md-button> </md-button>
<md-slider flex="" min="0" max="{{totalDurationSeconds}}" ng-model="currentDurationSeconds" aria-label="Progress" id="progress-slider">
</md-slider>
</section>
<label layout="column" layout-align="center center">{{currentDurationSeconds | toMinSec}}/{{totalDurationSeconds | toMinSec}}</label>
<section layout="row" layout-sm="column" layout-align="center center" layout-wrap> <section layout="row" layout-sm="column" layout-align="center center" layout-wrap>
<div class="label">Skip</div> <div class="label">Skip</div>
@ -142,6 +149,7 @@ height: 50px;
<md-icon class="material-icons">volume_off</md-icon> <md-icon class="material-icons">volume_off</md-icon>
</md-button> </md-button>
</section> </section>
<div class="status-container"> <div class="status-container">
<div class="ng-scope fade" ng-if="status" id="status"> <div class="ng-scope fade" ng-if="status" id="status">
<b layout="row" layout-align="center center" class="md-padding ng-binding layout-align-center-center layout-row"> <b layout="row" layout-align="center center" class="md-padding ng-binding layout-align-center-center layout-row">
@ -161,7 +169,16 @@ height: 50px;
<script type="text/javascript"> <script type="text/javascript">
var app = angular.module('StarterApp', ['ngMaterial', 'ngMdIcons']); var app = angular.module('StarterApp', ['ngMaterial', 'ngMdIcons']);
app.filter('toMinSec', function(){
return function(input){
var minutes = parseInt(input/60, 10);
var seconds = input%60;
if (seconds < 10) {
seconds = '0' + seconds;
}
return minutes + ':' + seconds;
}
})
app.controller('MpvRemote', ['$scope', '$mdBottomSheet', '$http', '$timeout', function($scope, $mdBottomSheet, $http, $timeout){ app.controller('MpvRemote', ['$scope', '$mdBottomSheet', '$http', '$timeout', function($scope, $mdBottomSheet, $http, $timeout){
// functions // functions
@ -208,12 +225,17 @@ var chapter = function(isNext) {
}; };
// --------------------------------------------------------- // ---------------------------------------------------------
$scope.status = ''; $scope.status = '';
$scope.currentDurationSeconds = 50;
$scope.totalDurationSeconds = 530;
$scope.isPlaying = true;
$scope.alert = ''; $scope.alert = '';
$scope.previousChapter = function() { chapter(false) }; $scope.previousChapter = function() { chapter(false) };
$scope.nextChapter = function() { chapter(true) }; $scope.nextChapter = function() { chapter(true) };
$scope.back = function() { seek(-10) }; $scope.back = function() { seek(-10) };
$scope.togglePlay = function() { $scope.togglePlay = function() {
$scope.isPlaying = !$scope.isPlaying;
$http({ $http({
method: 'GET', method: 'GET',
url: '/playpause' url: '/playpause'

@ -0,0 +1,42 @@
--------------------------------------------------------------------------------
Status (from Server):
--------------------------------------------------------------------------------
Response:
{
"type": "status",
"totalDuration": 250,
"currentDuration": 2,
"volume": 50,
"fileName": "Foo",
"isPlaying": true
}
--------------------------------------------------------------------------------
Seek:
--------------------------------------------------------------------------------
Request:
{
"command": "seek",
"seekValue":30
}
--------------------------------------------------------------------------------
Seek Chapter:
--------------------------------------------------------------------------------
Request:
{
"command": "seekChapter",
"direction":"forward"
}
--------------------------------------------------------------------------------
Play
--------------------------------------------------------------------------------
Request:
{
"command": "play"
}
--------------------------------------------------------------------------------
Pause
--------------------------------------------------------------------------------
Request:
{
"command": "pause"
}
Loading…
Cancel
Save