diff --git a/css/constants.scss b/css/constants.scss index dc3e6dc..0b86bd2 100644 --- a/css/constants.scss +++ b/css/constants.scss @@ -1,2 +1,2 @@ -$theme-color: #f97a53; -$theme-color: #5395f9; \ No newline at end of file +$theme-color: #4662d4; +$theme-color: #00A6EB; \ No newline at end of file diff --git a/css/container.css b/css/container.css index a8a680f..5ac7da1 100755 --- a/css/container.css +++ b/css/container.css @@ -1,2 +1,2 @@ - +#WRAPPER>#CONTAINER>.sub-menu-side{display:block;position:relative}#WRAPPER>#CONTAINER>.sub-menu-side>span[data-sublink]{display:block;position:relative;padding:.3em 1.5em;border-radius:3px;background:url("../src/?static/sub-menu-side.svg") left 0.25em center no-repeat;background-size:1.1em;color:#5b5e63;text-shadow:1px 1px white;white-space:nowrap;transition:all .2s;cursor:pointer}#WRAPPER>#CONTAINER>.sub-menu-side>span[data-sublink]:hover,#WRAPPER>#CONTAINER>.sub-menu-side>span[data-sublink].active{background-color:#d8deea;box-shadow:inset 0 0 4px #c8ced9} /*# sourceMappingURL=container.css.map */ diff --git a/css/container.scss b/css/container.scss index e69de29..542d0dc 100755 --- a/css/container.scss +++ b/css/container.scss @@ -0,0 +1,41 @@ +#WRAPPER > #CONTAINER{ + + /**************************/ + /* Menu interne (submenu) */ + /**************************/ + & > .sub-menu-side{ + display: block; + position: relative; + + // Les liens du menu + & > span[data-sublink]{ + display: block; + position: relative; + + padding: .3em 1.5em; + + border-radius: 3px; + + background: url('../src/?static/sub-menu-side.svg') left .25em center no-repeat; + background-size: 1.1em; + + color: #5b5e63; + text-shadow: 1px 1px white; + white-space: nowrap; + + transition: all .2s; + + cursor: pointer; + + &:hover, + &.active{ + background-color: #d8deea; + box-shadow: inset 0 0 4px #c8ced9; + } + + } + + } + + +} \ No newline at end of file diff --git a/css/header.css b/css/header.css index 1f84728..36e8b68 100755 --- a/css/header.css +++ b/css/header.css @@ -1,2 +1,2 @@ -#WRAPPER>#HEADER>.icon{display:block;position:absolute;top:0;left:0;width:4em;height:4em;background-color:#2277f7;background-image:url("../src/static/icon.svg");background-position:center center;background-repeat:no-repeat;background-size:50% 50%;cursor:pointer;transition:all .3s}#WRAPPER>#HEADER>.icon:hover{background-color:#0967f6}#WRAPPER>#HEADER.loading>.icon{background-image:url("../src/static/loader.svg");background-size:70% 70%} +#WRAPPER>#HEADER>.icon{display:block;position:absolute;top:0;left:0;width:4em;height:4em;background-color:#0082b8;background-image:url("../src/static/icon.svg");background-position:center center;background-repeat:no-repeat;background-size:50% 50%;cursor:pointer;transition:all .3s}#WRAPPER>#HEADER>.icon:hover{background-color:#00709f}#WRAPPER>#HEADER.loading>.icon{background-image:url("../src/static/loader.svg");background-size:70% 70%} /*# sourceMappingURL=header.css.map */ diff --git a/css/header.scss b/css/header.scss index 78c1fbf..6b7f148 100755 --- a/css/header.scss +++ b/css/header.scss @@ -1,4 +1,3 @@ - @import 'constants'; diff --git a/css/layout.css b/css/layout.css index 3ab2cb9..9191fd2 100755 --- a/css/layout.css +++ b/css/layout.css @@ -1,2 +1,2 @@ -#WRAPPER{display:block;position:fixed;top:0;left:0;width:100%;height:100%;background-color:#edf0f5;font-family:'Ubuntu'}#WRAPPER>#HEADER{display:block;position:absolute;top:0;left:0;width:100%;height:calc( 4em - 1px );border-bottom:1px solid #2277f7;background-color:#5395f9;z-index:10}#WRAPPER>#MENU-SIDE{display:block;position:absolute;top:4em;left:0;width:4em;height:100%;box-shadow:2px 1px 3px #ddd;background-color:#fff;transition:all .3s;z-index:9}#WRAPPER>#CONTAINER{display:block;position:absolute;top:4em;left:4em;width:calc( 100% - 4em - 2*1em );height:calc( 100% - 4em - 2*1em );padding:1em;overflow-x:none;overflow-y:auto} +#WRAPPER{display:block;position:fixed;top:0;left:0;width:100%;height:100%;background-color:#edf0f5;font-family:'Ubuntu'}#WRAPPER>#HEADER{display:block;position:absolute;top:0;left:0;width:100%;height:calc( 4em - 1px );border-bottom:1px solid #0082b8;background-color:#00A6EB;z-index:10}#WRAPPER>#MENU-SIDE{display:block;position:absolute;top:4em;left:0;width:4em;height:100%;box-shadow:2px 1px 3px #ddd;background-color:#fff;transition:all .3s;z-index:9}#WRAPPER>#CONTAINER{display:flex;position:absolute;top:4em;left:4em;width:calc( 100% - 4em - 2*1em );height:calc( 100% - 4em - 2*1em );padding:1em;flex-direction:row;justify-content:space-between;overflow-x:none;overflow-y:auto} /*# sourceMappingURL=layout.css.map */ diff --git a/css/layout.scss b/css/layout.scss index 8c802b0..3c3b8dd 100755 --- a/css/layout.scss +++ b/css/layout.scss @@ -56,7 +56,7 @@ /* [3] Container de la page ==========================================*/ & > #CONTAINER{ - display: block; + display: flex; position: absolute; top: 4em; left: 4em; @@ -64,6 +64,10 @@ height: calc( 100% - 4em - 2*1em ); padding: 1em; + // Flex properties + flex-direction: row; + justify-content: space-between; + overflow-x: none; overflow-y: auto; } diff --git a/index.php b/index.php index 5f163b9..18c6a24 100644 --- a/index.php +++ b/index.php @@ -1,6 +1,13 @@ page d'accueil $R->get('/?', function(){ header('Location: /dashboard/'); }); - $R->get('dashboard/(?::submenu/)*', function($sm){ var_dump(func_get_args()); $subMenu = $sm; include __ROOT__.'/view.php'; }); - $R->get('machines/(?::submenu/)*', function($sm){ $subMenu = $sm; include __ROOT__.'/view.php'; }); - $R->get('users/(?::submenu/)*', function($sm){ $subMenu = $sm; include __ROOT__.'/view.php'; }); - $R->get('sync/(?::submenu/)*', function($sm){ $subMenu = $sm; include __ROOT__.'/view.php'; }); - $R->get('settings/(?::submenu/)*', function($sm){ $subMenu = $sm; include __ROOT__.'/view.php'; }); + // nomPage/arg1/arg2 -> inclusion de la page + $R->get('dashboard(?:/[\w-]+)*/??', function(){ include __ROOT__.'/view.php'; }); + $R->get('machines(?:/[\w-]+)*/??', function(){ include __ROOT__.'/view.php'; }); + $R->get('users(?:/[\w-]+)*/??', function(){ include __ROOT__.'/view.php'; }); + $R->get('sync(?:/[\w-]+)*/??', function(){ include __ROOT__.'/view.php'; }); + $R->get('settings(?:/[\w-]+)*/??', function(){ include __ROOT__.'/view.php'; }); - $R->get('dashboard', function(){ header('Location: /dashboard/'); }); - $R->get('machines', function(){ header('Location: /machines/'); }); - $R->get('users', function(){ header('Location: /users/'); }); - $R->get('sync', function(){ header('Location: /sync/'); }); - $R->get('settings', function(){ header('Location: /settings/'); }); + // nomPage -> nomPage/ + $R->get('dashboard', function(){ header('Location: /dashboard/'); }); + $R->get('machines', function(){ header('Location: /machines/'); }); + $R->get('users', function(){ header('Location: /users/'); }); + $R->get('sync', function(){ header('Location: /sync/'); }); + $R->get('settings', function(){ header('Location: /settings/'); }); - $R->get('dashboard/', function(){ include __ROOT__.'/view.php'; }); - $R->get('machines/', function(){ include __ROOT__.'/view.php'; }); - $R->get('users/', function(){ include __ROOT__.'/view.php'; }); - $R->get('sync/', function(){ include __ROOT__.'/view.php'; }); - $R->get('settings/', function(){ include __ROOT__.'/view.php'; }); + $R->get('dashboard/', function(){ include __ROOT__.'/view.php'; }); + $R->get('machines/', function(){ include __ROOT__.'/view.php'; }); + $R->get('users/', function(){ include __ROOT__.'/view.php'; }); + $R->get('sync/', function(){ include __ROOT__.'/view.php'; }); + $R->get('settings/', function(){ include __ROOT__.'/view.php'; }); - // Correction d' + // Dispatcher + $R->get('f(?:/([\w-]+))*/?', function(){ new manager\Dispatcher($_GET['url']); }); + + // N'importe -> page d'accueil $R->get('.+', function(){ header('Location: /dashboard/'); }); diff --git a/manager/Dispatcher.php b/manager/Dispatcher.php new file mode 100755 index 0000000..b5fa2bd --- /dev/null +++ b/manager/Dispatcher.php @@ -0,0 +1,191 @@ + L'url courante + * + * @GET Arguments indirects (variable $_GET) + * + * @return status Retourne si oui ou non tout s'est bien passe + * + */ + public function __construct($url){ + /* [1] On recupere les donnees de l'URL + ==================================================*/ + $serialFlags = array_slice( explode('/',$url), 1 ); + + /* [2] On check/cree les drapeaux avec ces donnees + ==================================================*/ + if( !$this->createFlags($serialFlags) ) // Creation des drapeaux + return false; // On retourne FALSE, si erreur + + + /* [3] On construit le chemin a partir des tags + ==================================================*/ + if( !$this->buildPath() ) // Construction du chemin + return false; // On retourne FALSE, si erreur + + /* [4] On gere l'affichage pour l'appel externe + ==================================================*/ + $this->view(); + + + + return true; + + } + + + + /* FONCTION QUI VERIFIE LES DRAPEAUX + * + * @serialFlags Tableau a indice numerique + * + * @return correct Retourne si oui ou non les drapeaux sont corrects + * + */ + private function createFlags($serialFlags){ + /* [1] Verification des flags (version serialisee) + ======================================================*/ + + $correct = true; + + // Verification du nombre de drapeaux () au moins 3 + $correct = $correct && count($serialFlags) >= 3; + + // Verification que l'extension est correcte + $correct = $correct && array_search($serialFlags[0], self::$supported_extensions) !== false; + + // Verification du filename + $correct = $correct && preg_match('#^[\w_-]+$#i', $serialFlags[1]); + + // Verification du parent + $correct = $correct && array_search($serialFlags[2], self::$supported_parents) !== false; + + // Verification du sous-parent (optionnel) + $opt_subParent = count($serialFlags) >= 4; + + if( $opt_subParent ) + $correct = $correct && preg_match('#^[\w_-]+$#i', $serialFlags[3]); + + + if( !$correct ) + return false; + + + + /* [2] Creation (non serialisee) des flags + ======================================================*/ + // Si tout se deroule bien, on cree les flags + $this->flags = array( + 'extension' => $serialFlags[0], + 'filename' => $serialFlags[1], + 'parent' => $serialFlags[2] + ); + + // Ajout du sous-parent optionnel + if( $opt_subParent ) + $this->flags['subparent'] = $serialFlags[3]; + + return true; + + + } + + + /* FONCTION QUI CONSTRUIT LE CHEMIN A PARTIR DU PATH + * + * @return fileExists Retourne si oui ou non le fichier cible existe + * + * @format + * + * f/extension/filename/parent/:subparent:/ (:OPT:) + * + */ + private function buildPath(){ + /* [1] On recupere le HEADER associe a l'extension + ==========================================================*/ + $index_header = array_search($this->flags['extension'], self::$supported_extensions); + + // Si l'extension n'est pas repertoriee, on retourne une erreur + if( $index_header === false ) return false; + + // Si aucun header pour cet indice, on retourne une erreur + if( !isset(self::$supported_extensions_header[$index_header]) ) return false; + + // On recupere le header associe + $header = self::$supported_extensions_header[$index_header]; + + + + + + /* [2] On recupere le chemin associe au parent + ==========================================================*/ + $index_parent = array_search($this->flags['parent'], self::$supported_parents); + + // Si le parent n'est pas repertorie, on retourne une erreur + if( $index_parent === false ) return false; + + // Si aucun dossier pour cet indice, on retourne une erreur + if( !isset(self::$supported_parents_folder[$index_parent]) ) return false; + + // On recupere le dossier associe + $parent = self::$supported_parents_folder[$index_parent]; + + + /* [3] Gestion du sous-parent optionnel + ==========================================================*/ + $opt_subParent = (isset($this->flags['subparent'])) ? $this->flags['subparent'].'/' : ''; + + + /* [4] On definit le header + ==========================================================*/ + $this->header = $header; + + /* [5] On construit le chemin + ==========================================================*/ + $this->path = __ROOT__.$parent.'/'.$opt_subParent.$this->flags['filename'].'.'.$this->flags['extension']; + + /* [6] On retourne si le fichier existe ou non + ==========================================================*/ + return file_exists( $this->path ); + + } + + + + + /* FUNCTION QUI AFFICHE LA RESSOURCE EN QUESTION + * + */ + public function view(){ + // On definit le header + header('Content-Type: '.$this->header); + + // On inclut le contenu + include $this->path; + } + + + + } + +?> \ No newline at end of file diff --git a/router/Route.php b/router/Route.php index 87485b2..80217e0 100644 --- a/router/Route.php +++ b/router/Route.php @@ -25,8 +25,7 @@ class Route{ $this->callback = $callback; // On formatte le pattern en regexp - $this->pattern = preg_replace('#:(\w+)#i', '([^/]+)', $pattern); - $this->pattern = '#^'.$this->pattern.'$#'; + $this->pattern = '#^'.$pattern.'$#'; return $this; } @@ -56,7 +55,7 @@ class Route{ * */ public function call(){ - return call_user_func_array($this->callback, $this->matches); + return call_user_func($this->callback, $this->matches); } } diff --git a/src/dynamic/create.svg b/src/dynamic/create.svg new file mode 100644 index 0000000..5628266 --- /dev/null +++ b/src/dynamic/create.svg @@ -0,0 +1,71 @@ + + + + + + image/svg+xml + + + + + + + + + + + + + + diff --git a/src/dynamic/edit.svg b/src/dynamic/edit.svg new file mode 100644 index 0000000..203eb70 --- /dev/null +++ b/src/dynamic/edit.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/dynamic/filter.svg b/src/dynamic/filter.svg new file mode 100644 index 0000000..925e5dd --- /dev/null +++ b/src/dynamic/filter.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/dynamic/remove.svg b/src/dynamic/remove.svg new file mode 100644 index 0000000..8ca0e3c --- /dev/null +++ b/src/dynamic/remove.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/dynamic/search.svg b/src/dynamic/search.svg new file mode 100644 index 0000000..8708b76 --- /dev/null +++ b/src/dynamic/search.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/index.php b/src/index.php deleted file mode 100755 index e82d2c2..0000000 --- a/src/index.php +++ /dev/null @@ -1,52 +0,0 @@ -$v) - array_push($info, $k); - - - /* [2] Verification des donnees recues - ======================================*/ - $infoChecker = count($info) >= 3; - $infoChecker = $infoChecker && ($index=array_search($info[0], $extensions)) !== false; - - // Gestion de la declinaison si existe - $subView = ( count($info)>=4 && $info[3] != 'noheader' ) ? $info[3].'/' : ''; - - /* (1) Erreur */ - if( !$infoChecker ) exit(1); - - /* (2) Cas de $info[0] */ - switch($info[1]){ - case 'static': - $path = __ROOT__.'/static/'.$subView.$info[2].'.'.$info[0]; - - // On verifie si le fichier existe - if( file_exists($path) ){ - if( !isset($_GET['noheader']) ) - header('Content-type:'.$extensionHeader[$index]); - include $path; - } - break; - - } - -?> \ No newline at end of file diff --git a/src/static/menu-dashboard.svg b/src/static/menu-side/menu-dashboard.svg similarity index 100% rename from src/static/menu-dashboard.svg rename to src/static/menu-side/menu-dashboard.svg diff --git a/src/static/menu-machines.svg b/src/static/menu-side/menu-machines.svg similarity index 100% rename from src/static/menu-machines.svg rename to src/static/menu-side/menu-machines.svg diff --git a/src/static/menu-settings.svg b/src/static/menu-side/menu-settings.svg similarity index 100% rename from src/static/menu-settings.svg rename to src/static/menu-side/menu-settings.svg diff --git a/src/static/menu-sync.svg b/src/static/menu-side/menu-sync.svg similarity index 100% rename from src/static/menu-sync.svg rename to src/static/menu-side/menu-sync.svg diff --git a/src/static/menu-users.svg b/src/static/menu-side/menu-users.svg similarity index 100% rename from src/static/menu-users.svg rename to src/static/menu-side/menu-users.svg diff --git a/src/static/users2.svg b/src/static/menu-side/users2.svg similarity index 100% rename from src/static/users2.svg rename to src/static/menu-side/users2.svg diff --git a/src/static/sub-menu-side/create.svg b/src/static/sub-menu-side/create.svg new file mode 100644 index 0000000..5628266 --- /dev/null +++ b/src/static/sub-menu-side/create.svg @@ -0,0 +1,71 @@ + + + + + + image/svg+xml + + + + + + + + + + + + + + diff --git a/src/static/sub-menu-side/edit.svg b/src/static/sub-menu-side/edit.svg new file mode 100644 index 0000000..203eb70 --- /dev/null +++ b/src/static/sub-menu-side/edit.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/static/sub-menu-side/filter.svg b/src/static/sub-menu-side/filter.svg new file mode 100644 index 0000000..925e5dd --- /dev/null +++ b/src/static/sub-menu-side/filter.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/static/sub-menu-side/remove.svg b/src/static/sub-menu-side/remove.svg new file mode 100644 index 0000000..8ca0e3c --- /dev/null +++ b/src/static/sub-menu-side/remove.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/static/sub-menu-side/search.svg b/src/static/sub-menu-side/search.svg new file mode 100644 index 0000000..8708b76 --- /dev/null +++ b/src/static/sub-menu-side/search.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/todo.md b/todo.md index 0db43d4..4bbb1d8 100644 --- a/todo.md +++ b/todo.md @@ -9,10 +9,12 @@ ############ # EN COURS # ############ + - [.] Design de structure (layout) - [x] Header - [x] Menu-side - [.] Submenu-side + - [.] Gestion JS de la navigation - [x] Gestion de liens+URL du menu - [ ] Gestion des liens+URL du submenu @@ -20,6 +22,9 @@ ######## # FAIT # ######## +- [x] Dispatcher+Route pour les images (image/svg) + - [x] Inclusions maintenant par URL (forcer l'utilisation du Dispatcher) + - [x] Routage modifie - [x] Gestion complete de la navigation de niveau 0 - [x] Ajout d'un loader pour page-manager.js - [x] Autoloader avec namespace diff --git a/view.php b/view.php index 795e5b2..3d47d64 100755 --- a/view.php +++ b/view.php @@ -42,11 +42,11 @@ diff --git a/view/dashboard.php b/view/dashboard.php index 4e2a8f8..021dd98 100644 --- a/view/dashboard.php +++ b/view/dashboard.php @@ -1,6 +1,6 @@ -