$htm[] = "<div class='form-group'><label>Name</label>";
$htm[] = "<input type='text' class='form-control' id='ip_name' placeholder='name'>";
$htm[] = "</div></div>";
//ip
$htm[] = "<div class='col-sm-12'>";
$htm[] = "<div class='form-group'><label>IP</label>";
$htm[] = "<input type='text' class='form-control' id='ip_ip' placeholder='ip'>";
$htm[] = "</div></div>";
//port
$htm[] = "<div class='col-sm-12'>";
$htm[] = "<div class='form-group'><label>Port</label>";
$htm[] = "<input type='text' class='form-control' id='ip_port' placeholder='port'>";
$htm[] = "</div></div>";
//comment
$htm[] = "<div class='col-sm-12'>";
$htm[] = "<div class='form-group'><label>Comment</label>";
$htm[] = "<input type='text' class='form-control' id='ip_comment' placeholder='Comment'>";
$htm[] = "</div></div>";
$htm[] = "</div>";
$btns = [];
$btns[] = "<a href=#btn id=btnSave class='btn btn-primary'><i class='fa fa-save'></i> Save</a> ";
$btns[] = "<a href=#btn id=btnDel class='btn btn-default'><i class='fa fa-trash'></i></a> ";
$btns[] = "<a href=#btn class='btn btn-default' data-dismiss='modal'>Cancel</a>";
$modal = new LTE\Modal();
$modal->title("Edit port");
$modal->body(implode('', $htm));
$modal->footer(implode(" ", $btns));
echo $modal;
?>
<div id='more'></div>
	<?php 
//include "box_filter.php";
include "box_track.php";
include "box_preview.php";
?>
	</div>

</div>

<div class='row'>
	<div class='col-sm-12'>
	<?php 
include "box_canvas.php";
?>
	</div>
</div>

<script type="text/javascript" src="js/stream.js"></script>
<script type="text/javascript" src="js/midifile.js"></script>
<script type="text/javascript" src="js/replayer.js"></script>
<script type="text/javascript" src="js/synth.js"></script>
<script type="text/javascript" src="js/audio.js"></script>
<script type="text/javascript" src="js/main.js"></script>
<script type="text/javascript" src="js/canvas.js"></script>

<?php 
$modal = new LTE\Modal();
$modal->title("Browse");
echo $modal;
$admin->footer("<a href='https://github.com/gasman/jasmid'>https://github.com/gasman/jasmid</a>");
$admin->end();
<?php

//midi files
$box = new LTE\Box();
$box->title("File(s)");
$box->icon("fa fa-file-o");
$box->id("boxFiles");
$box->collapsable(true);
$box->loading(true);
$box->body("please wait");
echo $box;
$htm = [];
$htm[] = '<textarea class="form-control" id=midinfo rows=8></textarea>';
$modal = new LTE\Modal();
$modal->id('myModal');
$modal->icon('fa fa-edit');
$modal->title('midifile');
$modal->body($htm);
$btn = [];
$btn[] = '<a href=#btn class="btn btn-default" data-dismiss=modal>Close</a>';
$modal->footer($btn);
echo $modal;