Skip to content

Instantly share code, notes, and snippets.

@demonio
Created February 23, 2016 15:23
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save demonio/2c0b8fe6bca9bd641310 to your computer and use it in GitHub Desktop.
Save demonio/2c0b8fe6bca9bd641310 to your computer and use it in GitHub Desktop.
Librerías para pintar código html del framework materializecss.com
<?php
class Be
{
public static function get($from, $to)
{
if ( ! file_exists($to) ) self::put(file_get_contents($from), $to);
}
public static function put($content, $to)
{
if ( ! file_exists($to) ) file_put_contents($to, $content);
}
public static function install()
{
self::get('https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.5/css/materialize.min.css', $_SERVER['DOCUMENT_ROOT'] . '/css/materialize.min.css');
self::get('https://github.com/google/material-design-icons/raw/master/iconfont/MaterialIcons-Regular.ttf', $_SERVER['DOCUMENT_ROOT'] . '/font/MaterialIcons-Regular.ttf');
$s = "
@font-face
{
font-family: 'Material Icons';
src: local('MaterialIcons-Regular'),
url(../font/MaterialIcons-Regular.ttf) format('truetype');
}
.material-icons
{
font-family: 'Material Icons';
font-style: normal;
text-transform: none;
}
";
self::put($s, $_SERVER['DOCUMENT_ROOT'] . '/css/material-icons.css');
self::get('https://code.jquery.com/jquery-2.2.0.min.js', $_SERVER['DOCUMENT_ROOT'] . '/js/jquery/jquery-2.2.0.min.js');
self::get('https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.5/js/materialize.min.js', $_SERVER['DOCUMENT_ROOT'] . '/js/materialize.min.js');
}
public static function incFile($name, $vars=NULL, $test=0)
{
if ( is_file($name) )
{
ob_start();
if ($vars) extract($vars, EXTR_OVERWRITE);
include $name;
return ob_get_clean();
}
return false;
}
public static function incView($name, $vars=NULL, $test=0)
{
return self::incFile(APP_PATH . "views/$name.phtml", $vars, $test);
}
public static function begHtml($title='Give me title', $lang='es')
{
$s = self::begTag('!DOCTYPE html');
$s .= self::begTag( 'html', array('lang'=>$lang ) );
$s .= self::begTag('head');
$s .= self::tag( 'meta', array('charset'=>'UTF-8') );
$s .= self::tag( 'meta', array('name'=>'viewport', 'content'=>'width=device-width, initial-scale=1.0') );
$s .= self::boxTag('title', $title);
$s .= self::tag( 'link', array('href'=>'/css/materialize.min.css',
'media'=>'screen,projection', 'rel'=>'stylesheet', 'type'=>'text/css') );
$s .= self::tag( 'link', array('href'=>'/css/material-icons.css', 'rel'=>'stylesheet', 'type'=>'text/css') );
return $s;
}
public static function endHtml()
{
$s = self::endTag('body');
$s .= self::endTag('html');
return $s;
}
public static function begContent($color='white')
{
$s = self::endTag('head');
$s .= self::begTag('body', array('class'=>$color, 'id'=>'body', 'style'=>'font: 14px monospace') );
return $s;
}
public static function endContent()
{
return self::boxTag( 'script', '', array('src'=>'/js/jquery/jquery-2.2.0.min.js') ) .
self::boxTag( 'script', '', array('src'=>'/js/materialize.min.js') ) .
self::begTag('script') . "
$(function(){
$('.button-collapse').sideNav();
$('.dropdown-button').dropdown();
});
" . self::endTag('script');
}
public static function begRow()
{
return self::begTag( 'div', array('class'=>'row') );
}
public static function endRow()
{
return self::endTag('div');
}
public static function colBox($file, $size='s12')
{
$s = self::begTag('div', array('class'=>"col $size") );
$s .= self::incFile(APP_PATH . "views/$file.phtml");
$s .= self::endTag('div');
return $s;
}
public static function colBoxCard($file, $size='s12')
{
$s = self::begTag('div', array('class'=>"card col $size") );
$s .= self::incFile(APP_PATH . "views/$file.phtml");
$s .= self::endTag('div');
return $s;
}
public static function header($content, $size=5)
{
return self::boxTag( "h$size", $content, array('class'=>'teal-text darken-1') );
}
public static function line($mv=0)
{
return self::boxTag( 'div', '', array('class'=>'divider end', 'style'=>"margin:{$mv}px auto" ) );
}
public static function subList( $suffix, $a )
{
$links = '';
foreach ($a as $to=>$content) :
$links .= self::begTag('li');
if ( is_array($content) )
{
$links .= self::boxTag('a', $to . self::icon('arrow_drop_down', 'right'), array('class'=>'dropdown-button', 'data-activates'=>"$suffix$to", 'href'=>'#!') ) .
self::begTag( 'ul', array('class'=>'dropdown-content', 'id'=>"$suffix$to") );
foreach ($content as $k=>$v) :
$links .= self::begTag('li') .
self::boxTag('a', $v, array('href'=>$k) ) .
self::endTag('li');
endforeach;
$links .= self::endTag('ul');
}
else
{
$links .= self::boxTag('a', $content, array('href'=>$to) );
}
$links .= self::endTag('li');
endforeach;
return $links;
}
public static function menu( $size='s12', $a=array(), $name='menu' )
{
return self::begTag( 'nav', array('class'=>"col $size z-depth-5") ) .
self::begTag('div', array('class'=>'nav-wrapper') ) .
self::boxTag('a', self::icon('menu'), array('href'=>'#',
'class'=>'button-collapse hide-on-med-and-up',
'data-activates'=>$name) ) .
self::begTag( 'ul', array('class'=>'hide-on-small-only') ) .
self::subList('main_', $a) .
self::endTag('ul') .
self::begTag( 'ul', array('class'=>'side-nav', 'id'=>$name) ) .
self::subList('side_', $a) .
self::endTag('ul') .
self::endTag('div') .
self::endTag('nav');
}
public static function search( $size='s12', $name='search' )
{
return self::begTag( 'nav', array('class'=>"col $size z-depth-5") ) .
self::begTag( 'div', array('class'=>'nav-wrapper') ) .
self::begTag('form') .
self::begTag( 'div', array('class'=>'input-field') ) .
self::tag( 'input', array('id'=>$name, 'name'=>$name, 'required', 'type'=>'search') ) .
self::boxTag( 'label', self::icon('search'), array('for'=>'search') ) .
self::icon('close') .
self::endTag('div') .
self::endTag('form') .
self::endTag('div') .
self::endTag('nav');
}
public static function link( $type, $icon, $action='', $user_attrs=array() )
{
$shape = ($type == 'orb') ? ' btn-floating' : '';
$default = array
(
'add'=>array('color'=>'green', 'data-tooltip'=>'Crear'),
'check'=>array('color'=>'orange', 'data-tooltip'=>'Guardar'),
'clear'=>array('color'=>'red', 'data-tooltip'=>'Eliminar'),
'close'=>array('color'=>'grey', 'data-tooltip'=>'Cerrar'),
'mode_edit'=>array('color'=>'grey', 'data-tooltip'=>'Editar'),
'people'=>array('color'=>'blue', 'data-tooltip'=>'Buscar'),
'person_add'=>array('color'=>'green', 'data-tooltip'=>'Nuevo'),
'remove'=>array('color'=>'red', 'data-tooltip'=>'Eliminar'),
'search'=>array('color'=>'blue', 'data-tooltip'=>'Buscar'),
'web_asset'=>array('color'=>'green', 'data-tooltip'=>'Nuevo'),
);
$color = empty( $default[$icon]['color'] ) ? '' : " {$default[$icon]['color']} darken-1";
if ( empty( $default[$icon]['data-tooltip'] ) )
{
$tooltip = '';
}
else
{
$a['attrs']['data-delay'] = 500;
$a['attrs']['data-position'] = 'left';
$a['attrs']['data-tooltip'] = $default[$icon]['data-tooltip'];
$tooltip = ' tooltipped';
}
$a['attrs']['class'] = "$icon$shape$color$tooltip waves-effect waves-light";
if ( preg_match( '/[\/#\?]+/', $action ) )
{
$a['attrs']['href'] = $action;
$a['tag'] = 'a';
}
else
{
$a['attrs']['name'] = 'accion';
$a['attrs']['type'] = 'submit';
$a['attrs']['value'] = $action;
$a['tag'] = 'button';
}
foreach($user_attrs as $k=>$v)
{
if ( $k == 'class' )
{
$a['attrs'][$k] .= " $v";
continue;
}
$a['attrs'][$k] = $v;
}
$a['content'] = self::icon($icon);
$s = self::boxTag($a);
return $s;
}
public static function btn( $icon='add', $action='', $attrs=array() )
{
return self::link('btn', $icon, $action, $attrs);
}
public static function ico( $icon='add', $action='', $attrs=array() )
{
return self::link('ico', $icon, $action, $attrs);
}
public static function orb( $icon='add', $action='', $attrs=array() )
{
return self::link('orb', $icon, $action, $attrs);
}
public static function icon($name='add', $pos='')
{
return self::boxTag( 'i', $name, array('class'=>"material-icons $pos") );
}
public static function toasts( $toasts=array() )
{
$s = self::begTag('script');
foreach($toasts as $toast)
{
$s .= "Materialize.toast('$toast', 4000, 'rounded');";
}
$s .= self::endTag('script');
return $s;
}
# BEG CORE TAG
public static function tag( $name, $a=array() )
{
$attrs = self::attrs($a);
return "<$name$attrs />";
}
public static function boxTag( $tag, $content='', $a=array() )
{
$items = is_array($content) ? $content : array($content);
$s = '';
foreach ($items as $item)
{
$s .= self::begTag($tag, $a);
$s .= $item;
$s .= self::endTag($tag);
}
return $s;
}
public static function begTag( $tag, $a=array() )
{
$attrs = self::attrs($a);
return "<$tag$attrs>";
}
public static function endTag($tag)
{
return "</$tag>";
}
public static function attrs($a)
{
if ( ! $a ) return;
$s = '';
foreach($a as $k => $v) :
if ( is_array($v) ) $v = implode(' ', $v);
$s .= ($k) ? " $k=\"$v\"" : " $v";
endforeach;
return $s;
}
# END CORE TAG
}
<?php
class BeForm
{
public static $color = array(
'add'=>'green darken-1',
'clear'=>'red darken-1',
'remove'=>'red darken-1',
);
public static $tooltip = array(
'add'=>'Crear',
'clear'=>'Borrar',
'remove'=>'Borrar',
);
public static function beg( $action='', $method='', $enctype='', $attrs=array() )
{
$attrs['action'] = $action;
$attrs['method'] = $method;
$attrs['enctype'] = $enctype;
return Be::begTag('form', $attrs);
}
public static function get( $action='', $attrs=array() )
{
return self::beg($action, '', '', $attrs);
}
public static function post( $action='', $attrs=array() )
{
return self::beg($action, 'post', '', $attrs);
}
public static function multiGet( $action='', $attrs=array() )
{
return self::beg($action, '', 'multipart/form-data', $attrs);
}
public static function multiPost( $action='', $attrs=array() )
{
return self::beg($action, 'post', 'multipart/form-data', $attrs);
}
public static function end( $hiddens=array() )
{
$s = '';
if ($hiddens) :
foreach ($hiddens as $name=>$value) :
$s .= self::hidden($name, $value);
endforeach;
endif;
return $s . Be::endTag('form');
}
public static function button( $attrs=array() )
{
}
public static function submit( $content, $attrs=array() )
{
return Be::begTag('button', $attrs) .
$content .
Be::endTag('button');
}
public static function btnLeaf( $icon, $name='', $value='', $pos='left', $attrs=array() )
{
$attrs['data-delay'] = 500;
$attrs['data-position'] = 'left';
$attrs['data-tooltip'] = self::$tooltip[$icon];
$color = self::$color[$icon];
$class = "$icon $pos btn btn-leaf $color tooltipped waves-effect waves-light";
$attrs['class'] = empty($attrs['class'])
? $class
: "$class " . $attrs['class'];
$attrs['name'] = $name;
$attrs['type'] = 'submit';
$attrs['value'] = $value;
return self::submit(BeWeb::icon($icon), $attrs);
}
public static function reset()
{
}
public static function email()
{
}
public static function file()
{
}
public static function hidden($name, $value)
{
return Be::boxTag( 'input', '', array('name'=>$name, 'type'=>'hidden', 'value'=>$value) );
}
public static function number()
{
}
public static function password()
{
}
public static function radio()
{
}
public static function range()
{
}
public static function search()
{
}
public static function tel()
{
}
/* IC) CAJA DE SELECCION MULTIPLE */
public static function checkbox($name, $value='')
{
return Be::tag( 'input', array('id'=>$name, 'for'=>$name, 'name'=>$name, 'type'=>'checkbox', 'value'=>$value) );
}
public static function checkLabel($label, $name, $value='')
{
return BeForm::checkbox($name) .
BeForm::label($label, $name) . Be::tag('br');
}
public static function boxCheckLabel($label, $name, $value='', $grid='s12 m4 l3')
{
return BeWeb::begP($grid) .
BeForm::checkbox($name) .
BeForm::label($label, $name) .
BeWeb::endP();
}
/* ID) DATEPICKER */
public static function date( $name, $value='', $attrs=array() )
{
$attrs['class'] = 'datepicker';
$attrs['name'] = $name;
$attrs['type'] = 'text';
$attrs['value'] = $value;
return Be::tag('input', $attrs);
}
public static function boxDate($label, $name='', $value='')
{
return BeWeb::begP() .
self::label($label) .
self::date( $name, $value ) .
BeWeb::endP();
}
/* IL) PALANCA */
public static function boxLever($label, $name)
{
return Be::begTag( 'p', array('class'=>'switch col s12 m2 l2') ) .
Be::begTag('label') .
$label . Be::tag('br') .
BeForm::checkbox($name) . Be::boxTag( 'span', '', array('class'=>'lever') ) .
Be::endTag('label') .
Be::endTag('p');
}
/* IT) CAMPO DE TEXTO */
public static function text($name, $value='')
{
return Be::tag( 'input', array('id'=>$name, 'name'=>$name, 'type'=>'text', 'value'=>$value) );
}
public static function boxText($label, $name='', $value='', $grid='s12 m4 l3')
{
return BeWeb::begP($grid) .
self::label($label) .
self::text($name, $value) .
BeWeb::endP();
}
public static function url()
{
}
public static function fieldset()
{
}
/* L) ETIQUETA */
public static function label($content, $for='')
{
$for = ($for) ? array('for'=>$for) : '';
return Be::boxTag('label', $content, $for);
}
public static function boxLabel($content, $for='', $grid='s12 m4 l3')
{
$for = ($for) ? array('for'=>$for) : '';
return BeWeb::begP($grid) .
Be::boxTag('label', $content, $for) .
BeWeb::endP();
}
/* S) COMBO */
public static function select($name, $options)
{
$s = Be::begTag( 'select', array('name'=>$name) );
foreach ($options as $value=>$content) :
$s .= Be::boxTag('option', $content, array('value'=>$value) );
endforeach;
$s .= Be::endTag('select');
return $s;
}
public static function boxSelect( $label, $name, $options=array(), $value='', $grid='s12 m4 l3' )
{
return BeWeb::begP($grid) .
self::label($label) .
self::select($name, $options) .
BeWeb::endP();
}
/* T) AREA DE TEXTO LIBRE */
public static function textarea($name, $content='')
{
return Be::boxTag( 'textarea', $content, array('class'=>'materialize-textarea', 'name'=>$name) );
}
public static function boxTextarea($label, $name='', $content='', $grid='s12')
{
return BeWeb::begP($grid) .
self::label($label) .
self::textarea($name, $content) .
BeWeb::endP();
}
}
<?php
class BeWeb
{
public static $color = array(
'add'=>'green darken-1',
'remove'=>'red darken-1',
);
/* BR) BREAK LINE */
public static function br($n=1)
{
$s = '';
for ($i=0; $i<$n; ++$i):
$s .= '&nbsp;' . Be::tag( 'br', array('class'=>'end') );
endfor;
return $s;
}
/* BU) BUTTON */
public static function btnLeaf($icon, $attrs=array(), $pos='')
{
$icon_color = self::$color[$icon];
$attrs['class'] = ($pos) ? "$pos ": '';
$attrs['class'] .= "$icon btn btn-corner btn-leaf waves-effect waves-light $icon_color";
return Be::boxTag('a', self::icon($icon), $attrs);
}
/* C) COLUMNA */
public static function begCol($grid='s12 m4 l3', $attrs=array() )
{
$attrs['class'] = empty($attrs['class']) ? "col $grid" : "col $grid " . $attrs['class'];
return Be::begTag('div', $attrs);
}
public static function endCol() { return Be::endTag('div'); }
public static function endBegCol( $grid='s12 m4 l3', $attrs=array() )
{
return self::endCol('div') . self::begCol($grid, $attrs);
}
/* D) CAPA */
public static function begDiv($id='', $attrs=array() )
{
if ( empty($attrs['class']) ) $attrs['class'] = 'card';
else $attrs['class'] .= ' card';
if ($id) $attrs['id'] = $id;
return Be::begTag( 'div', $attrs );
}
public static function endDiv() { return Be::endTag('div'); }
/* HE) CABECERAS */
public static function h5( $content, $attrs=array() )
{
if ( empty($attrs['class']) ) $attrs['class'] = 'teal-text darken-1';
else $attrs['class'] .= ' teal-text darken-1';
return Be::boxTag( 'h5', $content, $attrs );
}
public static function boxH5( $content, $a_col=array(), $a_h5=array() )
{
return self::begCol('col s12', $a_col) .
self::h5( $content, $a_h5 ) .
self::endCol();
}
public static function h6($content)
{
return Be::boxTag( 'h6', $content, array('style'=>'font-weight: bold') );
}
/* HR) LINEA HORIZONTAL */
public static function hr($mv=0, $style='solid', $color='#e0e0e0')
{
return self::br() .
Be::boxTag( 'div', '', array('class'=>'divider end', 'style'=>"
background: transparent;
border: 0;
border-top: 1px $style $color;
height: 0;
margin:{$mv}px auto;
" ) );
}
/* I) ICONO */
public static function icon($name)
{
$attrs['class'] = 'material-icons';
return Be::boxTag('i', $name, $attrs);
}
/* P) PARRAFO */
public static function boxP($content, $grid='s12')
{
$attrs['class'] = "col $grid";
return Be::boxTag('p', $content, $attrs);
}
public static function begP($grid='s12 m4 l3')
{
$attrs['class'] = "col $grid";
return Be::begTag('p', $attrs);
}
public static function endP() { return Be::endTag('p'); }
public static function endBegP($grid='s12 m4 l3') { return self::endP() . self::begP($grid); }
/* R) CAJA CON FONDO BLANCO */
public static function begCard( $id='', $attrs=array() )
{
if ( empty($attrs['class']) ) $attrs['class'] = 'card row';
else $attrs['class'] .= ' card row';
if ($id) $attrs['id'] = $id;
return Be::begTag('div', $attrs);
}
public static function endCard() { return Be::endTag('div'); }
public static function endBegCard($id='') { return self::endCard() . self::begCard($id); }
/* R) FILA */
public static function begRow( $id='', $attrs=array() )
{
if ( empty($attrs['class']) ) $attrs['class'] = 'row';
else $attrs['class'] .= ' row';
if ($id) $attrs['id'] = $id;
return Be::begTag('div', $attrs);
}
public static function endRow() { return Be::endTag('div'); }
public static function endBegRow($id='') { return self::endRow() . self::begRow($id); }
/* T) PESTAÑAS */
public static function tabs( $tabs, $attrs=array() )
{
$attrs['class'] = "tabs teal lighten-5";
$s = Be::begTag('ul', $attrs);
foreach ($tabs as $href=>$content) :
$a = Be::boxTag( 'a', $content, array('href'=>$href) );
$s .= Be::boxTag( 'li', $a, array('class'=>'tab') );
endforeach;
$s .= Be::endTag('ul');
return $s;
}
public static function boxTabs( $tabs, $grid='s12', $a_ul=array() )
{
$a_div['class'] = "col $grid";
$s = Be::begTag('div', $a_div) .
self::tabs($tabs, $a_ul) .
Be::endTag('div');
return $s;
}
/* U) LISTA DESORDENADA */
public static function ul($elements)
{
$s = Be::begTag('ul');
foreach ($elements as $content) :
$s .= Be::boxTag('li', $content);
endforeach;
$s .= Be::endTag('ul');
return $s;
}
public static function boxUl($elements, $grid='s12 m4 l3')
{
$attrs['class'] = "col $grid";
$s = Be::begTag('ul', $attrs);
foreach ($elements as $content) :
$s .= Be::boxTag('li', $content);
endforeach;
$s .= Be::endTag('ul');
return $s;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment