mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-02-02 22:37:32 +00:00
145 lines
5.4 KiB
HTML
Executable File
145 lines
5.4 KiB
HTML
Executable File
<!-- Javi Agenjo (@tamat) on 31/9/2011 -->
|
|
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>LiteGraph</title>
|
|
<!--<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">-->
|
|
<meta http-equiv="X-UA-Compatible" content="chrome=1">
|
|
|
|
<link rel="stylesheet" type="text/css" href="../css/litegraph.css">
|
|
<link rel="stylesheet" type="text/css" href="../css/litegraph-editor.css">
|
|
<link rel="stylesheet" type="text/css" href="style.css">
|
|
|
|
</head>
|
|
<body>
|
|
<div id="main">
|
|
</div>
|
|
|
|
<script type="text/javascript" src="../external/jquery-1.6.2.min.js"></script>
|
|
<script type="text/javascript" src="https://tamats.com/projects/sillyserver/src/sillyclient.js"></script>
|
|
<!-- <script type="text/javascript" src="https://unpkg.com/codeflask/build/codeflask.min.js"></script> -->
|
|
<script type="text/javascript" src="js/libs/gl-matrix-min.js"></script>
|
|
<script type="text/javascript" src="js/libs/audiosynth.js"></script>
|
|
<script type="text/javascript" src="js/libs/midi-parser.js"></script>
|
|
|
|
<script type="text/javascript" src="../src/litegraph.js"></script>
|
|
<script type="text/javascript" src="../src/litegraph-editor.js"></script>
|
|
<script type="text/javascript" src="js/defaults_mobile.js"></script>
|
|
|
|
<script type="text/javascript" src="../src/nodes/base.js"></script>
|
|
<script type="text/javascript" src="../src/nodes/logic.js"></script>
|
|
<script type="text/javascript" src="../src/nodes/events.js"></script>
|
|
<script type="text/javascript" src="../src/nodes/math.js"></script>
|
|
<script type="text/javascript" src="../src/nodes/math3d.js"></script>
|
|
<script type="text/javascript" src="../src/nodes/strings.js"></script>
|
|
<script type="text/javascript" src="../src/nodes/interface.js"></script>
|
|
<script type="text/javascript" src="../src/nodes/geometry.js"></script>
|
|
<script type="text/javascript" src="../src/nodes/graphics.js"></script>
|
|
<script type="text/javascript" src="../src/nodes/input.js"></script>
|
|
<script type="text/javascript" src="../src/nodes/midi.js"></script>
|
|
<script type="text/javascript" src="../src/nodes/audio.js"></script>
|
|
<script type="text/javascript" src="../src/nodes/network.js"></script>
|
|
|
|
<script type="text/javascript" src="js/demos.js"></script>
|
|
<script type="text/javascript" src="js/code.js"></script>
|
|
|
|
<script type="text/javascript" src="../src/nodes/others.js"></script>
|
|
|
|
<!-- htmlConsole use to debug on mobile, include and set editorUseHtmlConsole in defaults.js -->
|
|
<!-- enable console style, html, js enabling/disabling this comment here-> -->
|
|
|
|
<link rel="stylesheet" href="//htmlacademy.github.io/console.js/latest/css/style.css">
|
|
<style>
|
|
.invisible{ display: none; }
|
|
.console__row{
|
|
margin: 1px;
|
|
padding: 2px;
|
|
}
|
|
.console-container{
|
|
min-width: 200px;
|
|
background: rgba(255,255,255,0.1);
|
|
position: fixed;
|
|
top: 38px;
|
|
left: 0;
|
|
overflow: auto;
|
|
height: calc(100%-38px);
|
|
}
|
|
.console-container.small{
|
|
max-width: 30%;
|
|
}
|
|
.graphcanvas{
|
|
/*WONT WORK touch-action: manipulation;*/
|
|
/*touch-action: none;*/
|
|
touch-action: pinch-zoom;
|
|
}
|
|
</style>
|
|
|
|
<div id="console-container" class="litegraph-editor console-container small invisible" style="">
|
|
<div class="console-tools" style="position: absolute; top: 0; right:0; z-index:2;">
|
|
<button class='btn' id='btn_console_close'>close</button>
|
|
<button class='btn' id='btn_console_clear'>clear</button>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="//htmlacademy.github.io/console.js/latest/js/index.js"></script>
|
|
<script>
|
|
|
|
var editorUseHtmlConsole = true; // enable html console to debug on mobile
|
|
|
|
// ToBarSelector
|
|
if(editorUseHtmlConsole){
|
|
document.getElementById("LGEditorTopBarSelector").innerHTML = "<button class='btn' id='btn_console'>Console</button> "
|
|
+document.getElementById("LGEditorTopBarSelector").innerHTML;
|
|
}
|
|
|
|
// html console
|
|
if(editorUseHtmlConsole){
|
|
elem.querySelector("#btn_console").addEventListener("click", function(){
|
|
var consoleCnt = document.getElementById('console-container');
|
|
if (consoleCnt.classList.contains("invisible")){
|
|
consoleCnt.classList.remove("invisible");
|
|
}else{
|
|
jsConsole.clean();
|
|
consoleCnt.classList.add("invisible");
|
|
}
|
|
});
|
|
|
|
|
|
const params = {
|
|
expandDepth : 1,
|
|
common : {
|
|
excludeProperties : ['__proto__'],
|
|
removeProperties: ['__proto__'],
|
|
maxFieldsInHead : 5,
|
|
minFieldsToAutoexpand : 5,
|
|
maxFieldsToAutoexpand : 15
|
|
}
|
|
};
|
|
var jsConsole = new Console(document.querySelector('.console-container'), params);
|
|
jsConsole.log("Here is console.log!");
|
|
|
|
// map console log-debug to jsConsole
|
|
console.log = function(par){
|
|
jsConsole.log(par);
|
|
var objDiv = document.getElementById("console-container");
|
|
objDiv.scrollTop = objDiv.scrollHeight;
|
|
}
|
|
console.debug = console.log;
|
|
|
|
console.log("going into html console");
|
|
|
|
document.getElementById("btn_console_clear").addEventListener("click", function(){
|
|
var consoleCnt = document.getElementById('console-container');
|
|
jsConsole.clean();
|
|
});
|
|
document.getElementById("btn_console_close").addEventListener("click", function(){
|
|
var consoleCnt = document.getElementById('console-container');
|
|
consoleCnt.classList.add("invisible");
|
|
});
|
|
}
|
|
</script>
|
|
<!-- -->
|
|
|
|
</body>
|
|
</html>
|