mirror of
https://github.com/hyperion-project/hyperion.ng.git
synced 2025-03-01 10:33:28 +00:00
WebUI: Several File adjustments (#195)
* Example JSON Form Example with General setting I have created a new Category "General" with several Settings for Hyperion. For now the Submit Button only console.log's the values. Known Bug: For some reason it seems to do not load the bootstrap correctly or maybe the Lib isn't compatible with the newest version of bootstrap. * Reorganize files
This commit is contained in:
b1rdhous3
brindosch
222
assets/webconfig/css/bootstrap-colorpicker.css
vendored
222
assets/webconfig/css/bootstrap-colorpicker.css
vendored
@@ -1,222 +0,0 @@
|
||||
/*!
|
||||
* Bootstrap Colorpicker v2.3.3
|
||||
* http://mjolnic.github.io/bootstrap-colorpicker/
|
||||
*
|
||||
* Originally written by (c) 2012 Stefan Petre
|
||||
* Licensed under the Apache License v2.0
|
||||
* http://www.apache.org/licenses/LICENSE-2.0.txt
|
||||
*
|
||||
*/
|
||||
.colorpicker-saturation {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background-image: url("../img/bootstrap-colorpicker/saturation.png");
|
||||
cursor: crosshair;
|
||||
float: left;
|
||||
}
|
||||
.colorpicker-saturation i {
|
||||
display: block;
|
||||
height: 5px;
|
||||
width: 5px;
|
||||
border: 1px solid #000;
|
||||
-webkit-border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
margin: -4px 0 0 -4px;
|
||||
}
|
||||
.colorpicker-saturation i b {
|
||||
display: block;
|
||||
height: 5px;
|
||||
width: 5px;
|
||||
border: 1px solid #fff;
|
||||
-webkit-border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.colorpicker-hue,
|
||||
.colorpicker-alpha {
|
||||
width: 15px;
|
||||
height: 100px;
|
||||
float: left;
|
||||
cursor: row-resize;
|
||||
margin-left: 4px;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
.colorpicker-hue i,
|
||||
.colorpicker-alpha i {
|
||||
display: block;
|
||||
height: 1px;
|
||||
background: #000;
|
||||
border-top: 1px solid #fff;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
margin-top: -1px;
|
||||
}
|
||||
.colorpicker-hue {
|
||||
background-image: url("../img/bootstrap-colorpicker/hue.png");
|
||||
}
|
||||
.colorpicker-alpha {
|
||||
background-image: url("../img/bootstrap-colorpicker/alpha.png");
|
||||
display: none;
|
||||
}
|
||||
.colorpicker-saturation,
|
||||
.colorpicker-hue,
|
||||
.colorpicker-alpha {
|
||||
background-size: contain;
|
||||
}
|
||||
.colorpicker {
|
||||
padding: 4px;
|
||||
min-width: 130px;
|
||||
margin-top: 1px;
|
||||
-webkit-border-radius: 4px;
|
||||
-moz-border-radius: 4px;
|
||||
border-radius: 4px;
|
||||
z-index: 2500;
|
||||
}
|
||||
.colorpicker:before,
|
||||
.colorpicker:after {
|
||||
display: table;
|
||||
content: "";
|
||||
line-height: 0;
|
||||
}
|
||||
.colorpicker:after {
|
||||
clear: both;
|
||||
}
|
||||
.colorpicker:before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
border-left: 7px solid transparent;
|
||||
border-right: 7px solid transparent;
|
||||
border-bottom: 7px solid #ccc;
|
||||
border-bottom-color: rgba(0, 0, 0, 0.2);
|
||||
position: absolute;
|
||||
top: -7px;
|
||||
left: 6px;
|
||||
}
|
||||
.colorpicker:after {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
border-left: 6px solid transparent;
|
||||
border-right: 6px solid transparent;
|
||||
border-bottom: 6px solid #ffffff;
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
left: 7px;
|
||||
}
|
||||
.colorpicker div {
|
||||
position: relative;
|
||||
}
|
||||
.colorpicker.colorpicker-with-alpha {
|
||||
min-width: 140px;
|
||||
}
|
||||
.colorpicker.colorpicker-with-alpha .colorpicker-alpha {
|
||||
display: block;
|
||||
}
|
||||
.colorpicker-color {
|
||||
height: 10px;
|
||||
margin-top: 5px;
|
||||
clear: both;
|
||||
background-image: url("../img/bootstrap-colorpicker/alpha.png");
|
||||
background-position: 0 100%;
|
||||
}
|
||||
.colorpicker-color div {
|
||||
height: 10px;
|
||||
}
|
||||
.colorpicker-selectors {
|
||||
display: none;
|
||||
height: 10px;
|
||||
margin-top: 5px;
|
||||
clear: both;
|
||||
}
|
||||
.colorpicker-selectors i {
|
||||
cursor: pointer;
|
||||
float: left;
|
||||
height: 10px;
|
||||
width: 10px;
|
||||
}
|
||||
.colorpicker-selectors i + i {
|
||||
margin-left: 3px;
|
||||
}
|
||||
.colorpicker-element .input-group-addon i,
|
||||
.colorpicker-element .add-on i {
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
height: 16px;
|
||||
vertical-align: text-top;
|
||||
width: 16px;
|
||||
}
|
||||
.colorpicker.colorpicker-inline {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
float: none;
|
||||
z-index: auto;
|
||||
}
|
||||
.colorpicker.colorpicker-horizontal {
|
||||
width: 110px;
|
||||
min-width: 110px;
|
||||
height: auto;
|
||||
}
|
||||
.colorpicker.colorpicker-horizontal .colorpicker-saturation {
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
.colorpicker.colorpicker-horizontal .colorpicker-color {
|
||||
width: 100px;
|
||||
}
|
||||
.colorpicker.colorpicker-horizontal .colorpicker-hue,
|
||||
.colorpicker.colorpicker-horizontal .colorpicker-alpha {
|
||||
width: 100px;
|
||||
height: 15px;
|
||||
float: left;
|
||||
cursor: col-resize;
|
||||
margin-left: 0px;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
.colorpicker.colorpicker-horizontal .colorpicker-hue i,
|
||||
.colorpicker.colorpicker-horizontal .colorpicker-alpha i {
|
||||
display: block;
|
||||
height: 15px;
|
||||
background: #ffffff;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 1px;
|
||||
border: none;
|
||||
margin-top: 0px;
|
||||
}
|
||||
.colorpicker.colorpicker-horizontal .colorpicker-hue {
|
||||
background-image: url("../img/bootstrap-colorpicker/hue-horizontal.png");
|
||||
}
|
||||
.colorpicker.colorpicker-horizontal .colorpicker-alpha {
|
||||
background-image: url("../img/bootstrap-colorpicker/alpha-horizontal.png");
|
||||
}
|
||||
.colorpicker.colorpicker-hidden {
|
||||
display: none;
|
||||
}
|
||||
.colorpicker.colorpicker-visible {
|
||||
display: block;
|
||||
}
|
||||
.colorpicker-inline.colorpicker-visible {
|
||||
display: inline-block;
|
||||
}
|
||||
.colorpicker-right:before {
|
||||
left: auto;
|
||||
right: 6px;
|
||||
}
|
||||
.colorpicker-right:after {
|
||||
left: auto;
|
||||
right: 7px;
|
||||
}
|
||||
.colorpicker-no-arrow:before {
|
||||
border-right: 0;
|
||||
border-left: 0;
|
||||
}
|
||||
.colorpicker-no-arrow:after {
|
||||
border-right: 0;
|
||||
border-left: 0;
|
||||
}
|
||||
/*# sourceMappingURL=bootstrap-colorpicker.css.map */
|
||||
10
assets/webconfig/css/bootstrap-colorpicker.min.css
vendored
Normal file
10
assets/webconfig/css/bootstrap-colorpicker.min.css
vendored
Normal file
@@ -0,0 +1,10 @@
|
||||
/*!
|
||||
* Bootstrap Colorpicker v2.3.3
|
||||
* http://mjolnic.github.io/bootstrap-colorpicker/
|
||||
*
|
||||
* Originally written by (c) 2012 Stefan Petre
|
||||
* Licensed under the Apache License v2.0
|
||||
* http://www.apache.org/licenses/LICENSE-2.0.txt
|
||||
*
|
||||
*/.colorpicker-saturation{width:100px;height:100px;background-image:url(../img/bootstrap-colorpicker/saturation.png);cursor:crosshair;float:left}.colorpicker-saturation i{display:block;height:5px;width:5px;border:1px solid #000;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;position:absolute;top:0;left:0;margin:-4px 0 0 -4px}.colorpicker-saturation i b{display:block;height:5px;width:5px;border:1px solid #fff;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}.colorpicker-alpha,.colorpicker-hue{width:15px;height:100px;float:left;cursor:row-resize;margin-left:4px;margin-bottom:4px}.colorpicker-alpha i,.colorpicker-hue i{display:block;height:1px;background:#000;border-top:1px solid #fff;position:absolute;top:0;left:0;width:100%;margin-top:-1px}.colorpicker-hue{background-image:url(../img/bootstrap-colorpicker/hue.png)}.colorpicker-alpha{background-image:url(../img/bootstrap-colorpicker/alpha.png);display:none}.colorpicker-alpha,.colorpicker-hue,.colorpicker-saturation{background-size:contain}.colorpicker{padding:4px;min-width:130px;margin-top:1px;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;z-index:2500}.colorpicker:after,.colorpicker:before{display:table;content:"";line-height:0}.colorpicker:after{clear:both}.colorpicker:before{content:'';display:inline-block;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid #ccc;border-bottom-color:rgba(0,0,0,.2);position:absolute;top:-7px;left:6px}.colorpicker:after{content:'';display:inline-block;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:6px solid #fff;position:absolute;top:-6px;left:7px}.colorpicker div{position:relative}.colorpicker.colorpicker-with-alpha{min-width:140px}.colorpicker.colorpicker-with-alpha .colorpicker-alpha{display:block}.colorpicker-color{height:10px;margin-top:5px;clear:both;background-image:url(../img/bootstrap-colorpicker/alpha.png);background-position:0 100%}.colorpicker-color div{height:10px}.colorpicker-selectors{display:none;height:10px;margin-top:5px;clear:both}.colorpicker-selectors i{cursor:pointer;float:left;height:10px;width:10px}.colorpicker-selectors i+i{margin-left:3px}.colorpicker-element .add-on i,.colorpicker-element .input-group-addon i{display:inline-block;cursor:pointer;height:16px;vertical-align:text-top;width:16px}.colorpicker.colorpicker-inline{position:relative;display:inline-block;float:none;z-index:auto}.colorpicker.colorpicker-horizontal{width:110px;min-width:110px;height:auto}.colorpicker.colorpicker-horizontal .colorpicker-saturation{margin-bottom:4px}.colorpicker.colorpicker-horizontal .colorpicker-color{width:100px}.colorpicker.colorpicker-horizontal .colorpicker-alpha,.colorpicker.colorpicker-horizontal .colorpicker-hue{width:100px;height:15px;float:left;cursor:col-resize;margin-left:0;margin-bottom:4px}.colorpicker.colorpicker-horizontal .colorpicker-alpha i,.colorpicker.colorpicker-horizontal .colorpicker-hue i{display:block;height:15px;background:#fff;position:absolute;top:0;left:0;width:1px;border:none;margin-top:0}.colorpicker.colorpicker-horizontal .colorpicker-hue{background-image:url(../img/bootstrap-colorpicker/hue-horizontal.png)}.colorpicker.colorpicker-horizontal .colorpicker-alpha{background-image:url(../img/bootstrap-colorpicker/alpha-horizontal.png)}.colorpicker.colorpicker-hidden{display:none}.colorpicker.colorpicker-visible{display:block}.colorpicker-inline.colorpicker-visible{display:inline-block}.colorpicker-right:before{left:auto;right:6px}.colorpicker-right:after{left:auto;right:7px}.colorpicker-no-arrow:before{border-right:0;border-left:0}.colorpicker-no-arrow:after{border-right:0;border-left:0}
|
||||
/*# sourceMappingURL=bootstrap-colorpicker.min.css.map */
|
||||
1
assets/webconfig/css/bootstrap-colorpicker.min.css.map
Normal file
1
assets/webconfig/css/bootstrap-colorpicker.min.css.map
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"sources":["src/less/colorpicker.less"],"names":[],"mappings":";;;;;;;;AAqBA,wBACE,MAAA,MACA,OAAA,MAXA,iBAAsB,iDAatB,OAAA,UACA,MAAA,KACA,0BACE,QAAA,MACA,OAAA,IACA,MAAA,IACA,OAAA,IAAA,MAAA,KAfF,sBAAA,IACA,mBAAA,IACA,cAAA,IAeE,SAAA,SACA,IAAA,EACA,KAAA,EACA,OAAA,KAAA,EAAA,EAAA,KACA,4BACE,QAAA,MACA,OAAA,IACA,MAAA,IACA,OAAA,IAAA,MAAA,KAzBJ,sBAAA,IACA,mBAAA,IACA,cAAA,IA8BF,mBADA,iBAEE,MAAA,KACA,OAAA,MACA,MAAA,KACA,OAAA,WACA,YAAA,IACA,cAAA,IAIiB,qBADF,mBAEf,QAAA,MACA,OAAA,IACA,WAAA,KACA,WAAA,IAAA,MAAA,KACA,SAAA,SACA,IAAA,EACA,KAAA,EACA,MAAA,KACA,WAAA,KAGF,iBA1DE,iBAAsB,0CA8DxB,mBA9DE,iBAAsB,4CAgEtB,QAAA,KAKF,mBADA,iBADA,wBAGE,gBAAA,QAGF,aACE,QAAA,IACA,UAAA,MACA,WAAA,IAxEA,sBAAA,IACA,mBAAA,IACA,cAAA,IAwEA,QAAA,KAIU,mBADA,oBAEV,QAAA,MACA,QAAA,GACA,YAAA,EAGU,mBACV,MAAA,KAGU,oBACV,QAAA,GACA,QAAA,aACA,YAAA,IAAA,MAAA,YACA,aAAA,IAAA,MAAA,YACA,cAAA,IAAA,MAAA,KACA,oBAAA,eACA,SAAA,SACA,IAAA,KACA,KAAA,IAGU,mBACV,QAAA,GACA,QAAA,aACA,YAAA,IAAA,MAAA,YACA,aAAA,IAAA,MAAA,YACA,cAAA,IAAA,MAAA,KACA,SAAA,SACA,IAAA,KACA,KAAA,IAGW,iBACX,SAAA,SAGU,oCACV,UAAA,MAGkC,uDAClC,QAAA,MAGF,mBACE,OAAA,KACA,WAAA,IACA,MAAA,KAlIA,iBAAsB,4CAoItB,oBAAA,EAAA,KAGiB,uBACjB,OAAA,KAGF,uBACE,QAAA,KACA,OAAA,KACA,WAAA,IACA,MAAA,KAGqB,yBACrB,OAAA,QACA,MAAA,KACA,OAAA,KACA,MAAA,KAGuB,2BACvB,YAAA,IAI2B,+BADW,0CAEtC,QAAA,aACA,OAAA,QACA,OAAA,KACA,eAAA,SACA,MAAA,KAGU,gCACV,SAAA,SACA,QAAA,aACA,MAAA,KACA,QAAA,KAGU,oCACV,MAAA,MACA,UAAA,MACA,OAAA,KAGkC,4DAClC,cAAA,IAGkC,uDAClC,MAAA,MAIkC,uDADA,qDAElC,MAAA,MACA,OAAA,KACA,MAAA,KACA,OAAA,WACA,YAAA,EACA,cAAA,IAIqD,yDADF,uDAEnD,QAAA,MACA,OAAA,KACA,WAAA,KACA,SAAA,SACA,IAAA,EACA,KAAA,EACA,MAAA,IACA,OAAA,KACA,WAAA,EAGkC,qDAlNlC,iBAAsB,qDAsNY,uDAtNlC,iBAAsB,uDA0NZ,gCACV,QAAA,KAGU,iCACV,QAAA,MAGiB,wCACjB,QAAA,aAGgB,0BAChB,KAAA,KACA,MAAA,IAGgB,yBAChB,KAAA,KACA,MAAA,IAGmB,6BACnB,aAAA,EACA,YAAA,EAGmB,4BACnB,aAAA,EACA,YAAA"}
|
||||
@@ -12,20 +12,25 @@
|
||||
<title>Hyperion - WebUI</title>
|
||||
|
||||
<!-- jQuery -->
|
||||
<script src="js/jquery.min.js"></script>
|
||||
<script src="js/lib/jquery.min.js"></script>
|
||||
|
||||
<script src="js/hyperion.js"></script>
|
||||
|
||||
<!-- Colorpicker -->
|
||||
<script src="js/lib/bootstrap-colorpicker.min.js"></script>
|
||||
<link href="css/bootstrap-colorpicker.min.css" rel="stylesheet">
|
||||
|
||||
<!-- Bootstrap Switch -->
|
||||
<script src="js/bootstrap-switch.min.js"></script>
|
||||
<script src="js/lib/bootstrap-switch.min.js"></script>
|
||||
<link href="css/bootstrap-switch.min.css" rel="stylesheet">
|
||||
|
||||
<!-- JSONForm -->
|
||||
<script src="js/underscore.js"></script>
|
||||
<script src="js/jsonform.js"></script>
|
||||
<script src="js/lib/underscore.js"></script>
|
||||
<script src="js/lib/jsonform.js"></script>
|
||||
|
||||
<!--Language Support -->
|
||||
<script src="js/jquery-lang.js" charset="utf-8" type="text/javascript"></script>
|
||||
<script src="js/js.cookie.js"></script>
|
||||
<script src="js/lib/jquery-lang.js" charset="utf-8" type="text/javascript"></script>
|
||||
<script src="js/lib/js.cookie.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
// Create language switcher instance
|
||||
@@ -416,13 +421,13 @@
|
||||
|
||||
|
||||
<!-- Bootstrap Core JavaScript -->
|
||||
<script src="js/bootstrap.min.js"></script>
|
||||
<script src="js/lib/bootstrap.min.js"></script>
|
||||
|
||||
<!-- Metis Menu Plugin JavaScript -->
|
||||
<script src="js/metisMenu.min.js"></script>
|
||||
<script src="js/lib/metisMenu.min.js"></script>
|
||||
|
||||
<!-- Custom Theme JavaScript -->
|
||||
<script src="js/sb-admin-2.js"></script>
|
||||
<script src="js/lib/sb-admin-2.js"></script>
|
||||
<script>
|
||||
|
||||
$(document).ready( function() {
|
||||
@@ -445,11 +450,11 @@
|
||||
$("#load_confKodi").on("click", function() {
|
||||
$("#page-wrapper").load("kodiconf.html");
|
||||
});
|
||||
|
||||
|
||||
$("#load_update").on("click", function() {
|
||||
$("#page-wrapper").load("update.html");
|
||||
});
|
||||
|
||||
|
||||
$("#load_confGeneral").on("click", function() {
|
||||
$("#page-wrapper").load("generalconf.html");
|
||||
});
|
||||
|
||||
1106
assets/webconfig/js/bootstrap-colorpicker.js
vendored
1106
assets/webconfig/js/bootstrap-colorpicker.js
vendored
File diff suppressed because it is too large
Load Diff
5
assets/webconfig/js/lib/bootstrap-colorpicker.min.js
vendored
Normal file
5
assets/webconfig/js/lib/bootstrap-colorpicker.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
@@ -1,6 +1,3 @@
|
||||
<script src="js/bootstrap-colorpicker.js"></script>
|
||||
<link href="css/bootstrap-colorpicker.css" rel="stylesheet">
|
||||
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
<div class="col-lg-12">
|
||||
|
||||
Reference in New Issue
Block a user