diff --git a/COMMENT_CA_MARCHE.md b/COMMENT_CA_MARCHE.md new file mode 100644 index 0000000..639487f --- /dev/null +++ b/COMMENT_CA_MARCHE.md @@ -0,0 +1,73 @@ +# BsHelper + +__BsHelper::modal(string $header, string $body, array $options = array(), array $buttons = array())__ + +_param string $header_ : +Contenu de l'en-tête +_param string $body_ : +Contenu du corps +_param array $options_ : +Tableau indiquant l'ID du modal, classes supplémentaires et la présence ou non dans un formulaire. +_param array $buttons_ : +Tableau caractérisant les 3 boutons du modal. + +Créer un modal de Bootstrap : + + echo $this->Bs->modal('Mon en-tête', 'Mon contenu'); + +Crée une modal simple sans bouton close et confirm. + +Pour personnalisé vos boutons, utilisez le tableau $buttons : + + $this->Bs->modal( + 'Mon en-tête', + 'Mon contenu', + array( + 'id' => 'abc123', + 'class' => 'modal-form', + ), + array( + 'open' => array( + 'name' => 'S'inscrire', + 'class' => 'btn-success' + ), + 'close' => array( + 'name' => 'Annuler', + 'class' => 'btn-link' + ), + 'confirm' => array( + 'name' => 'Confirmer', + 'link' => array( + 'controller' => 'monController', + 'action' => 'monAction' + ), + 'class' => 'btn-success' + ) + ) + ); + +Si vous voulez naviguer en dehors du projet en cliquant sur le bouton confirmer, utilisez une URL absolue à la place du tableau de CakePHP. + +Pour insérer un formulaire dans le body : + + $this->Bs->modal('Mon en-tête', $form); + +La variable $form désigne ici le code HTML de votre formulaire. + +---------------------------------------------------------------------------------------------------------------------------- + +__BeHelper::alert(string $text, string $state, array $options = array())__ + +$text : Définit le contenu de l'alerte. +$state : L'état bootrstrap de l'alerte. +$options : Tableau d'options caractérisant l'alerte. + + $this->Bs->alert('monTexte', 'warning'); + +Donnera : + + '' + +Le tableau $options prend des attributs HTML classiques, mais aussi l'index 'dismiss' (true/false) pour définir si l'alerte peut être fermée ou non. Par défaut à true. + + $this->Bs->alert('monTexte', 'warning', array('dismiss' => 'true', 'id' => 'monId', 'style' => 'color:purple ;')); diff --git a/View/Helper/BsHelper.php b/View/Helper/BsHelper.php old mode 100644 new mode 100755 index bf8c0e1..090ff2a --- a/View/Helper/BsHelper.php +++ b/View/Helper/BsHelper.php @@ -1,6 +1,6 @@ ' . BL; $out .= '' . BL; $out .= '' . BL; @@ -86,7 +93,7 @@ public function html($titre = '' , $description = '' , $lang = 'fr') { $out .= ''.$titre.'' . BL; $out .= '' . BL; $out .= '' . BL; - + return $out; } @@ -101,37 +108,37 @@ public function html($titre = '' , $description = '' , $lang = 'fr') { */ public function html5($titre = '' , $description = '' , $lang = 'fr') { - + $out = $this->html($titre , $description , $lang); - + // Script JS for IE and HTML 5 $out .= '' . BL; - + return $out; } - + /** * Close the head element and initialize the body element * * @return string */ - + public function body($classBody = '') { - + $out = '' . BL; - + if($classBody == '') $out .= '' . BL; - else + else $out .= '' . BL; - + return $out; } - - + + /** * Close the body element and the html element * @@ -139,13 +146,13 @@ public function body($classBody = '') { */ public function end() { - + $out = '' . BL; $out .= ''; - + return $out; } - + /** * Load CSS for the current page @@ -155,7 +162,7 @@ public function end() { */ public function css($path = array(), $options = array()) { - + $out = parent::css($this->pathCSS). BL ; if ($this->fa_load) { $out .= parent::css($this->fa_path) . BL; @@ -163,11 +170,14 @@ public function css($path = array(), $options = array()) { if ($this->bs_addon_load) { $out .= parent::css($this->bs_addon_path) . BL; } - + if ($this->dp_css_path) { + $out .= parent::css($this->dp_css_path) . BL; + } + // Others CSS foreach($path as $css) $out .= parent::css($css, $options) . BL; - + return $out; } @@ -180,17 +190,18 @@ public function css($path = array(), $options = array()) { */ public function js($array_js = array()) { - + $out = parent::script($this->pathJquery) . BL; $out .= parent::script($this->pathJS) . BL; - + $out .= parent::script($this->dp_js_path). BL; + // Others JS foreach($array_js as $js) $out .= parent::script($js). BL; - + return $out; } - + /** * Close div elements * @@ -246,7 +257,7 @@ public function container($options = array()) { $out = ''; $class = CONTAINER; if(isset($options['class'])) - $class .= SP . $options['class']; + $class .= SP . $options['class']; $out .= parent::div($class , null, $options). BL; return $out; } @@ -269,7 +280,7 @@ public function row($options = array()) { /** * Create a
element. - * + * * Differents layouts with options. * * ### Construction @@ -295,7 +306,7 @@ public function row($options = array()) { * * @param string layout, size and options (offset, push and/or pull) * @param array $attributes Options of the div element - * @return string DIV tag element + * @return string DIV tag element */ public function col() { $class = ''; @@ -322,7 +333,7 @@ public function col() { $device = str_replace($replace, '.', $device); $device = explode('.', $device); - // Sould define the device in first + // Sould define the device in first foreach ($device as $elem) { if (!$ecran) { $nom = substr($elem, 0, 2); @@ -377,7 +388,7 @@ private function optCol($elem, $screen){ case 'ph': return 'col-'.$screen.'-push-'.$size; break; - + case 'of': return 'col-'.$screen.'-offset-'.$size; break; @@ -429,20 +440,20 @@ private function optCol($elem, $screen){ /** * Initialize the table with the head and the body element. - * @param array $titles 'title' => title of the cell + * @param array $titles 'title' => title of the cell * 'width' => width in percent of the cell * 'hidden' => layout * @param array $class classes of the table (hover, striped, etc) * @return string */ - function table($titles, $class = array()) { - + public function table($titles, $class = array()) { + $classes = ''; $out = '
'; if (!empty($class)) { foreach ($class as $opt) { - $classes .= ' table-'.$opt; + $classes .= ' table-'.$opt; } } @@ -457,7 +468,7 @@ function table($titles, $class = array()) { $tablePos = 0; $nbColumn = count($titles); $width = false; - + foreach($titles as $title) { $classVisibility = ''; if(isset($title['hidden'])) { @@ -478,7 +489,7 @@ function table($titles, $class = array()) { $out .= $classVisibility.'">'.$title['title'].''; $tablePos ++; } - + $out .= _TR; $out .= ''; $out .= ''; @@ -486,11 +497,11 @@ function table($titles, $class = array()) { $this->_nbColumn = $nbColumn - 1; $this->_tableClassesCells = $tableClassesCells; $this->_cellPos = 0; - $this->_openLine = 0; + $this->_openLine = 0; } return $out; } - + /** * Create a cell () @@ -504,10 +515,10 @@ public function cell($content, $class = '', $autoformat = true) { $out = ''; $classVisibility = ''; $cellPos = $this->_cellPos; - + if($cellPos == 0 && $this->_openLine == 0) $out .= TR; - + $this->_openLine = 0; if($this->_tableClassesCells[$cellPos]) @@ -517,9 +528,9 @@ public function cell($content, $class = '', $autoformat = true) { $out .= ''; else $out .= TD; - + $out .= $content; - + if($autoformat) { $out .= _TD; @@ -538,7 +549,7 @@ public function cell($content, $class = '', $autoformat = true) { } return $out; } - + /** * Color a line () @@ -573,12 +584,45 @@ public function endTable() { *--------------------------*/ +/** + * Create a bootstrap alert element. + * + * @param string $text Alert content + * @param string $state Bootstrap state + * @param array $options HTML attributes + * + * @return string + */ + public function alert($text, $state, $options = array()) { + + if (!isset($options['class'])) { + $options['class'] = 'alert alert-'.$state; + } else { + $options['class'] .= ' alert alert-'.$state; + } + if (!isset($options['dismiss']) or $options['dismiss'] == 'true') { + $dismiss = ''; + } + unset($options['dismiss']); + $out = '
$value) { + $out .= ' '.$key.'="'.$value.'"'; + } + $out .= '>'; + if (isset($dismiss)) { + $out .= $dismiss; + } + $out .= $text; + $out .= '
'; + return $out; + } + /** * Picture responsive * * Extends from HtmlHelper:image() - * + * * @param string $path Path to the image file, relative to the app/webroot/img/ directory. * @param array $options Array of HTML attributes. See above for special options. * @return string End tag header @@ -618,8 +662,8 @@ public function icon($iconLabel, $classes = array(), $attributes = array()) { } } - return ''; - + return ''; + } @@ -669,15 +713,15 @@ public function btn($text, $url = array(), $options = array(), $confirmMessage = } /** -* Create a Bootstrap Modal -* @param string $id the modal id -* @param string $header the text in the header -* @param string $body the content of the body -* @param array $buttons informations about open, close and save buttons -* @param array $options -* @return string +* Create a Bootstrap Modal. +* @param string $header The text in the header +* @param string $body The content of the body +* @param array $buttons Informations about open, close and confirm buttons +* @param array $options Used to add custom ID, class or a form into the modal +* @return string Bootstrap modal */ - public function modal($header, $body, $options = array(), $buttons = array()){ + public function modal($header, $body, $options = array(), $buttons = array()) + { $classes = (isset($options['class'])) ? $options['class'] : ''; // Is it a form ? @@ -692,7 +736,7 @@ public function modal($header, $body, $options = array(), $buttons = array()){ $cle1 = "zarnfjdlvjezprizejrjpzojazjpodffp"; $cle2 = "251848416487764197191944948794449"; $cle = ''; - for ($i=0; $i < 15; $i++) { + for ($i=0; $i < 15; $i++) { $tab = array($cle1, $cle2); if ($i == 0) { $cle .= $cle1[rand(0, strlen($cle1)-1)]; @@ -705,98 +749,103 @@ public function modal($header, $body, $options = array(), $buttons = array()){ $id = $cle; } - // Button - if (!empty($buttons)) { - if (isset($buttons['open']) && $buttons['open'] != '') { - if (is_array(($buttons['open']))){ + // Create the open button + if (!empty($buttons)) { + if (isset($buttons['open']) && $buttons['open'] != '') { + if (is_array(($buttons['open']))){ + // Create a simple font-awesome icon instead of a button + if (isset($buttons['open']['button']) && $buttons['open']['button'] === false) { + $out = $this->icon($buttons['open']['name'], array('open-modal'), array('data-toggle' => 'modal', 'data-target' => '#'.$id)); + } else { $out = $this->btn(__($buttons['open']['name']), null , array('tag' => 'button', 'class' => $buttons['open']['class'], 'data-toggle' => 'modal', 'data-target' => '#'.$id)); - }else{ - $out = $this->btn(__($buttons['open']), null , array('tag' => 'button', 'class' => 'btn-primary btn-lg', 'data-toggle' => 'modal', 'data-target' => '#'.$id)); } }else{ - $out = $this->btn(__('Voir'), null , array('tag' => 'button', 'class' => 'btn-primary btn-lg', 'data-toggle' => 'modal', 'data-target' => '#'.$id)); + $out = $this->btn(__($buttons['open']), null , array('tag' => 'button', 'class' => 'btn-primary btn-lg', 'data-toggle' => 'modal', 'data-target' => '#'.$id)); } }else{ $out = $this->btn(__('Voir'), null , array('tag' => 'button', 'class' => 'btn-primary btn-lg', 'data-toggle' => 'modal', 'data-target' => '#'.$id)); } + }else{ + $out = $this->btn(__('Voir'), null , array('tag' => 'button', 'class' => 'btn-primary btn-lg', 'data-toggle' => 'modal', 'data-target' => '#'.$id)); + } - // Modal - $out .= '