Black Material
<?php | |
require_once CORE_PATH . 'kumbia/controller.php'; | |
class AppController extends Controller | |
{ | |
final protected function initialize() | |
{ | |
$this->limit_params = false; | |
$this->url = empty($_SERVER['PATH_INFO']) ? '/' : $_SERVER['PATH_INFO']; | |
View::select('', 'default'); | |
if ( ! empty($_POST['model']) ) $_POST = (new $_POST['model'])->$_POST['action']($_POST); | |
$this->box = (new Boxes)->read($_POST); | |
$this->boxes = (new Boxes)->readBoxes($this->url); | |
} | |
final protected function finalize() | |
{ | |
} | |
} |
<div class="dialog row" title="Black Material"> | |
<form method="post" enctype="multipart/form-data"> | |
<div class="col s12"> | |
<label>URL:</label> | |
<input name="url" placeholder="URL Here" type="text" value="<?=$box->url?>"> | |
</div> | |
<div class="col s4"> | |
<label>Action:</label> | |
<select name="action"> | |
<option value="create">Create</option> | |
<option value="read" selected>Read</option> | |
<option value="update">Update</option> | |
<option value="delete">Delete</option> | |
</select> | |
</div> | |
<div class="col s4"> | |
<label>Box:</label> | |
<select class="submit" name="id"> | |
<option value="" selected>New</option> | |
<?php foreach ($boxes as $k=>$v) : ?> | |
<option<?php if ($v->id == $box->id) echo ' selected'; ?> value="<?=$v->id?>"><?=$v->name?></option> | |
<?php endforeach; ?> | |
</select> | |
</div> | |
<div class="col s4"> | |
<label>Name:</label> | |
<input name="name" placeholder="Name" type="text" value="<?=$box->name?>"> | |
</div> | |
<div class="col s12"> | |
<ul class="tabs"> | |
<li class="tab col s4"><a class="active" href="#attrs">ATTRs</a></li> | |
<li class="tab col s4"><a href="#html">HTML</a></li> | |
<li class="tab col s4"><a href="#css">CSS</a></li> | |
<li class="tab col s4"><a href="#js">JS</a></li> | |
</ul> | |
</div> | |
<div id="attrs" class="col s12"> | |
<div class="col s4"> | |
<label>Parent:</label> | |
<select name="boxes_id"> | |
<option value="" selected>I am</option> | |
<?php foreach ($boxes as $k=>$v) : ?> | |
<option<?php if ($v->id == $box->boxes_id) echo ' selected'; ?> value="<?=$v->id?>"><?=$v->name?></option> | |
<?php endforeach; ?> | |
</select> | |
</div> | |
<div class="col s4"> | |
<label>Hook:</label> | |
<input name="hook" placeholder="Hook" type="text" value="<?=$box->hook?>"> | |
</div> | |
<div class="col s4"> | |
<label>Weight:</label> | |
<input name="weight" placeholder="Weight" type="text" value="<?=$box->weight?>"> | |
</div> | |
<div class="col s4"> | |
<label>Border Size:</label> | |
<select name="border_size"> | |
<option value="" disabled>Border Size</option> | |
<?php for ($n=0; $n<=4; ++$n) : ?> | |
<option<?php if ($n == $box->border_size) echo ' selected'; ?> value="<?=$n?>"><?=$n?>px</option> | |
<?php endfor; ?> | |
</select> | |
</div> | |
<div class="col s4"> | |
<label>Border Style:</label> | |
<select name="border_style"> | |
<option value="" disabled selected>Border Style</option> | |
<?php foreach (['dashed', 'dotted', 'inset', 'solid'] as $v) : ?> | |
<option<?php if ($v == $box->border_style) echo ' selected'; ?> value="<?=$v?>"><?=$v?></option> | |
<?php endforeach; ?> | |
</select> | |
</div> | |
<div class="col s4"> | |
<label>Border Color:</label> | |
<select name="border_color"> | |
<option value="" disabled selected>Border Color</option> | |
<?php foreach (['black', 'blue', 'green', 'red'] as $v) : ?> | |
<option<?php if ($v == $box->border_color) echo ' selected'; ?> value="<?=$v?>"><?=$v?></option> | |
<?php endforeach; ?> | |
</select> | |
</div> | |
<div class="col s4"> | |
<label>Bg Color:</label> | |
<select name="bg_color"> | |
<option value="" disabled>Bg Color</option> | |
<?php foreach (['red', 'pink', 'purple', 'deep-purple', 'indigo', 'blue', 'light-blue', 'cyan', 'teal', 'green', 'light-green', 'lime', 'yellow', 'amber', 'orange', 'deep-orange', 'brown', 'grey', 'blue-grey', 'black', 'white', 'transparent'] as $v) : ?> | |
<option<?php if ($v == $box->bg_color) echo ' selected'; ?> value="<?=$v?>"><?=$v?></option> | |
<?php endforeach; ?> | |
</select> | |
</div> | |
<div class="col s4"> | |
<label>Margin Top:</label> | |
<input name="margin_top" placeholder="Margin Top" type="text" value="<?=$box->margin_top?>"> | |
</div> | |
<div class="col s4"> | |
<label>Bg Tone:</label> | |
<select name="bg_tone"> | |
<option value="" disabled>Bg Tone</option> | |
<?php foreach (['lighten-5', 'lighten-4', 'lighten-3', 'lighten-2', 'lighten-1', 'darken-1', 'darken-2', 'darken-3', 'darken-4', 'accent-1', 'accent-2', 'accent-3', 'accent-4'] as $v) : ?> | |
<option<?php if ($v == $box->bg_tone) echo ' selected'; ?> value="<?=$v?>"><?=$v?></option> | |
<?php endforeach; ?> | |
</select> | |
</div> | |
<div class="col s4"> | |
<label>Grid Phone:</label> | |
<select name="phone"> | |
<option value="" disabled>Phone</option> | |
<?php for ($n=12; $n>=1; --$n) : ?> | |
<option<?php if ($n == $box->phone) echo ' selected'; ?> value="<?=$n?>">s<?=$n?></option> | |
<?php endfor; ?> | |
</select> | |
</div> | |
<div class="col s4"> | |
<label>Grid Tablet:</label> | |
<select name="tablet"> | |
<option value="" disabled>Tablet</option> | |
<?php for ($n=12; $n>=1; --$n) : ?> | |
<option<?php if ($n == $box->tablet) echo ' selected'; ?> value="<?=$n?>">m<?=$n?></option> | |
<?php endfor; ?> | |
</select> | |
</div> | |
<div class="col s4"> | |
<label>Grid Computer:</label> | |
<select name="computer"> | |
<option value="" disabled>Computer</option> | |
<?php for ($n=12; $n>=1; --$n) : ?> | |
<option<?php if ($n == $box->computer) echo ' selected'; ?> value="<?=$n?>">l<?=$n?></option> | |
<?php endfor; ?> | |
</select> | |
</div> | |
<div class="col s4"> | |
<label>Text Color:</label> | |
<select name="text_color"> | |
<option value="" disabled>Text Color</option> | |
<?php foreach (['red-text', 'pink-text', 'deep-purple-text', 'indigo-text', 'blue-text', 'light-blue-text', 'cyan-text', 'teal-text', 'green-text', 'light-green-text', 'lime-text', 'yellow-text', 'amber-text', 'orange-text', 'deep-orange-text', 'brown-text', 'grey-text', 'blue-grey-text', 'black-text', 'white-text', 'transparent-text'] as $v) : ?> | |
<option<?php if ($v == $box->text_color) echo ' selected'; ?> value="<?=$v?>"><?=$v?></option> | |
<?php endforeach; ?> | |
</select> | |
</div> | |
<div class="col s4"> | |
<label>Margin Bottom:</label> | |
<input name="margin_bottom" placeholder="Margin Botttom" type="text" value="<?=$box->margin_bottom?>"> | |
</div> | |
<div class="col s4"> | |
<label>Text Tone:</label> | |
<select name="text_tone"> | |
<option value="" disabled>Text Tone</option> | |
<?php foreach (['text-lighten-5', 'text-lighten-4', 'text-lighten-3', 'text-lighten-2', 'text-lighten-1', 'text-normal', 'text-darken-1', 'text-darken-2', 'text-darken-3', 'text-darken-4', 'text-accent-1', 'text-accent-2', 'text-accent-3', 'text-accent-4'] as $v) : ?> | |
<option<?php if ($v == $box->bg_tone) echo ' selected'; ?> value="<?=$v?>"><?=$v?></option> | |
<?php endforeach; ?> | |
</select> | |
</div> | |
</div> | |
<div id="html" class="col s12"> | |
<textarea class="materialize-textarea" name="html" placeholder="HTML Code Here"><?=$box->html?></textarea> | |
</div> | |
<div id="css" class="col s12"> | |
<textarea class="materialize-textarea" name="css" placeholder="CSS Code Here"><?=$box->css?></textarea> | |
</div> | |
<div id="js" class="col s12"> | |
<textarea class="materialize-textarea" name="js" placeholder="JS Code Here"><?=$box->js?></textarea> | |
</div> | |
<div class="col s12 file-field input-field"> | |
<input multiple name="files[]" type="file"> | |
<input class="file-path" placeholder="Upload one or more files" type="text"> | |
</div> | |
<div class="col s12"> | |
<button class="btn full grey" name="model" type="submit" value="boxes">Apply</button><br> | |
</div> | |
</form> | |
</div> |
<?php | |
/** | |
*/ | |
class Boxes extends Myar | |
{ | |
public $id; | |
public $boxes_id = 0; | |
public $url; | |
public $name = 'New Box'; | |
public $hook; | |
public $weight = 0; | |
public $border_size = 0; | |
public $border_style; | |
public $border_color; | |
public $bg_color = 'transparent'; | |
public $margin_top = 0; | |
public $bg_tone; | |
public $phone = 12; | |
public $tablet = 4; | |
public $computer = 3; | |
public $text_color = 'black-text'; | |
public $margin_bottom = 0; | |
public $text_tone; | |
public $html; | |
public $css; | |
public $js; | |
public function __isset($var) | |
{ | |
$vars = get_object_vars($this); | |
return array_key_exists($var, $vars); | |
} | |
public function __construct() | |
{ | |
if ( empty($this->url) ) | |
$this->url = empty($_SERVER['PATH_INFO']) ? '/' : $_SERVER['PATH_INFO']; | |
if ($_FILES) | |
{ | |
$in['image/gif'] = '/img'; | |
$in['image/jpg'] = '/img'; | |
$in['image/png'] = '/img'; | |
foreach ($_FILES['files']['error'] as $k=>$e) | |
{ | |
if ($e == UPLOAD_ERR_OK) | |
{ | |
$temp = $_FILES['files']['tmp_name'][$k]; | |
$name = basename($_FILES['files']['name'][$k]); | |
$type = $_FILES['files']['type'][$k]; | |
$into = $_SERVER['DOCUMENT_ROOT'] . $in[$type] . "/$name"; | |
move_uploaded_file($temp, $into); | |
} | |
} | |
} | |
} | |
public function install() | |
{ | |
$vars = get_object_vars($this); | |
unset($vars['id']); | |
$types = ['boolean'=>'bool', 'integer'=>'int', 'double'=>'float']; | |
$sql = 'CREATE TABLE dbo.boxes (id int PRIMARY KEY IDENTITY(1,1), '; | |
foreach ($vars as $k=>$v) | |
{ | |
$type = empty($types[gettype($v)]) ? 'nvarchar(MAX)' : $types[gettype($v)]; | |
$sql .= "$k $type, "; | |
} | |
$sql = rtrim($sql, ', ') . ')'; | |
$this->query($sql); | |
} | |
public function filter($a) | |
{ | |
$filter['html'] = 'trim'; | |
foreach ($a as $k=>$v) | |
{ | |
if ( ! $this->__isset($k) ) continue; | |
$this->$k = empty($filter[$k]) ? $v : $filter[$k]($v); | |
} | |
} | |
public function create($a) | |
{ | |
$this->filter($a); | |
extract( (array)$this ); | |
$vars = get_object_vars($this); | |
unset($vars['id']); | |
$sql = 'INSERT INTO boxes ('; | |
foreach ($vars as $k=>$v) $sql .= "$k, "; | |
$sql = rtrim($sql, ', ') . ') VALUES ('; | |
foreach ($vars as $k=>$v) $sql .= "'{$$k}', "; | |
$sql = rtrim($sql, ', ') . ')'; | |
$id = $this->query($sql); | |
return ['id'=>$id]; | |
} | |
public function read($a) | |
{ | |
if ( empty($a['id']) ) return $this; | |
$sql = 'SELECT * FROM boxes WHERE id=?'; | |
return $this->row($sql, $a['id']); | |
} | |
public function readBoxes($url='/') | |
{ | |
$sql = "SELECT * FROM boxes WHERE url LIKE ? ORDER BY weight"; | |
$rows = $this->rows($sql, $url); | |
return $rows; | |
} | |
public function update($a) | |
{ | |
$this->filter($a); | |
extract( (array)$this ); | |
$vars = get_object_vars($this); | |
$id = $vars['id']; | |
unset($vars['id']); | |
$sql = 'UPDATE boxes SET '; | |
foreach ($vars as $k=>$v) $sql .= "$k='{$$k}', "; | |
$sql = rtrim($sql, ', ') . ' WHERE id=' . $id; | |
$this->query($sql); | |
return ['id'=>$id]; | |
} | |
public function delete($a) | |
{ | |
$id = (int)$a['id']; | |
$sql = "DELETE FROM boxes WHERE id=?"; | |
$this->query($sql, $id); | |
} | |
} |
<!DOCTYPE html> | |
<html lang="es"> | |
<head> | |
<title>Black Material</title> | |
<link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> | |
<link href="/css/jquery-ui.css" media="all" rel="stylesheet"> | |
<link href="/css/materialize.min.css" media="all" rel="stylesheet"> | |
<link href="/css/style.css" media="all" rel="stylesheet"> | |
<link href="/css/hacks.css" media="all" rel="stylesheet"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
</head> | |
<body class="row" id="important"> | |
<?php | |
function boxes($boxes, $boxes_id=0, $s='') | |
{ | |
foreach($boxes as $box) | |
{ | |
if ($box->boxes_id <> $boxes_id) continue; | |
unset($boxes[$box->id]); | |
$s .= "<div class=\"col s$box->phone m$box->tablet l$box->computer $box->bg_color $box->bg_tone $box->text_color $box->text_tone\" style=\"border: {$box->border_size}px $box->border_style $box->border_color; margin-bottom: {$box->margin_bottom}px; margin-top: {$box->margin_top}px;\">" . | |
str_replace('<?=$children?>', boxes($boxes, $box->id, $s), $box->html) . | |
"</div>"; | |
} | |
return $s; | |
} | |
echo boxes($boxes); | |
?> | |
<?php include APP_PATH . 'views/black_material.phtml'; ?> | |
<script src="/javascript/jquery/jquery-3.0.0.min.js"></script> | |
<script src="/javascript/jquery/jquery-ui.min.js"></script> | |
<script src="/javascript/materialize.min.js"></script> | |
<script src="/javascript/script.js"></script> | |
</body> | |
</html> |
#important .col { line-height: 1.2; } | |
#important input:not([type]), | |
#important input[type=text], | |
#important input[type=password], | |
#important input[type=email], | |
#important input[type=url], | |
#important input[type=time], | |
#important input[type=date], | |
#important input[type=datetime], | |
#important input[type=datetime-local], | |
#important input[type=tel], | |
#important input[type=number], | |
#important input[type=search], | |
#important .select-wrapper input.select-dropdown, | |
#important textarea.materialize-textarea | |
{ | |
height: 30px; | |
margin-bottom: 10px; | |
} | |
#important textarea.materialize-textarea { padding: 10px 0; } | |
#important .btn, | |
#important .btn-floating { box-shadow: none; } | |
#important .btn:hover, | |
#important .btn-floating:hover { box-shadow: 0 5px 11px 0 rgba(0,0,0,0.18),0 4px 15px 0 rgba(0,0,0,0.15) } | |
#important .row { margin-bottom: 0; } | |
#important .select-wrapper span.caret { top: 8px; } | |
#important .tabs, | |
#important .tab | |
{ | |
height: 30px; | |
line-height: 30px; | |
} | |
#important .ui-dialog-content { padding: 0; } |
<?php | |
/** | |
*/ | |
class Myar | |
{ | |
/** | |
*/ | |
public function error($model='') | |
{ | |
if ( $this->query->errorInfo()[0] == '42S02' ) | |
{ | |
(new $model)->install(); | |
return 1; | |
} | |
else _::d( $this->query->errorInfo() ); | |
return 0; | |
} | |
/** | |
* STEP 1 | |
*/ | |
public function connect() | |
{ | |
$config = require(APP_PATH.'config/databases.php'); | |
$config = $config['default']; | |
$this->pdo = new PDO($config['dsn'], $config['username'], $config['password']); | |
} | |
/** | |
* STEP 2 | |
*/ | |
public function query($sql, $values=NULL) | |
{ | |
$this->connect(); | |
$this->query = $this->pdo->prepare($sql); | |
if ( ! is_array($values) ) $values = array_slice(func_get_args(), 1); | |
$error = 0; | |
$this->query->execute($values) or $error = 1; | |
if ($error) | |
{ | |
$try = $this->error( get_called_class() ); | |
if ($try) $this->query($sql, $values); | |
} | |
return $this->pdo->lastInsertId(); | |
} | |
/** | |
* STEP 3a1 | |
*/ | |
public function row($sql, $values=NULL, $test=0) | |
{ | |
$this->query($sql, $values); | |
$this->rows = $this->query->fetch(PDO::FETCH_OBJ); | |
if ($test) _::d($this->rows); | |
if ($this->rows) return $this->rows; | |
} | |
/** | |
* STEP 3a2 | |
*/ | |
public function rowOrCols($sql, $values=NULL, $test=0) | |
{ | |
$this->rows = $this->row($sql, $values, $test); | |
if ( ! $this->rows ) $this->rows = $this->cols(); | |
if ($test) _::d($this->rows); | |
return $this->rows; | |
} | |
/** | |
* STEP 3b | |
*/ | |
public function rows($sql, $values=NULL, $test=0) | |
{ | |
$this->query($sql, $values); | |
$rows = $this->query->fetchAll(PDO::FETCH_OBJ); | |
$a = []; | |
if ($rows) foreach ($rows as $row) $a[$row->id] = $row; | |
if ($test) _::d($a); | |
return $a; | |
} | |
/** | |
* STEP 4 ONLY FOR FILL | |
*/ | |
public function cols($table='') | |
{ | |
if ( ! $table ) $table = static::table(); | |
$sql = "SELECT COLUMN_NAME FROM INFORMATION_SCHEMA.COLUMNS WHERE TABLE_NAME=?"; | |
$this->query($sql, $table); | |
$columns = $this->query->fetchAll(PDO::FETCH_OBJ); | |
if ( ! $columns) return ''; | |
$o = new stdClass; | |
foreach($columns as $column) $o->{$column->COLUMN_NAME} = ''; | |
return $o; | |
} | |
/** | |
public function combo($field='', $test=0) | |
{ | |
$table = static::table(); | |
$sql = "SELECT id, $field FROM $table"; | |
$rows = $this->rows($sql); | |
if ($test) _::d($rows); | |
return $rows; | |
}*/ | |
/** | |
*/ | |
public static function table() | |
{ | |
return strtolower( preg_replace( '/([A-Z])/', "_\\1", lcfirst( get_called_class() ) ) ); | |
} | |
} |
$(function() | |
{ | |
// JQUERY UI | |
$('.dialog').dialog({resizable:false, width:500}); | |
// MATERIALIZE | |
$('.tabs').tabs(); | |
$('select').material_select(); | |
// CUSTOM | |
$('body').on('change', '.submit', function() | |
{ | |
$(this).parents('form').submit(); | |
}); | |
/*$('body').on('change', '.copy', function(e) | |
{ | |
e.stopPropagation(); | |
var from = $(this).data('from'); | |
var val = $(this).find(from).text(); | |
var to = $(this).data('to'); | |
console.log('from: '+from+' val: '+val+' to: '+to); | |
$(to).val(val); | |
});*/ | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment