Settings Servers refresh all not only one, show list libraries in settings

.travis.yml

@@ -0,0 +1,12 @@
+language: php
+php:
+  - 5.3
+  - 5.4
+  - 5.5
+  - 7.0
+
+before_script:
+  - curl -s http://getcomposer.org/installer | php
+  - php composer.phar install --dev
+
+script: php oil test

composer.json

@@ -5,7 +5,7 @@
     "keywords": ["application", "website", "development", "framework", "PHP", "PHP7"],
     "license": "MIT",
     "require": {
-        "php": ">=5.3.3",
+        "php": ">=5.6.33",
         "composer/installers": "~1.0",
         "fuel/core": "1.8.*",
         "fuel/auth": "1.8.*",

fuel/app/classes/controller/install.php

@@ -2,6 +2,7 @@
 
 use Fuel\Core\Controller;
 use Fuel\Core\FuelException;
+use Fuel\Core\Response;
 use Fuel\Core\View;
 use Fuel\Core\Asset;
 
@@ -9,6 +10,11 @@ class Controller_Install extends Controller
 {
     public function action_index()
     {
+        $lock = Config::load('lock', true);
+
+        if($lock)
+            Response::redirect('/login');
+
         $view = View::forge('install/index');
 
         $js = Asset::js('plex_alert.js');

fuel/app/classes/controller/login.php

@@ -11,6 +11,14 @@ use Fuel\Core\FuelException;
 
 class Controller_Login extends Controller
 {
+    public function before()
+    {
+        parent::before();
+        $user = Session::get('user');
+
+        if($user)
+            Response::redirect('/home');
+    }
 
     public function action_index()
     {

fuel/app/classes/controller/register.php

@@ -9,6 +9,14 @@ use Fuel\Core\FuelException;
 
 class Controller_Register extends Controller
 {
+    public function before()
+    {
+        parent::before();
+        $user = Session::get('user');
+
+        if($user)
+            Response::redirect('/home');
+    }
 
     public function action_index()
     {

fuel/app/classes/controller/rest/install.php

@@ -397,37 +397,6 @@ class Controller_Rest_Install extends Controller_Rest
         }
     }
 
-    public function post_plex()
-    {
-        try {
-            $url = Input::post('url');
-
-            //@TODO CHECK AND REMOVE HTTP AND HTTPS
-
-            $port = Input::post('port');
-            $token = Input::post('token');
-
-            $curl = Request::forge('http://' . $url . ($port ? ':' . $port : '') . '/?X-Plex-Token=' . $token, 'curl');
-            $result = $curl->execute();
-
-            if(!$result)
-                throw new FuelException('Can not connect to your server!');
-
-            $server = Model_Server::forge();
-            $server->set([
-                'url'       => $url,
-                'port'      => $port,
-                'token'     => $token,
-                'lastcheck' => time()
-            ]);
-            $server->save();
-
-            return $this->response(array('error' => false));
-        } catch (FuelException $e) {
-            return $this->response(array('error' => true, 'message' => $e->getMessage()), 400);
-        }
-    }
-
     public function post_admin()
     {
         try {
@@ -460,4 +429,37 @@ class Controller_Rest_Install extends Controller_Rest
             return $this->response(array('error' => true, 'message' => $e->getMessage()), 404);
         }
     }
+
+    public function post_plex()
+    {
+        try {
+            $url = Input::post('url');
+
+            //@TODO CHECK AND REMOVE HTTP AND HTTPS
+
+            $port = Input::post('port');
+            $token = Input::post('token');
+
+            $curl = Request::forge('http://' . $url . ($port ? ':' . $port : '') . '/?X-Plex-Token=' . $token, 'curl');
+            $result = $curl->execute();
+
+            if(!$result)
+                throw new FuelException('Can not connect to your server!');
+
+            $server = Model_Server::forge();
+            $server->set([
+                'url'       => $url,
+                'port'      => $port,
+                'token'     => $token,
+                'lastcheck' => time()
+            ]);
+            $server->save();
+
+            Config::save('lock', array('FUCK OFF!'));
+
+            return $this->response(array('error' => false));
+        } catch (FuelException $e) {
+            return $this->response(array('error' => true, 'message' => $e->getMessage()), 400);
+        }
+    }
 }

fuel/app/classes/controller/rest/settings.php

@@ -1,7 +1,9 @@
 <?php
 
 use Fuel\Core\Controller_Rest;
+use Fuel\Core\FuelException;
 use Fuel\Core\Response;
+use Fuel\Core\Session;
 use Fuel\Core\View;
 
 class Controller_Rest_Settings extends Controller_Rest
@@ -12,4 +14,56 @@ class Controller_Rest_Settings extends Controller_Rest
 
         return new Response($view);
     }
+
+    public function post_server()
+    {
+        try {
+            $url = Input::post('url');
+
+            //@TODO CHECK AND REMOVE HTTP AND HTTPS
+
+            $port = Input::post('port');
+            $token = Input::post('token');
+
+            $curl = Request::forge('http://' . $url . ($port ? ':' . $port : '') . '/?X-Plex-Token=' . $token, 'curl');
+            $result = $curl->execute();
+
+            if(!$result)
+                throw new FuelException('Can not connect to your server!');
+
+            $server = Model_Server::forge();
+            $server->set([
+                'user_id'   => Session::get('user')->id,
+                'url'       => $url,
+                'port'      => $port,
+                'token'     => $token,
+                'lastcheck' => time()
+            ]);
+            $server->save();
+
+            return $this->response(array('error' => false));
+        } catch (FuelException $e) {
+            return $this->response(array('error' => true, 'message' => $e->getMessage() ?: 'Wrong parameters'), 400);
+        }
+    }
+
+    public function delete_server()
+    {
+        try {
+            $server = Input::delete('server_id');
+            $user = Session::get('user');
+
+            $server = Model_Server::find_by_pk($server);
+
+            if(!$server || $server->user_id !== $user->id)
+                throw new FuelException('No server found!');
+
+            $server->set(['disable' => 1]);
+            $server->save();
+
+            return $this->response(array('error' => false));
+        } catch (FuelException $e) {
+            return $this->response(array('error' => true, 'message' => $e->getMessage() ?: 'Wrong parameters'), 400);
+        }
+    }
 }

fuel/app/classes/controller/settings.php

@@ -1,6 +1,7 @@
 <?php
 
 use Fuel\Core\Controller_Template;
+use Fuel\Core\DB;
 use Fuel\Core\Response;
 use Fuel\Core\Session;
 use Fuel\Core\View;
@@ -31,12 +32,42 @@ class Controller_Settings extends Controller_Template
 
     public function action_servers()
     {
+        $this->template->js_bottom = ['plex_alert.js'];
+
         $body = View::forge('settings/servers');
 
-        $servers = Model_Server::find_by('user_id',Session::get('user')->id);
+        $user_id = Session::get('user')->id;
+
+        $servers = Model_Server::find(function($query) use($user_id) {
+            $query
+                ->where('user_id', $user_id)
+                ->and_where('disable', 0)
+            ;
+        });
 
         $body->set('servers', $servers);
 
         $this->template->body = $body;
     }
+
+    public function action_libraries()
+    {
+        $body = View::forge('settings/libraries');
+
+        $user_id = Session::get('user')->id;
+
+        $libraries = Model_Library::find(function($query) use($user_id) {
+            $query
+                ->select('library.*')
+                ->join('server', 'LEFT')
+                ->on('server.id', '=','library.server_id' )
+                ->where('server.user_id', $user_id)
+                ->and_where('server.disable', 0)
+            ;
+        });
+
+        $body->set('libraries', $libraries);
+
+        $this->template->body = $body;
+    }
 }

fuel/app/classes/model/library.php

@@ -17,6 +17,34 @@ class Model_Library extends Model_Overwrite
         'disable'
     );
 
+    private $_server = null;
+
+    public function getServer()
+    {
+        if(!$this->_server)
+            $this->_server = Model_Server::find_by_pk($this->server_id);
+
+        return $this->_server;
+    }
+
+    public function getLastUpdate()
+    {
+        $dateString = date('Y/m/d H:i:s', time());
+        $now = new DateTime($dateString);
+
+        $dateString = date('Y-m-d H:i:s', $this->updatedAt);
+        $time = new DateTime($dateString);
+
+        $diff = date_diff($now, $time);
+
+        $days = $diff->days . 'd ';
+        $hours = $diff->h . 'h ';
+        $minutes = $diff->i . 'min ';
+        $seconds = $diff->s . 's';
+
+        return $days.$hours.$minutes.$seconds;
+    }
+
     /**
      * List all libraries and register it in database
      * @param $server

fuel/app/classes/model/server.php

@@ -44,13 +44,6 @@ class Model_Server extends Model_Overwrite
 
     //$curl = Request::forge('http://' . $config['main']['server'] . ':' . $config['main']['port'] . '/:/prefs?X-Plex-Token=' . $config['main']['token'], 'curl');
 
-    public function initialise()
-    {
-        $servers = Model_Server::find();
-
-        self::BrowseServeur($servers);
-    }
-
     /**
      * Browse the list of server registered
      * @param null $_servers

fuel/app/config/lock.php

@@ -0,0 +1,3 @@
+<?php
+return array('FUCK OFF!');
+

fuel/app/views/home/index.php

@@ -1,28 +1,28 @@
 <div class="PageContent-pageContent-16mK6 Scroller-scroller-d5-b- Scroller-vertical-1bgGS ">
     <div class="DashboardPage-dashboardPageContent-2rN8X PageContent-innerPageContent-3ktLT">
         <div style="opacity: 1; pointer-events: auto;">
-            <div class="HubCell-hubCell-3Ys17" data-qa-id="hub--home.television.recent"
+            <div class="HubCell-hubCell-3Ys17" data-qa-id="tv_show"
                  style="visibility: visible;">
                 <div class="HubCellHeader-hubCellHeader-2pvYN">
                     <div class="HubCellTitle-hubCellTitle-2abIn"><a
                                 href="#" role="link" class="Link-link-2XYrU Link-default-32xSO">RECENTLY ADDED TV</a></div>
-                    <div class="HubCell-hubActions-28w1-">
-                        <button data-qa-id="hubPreviousButton" role="button"
+                    <div class="HubCell-hubActions-28w1- tv-shows-hubcell">
+                        <button role="button" data-hubcell-action="previous"
                                 class="HubCell-hubScrollButton-2Y7ri Link-link-2XYrU Link-default-32xSO isDisabled"
-                                type="button" disabled="">
-                            <i class="plex-icon-hub-prev-560" aria-hidden="false" aria-label="Previous Page"></i>
+                                type="button">
+                            <i class="plex-icon-hub-prev-560"></i>
                         </button>
-                        <button data-qa-id="hubNextButton" role="button"
+                        <button role="button" data-hubcell-action="next"
                                 class="HubCell-hubScrollButton-2Y7ri Link-link-2XYrU Link-default-32xSO"
                                 type="button">
-                            <i class="plex-icon-hub-next-560" aria-hidden="false" aria-label="Next Page"></i>
+                            <i class="plex-icon-hub-next-560"></i>
                         </button>
                     </div>
                 </div>
                 <div style="height: 275px; overflow: hidden;">
                     <div class="Measure-container-2XznZ">
-                        <div class="VirtualListScroller-scroller-37EU_ Scroller-scroller-d5-b- Scroller-horizontal-1k8ET ">
-                            <div class=" " style="width: 3019px; height: 275px;">
+                        <div id="tv_show_list" class="VirtualListScroller-scroller-37EU_ Scroller-scroller-d5-b- Scroller-horizontal-1k8ET ">
+                            <div class=" " style="width: 4540px; height: 275px;">
                                 <?php if($episodes) : ?>
                                 <?php
                                 $translate = -150;
@@ -115,29 +115,28 @@
                     </div>
                 </div>
             </div>
-            <div class="HubCell-hubCell-3Ys17" data-qa-id="hub--home.movies.recent"
+            <div class="HubCell-hubCell-3Ys17" data-qa-id="movies"
                  style="visibility: visible;">
                 <div class="HubCellHeader-hubCellHeader-2pvYN">
                     <div class="HubCellTitle-hubCellTitle-2abIn"><a
                                 href="#"
                                 role="link" class="Link-link-2XYrU Link-default-32xSO">RECENTLY ADDED MOVIES</a></div>
-                    <div class="HubCell-hubActions-28w1-">
-                        <button data-qa-id="hubPreviousButton" role="button"
+                    <div class="HubCell-hubActions-28w1- movies-hubcell">
+                        <button role="button" data-hubcell-action="previous"
                                 class="HubCell-hubScrollButton-2Y7ri Link-link-2XYrU Link-default-32xSO isDisabled"
-                                type="button" disabled=""><i class="plex-icon-hub-prev-560"
-                                                             aria-hidden="false"
-                                                             aria-label="Previous Page"></i>
+                                type="button">
+                            <i class="plex-icon-hub-prev-560"></i>
                         </button>
-                        <button data-qa-id="hubNextButton" role="button"
+                        <button role="button" data-hubcell-action="next"
                                 class="HubCell-hubScrollButton-2Y7ri Link-link-2XYrU Link-default-32xSO"
-                                type="button"><i class="plex-icon-hub-next-560" aria-hidden="false"
-                                                 aria-label="Next Page"></i></button>
+                                type="button">
+                            <i class="plex-icon-hub-next-560"></i>
                     </div>
                 </div>
                 <div style="height: 255px; overflow: hidden;">
                     <div class="Measure-container-2XznZ">
-                        <div class="VirtualListScroller-scroller-37EU_ Scroller-scroller-d5-b- Scroller-horizontal-1k8ET ">
-                            <div class=" " style="width: 3019px; height: 255px;">
+                        <div id="movies_list" class="VirtualListScroller-scroller-37EU_ Scroller-scroller-d5-b- Scroller-horizontal-1k8ET ">
+                            <div class=" " style="width: 4540px; height: 255px;">
                                 <?php if($movies) : ?>
                                 <?php
                                 $translate = -150;
@@ -237,5 +236,38 @@ $(function () {
             $('[data-movie-id="' + movie_id + '"] > div').css('background-image', 'url("/cover/movie?movie_id='+ movie_id +'&width='+ 126 +'&height='+189+'")');
         }, (index + 1) * 100);
     });
+    $('.HubCell-hubActions-28w1- button').on('click', function(){
+        var parent = $(this).closest('div[data-qa-id]');
+        var select = $(parent).data('qa-id');
+        var previous = $(parent).find('button[data-hubcell-action="previous"]');
+        var next = $(parent).find('button[data-hubcell-action="next"]');
+
+        if($(this).data('hubcell-action') === 'previous') {
+            $('#' + select + '_list').animate({scrollLeft: $('#' + select + '_list').scrollLeft() - 152 * 2}, 500);
+            setTimeout(function(){
+                if($('#' + select + '_list').scrollLeft() <= (150 * 19)) {
+                    $(next).removeClass('isDisabled');
+                }
+
+                if($('#' + select + '_list').scrollLeft() === 0) {
+                    $(previous).addClass('isDisabled');
+                }
+            }, 500);
+        }
+        if($(this).data('hubcell-action') === 'next') {
+            $('#' + select + '_list').animate({scrollLeft: $('#' + select + '_list').scrollLeft() + 152 * 2}, 500);
+            setTimeout(function(){
+                if($('#' + select + '_list').scrollLeft() > 0) {
+                    $(previous).removeClass('isDisabled');
+                }
+
+                console.log($('#' + select + '_list').scrollLeft());
+
+                if($('#' + select + '_list').scrollLeft() >= (150 * 19)) {
+                    $(next).addClass('isDisabled');
+                }
+            }, 500);
+        }
+    });
 });
 </script>

fuel/app/views/install/index.php

@@ -36,8 +36,8 @@
                                     <li><a class="card btn-gray selected" href="#checking">Configuration</a></li>
                                     <li><a class="card btn-gray" href="#SQL">Configuration SQL</a></li>
                                     <li><a class="card btn-gray" href="#create-table">Create Tables</a></li>
-                                    <li><a class="card btn-gray" href="#config-plex">Add plex server</a></li>
                                     <li><a class="card btn-gray" href="#admin">Create Admin Account</a></li>
+                                    <li><a class="card btn-gray" href="#config-plex">Add plex server</a></li>
                                 </ul>
                             </div>
                             <div class="col-sm-8 col-md-9">
@@ -283,99 +283,99 @@
                                         <span class="btn-label">Next ></span>
                                     </button>
                                 </div>
-                                <div id="config-plex" class="card-content hidden">
+                                <div id="admin" class="card-content hidden">
                                     <div class="FormGroup-group-15o1H">
                                         <form class="Page-page-aq7i_">
                                             <div class="PageHeader-pageHeader-18RSw">
-                                                Plex information:
+                                                Create Admin account:
                                             </div>
                                             <div>
-                                                <label class="FormLabel-label-1sr1f " for="url">
-                                                    Plex URL:
+                                                <label class="FormLabel-label-1sr1f " for="email">
+                                                    Admin Email:
                                                 </label>
-                                                <input id="url" name="url" placeholder="127.0.0.1"
-                                                       value="<?php echo isset($plex_url) ? $plex_url : ''; ?>"
+                                                <input id="email" name="email" placeholder="admin@domain.tld"
                                                        class="TextInput-input-34u_B input-input-2ol6B TextInput-large-3XjFh input-large-1cY_k"
                                                        type="text">
                                             </div>
                                             <div>
-                                                <label class="FormLabel-label-1sr1f " for="port">
-                                                    Plex Port:
+                                                <label class="FormLabel-label-1sr1f " for="username">
+                                                    Admin Username:
                                                 </label>
-                                                <input id="port" name="port" placeholder="3306"
-                                                       value="<?php echo isset($plex_port) ? $plex_port : ''; ?>"
+                                                <input id="username" name="username" placeholder="Admin"
                                                        class="TextInput-input-34u_B input-input-2ol6B TextInput-large-3XjFh input-large-1cY_k"
                                                        type="text">
                                             </div>
                                             <div>
-                                                <label class="FormLabel-label-1sr1f " for="token">
-                                                    Plex Token:
+                                                <label class="FormLabel-label-1sr1f " for="password">
+                                                    Admin Password:
                                                 </label>
-                                                <input id="token" name="token" placeholder="YOURTOKEN"
-                                                       value="<?php echo isset($plex_token) ? $plex_token : ''; ?>"
+                                                <input id="password" name="password" placeholder="••••••••••••••"
                                                        class="TextInput-input-34u_B input-input-2ol6B TextInput-large-3XjFh input-large-1cY_k"
-                                                       type="text">
+                                                       type="password">
+                                            </div>
+                                            <div>
+                                                <label class="FormLabel-label-1sr1f " for="cpassword">
+                                                    Admin Password Confirmation:
+                                                </label>
+                                                <input id="cpassword" name="cpassword" placeholder="••••••••••••••"
+                                                       class="TextInput-input-34u_B input-input-2ol6B TextInput-large-3XjFh input-large-1cY_k"
+                                                       type="password">
                                             </div>
                                         </form>
                                     </div>
                                     <button class="btn btn-lg btn-primary btn-loading col-sm-4"
-                                            onclick="check_plex()">
+                                            onclick="create_admin()">
                                         <span class="btn-label">Save it!</span>
                                     </button>
                                     <button class="btn btn-lg btn-link btn-loading col-sm-offset-8 col-sm-4 hidden"
                                             type="button"
-                                            onclick="next()">
-                                        <span class="btn-label">Next ></span>
+                                            onclick="window.location.replace('/login');">
+                                        <span class="btn-label">Finish!</span>
                                     </button>
                                 </div>
-                                <div id="admin" class="card-content hidden">
+                                <div id="config-plex" class="card-content hidden">
                                     <div class="FormGroup-group-15o1H">
                                         <form class="Page-page-aq7i_">
                                             <div class="PageHeader-pageHeader-18RSw">
-                                                Create Admin account:
+                                                Plex information:
                                             </div>
                                             <div>
-                                                <label class="FormLabel-label-1sr1f " for="email">
-                                                    Admin Email:
+                                                <label class="FormLabel-label-1sr1f " for="url">
+                                                    Plex URL:
                                                 </label>
-                                                <input id="email" name="email" placeholder="admin@domain.tld"
+                                                <input id="url" name="url" placeholder="127.0.0.1"
+                                                       value="<?php echo isset($plex_url) ? $plex_url : ''; ?>"
                                                        class="TextInput-input-34u_B input-input-2ol6B TextInput-large-3XjFh input-large-1cY_k"
                                                        type="text">
                                             </div>
                                             <div>
-                                                <label class="FormLabel-label-1sr1f " for="username">
-                                                    Admin Username:
+                                                <label class="FormLabel-label-1sr1f " for="port">
+                                                    Plex Port:
                                                 </label>
-                                                <input id="username" name="username" placeholder="Admin"
+                                                <input id="port" name="port" placeholder="3306"
+                                                       value="<?php echo isset($plex_port) ? $plex_port : ''; ?>"
                                                        class="TextInput-input-34u_B input-input-2ol6B TextInput-large-3XjFh input-large-1cY_k"
                                                        type="text">
                                             </div>
                                             <div>
-                                                <label class="FormLabel-label-1sr1f " for="password">
-                                                    Admin Password:
-                                                </label>
-                                                <input id="password" name="password" placeholder="••••••••••••••"
-                                                       class="TextInput-input-34u_B input-input-2ol6B TextInput-large-3XjFh input-large-1cY_k"
-                                                       type="password">
-                                            </div>
-                                            <div>
-                                                <label class="FormLabel-label-1sr1f " for="cpassword">
-                                                    Admin Password Confirmation:
+                                                <label class="FormLabel-label-1sr1f " for="token">
+                                                    Plex Token:
                                                 </label>
-                                                <input id="cpassword" name="cpassword" placeholder="••••••••••••••"
+                                                <input id="token" name="token" placeholder="YOURTOKEN"
+                                                       value="<?php echo isset($plex_token) ? $plex_token : ''; ?>"
                                                        class="TextInput-input-34u_B input-input-2ol6B TextInput-large-3XjFh input-large-1cY_k"
-                                                       type="password">
+                                                       type="text">
                                             </div>
                                         </form>
                                     </div>
                                     <button class="btn btn-lg btn-primary btn-loading col-sm-4"
-                                            onclick="create_admin()">
+                                            onclick="check_plex()">
                                         <span class="btn-label">Save it!</span>
                                     </button>
                                     <button class="btn btn-lg btn-link btn-loading col-sm-offset-8 col-sm-4 hidden"
                                             type="button"
-                                            onclick="window.location.replace('/login');">
-                                        <span class="btn-label">Finish!</span>
+                                            onclick="next()">
+                                        <span class="btn-label">Next ></span>
                                     </button>
                                 </div>
                             </div>
@@ -637,17 +637,20 @@
         document.getElementById('table').value = 'Please wait we are creating your tables!';
     }
 
-    function check_plex() {
-        var button = document.querySelector('#config-plex button');
-        var next = document.querySelector('#config-plex button.hidden');
+    function create_admin() {
+        var button = document.querySelector('#admin button');
+        var next = document.querySelector('#admin button.hidden');
 
-        var data = new FormData(document.querySelector('#config-plex form'));
+        var data = new FormData(document.querySelector('#admin form'));
 
         var xhr = new XMLHttpRequest();
-        xhr.open('POST', '/rest/install/plex.json');
+        xhr.open('POST', '/rest/install/admin.json');
 
         xhr.addEventListener('readystatechange', function () {
             if (xhr.readyState === XMLHttpRequest.DONE) {
+                if(xhr.status === 500)
+                    return show_alert('error', xhr.responseText);
+
                 var result = JSON.parse(xhr.responseText);
                 if(result.error === true) {
                     show_alert('error', result.message);
@@ -661,20 +664,17 @@
         xhr.send(data);
     }
 
-    function create_admin() {
-        var button = document.querySelector('#admin button');
-        var next = document.querySelector('#admin button.hidden');
+    function check_plex() {
+        var button = document.querySelector('#config-plex button');
+        var next = document.querySelector('#config-plex button.hidden');
 
-        var data = new FormData(document.querySelector('#admin form'));
+        var data = new FormData(document.querySelector('#config-plex form'));
 
         var xhr = new XMLHttpRequest();
-        xhr.open('POST', '/rest/install/admin.json');
+        xhr.open('POST', '/rest/install/plex.json');
 
         xhr.addEventListener('readystatechange', function () {
             if (xhr.readyState === XMLHttpRequest.DONE) {
-                if(xhr.status === 500)
-                    return show_alert('error', xhr.responseText);
-
                 var result = JSON.parse(xhr.responseText);
                 if(result.error === true) {
                     show_alert('error', result.message);

fuel/app/views/modal/modal.php

@@ -5,11 +5,11 @@
                 <button type="button" class="close" data-dismiss="modal"><i class="glyphicon remove-2"></i></button>
                 <h4 class="modal-title"><i class="modal-icon glyphicon server-plus"></i> Add a new server</h4></div>
             <div class="modal-body modal-body-scroll dark-scrollbar">
-                <div id="config-plex" class="card-content">
+                <div id="add-plex" class="card-content">
                     <div class="FormGroup-group-15o1H">
                         <form class="Page-page-aq7i_" style="height: auto">
                             <div class="PageHeader-pageHeader-18RSw">
-                                Plex information:
+                                Plex server information:
                             </div>
                             <div>
                                 <label class="FormLabel-label-1sr1f " for="url">
@@ -40,15 +40,9 @@
                             </div>
                         </form>
                     </div>
-                    <button class="btn btn-lg btn-primary btn-loading col-sm-4"
-                            onclick="check_plex()">
+                    <button class="btn btn-lg btn-primary col-sm-4">
                         <span class="btn-label">Save it!</span>
                     </button>
-                    <button class="btn btn-lg btn-link btn-loading col-sm-offset-8 col-sm-4 hidden"
-                            type="button"
-                            onclick="next()">
-                        <span class="btn-label">Next ></span>
-                    </button>
                 </div>
             </div>
             <div class="modal-footer">

fuel/app/views/settings/index.php

@@ -4,8 +4,8 @@
         <div class="row">
             <div class="col-sm-4 col-md-3">
                 <ul class="settings-nav nav nav-cards">
-                    <li><a class="card btn-gray selected" href="#general-web-group">Général</a></li>
-                    <li><a class="card btn-gray" href="#quality-web-group">Qualité</a></li>
+                    <li><a class="card btn-gray selected" href="#general-web-group">General</a></li>
+                    <li><a class="card btn-gray" href="#quality-web-group">Sub Account</a></li>
                     <li class="advanced-setting"><a class="card btn-gray" href="#debug-web-group">Débogage</a></li>
                     <li><a class="card btn-gray" href="#player-web-group">Lecteur</a></li>
                 </ul>
@@ -14,50 +14,11 @@
                 <form id="web-settings-form">
                     <div id="general-web-group" class="settings-group active"><h4 class="version-title"> Version
                             3.41.1 </h4>
-                        <div class="form-group"><label for="language">Langue</label> <select id="language">
+                        <div class="form-group">
+                            <label for="language">Langue</label>
+                            <select id="language">
                                 <option value="en"> English</option>
-                                <option value="en-GB"> English (UK)</option>
-                                <option value="af"> Afrikaans</option>
-                                <option value="my"> Burmese</option>
-                                <option value="ca"> Català</option>
-                                <option value="cs"> čeština</option>
-                                <option value="sr"> српски језик</option>
-                                <option value="da"> Dansk</option>
-                                <option value="de"> Deutsch</option>
-                                <option value="et"> eesti</option>
-                                <option value="es"> Español</option>
-                                <option value="es-419"> Español (Latinoamérica)</option>
-                                <option value="el"> Ελληνικά</option>
                                 <option value="fr" selected=""> Français</option>
-                                <option value="fr-CA"> Français Canadien</option>
-                                <option value="hr"> hrvatski</option>
-                                <option value="is"> Íslenska</option>
-                                <option value="it"> Italiano</option>
-                                <option value="lt"> lietuvių kalba</option>
-                                <option value="hu"> Magyar</option>
-                                <option value="nl"> Nederlands</option>
-                                <option value="no"> Norsk</option>
-                                <option value="pl"> Polski</option>
-                                <option value="pt"> Português</option>
-                                <option value="pt-BR"> Português Brasileiro</option>
-                                <option value="ru"> русский язык</option>
-                                <option value="ro"> română</option>
-                                <option value="sk"> slovenčina</option>
-                                <option value="sl"> Slovenščina</option>
-                                <option value="fi"> Suomeksi</option>
-                                <option value="sv"> Svenska</option>
-                                <option value="vi"> Tiếng Việt</option>
-                                <option value="tr"> Türkçe</option>
-                                <option value="uk"> українська</option>
-                                <option value="bg"> български език</option>
-                                <option value="zh"> 中文</option>
-                                <option value="zh-TW"> 臺語</option>
-                                <option value="ja"> 日本語</option>
-                                <option value="ko"> 한국어</option>
-                                <option value="th"> ไทย</option>
-                                <option value="fa"> فارسی</option>
-                                <option value="ar"> العربية</option>
-                                <option value="he"> עברית</option>
                             </select>
                             <p class="help-block">Aidez-nous à traduire cette application dans votre langue <a
                                         href="https://transifex.com/plex-1/plex-web" target="_blank">ici</a>.</p>

fuel/app/views/settings/libraries.php

@@ -0,0 +1,58 @@
+<div class="settings-container">
+    <div class="filter-bar">
+        <button class="toggle-advanced-btn btn btn-sm Button-primary-2LQVw pull-left add-libraries"
+                data-placement="top" data-toggle="tooltip" data-original-title="Add library"><i class="glyphicon circle-plus"></i></button>
+        <button class="toggle-advanced-btn btn btn-sm btn-default pull-right refresh">Refresh Libraries &nbsp;<i class="glyphicon refresh"></i></button>
+    </div>
+    <div class="devices-container row">
+        <div class="device-list-container col-sm-12 col-md-12">
+            <ul class="list card-tile-list">
+                <?php if($libraries) : ?>
+                <?php foreach ($libraries as $library) : ?>
+                <li class="card-tile-list-item card-3-col-item">
+                    <div class="card card-device">
+                        <div class="card-actions">
+                            <button class="edit-device-btn card-action-btn btn-info"
+                                    data-placement="top" data-toggle="tooltip" data-original-title="Refresh">
+                                <i class="glyphicon refresh"></i>
+                            </button>
+                            <button class="edit-device-btn card-action-btn"
+                                    data-placement="top" data-toggle="tooltip" data-original-title="Edit">
+                                <i class="glyphicon pencil"></i>
+                            </button>
+                            <button class="edit-device-btn card-action-btn btn-danger"
+                                    data-placement="top" data-toggle="tooltip" data-original-title="Disable">
+                                <i class="glyphicon ban"></i>
+                            </button>
+                            <button class="remove-libraries-btn card-action-btn btn-danger"
+                                    data-placement="top" data-toggle="tooltip" data-original-title="Delete">
+                                <i class="glyphicon remove-2"></i>
+                            </button>
+                        </div>
+                        <h4 class="name"><?php echo $library->name; ?> <span class="glyphicon ok-2 text-success"></span></h4>
+                        <div class="card-details">
+                            <div class="pull-right">
+                                <div class="last-seen text-muted"><i class="plex-icon-watch-later-560"></i> <?php echo $library->getLastUpdate(); ?></div>
+                                <span class="sync-info hidden">
+                            <span class="glyphicon circle-arrow-down sync-icon"></span>
+                            <span class="sync-count">123</span> / <span class="sync-size">456</span>
+                        </span>
+                            </div>
+                            <span class="version text-muted"><?php echo $library->type; ?></span>
+                            <div class="device-info-container">
+                                <div class="product"><?php echo $library->getServer()->name; ?></div>
+                                <div class="device text-muted"></div>
+                                <div class="platform-info text-muted">
+                                    <span class="platform">Linux</span>
+                                    <span class="platform-version">Debian 8</span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </li>
+                <?php endforeach; ?>
+                <?php endif; ?>
+            </ul>
+        </div>
+    </div>
+</div>

fuel/app/views/settings/servers.php

@@ -1,27 +1,42 @@
 <div class="settings-container">
     <div class="filter-bar">
-        <button class="toggle-advanced-btn btn btn-sm Button-primary-2LQVw pull-left add"><i class="glyphicon circle-plus"></i></button>
+        <button class="toggle-advanced-btn btn btn-sm Button-primary-2LQVw pull-left add"
+                data-placement="top" data-toggle="tooltip" data-original-title="Add server"><i class="glyphicon circle-plus"></i></button>
         <button class="toggle-advanced-btn btn btn-sm btn-default pull-right refresh">Refresh Servers &nbsp;<i class="glyphicon refresh"></i></button>
     </div>
     <div class="devices-container row">
         <div class="device-list-container col-sm-12 col-md-12">
             <ul class="list card-tile-list">
+                <?php if($servers) : ?>
                 <?php foreach ($servers as $server) : ?>
                 <li class="card-tile-list-item card-2-col-item">
                     <div class="card card-device">
                         <img class="card-poster device-icon" src="data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTEwIDExMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGZpbGw9IiNlNWEwMGQiIGQ9Im0wIDBoMTEwdjExMGgtMTEweiIvPjxwYXRoIGQ9Im0zMCA2MGMxNi41NjkgMCAzMC0xMy40MzEgMzAtMzAgMC0xNi41NjktMTMuNDMxLTMwLTMwLTMwLTE2LjU2OSAwLTMwIDEzLjQzMS0zMCAzMCAwIDE2LjU2OSAxMy40MzEgMzAgMzAgMzBtLS41NzEtNDguNzJsMTIuMTQ5IDE4Ljc0OS0xMi4xNSAxOC43NWgtNS41MDQtNS41MDR2LS4wMDRsMTIuMTQ3LTE4Ljc0Ni0xMi4xNDctMTguNzQ2di0uMDAyaDExLjAxIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyNSAyNSkiIGZpbGw9IiMxZjFmMWYiLz48L2c+PC9zdmc+">
                         <div class="card-actions">
-                            <button class="remove-device-btn card-action-btn btn-danger">
+                            <button class="edit-device-btn card-action-btn btn-info"
+                                    data-placement="top" data-toggle="tooltip" data-original-title="Refresh">
+                                <i class="glyphicon refresh"></i>
+                            </button>
+                            <button class="edit-device-btn card-action-btn"
+                                    data-placement="top" data-toggle="tooltip" data-original-title="Edit">
+                                <i class="glyphicon pencil"></i>
+                            </button>
+                            <button class="edit-device-btn card-action-btn btn-danger"
+                                    data-placement="top" data-toggle="tooltip" data-original-title="Disable">
+                                <i class="glyphicon ban"></i>
+                            </button>
+                            <button class="remove-libraries-btn card-action-btn btn-danger" data-server-id="<?php echo $server->id; ?>"
+                                    data-placement="top" data-toggle="tooltip" data-original-title="Delete">
                                 <i class="glyphicon remove-2"></i>
                             </button>
                         </div>
                         <h4 class="name"><?php echo $server->name; ?> <span data-placement="top" data-toggle="tooltip" data-original-title="<?php echo $server->online ? 'online' : 'offline' ; ?>" class="glyphicon <?php echo $server->online ? 'server text-success' : 'server-ban text-danger' ; ?>"></span></h4>
                         <div class="card-details">
                             <div class="pull-right">
-                                <div class="last-seen text-muted"><?php echo $server->getLastCheck(); ?></div>
+                                <div class="last-seen text-muted"><i class="plex-icon-watch-later-560"></i> <?php echo $server->getLastCheck(); ?></div>
                                 <span class="sync-info hidden">
                                     <span class="glyphicon circle-arrow-down sync-icon"></span>
-                                    <span class="sync-count">123</span> <span class="sync-size">123</span>
+                                    <span class="sync-count">123</span> / <span class="sync-size">456</span>
                                 </span>
                             </div>
                             <span class="version text-muted"><?php echo $server->version; ?></span>
@@ -37,6 +52,7 @@
                     </div>
                 </li>
                 <?php endforeach; ?>
+                <?php endif; ?>
             </ul>
         </div>
     </div>
@@ -48,14 +64,45 @@
                 method: 'get',
                 url: '/rest/settings/add_server.json'
             }).done(function (data) {
-                $('body').append(data);
-                setTimeout(function() {
+                $('body').append(data).delay(100).queue(function() {
                     $('.media-server-modal').removeClass('out').addClass('in');
-                }, 100);
+                });
             });
         });
         $(document).on('click', '.media-server-modal button.close', function () {
-            $('.media-server-modal').remove();
+            $('.media-server-modal').removeClass('in').addClass('out').delay(500).queue(function(){ $(this).remove()});
+        });
+        $(document).on('click', '#add-plex button', function () {
+            var url = $('#add-plex #url').val();
+            var port = $('#add-plex #port').val();
+            var token = $('#add-plex #token').val();
+            $.ajax({
+                method: 'post',
+                url: '/rest/settings/server.json',
+                data: {url: url, port: port, token: token}
+            }).done(function (data) {
+                show_alert('success', 'Server save succesfully!');
+                $('.media-server-modal button.close').click();
+            }).fail(function (data) {
+                data = JSON.parse(data.responseText);
+                show_alert('error', data.message);
+                setTimeout(function(){location.reload()}, 200);
+            });
+        });
+        $(document).on('click', 'button.remove-device-btn', function () {
+            var button = this;
+            var server_id = $(this).data('server-id');
+            $.ajax({
+                method: 'delete',
+                url: '/rest/settings/server.json',
+                data: {server_id: server_id}
+            }).done(function (data) {
+                show_alert('success', 'Server delete succesfully!');
+                $(button).closest('li').get(0).remove();
+            }).fail(function (data) {
+                data = JSON.parse(data.responseText);
+                show_alert('error', data.message);
+            });
         });
     });
     // UPDATE DATA SERVER AND BROWSING

public/assets/css/normalize.css

@@ -4724,7 +4724,7 @@ label.disabled {
 
 .alert > .alert-icon {
     position: absolute;
-    top: 50%;
+    top: 40%;
     left: 35px;
     margin-top: -24px;
     font-size: 48px;
@@ -9924,11 +9924,15 @@ a.card:focus, a.card:hover {
     font-size: 16px
 }
 
-.card-action-btn.btn-danger, .card-action-btn.btn-success {
-    color: #ac3323
-}
-
-.card-action-btn.btn-danger:active, .card-action-btn.btn-danger:focus, .card-action-btn.btn-danger:hover, .card-action-btn.btn-success:active, .card-action-btn.btn-success:focus, .card-action-btn.btn-success:hover {
+.card-action-btn.btn-danger:active,
+.card-action-btn.btn-danger:focus,
+.card-action-btn.btn-danger:hover,
+.card-action-btn.btn-success:active,
+.card-action-btn.btn-success:focus,
+.card-action-btn.btn-success:hover,
+.card-action-btn.btn-info:active,
+.card-action-btn.btn-info:focus,
+.card-action-btn.btn-info:hover {
     background: none;
     border: 0;
     outline: 0;
@@ -9936,6 +9940,14 @@ a.card:focus, a.card:hover {
     box-shadow: none
 }
 
+.card-action-btn.btn-info {
+    color: #2d6ca2;
+}
+
+.card-action-btn.btn-danger {
+    color: #ac3323
+}
+
 .card-action-btn.btn-success {
     color: #5cb85c
 }
@@ -9954,15 +9966,19 @@ a.card:focus, a.card:hover {
     cursor: default
 }
 
-.card-action-btn.btn-danger, .card-action-btn.btn-success {
+.card-action-btn.btn-danger, .card-action-btn.btn-info.disabled, .card-action-btn.btn-success {
     background: none
 }
 
-.card-action-btn.btn-danger.disabled, .card-action-btn.btn-success.disabled {
+.card-action-btn.btn-danger.disabled, .card-action-btn.btn-info.disabled, .card-action-btn.btn-success.disabled {
     opacity: .2;
     filter: alpha(opacity=20)
 }
 
+.card-action-btn.btn-info.disabled {
+    color: #2d6ca2;
+}
+
 .card-action-btn.btn-success.disabled {
     color: #5cb85c
 }