mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-02-02 22:37:32 +00:00
style: format codes
This commit is contained in:
NateScarlet
@@ -1,224 +1,228 @@
|
||||
.litegraph-editor {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
background-color: #333;
|
||||
color: #EEE;
|
||||
font: 14px Tahoma;
|
||||
background-color: #333;
|
||||
color: #eee;
|
||||
font: 14px Tahoma;
|
||||
|
||||
position: relative;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.litegraph-editor h1 {
|
||||
font-family: "Metro Light",Tahoma;
|
||||
color: #DDD;
|
||||
font-size: 28px;
|
||||
padding-left: 10px;
|
||||
/*text-shadow: 0 1px 1px #333, 0 -1px 1px #777;*/
|
||||
margin: 0;
|
||||
font-weight: normal;
|
||||
font-family: "Metro Light", Tahoma;
|
||||
color: #ddd;
|
||||
font-size: 28px;
|
||||
padding-left: 10px;
|
||||
/*text-shadow: 0 1px 1px #333, 0 -1px 1px #777;*/
|
||||
margin: 0;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.litegraph-editor h1 span {
|
||||
font-family: "Arial";
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
color: #AAA;
|
||||
font-family: "Arial";
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
.litegraph-editor h2 {
|
||||
font-family: "Metro Light";
|
||||
padding: 5px;
|
||||
margin-left: 10px;
|
||||
font-family: "Metro Light";
|
||||
padding: 5px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
|
||||
.litegraph-editor * {
|
||||
box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
}
|
||||
|
||||
.litegraph-editor .content {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: calc( 100% - 80px );
|
||||
background-color: #1A1A1A;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: calc(100% - 80px);
|
||||
background-color: #1a1a1a;
|
||||
}
|
||||
|
||||
.litegraph-editor .header, .litegraph-editor .footer {
|
||||
position: relative;
|
||||
height: 40px;
|
||||
background-color: #333;
|
||||
/*border-radius: 10px 10px 0 0;*/
|
||||
.litegraph-editor .header,
|
||||
.litegraph-editor .footer {
|
||||
position: relative;
|
||||
height: 40px;
|
||||
background-color: #333;
|
||||
/*border-radius: 10px 10px 0 0;*/
|
||||
}
|
||||
|
||||
.litegraph-editor .tools, .litegraph-editor .tools-left, .litegraph-editor .tools-right {
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
right: 0px;
|
||||
vertical-align: top;
|
||||
.litegraph-editor .tools,
|
||||
.litegraph-editor .tools-left,
|
||||
.litegraph-editor .tools-right {
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
right: 0px;
|
||||
vertical-align: top;
|
||||
|
||||
margin: 2px 5px 0 0px;
|
||||
margin: 2px 5px 0 0px;
|
||||
}
|
||||
|
||||
.litegraph-editor .tools-left {
|
||||
right: auto;
|
||||
left: 4px;
|
||||
right: auto;
|
||||
left: 4px;
|
||||
}
|
||||
|
||||
.litegraph-editor .footer {
|
||||
height: 40px;
|
||||
position: relative;
|
||||
/*border-radius: 0 0 10px 10px;*/
|
||||
height: 40px;
|
||||
position: relative;
|
||||
/*border-radius: 0 0 10px 10px;*/
|
||||
}
|
||||
|
||||
.litegraph-editor .miniwindow {
|
||||
background-color: #333;
|
||||
border: 1px solid #111;
|
||||
background-color: #333;
|
||||
border: 1px solid #111;
|
||||
}
|
||||
|
||||
.litegraph-editor .miniwindow .corner-button {
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
right: 2px;
|
||||
font-family: "Tahoma";
|
||||
font-size: 14px;
|
||||
color: #AAA;
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
right: 2px;
|
||||
font-family: "Tahoma";
|
||||
font-size: 14px;
|
||||
color: #aaa;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
/* BUTTONS **********************/
|
||||
|
||||
.litegraph-editor button {
|
||||
/*font-family: "Metro Light";*/
|
||||
color: #CCC;
|
||||
font-size: 20px;
|
||||
min-width: 30px;
|
||||
/*border-radius: 0.3em;*/
|
||||
border: 0 solid #666;
|
||||
background-color: #3F3F3F;
|
||||
/*box-shadow: 0 0 3px black;*/
|
||||
padding: 4px 10px;
|
||||
cursor: pointer;
|
||||
transition: all 1s;
|
||||
-moz-transition: all 1s;
|
||||
-webkit-transition: all 0.4s;
|
||||
/*font-family: "Metro Light";*/
|
||||
color: #ccc;
|
||||
font-size: 20px;
|
||||
min-width: 30px;
|
||||
/*border-radius: 0.3em;*/
|
||||
border: 0 solid #666;
|
||||
background-color: #3f3f3f;
|
||||
/*box-shadow: 0 0 3px black;*/
|
||||
padding: 4px 10px;
|
||||
cursor: pointer;
|
||||
transition: all 1s;
|
||||
-moz-transition: all 1s;
|
||||
-webkit-transition: all 0.4s;
|
||||
}
|
||||
|
||||
.litegraph-editor button:hover {
|
||||
background-color: #999;
|
||||
color: #FFF;
|
||||
transition: all 1s;
|
||||
-moz-transition: all 1s;
|
||||
-webkit-transition: all 0.4s;
|
||||
background-color: #999;
|
||||
color: #fff;
|
||||
transition: all 1s;
|
||||
-moz-transition: all 1s;
|
||||
-webkit-transition: all 0.4s;
|
||||
}
|
||||
|
||||
.litegraph-editor button:active {
|
||||
background-color: white;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.litegraph-editor button.fixed {
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
right: 5px;
|
||||
font-size: 1.2em;
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
right: 5px;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
.litegraph-editor button img {
|
||||
margin: -4px;
|
||||
vertical-align: top;
|
||||
opacity: 0.8;
|
||||
transition: all 1s;
|
||||
margin: -4px;
|
||||
vertical-align: top;
|
||||
opacity: 0.8;
|
||||
transition: all 1s;
|
||||
}
|
||||
|
||||
.litegraph-editor button:hover img {
|
||||
opacity: 1;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.litegraph-editor .header button {
|
||||
height: 32px;
|
||||
vertical-align: top;
|
||||
height: 32px;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.litegraph-editor .footer button {
|
||||
/*font-size: 16px;*/
|
||||
/*font-size: 16px;*/
|
||||
}
|
||||
|
||||
.litegraph-editor .toolbar-widget {
|
||||
display: inline-block;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.litegraph-editor .editor-area {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* METER *********************/
|
||||
|
||||
.litegraph-editor .loadmeter {
|
||||
font-family: "Tahoma";
|
||||
color: #AAA;
|
||||
font-size: 12px;
|
||||
border-radius: 2px;
|
||||
width: 130px;
|
||||
vertical-align: top;
|
||||
font-family: "Tahoma";
|
||||
color: #aaa;
|
||||
font-size: 12px;
|
||||
border-radius: 2px;
|
||||
width: 130px;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.litegraph-editor .strong {
|
||||
vertical-align: top;
|
||||
padding: 3px;
|
||||
width: 30px;
|
||||
display: inline-block;
|
||||
line-height: 8px;
|
||||
.litegraph-editor .strong {
|
||||
vertical-align: top;
|
||||
padding: 3px;
|
||||
width: 30px;
|
||||
display: inline-block;
|
||||
line-height: 8px;
|
||||
}
|
||||
|
||||
.litegraph-editor .cpuload .bgload, .litegraph-editor .gpuload .bgload {
|
||||
display: inline-block;
|
||||
width: 90px;
|
||||
height: 15px;
|
||||
background-image: url('../demo/imgs/load-progress-empty.png');
|
||||
.litegraph-editor .cpuload .bgload,
|
||||
.litegraph-editor .gpuload .bgload {
|
||||
display: inline-block;
|
||||
width: 90px;
|
||||
height: 15px;
|
||||
background-image: url("../demo/imgs/load-progress-empty.png");
|
||||
}
|
||||
|
||||
.litegraph-editor .cpuload .fgload, .litegraph-editor .gpuload .fgload {
|
||||
display: inline-block;
|
||||
width: 4px;
|
||||
height: 15px;
|
||||
max-width: 90px;
|
||||
background-image: url('../demo/imgs/load-progress-full.png');
|
||||
.litegraph-editor .cpuload .fgload,
|
||||
.litegraph-editor .gpuload .fgload {
|
||||
display: inline-block;
|
||||
width: 4px;
|
||||
height: 15px;
|
||||
max-width: 90px;
|
||||
background-image: url("../demo/imgs/load-progress-full.png");
|
||||
}
|
||||
|
||||
.litegraph-editor .dialog {
|
||||
position: absolute;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin-top: -150px;
|
||||
margin-left: -200px;
|
||||
|
||||
background-color: #151515;
|
||||
background-color: #151515;
|
||||
|
||||
min-width: 400px;
|
||||
min-height: 300px;
|
||||
box-shadow: 0 0 2px black;
|
||||
min-width: 400px;
|
||||
min-height: 300px;
|
||||
box-shadow: 0 0 2px black;
|
||||
}
|
||||
|
||||
.litegraph-editor .dialog .dialog-header, .litegraph-editor .dialog .dialog-footer{
|
||||
height: 40px;
|
||||
.litegraph-editor .dialog .dialog-header,
|
||||
.litegraph-editor .dialog .dialog-footer {
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.litegraph-editor .dialog .dialog-header .dialog-title {
|
||||
font: 20px 'Arial';
|
||||
margin: 4px;
|
||||
padding: 4px 10px;
|
||||
display:inline-block;
|
||||
font: 20px "Arial";
|
||||
margin: 4px;
|
||||
padding: 4px 10px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.litegraph-editor .dialog .dialog-content {
|
||||
height: calc( 100% - 40px );
|
||||
width: calc( 100% - 10px );
|
||||
background-color: black;
|
||||
margin: 4px;
|
||||
display:inline-block;
|
||||
}
|
||||
height: calc(100% - 40px);
|
||||
width: calc(100% - 10px);
|
||||
background-color: black;
|
||||
margin: 4px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
@@ -1,334 +1,337 @@
|
||||
/* this CSS contains only the basic CSS needed to run the app and use it */
|
||||
|
||||
.lgraphcanvas {
|
||||
/*cursor: crosshair;*/
|
||||
user-select: none;
|
||||
-moz-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
/*cursor: crosshair;*/
|
||||
user-select: none;
|
||||
-moz-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
}
|
||||
|
||||
|
||||
.litegraph.litecontextmenu {
|
||||
font-family:Tahoma, sans-serif;
|
||||
position: fixed;
|
||||
top: 100px;
|
||||
left: 100px;
|
||||
min-width: 100px;
|
||||
color: #AAF;
|
||||
padding: 0;
|
||||
box-shadow: 0 0 10px black !important;
|
||||
background-color: #2E2E2E !important;
|
||||
font-family: Tahoma, sans-serif;
|
||||
position: fixed;
|
||||
top: 100px;
|
||||
left: 100px;
|
||||
min-width: 100px;
|
||||
color: #aaf;
|
||||
padding: 0;
|
||||
box-shadow: 0 0 10px black !important;
|
||||
background-color: #2e2e2e !important;
|
||||
}
|
||||
|
||||
.litegraph.litecontextmenu.dark {
|
||||
background-color: #000 !important;
|
||||
background-color: #000 !important;
|
||||
}
|
||||
|
||||
.litegraph.litecontextmenu .litemenu-title img {
|
||||
margin-top: 2px;
|
||||
margin-left: 2px;
|
||||
margin-right: 4px;
|
||||
margin-top: 2px;
|
||||
margin-left: 2px;
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
.litegraph.litecontextmenu .litemenu-entry {
|
||||
margin: 2px;
|
||||
padding: 2px;
|
||||
margin: 2px;
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
.litegraph.litecontextmenu .litemenu-entry.submenu {
|
||||
background-color: #2E2E2E !important;
|
||||
background-color: #2e2e2e !important;
|
||||
}
|
||||
|
||||
.litegraph.litecontextmenu.dark .litemenu-entry.submenu {
|
||||
background-color: #000 !important;
|
||||
background-color: #000 !important;
|
||||
}
|
||||
|
||||
|
||||
.litegraph .litemenubar ul {
|
||||
font-family:Tahoma, sans-serif;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: Tahoma, sans-serif;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.litegraph .litemenubar li {
|
||||
font-size: 14px;
|
||||
color: #999;
|
||||
display: inline-block;
|
||||
min-width: 50px;
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
user-select: none;
|
||||
-moz-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
color: #999;
|
||||
display: inline-block;
|
||||
min-width: 50px;
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
user-select: none;
|
||||
-moz-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.litegraph .litemenubar li:hover {
|
||||
background-color: #777;
|
||||
color: #EEE;
|
||||
background-color: #777;
|
||||
color: #eee;
|
||||
}
|
||||
|
||||
.litegraph .litegraph .litemenubar-panel {
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
left: 5px;
|
||||
min-width: 100px;
|
||||
background-color: #444;
|
||||
box-shadow: 0 0 3px black;
|
||||
padding: 4px;
|
||||
border-bottom: 2px solid #AAF;
|
||||
z-index: 10;
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
left: 5px;
|
||||
min-width: 100px;
|
||||
background-color: #444;
|
||||
box-shadow: 0 0 3px black;
|
||||
padding: 4px;
|
||||
border-bottom: 2px solid #aaf;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.litegraph .litemenu-entry, .litemenu-title {
|
||||
font-size: 12px;
|
||||
color: #AAA;
|
||||
padding: 0 0 0 4px;
|
||||
margin: 2px;
|
||||
padding-left: 2px;
|
||||
-moz-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
user-select: none;
|
||||
cursor: pointer;
|
||||
.litegraph .litemenu-entry,
|
||||
.litemenu-title {
|
||||
font-size: 12px;
|
||||
color: #aaa;
|
||||
padding: 0 0 0 4px;
|
||||
margin: 2px;
|
||||
padding-left: 2px;
|
||||
-moz-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
user-select: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.litegraph .litemenu-entry .icon {
|
||||
display: inline-block;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
margin: 2px;
|
||||
vertical-align: top;
|
||||
display: inline-block;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
margin: 2px;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.litegraph .litemenu-entry.checked .icon {
|
||||
background-color: #AAF;
|
||||
background-color: #aaf;
|
||||
}
|
||||
|
||||
.litegraph .litemenu-entry .more {
|
||||
float: right;
|
||||
padding-right:5px;
|
||||
float: right;
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
.litegraph .litemenu-entry.disabled {
|
||||
opacity: 0.5;
|
||||
cursor: default;
|
||||
opacity: 0.5;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.litegraph .litemenu-entry.separator {
|
||||
display: block;
|
||||
border-top: 1px solid #333;
|
||||
border-bottom: 1px solid #666;
|
||||
width: 100%;
|
||||
height: 0px;
|
||||
margin: 3px 0 2px 0;
|
||||
background-color: transparent;
|
||||
padding: 0 !important;
|
||||
cursor: default !important;
|
||||
display: block;
|
||||
border-top: 1px solid #333;
|
||||
border-bottom: 1px solid #666;
|
||||
width: 100%;
|
||||
height: 0px;
|
||||
margin: 3px 0 2px 0;
|
||||
background-color: transparent;
|
||||
padding: 0 !important;
|
||||
cursor: default !important;
|
||||
}
|
||||
|
||||
.litegraph .litemenu-entry.has_submenu {
|
||||
border-right: 2px solid cyan;
|
||||
border-right: 2px solid cyan;
|
||||
}
|
||||
|
||||
.litegraph .litemenu-title {
|
||||
color: #DDE;
|
||||
background-color: #111;
|
||||
margin: 0;
|
||||
padding: 2px;
|
||||
cursor: default;
|
||||
color: #dde;
|
||||
background-color: #111;
|
||||
margin: 0;
|
||||
padding: 2px;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.litegraph .litemenu-entry:hover:not(.disabled):not(.separator) {
|
||||
background-color: #444 !important;
|
||||
color: #EEE;
|
||||
transition: all 0.2s;
|
||||
background-color: #444 !important;
|
||||
color: #eee;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.litegraph .litemenu-entry .property_name {
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
min-width: 80px;
|
||||
min-height: 1.2em;
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
min-width: 80px;
|
||||
min-height: 1.2em;
|
||||
}
|
||||
|
||||
.litegraph .litemenu-entry .property_value {
|
||||
display: inline-block;
|
||||
background-color: rgba(0,0,0,0.5);
|
||||
text-align: right;
|
||||
min-width: 80px;
|
||||
min-height: 1.2em;
|
||||
vertical-align: middle;
|
||||
padding-right: 10px;
|
||||
display: inline-block;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
text-align: right;
|
||||
min-width: 80px;
|
||||
min-height: 1.2em;
|
||||
vertical-align: middle;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.litegraph.litesearchbox {
|
||||
font-family:Tahoma, sans-serif;
|
||||
position: absolute;
|
||||
background-color: rgba(0,0,0,0.5);
|
||||
padding-top: 4px;
|
||||
font-family: Tahoma, sans-serif;
|
||||
position: absolute;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
padding-top: 4px;
|
||||
}
|
||||
|
||||
.litegraph.litesearchbox input, .litegraph.litesearchbox select {
|
||||
margin-top: 3px;
|
||||
min-width: 60px;
|
||||
min-height: 1.5em;
|
||||
background-color: black;
|
||||
border: 0;
|
||||
color: white;
|
||||
padding-left: 10px;
|
||||
margin-right: 5px;
|
||||
.litegraph.litesearchbox input,
|
||||
.litegraph.litesearchbox select {
|
||||
margin-top: 3px;
|
||||
min-width: 60px;
|
||||
min-height: 1.5em;
|
||||
background-color: black;
|
||||
border: 0;
|
||||
color: white;
|
||||
padding-left: 10px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.litegraph.litesearchbox .name {
|
||||
display: inline-block;
|
||||
min-width: 60px;
|
||||
min-height: 1.5em;
|
||||
padding-left: 10px;
|
||||
display: inline-block;
|
||||
min-width: 60px;
|
||||
min-height: 1.5em;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.litegraph.litesearchbox .helper {
|
||||
overflow: auto;
|
||||
max-height: 200px;
|
||||
margin-top: 2px;
|
||||
overflow: auto;
|
||||
max-height: 200px;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.litegraph.lite-search-item {
|
||||
font-family:Tahoma, sans-serif;
|
||||
background-color: rgba(0,0,0,0.5);
|
||||
color: white;
|
||||
padding-top: 2px;
|
||||
font-family: Tahoma, sans-serif;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
color: white;
|
||||
padding-top: 2px;
|
||||
}
|
||||
|
||||
.litegraph.lite-search-item:hover, .litegraph.lite-search-item.selected {
|
||||
cursor: pointer;
|
||||
background-color: white;
|
||||
color: black;
|
||||
.litegraph.lite-search-item:hover,
|
||||
.litegraph.lite-search-item.selected {
|
||||
cursor: pointer;
|
||||
background-color: white;
|
||||
color: black;
|
||||
}
|
||||
|
||||
/* OLD */
|
||||
|
||||
.graphcontextmenu {
|
||||
padding: 4px;
|
||||
min-width: 100px;
|
||||
padding: 4px;
|
||||
min-width: 100px;
|
||||
}
|
||||
|
||||
|
||||
.graphcontextmenu-title {
|
||||
color: #DDE;
|
||||
background-color: #222;
|
||||
margin: 0;
|
||||
padding: 2px;
|
||||
cursor: default;
|
||||
color: #dde;
|
||||
background-color: #222;
|
||||
margin: 0;
|
||||
padding: 2px;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.graphmenu-entry {
|
||||
box-sizing: border-box;
|
||||
margin: 2px;
|
||||
padding-left: 20px;
|
||||
user-select: none;
|
||||
-moz-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
transition: all linear 0.3s;
|
||||
box-sizing: border-box;
|
||||
margin: 2px;
|
||||
padding-left: 20px;
|
||||
user-select: none;
|
||||
-moz-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
transition: all linear 0.3s;
|
||||
}
|
||||
|
||||
.graphmenu-entry.event, .litemenu-entry.event {
|
||||
border-left: 8px solid orange;
|
||||
padding-left: 12px;
|
||||
.graphmenu-entry.event,
|
||||
.litemenu-entry.event {
|
||||
border-left: 8px solid orange;
|
||||
padding-left: 12px;
|
||||
}
|
||||
|
||||
.graphmenu-entry.disabled {
|
||||
opacity: 0.3;
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
.graphmenu-entry.submenu {
|
||||
border-right: 2px solid #EEE;
|
||||
.graphmenu-entry.submenu {
|
||||
border-right: 2px solid #eee;
|
||||
}
|
||||
|
||||
|
||||
.graphmenu-entry:hover {
|
||||
background-color: #555;
|
||||
background-color: #555;
|
||||
}
|
||||
|
||||
.graphmenu-entry.separator {
|
||||
background-color: #111;
|
||||
border-bottom: 1px solid #666;
|
||||
height: 1px;
|
||||
width: calc( 100% - 20px );
|
||||
-moz-width: calc( 100% - 20px );
|
||||
-webkit-width: calc( 100% - 20px );
|
||||
background-color: #111;
|
||||
border-bottom: 1px solid #666;
|
||||
height: 1px;
|
||||
width: calc(100% - 20px);
|
||||
-moz-width: calc(100% - 20px);
|
||||
-webkit-width: calc(100% - 20px);
|
||||
}
|
||||
|
||||
.graphmenu-entry .property_name {
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
min-width: 80px;
|
||||
min-height: 1.2em;
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
min-width: 80px;
|
||||
min-height: 1.2em;
|
||||
}
|
||||
|
||||
.graphmenu-entry .property_value, .litemenu-entry .property_value {
|
||||
display: inline-block;
|
||||
background-color: rgba(0,0,0,0.5);
|
||||
text-align: right;
|
||||
min-width: 80px;
|
||||
min-height: 1.2em;
|
||||
vertical-align: middle;
|
||||
padding-right: 10px;
|
||||
.graphmenu-entry .property_value,
|
||||
.litemenu-entry .property_value {
|
||||
display: inline-block;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
text-align: right;
|
||||
min-width: 80px;
|
||||
min-height: 1.2em;
|
||||
vertical-align: middle;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.graphdialog {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
min-height: 2em;
|
||||
background-color: #333;
|
||||
font-size: 1.2em;
|
||||
box-shadow: 0 0 10px black !important;
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
min-height: 2em;
|
||||
background-color: #333;
|
||||
font-size: 1.2em;
|
||||
box-shadow: 0 0 10px black !important;
|
||||
}
|
||||
|
||||
.graphdialog.rounded {
|
||||
border-radius: 12px;
|
||||
padding-right: 2px;
|
||||
border-radius: 12px;
|
||||
padding-right: 2px;
|
||||
}
|
||||
|
||||
.graphdialog .name {
|
||||
display: inline-block;
|
||||
min-width: 60px;
|
||||
min-height: 1.5em;
|
||||
padding-left: 10px;
|
||||
display: inline-block;
|
||||
min-width: 60px;
|
||||
min-height: 1.5em;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.graphdialog input, .graphdialog select {
|
||||
margin: 3px;
|
||||
min-width: 60px;
|
||||
min-height: 1.5em;
|
||||
background-color: black;
|
||||
border: 0;
|
||||
color: white;
|
||||
padding-left: 10px;
|
||||
.graphdialog input,
|
||||
.graphdialog select {
|
||||
margin: 3px;
|
||||
min-width: 60px;
|
||||
min-height: 1.5em;
|
||||
background-color: black;
|
||||
border: 0;
|
||||
color: white;
|
||||
padding-left: 10px;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.graphdialog button {
|
||||
margin-top: 3px;
|
||||
vertical-align: top;
|
||||
margin-top: 3px;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.graphdialog button.rounded, .graphdialog input.rounded {
|
||||
border-radius: 0 12px 12px 0;
|
||||
.graphdialog button.rounded,
|
||||
.graphdialog input.rounded {
|
||||
border-radius: 0 12px 12px 0;
|
||||
}
|
||||
|
||||
.graphdialog .helper {
|
||||
overflow: auto;
|
||||
max-height: 200px;
|
||||
overflow: auto;
|
||||
max-height: 200px;
|
||||
}
|
||||
|
||||
.graphdialog .help-item {
|
||||
padding-left: 10px;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.graphdialog .help-item:hover, .graphdialog .help-item.selected {
|
||||
cursor: pointer;
|
||||
background-color: white;
|
||||
color: black;
|
||||
.graphdialog .help-item:hover,
|
||||
.graphdialog .help-item.selected {
|
||||
cursor: pointer;
|
||||
background-color: white;
|
||||
color: black;
|
||||
}
|
||||
|
||||
|
||||
@@ -1,233 +1,266 @@
|
||||
//Creates an interface to access extra features from a graph (like play, stop, live, etc)
|
||||
function Editor( container_id, options )
|
||||
{
|
||||
options = options || {};
|
||||
function Editor(container_id, options) {
|
||||
options = options || {};
|
||||
|
||||
//fill container
|
||||
var html = "<div class='header'><div class='tools tools-left'></div><div class='tools tools-right'></div></div>";
|
||||
html += "<div class='content'><div class='editor-area'><canvas class='graphcanvas' width='1000' height='500' tabindex=10></canvas></div></div>";
|
||||
html += "<div class='footer'><div class='tools tools-left'></div><div class='tools tools-right'></div></div>";
|
||||
|
||||
var root = document.createElement("div");
|
||||
this.root = root;
|
||||
root.className = "litegraph-editor";
|
||||
root.innerHTML = html;
|
||||
//fill container
|
||||
var html =
|
||||
"<div class='header'><div class='tools tools-left'></div><div class='tools tools-right'></div></div>";
|
||||
html +=
|
||||
"<div class='content'><div class='editor-area'><canvas class='graphcanvas' width='1000' height='500' tabindex=10></canvas></div></div>";
|
||||
html +=
|
||||
"<div class='footer'><div class='tools tools-left'></div><div class='tools tools-right'></div></div>";
|
||||
|
||||
this.tools = root.querySelector(".tools");
|
||||
this.footer = root.querySelector(".footer");
|
||||
var root = document.createElement("div");
|
||||
this.root = root;
|
||||
root.className = "litegraph-editor";
|
||||
root.innerHTML = html;
|
||||
|
||||
var canvas = root.querySelector(".graphcanvas");
|
||||
this.tools = root.querySelector(".tools");
|
||||
this.footer = root.querySelector(".footer");
|
||||
|
||||
//create graph
|
||||
var graph = this.graph = new LGraph();
|
||||
var graphcanvas = this.graphcanvas = new LGraphCanvas(canvas,graph);
|
||||
graphcanvas.background_image = "imgs/grid.png";
|
||||
graph.onAfterExecute = function() { graphcanvas.draw(true) };
|
||||
var canvas = root.querySelector(".graphcanvas");
|
||||
|
||||
//add stuff
|
||||
//this.addToolsButton("loadsession_button","Load","imgs/icon-load.png", this.onLoadButton.bind(this), ".tools-left" );
|
||||
//this.addToolsButton("savesession_button","Save","imgs/icon-save.png", this.onSaveButton.bind(this), ".tools-left" );
|
||||
this.addLoadCounter();
|
||||
this.addToolsButton("playnode_button","Play","imgs/icon-play.png", this.onPlayButton.bind(this), ".tools-right" );
|
||||
this.addToolsButton("playstepnode_button","Step","imgs/icon-playstep.png", this.onPlayStepButton.bind(this), ".tools-right" );
|
||||
|
||||
if(!options.skip_livemode)
|
||||
this.addToolsButton("livemode_button","Live","imgs/icon-record.png", this.onLiveButton.bind(this), ".tools-right" );
|
||||
if(!options.skip_maximize)
|
||||
this.addToolsButton("maximize_button","","imgs/icon-maximize.png", this.onFullscreenButton.bind(this), ".tools-right" );
|
||||
if(options.miniwindow)
|
||||
this.addMiniWindow(300,200);
|
||||
//create graph
|
||||
var graph = (this.graph = new LGraph());
|
||||
var graphcanvas = (this.graphcanvas = new LGraphCanvas(canvas, graph));
|
||||
graphcanvas.background_image = "imgs/grid.png";
|
||||
graph.onAfterExecute = function() {
|
||||
graphcanvas.draw(true);
|
||||
};
|
||||
|
||||
//append to DOM
|
||||
var parent = document.getElementById(container_id);
|
||||
if(parent)
|
||||
parent.appendChild(root);
|
||||
//add stuff
|
||||
//this.addToolsButton("loadsession_button","Load","imgs/icon-load.png", this.onLoadButton.bind(this), ".tools-left" );
|
||||
//this.addToolsButton("savesession_button","Save","imgs/icon-save.png", this.onSaveButton.bind(this), ".tools-left" );
|
||||
this.addLoadCounter();
|
||||
this.addToolsButton(
|
||||
"playnode_button",
|
||||
"Play",
|
||||
"imgs/icon-play.png",
|
||||
this.onPlayButton.bind(this),
|
||||
".tools-right"
|
||||
);
|
||||
this.addToolsButton(
|
||||
"playstepnode_button",
|
||||
"Step",
|
||||
"imgs/icon-playstep.png",
|
||||
this.onPlayStepButton.bind(this),
|
||||
".tools-right"
|
||||
);
|
||||
|
||||
graphcanvas.resize();
|
||||
//graphcanvas.draw(true,true);
|
||||
if (!options.skip_livemode)
|
||||
this.addToolsButton(
|
||||
"livemode_button",
|
||||
"Live",
|
||||
"imgs/icon-record.png",
|
||||
this.onLiveButton.bind(this),
|
||||
".tools-right"
|
||||
);
|
||||
if (!options.skip_maximize)
|
||||
this.addToolsButton(
|
||||
"maximize_button",
|
||||
"",
|
||||
"imgs/icon-maximize.png",
|
||||
this.onFullscreenButton.bind(this),
|
||||
".tools-right"
|
||||
);
|
||||
if (options.miniwindow) this.addMiniWindow(300, 200);
|
||||
|
||||
//append to DOM
|
||||
var parent = document.getElementById(container_id);
|
||||
if (parent) parent.appendChild(root);
|
||||
|
||||
graphcanvas.resize();
|
||||
//graphcanvas.draw(true,true);
|
||||
}
|
||||
|
||||
Editor.prototype.addLoadCounter = function()
|
||||
{
|
||||
var meter = document.createElement("div");
|
||||
meter.className = 'headerpanel loadmeter toolbar-widget';
|
||||
Editor.prototype.addLoadCounter = function() {
|
||||
var meter = document.createElement("div");
|
||||
meter.className = "headerpanel loadmeter toolbar-widget";
|
||||
|
||||
var html = "<div class='cpuload'><strong>CPU</strong> <div class='bgload'><div class='fgload'></div></div></div>";
|
||||
html += "<div class='gpuload'><strong>GFX</strong> <div class='bgload'><div class='fgload'></div></div></div>";
|
||||
var html =
|
||||
"<div class='cpuload'><strong>CPU</strong> <div class='bgload'><div class='fgload'></div></div></div>";
|
||||
html +=
|
||||
"<div class='gpuload'><strong>GFX</strong> <div class='bgload'><div class='fgload'></div></div></div>";
|
||||
|
||||
meter.innerHTML = html;
|
||||
this.root.querySelector(".header .tools-left").appendChild(meter);
|
||||
var self = this;
|
||||
meter.innerHTML = html;
|
||||
this.root.querySelector(".header .tools-left").appendChild(meter);
|
||||
var self = this;
|
||||
|
||||
setInterval(function() {
|
||||
meter.querySelector(".cpuload .fgload").style.width = ((2*self.graph.execution_time) * 90) + "px";
|
||||
if(self.graph.status == LGraph.STATUS_RUNNING)
|
||||
meter.querySelector(".gpuload .fgload").style.width = ((self.graphcanvas.render_time*10) * 90) + "px";
|
||||
else
|
||||
meter.querySelector(".gpuload .fgload").style.width = 4 + "px";
|
||||
},200);
|
||||
}
|
||||
setInterval(function() {
|
||||
meter.querySelector(".cpuload .fgload").style.width =
|
||||
2 * self.graph.execution_time * 90 + "px";
|
||||
if (self.graph.status == LGraph.STATUS_RUNNING)
|
||||
meter.querySelector(".gpuload .fgload").style.width =
|
||||
self.graphcanvas.render_time * 10 * 90 + "px";
|
||||
else meter.querySelector(".gpuload .fgload").style.width = 4 + "px";
|
||||
}, 200);
|
||||
};
|
||||
|
||||
Editor.prototype.addToolsButton = function(id,name,icon_url, callback, container)
|
||||
{
|
||||
if(!container)
|
||||
container = ".tools";
|
||||
Editor.prototype.addToolsButton = function(
|
||||
id,
|
||||
name,
|
||||
icon_url,
|
||||
callback,
|
||||
container
|
||||
) {
|
||||
if (!container) container = ".tools";
|
||||
|
||||
var button = this.createButton(name, icon_url);
|
||||
button.id = id;
|
||||
button.addEventListener("click", callback);
|
||||
var button = this.createButton(name, icon_url);
|
||||
button.id = id;
|
||||
button.addEventListener("click", callback);
|
||||
|
||||
this.root.querySelector(container).appendChild(button);
|
||||
}
|
||||
this.root.querySelector(container).appendChild(button);
|
||||
};
|
||||
|
||||
Editor.prototype.createPanel = function(title, options) {
|
||||
var root = document.createElement("div");
|
||||
root.className = "dialog";
|
||||
root.innerHTML =
|
||||
"<div class='dialog-header'><span class='dialog-title'>" +
|
||||
title +
|
||||
"</span></div><div class='dialog-content'></div><div class='dialog-footer'></div>";
|
||||
root.header = root.querySelector(".dialog-header");
|
||||
root.content = root.querySelector(".dialog-content");
|
||||
root.footer = root.querySelector(".dialog-footer");
|
||||
|
||||
Editor.prototype.createPanel = function(title, options)
|
||||
{
|
||||
return root;
|
||||
};
|
||||
|
||||
var root = document.createElement("div");
|
||||
root.className = "dialog";
|
||||
root.innerHTML = "<div class='dialog-header'><span class='dialog-title'>"+title+"</span></div><div class='dialog-content'></div><div class='dialog-footer'></div>";
|
||||
root.header = root.querySelector(".dialog-header");
|
||||
root.content = root.querySelector(".dialog-content");
|
||||
root.footer = root.querySelector(".dialog-footer");
|
||||
Editor.prototype.createButton = function(name, icon_url) {
|
||||
var button = document.createElement("button");
|
||||
if (icon_url) button.innerHTML = "<img src='" + icon_url + "'/> ";
|
||||
button.innerHTML += name;
|
||||
return button;
|
||||
};
|
||||
|
||||
Editor.prototype.onLoadButton = function() {
|
||||
var panel = this.createPanel("Load session");
|
||||
var close = this.createButton("Close");
|
||||
close.style.float = "right";
|
||||
close.addEventListener("click", function() {
|
||||
panel.parentNode.removeChild(panel);
|
||||
});
|
||||
panel.header.appendChild(close);
|
||||
panel.content.innerHTML = "test";
|
||||
|
||||
return root;
|
||||
}
|
||||
this.root.appendChild(panel);
|
||||
};
|
||||
|
||||
Editor.prototype.createButton = function(name, icon_url)
|
||||
{
|
||||
var button = document.createElement("button");
|
||||
if(icon_url)
|
||||
button.innerHTML = "<img src='"+icon_url+"'/> ";
|
||||
button.innerHTML += name;
|
||||
return button;
|
||||
}
|
||||
Editor.prototype.onSaveButton = function() {};
|
||||
|
||||
Editor.prototype.onLoadButton = function()
|
||||
{
|
||||
var panel = this.createPanel("Load session");
|
||||
var close = this.createButton("Close");
|
||||
close.style.float = "right";
|
||||
close.addEventListener("click", function() { panel.parentNode.removeChild( panel ); });
|
||||
panel.header.appendChild(close);
|
||||
panel.content.innerHTML = "test";
|
||||
Editor.prototype.onPlayButton = function() {
|
||||
var graph = this.graph;
|
||||
var button = this.root.querySelector("#playnode_button");
|
||||
|
||||
this.root.appendChild(panel);
|
||||
}
|
||||
if (graph.status == LGraph.STATUS_STOPPED) {
|
||||
button.innerHTML = "<img src='imgs/icon-stop.png'/> Stop";
|
||||
graph.start();
|
||||
} else {
|
||||
button.innerHTML = "<img src='imgs/icon-play.png'/> Play";
|
||||
graph.stop();
|
||||
}
|
||||
};
|
||||
|
||||
Editor.prototype.onSaveButton = function()
|
||||
{
|
||||
}
|
||||
Editor.prototype.onPlayStepButton = function() {
|
||||
var graph = this.graph;
|
||||
graph.runStep(1);
|
||||
this.graphcanvas.draw(true, true);
|
||||
};
|
||||
|
||||
Editor.prototype.onPlayButton = function()
|
||||
{
|
||||
var graph = this.graph;
|
||||
var button = this.root.querySelector("#playnode_button");
|
||||
Editor.prototype.onLiveButton = function() {
|
||||
var is_live_mode = !this.graphcanvas.live_mode;
|
||||
this.graphcanvas.switchLiveMode(true);
|
||||
this.graphcanvas.draw();
|
||||
var url = this.graphcanvas.live_mode
|
||||
? "imgs/gauss_bg_medium.jpg"
|
||||
: "imgs/gauss_bg.jpg";
|
||||
var button = this.root.querySelector("#livemode_button");
|
||||
button.innerHTML = !is_live_mode
|
||||
? "<img src='imgs/icon-record.png'/> Live"
|
||||
: "<img src='imgs/icon-gear.png'/> Edit";
|
||||
};
|
||||
|
||||
if(graph.status == LGraph.STATUS_STOPPED)
|
||||
{
|
||||
button.innerHTML = "<img src='imgs/icon-stop.png'/> Stop";
|
||||
graph.start();
|
||||
}
|
||||
else
|
||||
{
|
||||
button.innerHTML = "<img src='imgs/icon-play.png'/> Play";
|
||||
graph.stop();
|
||||
}
|
||||
}
|
||||
Editor.prototype.goFullscreen = function() {
|
||||
if (this.root.requestFullscreen)
|
||||
this.root.requestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
|
||||
else if (this.root.mozRequestFullscreen)
|
||||
this.root.requestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
|
||||
else if (this.root.webkitRequestFullscreen)
|
||||
this.root.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
|
||||
else throw "Fullscreen not supported";
|
||||
|
||||
Editor.prototype.onPlayStepButton = function()
|
||||
{
|
||||
var graph = this.graph;
|
||||
graph.runStep(1);
|
||||
this.graphcanvas.draw(true,true);
|
||||
}
|
||||
var self = this;
|
||||
setTimeout(function() {
|
||||
self.graphcanvas.resize();
|
||||
}, 100);
|
||||
};
|
||||
|
||||
Editor.prototype.onLiveButton = function()
|
||||
{
|
||||
var is_live_mode = !this.graphcanvas.live_mode;
|
||||
this.graphcanvas.switchLiveMode(true);
|
||||
this.graphcanvas.draw();
|
||||
var url = this.graphcanvas.live_mode ? "imgs/gauss_bg_medium.jpg" : "imgs/gauss_bg.jpg";
|
||||
var button = this.root.querySelector("#livemode_button");
|
||||
button.innerHTML = !is_live_mode ? "<img src='imgs/icon-record.png'/> Live" : "<img src='imgs/icon-gear.png'/> Edit" ;
|
||||
}
|
||||
Editor.prototype.onFullscreenButton = function() {
|
||||
this.goFullscreen();
|
||||
};
|
||||
|
||||
Editor.prototype.goFullscreen = function()
|
||||
{
|
||||
if(this.root.requestFullscreen)
|
||||
this.root.requestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
|
||||
else if(this.root.mozRequestFullscreen)
|
||||
this.root.requestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
|
||||
else if(this.root.webkitRequestFullscreen)
|
||||
this.root.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
|
||||
else
|
||||
throw("Fullscreen not supported");
|
||||
Editor.prototype.onMaximizeButton = function() {
|
||||
this.maximize();
|
||||
};
|
||||
|
||||
var self = this;
|
||||
setTimeout(function() {
|
||||
self.graphcanvas.resize();
|
||||
},100);
|
||||
}
|
||||
Editor.prototype.addMiniWindow = function(w, h) {
|
||||
var miniwindow = document.createElement("div");
|
||||
miniwindow.className = "litegraph miniwindow";
|
||||
miniwindow.innerHTML =
|
||||
"<canvas class='graphcanvas' width='" +
|
||||
w +
|
||||
"' height='" +
|
||||
h +
|
||||
"' tabindex=10></canvas>";
|
||||
var canvas = miniwindow.querySelector("canvas");
|
||||
var that = this;
|
||||
|
||||
Editor.prototype.onFullscreenButton = function()
|
||||
{
|
||||
this.goFullscreen();
|
||||
}
|
||||
var graphcanvas = new LGraphCanvas(canvas, this.graph);
|
||||
graphcanvas.show_info = false;
|
||||
graphcanvas.background_image = "imgs/grid.png";
|
||||
graphcanvas.scale = 0.25;
|
||||
graphcanvas.allow_dragnodes = false;
|
||||
graphcanvas.allow_interaction = false;
|
||||
graphcanvas.render_shadows = false;
|
||||
graphcanvas.max_zoom = 0.25;
|
||||
this.miniwindow_graphcanvas = graphcanvas;
|
||||
graphcanvas.onClear = function() {
|
||||
graphcanvas.scale = 0.25;
|
||||
graphcanvas.allow_dragnodes = false;
|
||||
graphcanvas.allow_interaction = false;
|
||||
};
|
||||
graphcanvas.onRenderBackground = function(canvas, ctx) {
|
||||
ctx.strokeStyle = "#567";
|
||||
var tl = that.graphcanvas.convertOffsetToCanvas([0, 0]);
|
||||
var br = that.graphcanvas.convertOffsetToCanvas([
|
||||
that.graphcanvas.canvas.width,
|
||||
that.graphcanvas.canvas.height
|
||||
]);
|
||||
tl = this.convertCanvasToOffset(tl);
|
||||
br = this.convertCanvasToOffset(br);
|
||||
ctx.lineWidth = 1;
|
||||
ctx.strokeRect(
|
||||
Math.floor(tl[0]) + 0.5,
|
||||
Math.floor(tl[1]) + 0.5,
|
||||
Math.floor(br[0] - tl[0]),
|
||||
Math.floor(br[1] - tl[1])
|
||||
);
|
||||
};
|
||||
|
||||
Editor.prototype.onMaximizeButton = function()
|
||||
{
|
||||
this.maximize();
|
||||
}
|
||||
miniwindow.style.position = "absolute";
|
||||
miniwindow.style.top = "4px";
|
||||
miniwindow.style.right = "4px";
|
||||
|
||||
Editor.prototype.addMiniWindow = function(w,h)
|
||||
{
|
||||
var miniwindow = document.createElement("div");
|
||||
miniwindow.className = "litegraph miniwindow";
|
||||
miniwindow.innerHTML = "<canvas class='graphcanvas' width='"+w+"' height='"+h+"' tabindex=10></canvas>";
|
||||
var canvas = miniwindow.querySelector("canvas");
|
||||
var that = this;
|
||||
var close_button = document.createElement("div");
|
||||
close_button.className = "corner-button";
|
||||
close_button.innerHTML = "X";
|
||||
close_button.addEventListener("click", function(e) {
|
||||
graphcanvas.setGraph(null);
|
||||
miniwindow.parentNode.removeChild(miniwindow);
|
||||
});
|
||||
miniwindow.appendChild(close_button);
|
||||
|
||||
var graphcanvas = new LGraphCanvas(canvas, this.graph);
|
||||
graphcanvas.show_info = false;
|
||||
graphcanvas.background_image = "imgs/grid.png";
|
||||
graphcanvas.scale = 0.25;
|
||||
graphcanvas.allow_dragnodes = false;
|
||||
graphcanvas.allow_interaction = false;
|
||||
graphcanvas.render_shadows = false;
|
||||
graphcanvas.max_zoom = 0.25;
|
||||
this.miniwindow_graphcanvas = graphcanvas;
|
||||
graphcanvas.onClear = function() {
|
||||
graphcanvas.scale = 0.25;
|
||||
graphcanvas.allow_dragnodes = false;
|
||||
graphcanvas.allow_interaction = false;
|
||||
};
|
||||
graphcanvas.onRenderBackground = function(canvas, ctx)
|
||||
{
|
||||
ctx.strokeStyle = "#567";
|
||||
var tl = that.graphcanvas.convertOffsetToCanvas([0,0]);
|
||||
var br = that.graphcanvas.convertOffsetToCanvas([that.graphcanvas.canvas.width,that.graphcanvas.canvas.height]);
|
||||
tl = this.convertCanvasToOffset( tl );
|
||||
br = this.convertCanvasToOffset( br );
|
||||
ctx.lineWidth = 1;
|
||||
ctx.strokeRect( Math.floor(tl[0]) + 0.5, Math.floor(tl[1]) + 0.5, Math.floor(br[0] - tl[0]), Math.floor(br[1] - tl[1]) );
|
||||
}
|
||||
this.root.querySelector(".content").appendChild(miniwindow);
|
||||
};
|
||||
|
||||
miniwindow.style.position = "absolute";
|
||||
miniwindow.style.top = "4px";
|
||||
miniwindow.style.right = "4px";
|
||||
|
||||
var close_button = document.createElement("div");
|
||||
close_button.className = "corner-button";
|
||||
close_button.innerHTML = "X";
|
||||
close_button.addEventListener("click",function(e) {
|
||||
graphcanvas.setGraph(null);
|
||||
miniwindow.parentNode.removeChild(miniwindow);
|
||||
});
|
||||
miniwindow.appendChild(close_button);
|
||||
|
||||
this.root.querySelector(".content").appendChild(miniwindow);
|
||||
}
|
||||
|
||||
LiteGraph.Editor = Editor;
|
||||
LiteGraph.Editor = Editor;
|
||||
|
||||
17322
src/litegraph.js
17322
src/litegraph.js
File diff suppressed because it is too large
Load Diff
2707
src/nodes/audio.js
2707
src/nodes/audio.js
File diff suppressed because it is too large
Load Diff
1536
src/nodes/base.js
1536
src/nodes/base.js
File diff suppressed because it is too large
Load Diff
@@ -1,271 +1,242 @@
|
||||
//event related nodes
|
||||
(function(global){
|
||||
var LiteGraph = global.LiteGraph;
|
||||
(function(global) {
|
||||
var LiteGraph = global.LiteGraph;
|
||||
|
||||
//Show value inside the debug console
|
||||
function LogEvent()
|
||||
{
|
||||
this.size = [60,20];
|
||||
this.addInput("event", LiteGraph.ACTION);
|
||||
}
|
||||
//Show value inside the debug console
|
||||
function LogEvent() {
|
||||
this.size = [60, 20];
|
||||
this.addInput("event", LiteGraph.ACTION);
|
||||
}
|
||||
|
||||
LogEvent.title = "Log Event";
|
||||
LogEvent.desc = "Log event in console";
|
||||
LogEvent.title = "Log Event";
|
||||
LogEvent.desc = "Log event in console";
|
||||
|
||||
LogEvent.prototype.onAction = function( action, param )
|
||||
{
|
||||
console.log( action, param );
|
||||
}
|
||||
LogEvent.prototype.onAction = function(action, param) {
|
||||
console.log(action, param);
|
||||
};
|
||||
|
||||
LiteGraph.registerNodeType("events/log", LogEvent );
|
||||
LiteGraph.registerNodeType("events/log", LogEvent);
|
||||
|
||||
//Sequencer for events
|
||||
function Sequencer() {
|
||||
this.addInput("", LiteGraph.ACTION);
|
||||
this.addInput("", LiteGraph.ACTION);
|
||||
this.addInput("", LiteGraph.ACTION);
|
||||
this.addInput("", LiteGraph.ACTION);
|
||||
this.addInput("", LiteGraph.ACTION);
|
||||
this.addInput("", LiteGraph.ACTION);
|
||||
this.addOutput("", LiteGraph.EVENT);
|
||||
this.addOutput("", LiteGraph.EVENT);
|
||||
this.addOutput("", LiteGraph.EVENT);
|
||||
this.addOutput("", LiteGraph.EVENT);
|
||||
this.addOutput("", LiteGraph.EVENT);
|
||||
this.addOutput("", LiteGraph.EVENT);
|
||||
this.size = [120, 30];
|
||||
this.flags = { horizontal: true, render_box: false };
|
||||
}
|
||||
|
||||
//Sequencer for events
|
||||
function Sequencer()
|
||||
{
|
||||
this.addInput("", LiteGraph.ACTION);
|
||||
this.addInput("", LiteGraph.ACTION);
|
||||
this.addInput("", LiteGraph.ACTION);
|
||||
this.addInput("", LiteGraph.ACTION);
|
||||
this.addInput("", LiteGraph.ACTION);
|
||||
this.addInput("", LiteGraph.ACTION);
|
||||
this.addOutput("", LiteGraph.EVENT);
|
||||
this.addOutput("", LiteGraph.EVENT);
|
||||
this.addOutput("", LiteGraph.EVENT);
|
||||
this.addOutput("", LiteGraph.EVENT);
|
||||
this.addOutput("", LiteGraph.EVENT);
|
||||
this.addOutput("", LiteGraph.EVENT);
|
||||
this.size = [120,30];
|
||||
this.flags = { horizontal: true, render_box: false };
|
||||
}
|
||||
Sequencer.title = "Sequencer";
|
||||
Sequencer.desc = "Trigger events when an event arrives";
|
||||
|
||||
Sequencer.title = "Sequencer";
|
||||
Sequencer.desc = "Trigger events when an event arrives";
|
||||
Sequencer.prototype.getTitle = function() {
|
||||
return "";
|
||||
};
|
||||
|
||||
Sequencer.prototype.getTitle = function() { return ""; }
|
||||
Sequencer.prototype.onAction = function(action, param) {
|
||||
if (this.outputs)
|
||||
for (var i = 0; i < this.outputs.length; ++i)
|
||||
this.triggerSlot(i, param);
|
||||
};
|
||||
|
||||
Sequencer.prototype.onAction = function( action, param )
|
||||
{
|
||||
if(this.outputs)
|
||||
for(var i = 0; i < this.outputs.length; ++i)
|
||||
this.triggerSlot( i, param );
|
||||
}
|
||||
LiteGraph.registerNodeType("events/sequencer", Sequencer);
|
||||
|
||||
LiteGraph.registerNodeType("events/sequencer", Sequencer );
|
||||
//Filter events
|
||||
function FilterEvent() {
|
||||
this.size = [60, 20];
|
||||
this.addInput("event", LiteGraph.ACTION);
|
||||
this.addOutput("event", LiteGraph.EVENT);
|
||||
this.properties = {
|
||||
equal_to: "",
|
||||
has_property: "",
|
||||
property_equal_to: ""
|
||||
};
|
||||
}
|
||||
|
||||
//Filter events
|
||||
function FilterEvent()
|
||||
{
|
||||
this.size = [60,20];
|
||||
this.addInput("event", LiteGraph.ACTION);
|
||||
this.addOutput("event", LiteGraph.EVENT);
|
||||
this.properties = {
|
||||
equal_to: "",
|
||||
has_property:"",
|
||||
property_equal_to: ""
|
||||
};
|
||||
}
|
||||
FilterEvent.title = "Filter Event";
|
||||
FilterEvent.desc = "Blocks events that do not match the filter";
|
||||
|
||||
FilterEvent.title = "Filter Event";
|
||||
FilterEvent.desc = "Blocks events that do not match the filter";
|
||||
FilterEvent.prototype.onAction = function(action, param) {
|
||||
if (param == null) return;
|
||||
|
||||
FilterEvent.prototype.onAction = function( action, param )
|
||||
{
|
||||
if( param == null )
|
||||
return;
|
||||
if (this.properties.equal_to && this.properties.equal_to != param)
|
||||
return;
|
||||
|
||||
if( this.properties.equal_to && this.properties.equal_to != param )
|
||||
return;
|
||||
if (this.properties.has_property) {
|
||||
var prop = param[this.properties.has_property];
|
||||
if (prop == null) return;
|
||||
|
||||
if( this.properties.has_property )
|
||||
{
|
||||
var prop = param[ this.properties.has_property ];
|
||||
if( prop == null )
|
||||
return;
|
||||
if (
|
||||
this.properties.property_equal_to &&
|
||||
this.properties.property_equal_to != prop
|
||||
)
|
||||
return;
|
||||
}
|
||||
|
||||
if( this.properties.property_equal_to && this.properties.property_equal_to != prop )
|
||||
return;
|
||||
}
|
||||
this.triggerSlot(0, param);
|
||||
};
|
||||
|
||||
this.triggerSlot(0,param);
|
||||
}
|
||||
LiteGraph.registerNodeType("events/filter", FilterEvent);
|
||||
|
||||
LiteGraph.registerNodeType("events/filter", FilterEvent );
|
||||
//Show value inside the debug console
|
||||
function EventCounter() {
|
||||
this.addInput("inc", LiteGraph.ACTION);
|
||||
this.addInput("dec", LiteGraph.ACTION);
|
||||
this.addInput("reset", LiteGraph.ACTION);
|
||||
this.addOutput("change", LiteGraph.EVENT);
|
||||
this.addOutput("num", "number");
|
||||
this.num = 0;
|
||||
}
|
||||
|
||||
EventCounter.title = "Counter";
|
||||
EventCounter.desc = "Counts events";
|
||||
|
||||
//Show value inside the debug console
|
||||
function EventCounter()
|
||||
{
|
||||
this.addInput("inc", LiteGraph.ACTION);
|
||||
this.addInput("dec", LiteGraph.ACTION);
|
||||
this.addInput("reset", LiteGraph.ACTION);
|
||||
this.addOutput("change", LiteGraph.EVENT);
|
||||
this.addOutput("num", "number");
|
||||
this.num = 0;
|
||||
}
|
||||
EventCounter.prototype.getTitle = function() {
|
||||
if (this.flags.collapsed) return String(this.num);
|
||||
return this.title;
|
||||
};
|
||||
|
||||
EventCounter.title = "Counter";
|
||||
EventCounter.desc = "Counts events";
|
||||
EventCounter.prototype.onAction = function(action, param) {
|
||||
var v = this.num;
|
||||
if (action == "inc") this.num += 1;
|
||||
else if (action == "dec") this.num -= 1;
|
||||
else if (action == "reset") this.num = 0;
|
||||
if (this.num != v) this.trigger("change", this.num);
|
||||
};
|
||||
|
||||
EventCounter.prototype.getTitle = function()
|
||||
{
|
||||
if(this.flags.collapsed)
|
||||
return String(this.num);
|
||||
return this.title;
|
||||
}
|
||||
EventCounter.prototype.onDrawBackground = function(ctx) {
|
||||
if (this.flags.collapsed) return;
|
||||
ctx.fillStyle = "#AAA";
|
||||
ctx.font = "20px Arial";
|
||||
ctx.textAlign = "center";
|
||||
ctx.fillText(this.num, this.size[0] * 0.5, this.size[1] * 0.5);
|
||||
};
|
||||
|
||||
EventCounter.prototype.onAction = function(action, param)
|
||||
{
|
||||
var v = this.num;
|
||||
if(action == "inc")
|
||||
this.num += 1;
|
||||
else if(action == "dec")
|
||||
this.num -= 1;
|
||||
else if(action == "reset")
|
||||
this.num = 0;
|
||||
if(this.num != v)
|
||||
this.trigger("change",this.num);
|
||||
}
|
||||
EventCounter.prototype.onExecute = function() {
|
||||
this.setOutputData(1, this.num);
|
||||
};
|
||||
|
||||
EventCounter.prototype.onDrawBackground = function(ctx)
|
||||
{
|
||||
if(this.flags.collapsed)
|
||||
return;
|
||||
ctx.fillStyle = "#AAA";
|
||||
ctx.font = "20px Arial";
|
||||
ctx.textAlign = "center";
|
||||
ctx.fillText( this.num, this.size[0] * 0.5, this.size[1] * 0.5 );
|
||||
}
|
||||
LiteGraph.registerNodeType("events/counter", EventCounter);
|
||||
|
||||
//Show value inside the debug console
|
||||
function DelayEvent() {
|
||||
this.size = [60, 20];
|
||||
this.addProperty("time_in_ms", 1000);
|
||||
this.addInput("event", LiteGraph.ACTION);
|
||||
this.addOutput("on_time", LiteGraph.EVENT);
|
||||
|
||||
EventCounter.prototype.onExecute = function()
|
||||
{
|
||||
this.setOutputData(1,this.num);
|
||||
}
|
||||
this._pending = [];
|
||||
}
|
||||
|
||||
LiteGraph.registerNodeType("events/counter", EventCounter );
|
||||
DelayEvent.title = "Delay";
|
||||
DelayEvent.desc = "Delays one event";
|
||||
|
||||
//Show value inside the debug console
|
||||
function DelayEvent()
|
||||
{
|
||||
this.size = [60,20];
|
||||
this.addProperty( "time_in_ms", 1000 );
|
||||
this.addInput("event", LiteGraph.ACTION);
|
||||
this.addOutput("on_time", LiteGraph.EVENT);
|
||||
DelayEvent.prototype.onAction = function(action, param) {
|
||||
var time = this.properties.time_in_ms;
|
||||
if (time <= 0) this.trigger(null, param);
|
||||
else this._pending.push([time, param]);
|
||||
};
|
||||
|
||||
this._pending = [];
|
||||
}
|
||||
DelayEvent.prototype.onExecute = function() {
|
||||
var dt = this.graph.elapsed_time * 1000; //in ms
|
||||
|
||||
DelayEvent.title = "Delay";
|
||||
DelayEvent.desc = "Delays one event";
|
||||
if (this.isInputConnected(1))
|
||||
this.properties.time_in_ms = this.getInputData(1);
|
||||
|
||||
DelayEvent.prototype.onAction = function(action, param)
|
||||
{
|
||||
var time = this.properties.time_in_ms;
|
||||
if(time <= 0)
|
||||
this.trigger(null, param);
|
||||
else
|
||||
this._pending.push([ time, param ]);
|
||||
}
|
||||
for (var i = 0; i < this._pending.length; ++i) {
|
||||
var action = this._pending[i];
|
||||
action[0] -= dt;
|
||||
if (action[0] > 0) continue;
|
||||
|
||||
DelayEvent.prototype.onExecute = function()
|
||||
{
|
||||
var dt = this.graph.elapsed_time * 1000; //in ms
|
||||
//remove
|
||||
this._pending.splice(i, 1);
|
||||
--i;
|
||||
|
||||
if(this.isInputConnected(1))
|
||||
this.properties.time_in_ms = this.getInputData(1);
|
||||
//trigger
|
||||
this.trigger(null, action[1]);
|
||||
}
|
||||
};
|
||||
|
||||
for(var i = 0; i < this._pending.length; ++i)
|
||||
{
|
||||
var action = this._pending[i];
|
||||
action[0] -= dt;
|
||||
if( action[0] > 0 )
|
||||
continue;
|
||||
|
||||
//remove
|
||||
this._pending.splice(i,1);
|
||||
--i;
|
||||
DelayEvent.prototype.onGetInputs = function() {
|
||||
return [["event", LiteGraph.ACTION], ["time_in_ms", "number"]];
|
||||
};
|
||||
|
||||
//trigger
|
||||
this.trigger(null, action[1]);
|
||||
}
|
||||
}
|
||||
LiteGraph.registerNodeType("events/delay", DelayEvent);
|
||||
|
||||
DelayEvent.prototype.onGetInputs = function()
|
||||
{
|
||||
return [["event",LiteGraph.ACTION],["time_in_ms","number"]];
|
||||
}
|
||||
//Show value inside the debug console
|
||||
function TimerEvent() {
|
||||
this.addProperty("interval", 1000);
|
||||
this.addProperty("event", "tick");
|
||||
this.addOutput("on_tick", LiteGraph.EVENT);
|
||||
this.time = 0;
|
||||
this.last_interval = 1000;
|
||||
this.triggered = false;
|
||||
}
|
||||
|
||||
LiteGraph.registerNodeType("events/delay", DelayEvent );
|
||||
TimerEvent.title = "Timer";
|
||||
TimerEvent.desc = "Sends an event every N milliseconds";
|
||||
|
||||
TimerEvent.prototype.onStart = function() {
|
||||
this.time = 0;
|
||||
};
|
||||
|
||||
//Show value inside the debug console
|
||||
function TimerEvent()
|
||||
{
|
||||
this.addProperty("interval", 1000);
|
||||
this.addProperty("event", "tick");
|
||||
this.addOutput("on_tick", LiteGraph.EVENT);
|
||||
this.time = 0;
|
||||
this.last_interval = 1000;
|
||||
this.triggered = false;
|
||||
}
|
||||
TimerEvent.prototype.getTitle = function() {
|
||||
return "Timer: " + this.last_interval.toString() + "ms";
|
||||
};
|
||||
|
||||
TimerEvent.title = "Timer";
|
||||
TimerEvent.desc = "Sends an event every N milliseconds";
|
||||
TimerEvent.on_color = "#AAA";
|
||||
TimerEvent.off_color = "#222";
|
||||
|
||||
TimerEvent.prototype.onStart = function()
|
||||
{
|
||||
this.time = 0;
|
||||
}
|
||||
TimerEvent.prototype.onDrawBackground = function() {
|
||||
this.boxcolor = this.triggered
|
||||
? TimerEvent.on_color
|
||||
: TimerEvent.off_color;
|
||||
this.triggered = false;
|
||||
};
|
||||
|
||||
TimerEvent.prototype.getTitle = function()
|
||||
{
|
||||
return "Timer: " + this.last_interval.toString() + "ms";
|
||||
}
|
||||
TimerEvent.prototype.onExecute = function() {
|
||||
var dt = this.graph.elapsed_time * 1000; //in ms
|
||||
|
||||
TimerEvent.on_color = "#AAA";
|
||||
TimerEvent.off_color = "#222";
|
||||
var trigger = this.time == 0;
|
||||
|
||||
TimerEvent.prototype.onDrawBackground = function()
|
||||
{
|
||||
this.boxcolor = this.triggered ? TimerEvent.on_color : TimerEvent.off_color;
|
||||
this.triggered = false;
|
||||
}
|
||||
this.time += dt;
|
||||
this.last_interval = Math.max(
|
||||
1,
|
||||
this.getInputOrProperty("interval") | 0
|
||||
);
|
||||
|
||||
TimerEvent.prototype.onExecute = function()
|
||||
{
|
||||
var dt = this.graph.elapsed_time * 1000; //in ms
|
||||
if (
|
||||
!trigger &&
|
||||
(this.time < this.last_interval || isNaN(this.last_interval))
|
||||
) {
|
||||
if (this.inputs && this.inputs.length > 1 && this.inputs[1])
|
||||
this.setOutputData(1, false);
|
||||
return;
|
||||
}
|
||||
|
||||
var trigger = this.time == 0;
|
||||
this.triggered = true;
|
||||
this.time = this.time % this.last_interval;
|
||||
this.trigger("on_tick", this.properties.event);
|
||||
if (this.inputs && this.inputs.length > 1 && this.inputs[1])
|
||||
this.setOutputData(1, true);
|
||||
};
|
||||
|
||||
this.time += dt;
|
||||
this.last_interval = Math.max(1, this.getInputOrProperty("interval") | 0);
|
||||
TimerEvent.prototype.onGetInputs = function() {
|
||||
return [["interval", "number"]];
|
||||
};
|
||||
|
||||
if( !trigger && ( this.time < this.last_interval || isNaN(this.last_interval)) )
|
||||
{
|
||||
if( this.inputs && this.inputs.length > 1 && this.inputs[1] )
|
||||
this.setOutputData(1,false);
|
||||
return;
|
||||
}
|
||||
TimerEvent.prototype.onGetOutputs = function() {
|
||||
return [["tick", "boolean"]];
|
||||
};
|
||||
|
||||
this.triggered = true;
|
||||
this.time = this.time % this.last_interval;
|
||||
this.trigger( "on_tick", this.properties.event );
|
||||
if( this.inputs && this.inputs.length > 1 && this.inputs[1] )
|
||||
this.setOutputData( 1, true );
|
||||
}
|
||||
|
||||
TimerEvent.prototype.onGetInputs = function()
|
||||
{
|
||||
return [["interval","number"]];
|
||||
}
|
||||
|
||||
TimerEvent.prototype.onGetOutputs = function()
|
||||
{
|
||||
return [["tick","boolean"]];
|
||||
}
|
||||
|
||||
LiteGraph.registerNodeType("events/timer", TimerEvent );
|
||||
|
||||
|
||||
})(this);
|
||||
LiteGraph.registerNodeType("events/timer", TimerEvent);
|
||||
})(this);
|
||||
|
||||
@@ -1,83 +1,99 @@
|
||||
(function(global){
|
||||
var LiteGraph = global.LiteGraph;
|
||||
(function(global) {
|
||||
var LiteGraph = global.LiteGraph;
|
||||
|
||||
//Works with Litegl.js to create WebGL nodes
|
||||
if(typeof(GL) != "undefined")
|
||||
{
|
||||
//Works with Litegl.js to create WebGL nodes
|
||||
if (typeof GL != "undefined") {
|
||||
// Texture Lens *****************************************
|
||||
function LGraphFXLens() {
|
||||
this.addInput("Texture", "Texture");
|
||||
this.addInput("Aberration", "number");
|
||||
this.addInput("Distortion", "number");
|
||||
this.addInput("Blur", "number");
|
||||
this.addOutput("Texture", "Texture");
|
||||
this.properties = {
|
||||
aberration: 1.0,
|
||||
distortion: 1.0,
|
||||
blur: 1.0,
|
||||
precision: LGraphTexture.DEFAULT
|
||||
};
|
||||
|
||||
// Texture Lens *****************************************
|
||||
function LGraphFXLens()
|
||||
{
|
||||
this.addInput("Texture","Texture");
|
||||
this.addInput("Aberration","number");
|
||||
this.addInput("Distortion","number");
|
||||
this.addInput("Blur","number");
|
||||
this.addOutput("Texture","Texture");
|
||||
this.properties = { aberration:1.0, distortion: 1.0, blur: 1.0, precision: LGraphTexture.DEFAULT };
|
||||
if (!LGraphFXLens._shader) {
|
||||
LGraphFXLens._shader = new GL.Shader(
|
||||
GL.Shader.SCREEN_VERTEX_SHADER,
|
||||
LGraphFXLens.pixel_shader
|
||||
);
|
||||
LGraphFXLens._texture = new GL.Texture(3, 1, {
|
||||
format: gl.RGB,
|
||||
wrap: gl.CLAMP_TO_EDGE,
|
||||
magFilter: gl.LINEAR,
|
||||
minFilter: gl.LINEAR,
|
||||
pixel_data: [255, 0, 0, 0, 255, 0, 0, 0, 255]
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
if(!LGraphFXLens._shader)
|
||||
{
|
||||
LGraphFXLens._shader = new GL.Shader( GL.Shader.SCREEN_VERTEX_SHADER, LGraphFXLens.pixel_shader );
|
||||
LGraphFXLens._texture = new GL.Texture(3,1,{ format: gl.RGB, wrap: gl.CLAMP_TO_EDGE, magFilter: gl.LINEAR, minFilter: gl.LINEAR, pixel_data: [255,0,0, 0,255,0, 0,0,255] });
|
||||
}
|
||||
}
|
||||
LGraphFXLens.title = "Lens";
|
||||
LGraphFXLens.desc = "Camera Lens distortion";
|
||||
LGraphFXLens.widgets_info = {
|
||||
precision: { widget: "combo", values: LGraphTexture.MODE_VALUES }
|
||||
};
|
||||
|
||||
LGraphFXLens.title = "Lens";
|
||||
LGraphFXLens.desc = "Camera Lens distortion";
|
||||
LGraphFXLens.widgets_info = {
|
||||
"precision": { widget:"combo", values: LGraphTexture.MODE_VALUES }
|
||||
};
|
||||
LGraphFXLens.prototype.onExecute = function() {
|
||||
var tex = this.getInputData(0);
|
||||
if (this.properties.precision === LGraphTexture.PASS_THROUGH) {
|
||||
this.setOutputData(0, tex);
|
||||
return;
|
||||
}
|
||||
|
||||
LGraphFXLens.prototype.onExecute = function()
|
||||
{
|
||||
var tex = this.getInputData(0);
|
||||
if(this.properties.precision === LGraphTexture.PASS_THROUGH )
|
||||
{
|
||||
this.setOutputData(0,tex);
|
||||
return;
|
||||
}
|
||||
if (!tex) return;
|
||||
|
||||
if(!tex) return;
|
||||
this._tex = LGraphTexture.getTargetTexture(
|
||||
tex,
|
||||
this._tex,
|
||||
this.properties.precision
|
||||
);
|
||||
|
||||
this._tex = LGraphTexture.getTargetTexture( tex, this._tex, this.properties.precision );
|
||||
var aberration = this.properties.aberration;
|
||||
if (this.isInputConnected(1)) {
|
||||
aberration = this.getInputData(1);
|
||||
this.properties.aberration = aberration;
|
||||
}
|
||||
|
||||
var aberration = this.properties.aberration;
|
||||
if( this.isInputConnected(1) )
|
||||
{
|
||||
aberration = this.getInputData(1);
|
||||
this.properties.aberration = aberration;
|
||||
}
|
||||
var distortion = this.properties.distortion;
|
||||
if (this.isInputConnected(2)) {
|
||||
distortion = this.getInputData(2);
|
||||
this.properties.distortion = distortion;
|
||||
}
|
||||
|
||||
var distortion = this.properties.distortion;
|
||||
if( this.isInputConnected(2) )
|
||||
{
|
||||
distortion = this.getInputData(2);
|
||||
this.properties.distortion = distortion;
|
||||
}
|
||||
var blur = this.properties.blur;
|
||||
if (this.isInputConnected(3)) {
|
||||
blur = this.getInputData(3);
|
||||
this.properties.blur = blur;
|
||||
}
|
||||
|
||||
var blur = this.properties.blur;
|
||||
if( this.isInputConnected(3) )
|
||||
{
|
||||
blur = this.getInputData(3);
|
||||
this.properties.blur = blur;
|
||||
}
|
||||
gl.disable(gl.BLEND);
|
||||
gl.disable(gl.DEPTH_TEST);
|
||||
var mesh = Mesh.getScreenQuad();
|
||||
var shader = LGraphFXLens._shader;
|
||||
//var camera = LS.Renderer._current_camera;
|
||||
|
||||
gl.disable( gl.BLEND );
|
||||
gl.disable( gl.DEPTH_TEST );
|
||||
var mesh = Mesh.getScreenQuad();
|
||||
var shader = LGraphFXLens._shader;
|
||||
//var camera = LS.Renderer._current_camera;
|
||||
this._tex.drawTo(function() {
|
||||
tex.bind(0);
|
||||
shader
|
||||
.uniforms({
|
||||
u_texture: 0,
|
||||
u_aberration: aberration,
|
||||
u_distortion: distortion,
|
||||
u_blur: blur
|
||||
})
|
||||
.draw(mesh);
|
||||
});
|
||||
|
||||
this._tex.drawTo( function() {
|
||||
tex.bind(0);
|
||||
shader.uniforms({u_texture:0, u_aberration: aberration, u_distortion: distortion, u_blur: blur })
|
||||
.draw(mesh);
|
||||
});
|
||||
this.setOutputData(0, this._tex);
|
||||
};
|
||||
|
||||
this.setOutputData(0, this._tex);
|
||||
}
|
||||
|
||||
LGraphFXLens.pixel_shader = "precision highp float;\n\
|
||||
LGraphFXLens.pixel_shader =
|
||||
"precision highp float;\n\
|
||||
precision highp float;\n\
|
||||
varying vec2 v_coord;\n\
|
||||
uniform sampler2D u_texture;\n\
|
||||
@@ -99,7 +115,7 @@ if(typeof(GL) != "undefined")
|
||||
gl_FragColor = color;\n\
|
||||
}\n\
|
||||
";
|
||||
/*
|
||||
/*
|
||||
float normalized_tunable_sigmoid(float xs, float k)\n\
|
||||
{\n\
|
||||
xs = xs * 2.0 - 1.0;\n\
|
||||
@@ -109,10 +125,10 @@ if(typeof(GL) != "undefined")
|
||||
}\n\
|
||||
*/
|
||||
|
||||
LiteGraph.registerNodeType("fx/lens", LGraphFXLens );
|
||||
global.LGraphFXLens = LGraphFXLens;
|
||||
LiteGraph.registerNodeType("fx/lens", LGraphFXLens);
|
||||
global.LGraphFXLens = LGraphFXLens;
|
||||
|
||||
/* not working yet
|
||||
/* not working yet
|
||||
function LGraphDepthOfField()
|
||||
{
|
||||
this.addInput("Color","Texture");
|
||||
@@ -225,136 +241,170 @@ if(typeof(GL) != "undefined")
|
||||
global.LGraphDepthOfField = LGraphDepthOfField;
|
||||
*/
|
||||
|
||||
//*******************************************************
|
||||
//*******************************************************
|
||||
|
||||
function LGraphFXBokeh()
|
||||
{
|
||||
this.addInput("Texture","Texture");
|
||||
this.addInput("Blurred","Texture");
|
||||
this.addInput("Mask","Texture");
|
||||
this.addInput("Threshold","number");
|
||||
this.addOutput("Texture","Texture");
|
||||
this.properties = { shape: "", size: 10, alpha: 1.0, threshold: 1.0, high_precision: false };
|
||||
}
|
||||
function LGraphFXBokeh() {
|
||||
this.addInput("Texture", "Texture");
|
||||
this.addInput("Blurred", "Texture");
|
||||
this.addInput("Mask", "Texture");
|
||||
this.addInput("Threshold", "number");
|
||||
this.addOutput("Texture", "Texture");
|
||||
this.properties = {
|
||||
shape: "",
|
||||
size: 10,
|
||||
alpha: 1.0,
|
||||
threshold: 1.0,
|
||||
high_precision: false
|
||||
};
|
||||
}
|
||||
|
||||
LGraphFXBokeh.title = "Bokeh";
|
||||
LGraphFXBokeh.desc = "applies an Bokeh effect";
|
||||
LGraphFXBokeh.title = "Bokeh";
|
||||
LGraphFXBokeh.desc = "applies an Bokeh effect";
|
||||
|
||||
LGraphFXBokeh.widgets_info = {"shape": { widget:"texture" }};
|
||||
LGraphFXBokeh.widgets_info = { shape: { widget: "texture" } };
|
||||
|
||||
LGraphFXBokeh.prototype.onExecute = function()
|
||||
{
|
||||
var tex = this.getInputData(0);
|
||||
var blurred_tex = this.getInputData(1);
|
||||
var mask_tex = this.getInputData(2);
|
||||
if(!tex || !mask_tex || !this.properties.shape)
|
||||
{
|
||||
this.setOutputData(0, tex);
|
||||
return;
|
||||
}
|
||||
LGraphFXBokeh.prototype.onExecute = function() {
|
||||
var tex = this.getInputData(0);
|
||||
var blurred_tex = this.getInputData(1);
|
||||
var mask_tex = this.getInputData(2);
|
||||
if (!tex || !mask_tex || !this.properties.shape) {
|
||||
this.setOutputData(0, tex);
|
||||
return;
|
||||
}
|
||||
|
||||
if(!blurred_tex)
|
||||
blurred_tex = tex;
|
||||
if (!blurred_tex) blurred_tex = tex;
|
||||
|
||||
var shape_tex = LGraphTexture.getTexture( this.properties.shape );
|
||||
if(!shape_tex)
|
||||
return;
|
||||
var shape_tex = LGraphTexture.getTexture(this.properties.shape);
|
||||
if (!shape_tex) return;
|
||||
|
||||
var threshold = this.properties.threshold;
|
||||
if( this.isInputConnected(3) )
|
||||
{
|
||||
threshold = this.getInputData(3);
|
||||
this.properties.threshold = threshold;
|
||||
}
|
||||
var threshold = this.properties.threshold;
|
||||
if (this.isInputConnected(3)) {
|
||||
threshold = this.getInputData(3);
|
||||
this.properties.threshold = threshold;
|
||||
}
|
||||
|
||||
var precision = gl.UNSIGNED_BYTE;
|
||||
if (this.properties.high_precision)
|
||||
precision = gl.half_float_ext ? gl.HALF_FLOAT_OES : gl.FLOAT;
|
||||
if (
|
||||
!this._temp_texture ||
|
||||
this._temp_texture.type != precision ||
|
||||
this._temp_texture.width != tex.width ||
|
||||
this._temp_texture.height != tex.height
|
||||
)
|
||||
this._temp_texture = new GL.Texture(tex.width, tex.height, {
|
||||
type: precision,
|
||||
format: gl.RGBA,
|
||||
filter: gl.LINEAR
|
||||
});
|
||||
|
||||
var precision = gl.UNSIGNED_BYTE;
|
||||
if(this.properties.high_precision)
|
||||
precision = gl.half_float_ext ? gl.HALF_FLOAT_OES : gl.FLOAT;
|
||||
if(!this._temp_texture || this._temp_texture.type != precision ||
|
||||
this._temp_texture.width != tex.width || this._temp_texture.height != tex.height)
|
||||
this._temp_texture = new GL.Texture( tex.width, tex.height, { type: precision, format: gl.RGBA, filter: gl.LINEAR });
|
||||
//iterations
|
||||
var size = this.properties.size;
|
||||
|
||||
//iterations
|
||||
var size = this.properties.size;
|
||||
var first_shader = LGraphFXBokeh._first_shader;
|
||||
if (!first_shader)
|
||||
first_shader = LGraphFXBokeh._first_shader = new GL.Shader(
|
||||
Shader.SCREEN_VERTEX_SHADER,
|
||||
LGraphFXBokeh._first_pixel_shader
|
||||
);
|
||||
|
||||
var first_shader = LGraphFXBokeh._first_shader;
|
||||
if(!first_shader)
|
||||
first_shader = LGraphFXBokeh._first_shader = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphFXBokeh._first_pixel_shader );
|
||||
var second_shader = LGraphFXBokeh._second_shader;
|
||||
if (!second_shader)
|
||||
second_shader = LGraphFXBokeh._second_shader = new GL.Shader(
|
||||
LGraphFXBokeh._second_vertex_shader,
|
||||
LGraphFXBokeh._second_pixel_shader
|
||||
);
|
||||
|
||||
var second_shader = LGraphFXBokeh._second_shader;
|
||||
if(!second_shader)
|
||||
second_shader = LGraphFXBokeh._second_shader = new GL.Shader( LGraphFXBokeh._second_vertex_shader, LGraphFXBokeh._second_pixel_shader );
|
||||
var points_mesh = this._points_mesh;
|
||||
if (
|
||||
!points_mesh ||
|
||||
points_mesh._width != tex.width ||
|
||||
points_mesh._height != tex.height ||
|
||||
points_mesh._spacing != 2
|
||||
)
|
||||
points_mesh = this.createPointsMesh(tex.width, tex.height, 2);
|
||||
|
||||
var points_mesh = this._points_mesh;
|
||||
if(!points_mesh || points_mesh._width != tex.width || points_mesh._height != tex.height || points_mesh._spacing != 2)
|
||||
points_mesh = this.createPointsMesh( tex.width, tex.height, 2 );
|
||||
var screen_mesh = Mesh.getScreenQuad();
|
||||
|
||||
var screen_mesh = Mesh.getScreenQuad();
|
||||
var point_size = this.properties.size;
|
||||
var min_light = this.properties.min_light;
|
||||
var alpha = this.properties.alpha;
|
||||
|
||||
var point_size = this.properties.size;
|
||||
var min_light = this.properties.min_light;
|
||||
var alpha = this.properties.alpha;
|
||||
gl.disable(gl.DEPTH_TEST);
|
||||
gl.disable(gl.BLEND);
|
||||
|
||||
gl.disable( gl.DEPTH_TEST );
|
||||
gl.disable( gl.BLEND );
|
||||
this._temp_texture.drawTo(function() {
|
||||
tex.bind(0);
|
||||
blurred_tex.bind(1);
|
||||
mask_tex.bind(2);
|
||||
first_shader
|
||||
.uniforms({
|
||||
u_texture: 0,
|
||||
u_texture_blur: 1,
|
||||
u_mask: 2,
|
||||
u_texsize: [tex.width, tex.height]
|
||||
})
|
||||
.draw(screen_mesh);
|
||||
});
|
||||
|
||||
this._temp_texture.drawTo( function() {
|
||||
tex.bind(0);
|
||||
blurred_tex.bind(1);
|
||||
mask_tex.bind(2);
|
||||
first_shader.uniforms({u_texture:0, u_texture_blur:1, u_mask: 2, u_texsize: [tex.width, tex.height] })
|
||||
.draw(screen_mesh);
|
||||
});
|
||||
this._temp_texture.drawTo(function() {
|
||||
//clear because we use blending
|
||||
//gl.clearColor(0.0,0.0,0.0,1.0);
|
||||
//gl.clear( gl.COLOR_BUFFER_BIT );
|
||||
gl.enable(gl.BLEND);
|
||||
gl.blendFunc(gl.ONE, gl.ONE);
|
||||
|
||||
this._temp_texture.drawTo( function() {
|
||||
//clear because we use blending
|
||||
//gl.clearColor(0.0,0.0,0.0,1.0);
|
||||
//gl.clear( gl.COLOR_BUFFER_BIT );
|
||||
gl.enable( gl.BLEND );
|
||||
gl.blendFunc( gl.ONE, gl.ONE );
|
||||
tex.bind(0);
|
||||
shape_tex.bind(3);
|
||||
second_shader
|
||||
.uniforms({
|
||||
u_texture: 0,
|
||||
u_mask: 2,
|
||||
u_shape: 3,
|
||||
u_alpha: alpha,
|
||||
u_threshold: threshold,
|
||||
u_pointSize: point_size,
|
||||
u_itexsize: [1.0 / tex.width, 1.0 / tex.height]
|
||||
})
|
||||
.draw(points_mesh, gl.POINTS);
|
||||
});
|
||||
|
||||
tex.bind(0);
|
||||
shape_tex.bind(3);
|
||||
second_shader.uniforms({u_texture:0, u_mask: 2, u_shape:3, u_alpha: alpha, u_threshold: threshold, u_pointSize: point_size, u_itexsize: [1.0/tex.width, 1.0/tex.height] })
|
||||
.draw(points_mesh, gl.POINTS);
|
||||
});
|
||||
this.setOutputData(0, this._temp_texture);
|
||||
};
|
||||
|
||||
this.setOutputData(0, this._temp_texture);
|
||||
}
|
||||
LGraphFXBokeh.prototype.createPointsMesh = function(
|
||||
width,
|
||||
height,
|
||||
spacing
|
||||
) {
|
||||
var nwidth = Math.round(width / spacing);
|
||||
var nheight = Math.round(height / spacing);
|
||||
|
||||
LGraphFXBokeh.prototype.createPointsMesh = function(width, height, spacing)
|
||||
{
|
||||
var nwidth = Math.round(width / spacing);
|
||||
var nheight = Math.round(height / spacing);
|
||||
var vertices = new Float32Array(nwidth * nheight * 2);
|
||||
|
||||
var vertices = new Float32Array(nwidth * nheight * 2);
|
||||
var ny = -1;
|
||||
var dx = (2 / width) * spacing;
|
||||
var dy = (2 / height) * spacing;
|
||||
for (var y = 0; y < nheight; ++y) {
|
||||
var nx = -1;
|
||||
for (var x = 0; x < nwidth; ++x) {
|
||||
var pos = y * nwidth * 2 + x * 2;
|
||||
vertices[pos] = nx;
|
||||
vertices[pos + 1] = ny;
|
||||
nx += dx;
|
||||
}
|
||||
ny += dy;
|
||||
}
|
||||
|
||||
var ny = -1;
|
||||
var dx = 2/width * spacing;
|
||||
var dy = 2/height * spacing;
|
||||
for(var y = 0; y < nheight; ++y )
|
||||
{
|
||||
var nx = -1;
|
||||
for(var x = 0; x < nwidth; ++x )
|
||||
{
|
||||
var pos = y*nwidth*2 + x*2;
|
||||
vertices[pos] = nx;
|
||||
vertices[pos+1] = ny;
|
||||
nx += dx;
|
||||
}
|
||||
ny += dy;
|
||||
}
|
||||
this._points_mesh = GL.Mesh.load({ vertices2D: vertices });
|
||||
this._points_mesh._width = width;
|
||||
this._points_mesh._height = height;
|
||||
this._points_mesh._spacing = spacing;
|
||||
|
||||
this._points_mesh = GL.Mesh.load({vertices2D: vertices});
|
||||
this._points_mesh._width = width;
|
||||
this._points_mesh._height = height;
|
||||
this._points_mesh._spacing = spacing;
|
||||
return this._points_mesh;
|
||||
};
|
||||
|
||||
return this._points_mesh;
|
||||
}
|
||||
|
||||
/*
|
||||
/*
|
||||
LGraphTextureBokeh._pixel_shader = "precision highp float;\n\
|
||||
varying vec2 a_coord;\n\
|
||||
uniform sampler2D u_texture;\n\
|
||||
@@ -367,7 +417,8 @@ if(typeof(GL) != "undefined")
|
||||
}\n";
|
||||
*/
|
||||
|
||||
LGraphFXBokeh._first_pixel_shader = "precision highp float;\n\
|
||||
LGraphFXBokeh._first_pixel_shader =
|
||||
"precision highp float;\n\
|
||||
precision highp float;\n\
|
||||
varying vec2 v_coord;\n\
|
||||
uniform sampler2D u_texture;\n\
|
||||
@@ -382,7 +433,8 @@ if(typeof(GL) != "undefined")
|
||||
}\n\
|
||||
";
|
||||
|
||||
LGraphFXBokeh._second_vertex_shader = "precision highp float;\n\
|
||||
LGraphFXBokeh._second_vertex_shader =
|
||||
"precision highp float;\n\
|
||||
attribute vec2 a_vertex2D;\n\
|
||||
varying vec4 v_color;\n\
|
||||
uniform sampler2D u_texture;\n\
|
||||
@@ -411,7 +463,8 @@ if(typeof(GL) != "undefined")
|
||||
}\n\
|
||||
";
|
||||
|
||||
LGraphFXBokeh._second_pixel_shader = "precision highp float;\n\
|
||||
LGraphFXBokeh._second_pixel_shader =
|
||||
"precision highp float;\n\
|
||||
varying vec4 v_color;\n\
|
||||
uniform sampler2D u_shape;\n\
|
||||
uniform float u_alpha;\n\
|
||||
@@ -422,100 +475,114 @@ if(typeof(GL) != "undefined")
|
||||
gl_FragColor = color;\n\
|
||||
}\n";
|
||||
|
||||
LiteGraph.registerNodeType("fx/bokeh", LGraphFXBokeh);
|
||||
global.LGraphFXBokeh = LGraphFXBokeh;
|
||||
|
||||
LiteGraph.registerNodeType("fx/bokeh", LGraphFXBokeh );
|
||||
global.LGraphFXBokeh = LGraphFXBokeh;
|
||||
//************************************************
|
||||
|
||||
//************************************************
|
||||
function LGraphFXGeneric() {
|
||||
this.addInput("Texture", "Texture");
|
||||
this.addInput("value1", "number");
|
||||
this.addInput("value2", "number");
|
||||
this.addOutput("Texture", "Texture");
|
||||
this.properties = {
|
||||
fx: "halftone",
|
||||
value1: 1,
|
||||
value2: 1,
|
||||
precision: LGraphTexture.DEFAULT
|
||||
};
|
||||
}
|
||||
|
||||
function LGraphFXGeneric()
|
||||
{
|
||||
this.addInput("Texture","Texture");
|
||||
this.addInput("value1","number");
|
||||
this.addInput("value2","number");
|
||||
this.addOutput("Texture","Texture");
|
||||
this.properties = { fx: "halftone", value1: 1, value2: 1, precision: LGraphTexture.DEFAULT };
|
||||
}
|
||||
LGraphFXGeneric.title = "FX";
|
||||
LGraphFXGeneric.desc = "applies an FX from a list";
|
||||
|
||||
LGraphFXGeneric.title = "FX";
|
||||
LGraphFXGeneric.desc = "applies an FX from a list";
|
||||
LGraphFXGeneric.widgets_info = {
|
||||
fx: {
|
||||
widget: "combo",
|
||||
values: ["halftone", "pixelate", "lowpalette", "noise", "gamma"]
|
||||
},
|
||||
precision: { widget: "combo", values: LGraphTexture.MODE_VALUES }
|
||||
};
|
||||
LGraphFXGeneric.shaders = {};
|
||||
|
||||
LGraphFXGeneric.widgets_info = {
|
||||
"fx": { widget:"combo", values:["halftone","pixelate","lowpalette","noise","gamma"] },
|
||||
"precision": { widget:"combo", values: LGraphTexture.MODE_VALUES }
|
||||
};
|
||||
LGraphFXGeneric.shaders = {};
|
||||
LGraphFXGeneric.prototype.onExecute = function() {
|
||||
if (!this.isOutputConnected(0)) return; //saves work
|
||||
|
||||
LGraphFXGeneric.prototype.onExecute = function()
|
||||
{
|
||||
if(!this.isOutputConnected(0))
|
||||
return; //saves work
|
||||
var tex = this.getInputData(0);
|
||||
if (this.properties.precision === LGraphTexture.PASS_THROUGH) {
|
||||
this.setOutputData(0, tex);
|
||||
return;
|
||||
}
|
||||
|
||||
var tex = this.getInputData(0);
|
||||
if(this.properties.precision === LGraphTexture.PASS_THROUGH )
|
||||
{
|
||||
this.setOutputData(0,tex);
|
||||
return;
|
||||
}
|
||||
if (!tex) return;
|
||||
|
||||
if(!tex)
|
||||
return;
|
||||
this._tex = LGraphTexture.getTargetTexture(
|
||||
tex,
|
||||
this._tex,
|
||||
this.properties.precision
|
||||
);
|
||||
|
||||
this._tex = LGraphTexture.getTargetTexture( tex, this._tex, this.properties.precision );
|
||||
//iterations
|
||||
var value1 = this.properties.value1;
|
||||
if (this.isInputConnected(1)) {
|
||||
value1 = this.getInputData(1);
|
||||
this.properties.value1 = value1;
|
||||
}
|
||||
|
||||
//iterations
|
||||
var value1 = this.properties.value1;
|
||||
if( this.isInputConnected(1) )
|
||||
{
|
||||
value1 = this.getInputData(1);
|
||||
this.properties.value1 = value1;
|
||||
}
|
||||
var value2 = this.properties.value2;
|
||||
if (this.isInputConnected(2)) {
|
||||
value2 = this.getInputData(2);
|
||||
this.properties.value2 = value2;
|
||||
}
|
||||
|
||||
var value2 = this.properties.value2;
|
||||
if( this.isInputConnected(2) )
|
||||
{
|
||||
value2 = this.getInputData(2);
|
||||
this.properties.value2 = value2;
|
||||
}
|
||||
|
||||
var fx = this.properties.fx;
|
||||
var shader = LGraphFXGeneric.shaders[ fx ];
|
||||
if(!shader)
|
||||
{
|
||||
var pixel_shader_code = LGraphFXGeneric["pixel_shader_" + fx ];
|
||||
if(!pixel_shader_code)
|
||||
return;
|
||||
var fx = this.properties.fx;
|
||||
var shader = LGraphFXGeneric.shaders[fx];
|
||||
if (!shader) {
|
||||
var pixel_shader_code = LGraphFXGeneric["pixel_shader_" + fx];
|
||||
if (!pixel_shader_code) return;
|
||||
|
||||
shader = LGraphFXGeneric.shaders[ fx ] = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, pixel_shader_code );
|
||||
}
|
||||
shader = LGraphFXGeneric.shaders[fx] = new GL.Shader(
|
||||
Shader.SCREEN_VERTEX_SHADER,
|
||||
pixel_shader_code
|
||||
);
|
||||
}
|
||||
|
||||
gl.disable(gl.BLEND);
|
||||
gl.disable(gl.DEPTH_TEST);
|
||||
var mesh = Mesh.getScreenQuad();
|
||||
var camera = global.LS ? LS.Renderer._current_camera : null;
|
||||
if (camera)
|
||||
camera_planes = [
|
||||
LS.Renderer._current_camera.near,
|
||||
LS.Renderer._current_camera.far
|
||||
];
|
||||
else camera_planes = [1, 100];
|
||||
|
||||
gl.disable( gl.BLEND );
|
||||
gl.disable( gl.DEPTH_TEST );
|
||||
var mesh = Mesh.getScreenQuad();
|
||||
var camera = global.LS ? LS.Renderer._current_camera : null;
|
||||
if(camera)
|
||||
camera_planes = [LS.Renderer._current_camera.near, LS.Renderer._current_camera.far];
|
||||
else
|
||||
camera_planes = [1,100];
|
||||
var noise = null;
|
||||
if (fx == "noise") noise = LGraphTexture.getNoiseTexture();
|
||||
|
||||
var noise = null;
|
||||
if(fx == "noise")
|
||||
noise = LGraphTexture.getNoiseTexture();
|
||||
this._tex.drawTo(function() {
|
||||
tex.bind(0);
|
||||
if (fx == "noise") noise.bind(1);
|
||||
|
||||
this._tex.drawTo( function() {
|
||||
tex.bind(0);
|
||||
if(fx == "noise")
|
||||
noise.bind(1);
|
||||
shader
|
||||
.uniforms({
|
||||
u_texture: 0,
|
||||
u_noise: 1,
|
||||
u_size: [tex.width, tex.height],
|
||||
u_rand: [Math.random(), Math.random()],
|
||||
u_value1: value1,
|
||||
u_value2: value2,
|
||||
u_camera_planes: camera_planes
|
||||
})
|
||||
.draw(mesh);
|
||||
});
|
||||
|
||||
shader.uniforms({u_texture:0, u_noise:1, u_size: [tex.width, tex.height], u_rand:[ Math.random(), Math.random() ], u_value1: value1, u_value2: value2, u_camera_planes: camera_planes })
|
||||
.draw(mesh);
|
||||
});
|
||||
this.setOutputData(0, this._tex);
|
||||
};
|
||||
|
||||
this.setOutputData(0, this._tex);
|
||||
}
|
||||
|
||||
LGraphFXGeneric.pixel_shader_halftone = "precision highp float;\n\
|
||||
LGraphFXGeneric.pixel_shader_halftone =
|
||||
"precision highp float;\n\
|
||||
varying vec2 v_coord;\n\
|
||||
uniform sampler2D u_texture;\n\
|
||||
uniform vec2 u_camera_planes;\n\
|
||||
@@ -538,7 +605,8 @@ if(typeof(GL) != "undefined")
|
||||
gl_FragColor = vec4(vec3(average * 10.0 - 5.0 + pattern()), color.a);\n\
|
||||
}\n";
|
||||
|
||||
LGraphFXGeneric.pixel_shader_pixelate = "precision highp float;\n\
|
||||
LGraphFXGeneric.pixel_shader_pixelate =
|
||||
"precision highp float;\n\
|
||||
varying vec2 v_coord;\n\
|
||||
uniform sampler2D u_texture;\n\
|
||||
uniform vec2 u_camera_planes;\n\
|
||||
@@ -552,7 +620,8 @@ if(typeof(GL) != "undefined")
|
||||
gl_FragColor = color;\n\
|
||||
}\n";
|
||||
|
||||
LGraphFXGeneric.pixel_shader_lowpalette = "precision highp float;\n\
|
||||
LGraphFXGeneric.pixel_shader_lowpalette =
|
||||
"precision highp float;\n\
|
||||
varying vec2 v_coord;\n\
|
||||
uniform sampler2D u_texture;\n\
|
||||
uniform vec2 u_camera_planes;\n\
|
||||
@@ -565,7 +634,8 @@ if(typeof(GL) != "undefined")
|
||||
gl_FragColor = floor(color * u_value1) / u_value1;\n\
|
||||
}\n";
|
||||
|
||||
LGraphFXGeneric.pixel_shader_noise = "precision highp float;\n\
|
||||
LGraphFXGeneric.pixel_shader_noise =
|
||||
"precision highp float;\n\
|
||||
varying vec2 v_coord;\n\
|
||||
uniform sampler2D u_texture;\n\
|
||||
uniform sampler2D u_noise;\n\
|
||||
@@ -580,7 +650,8 @@ if(typeof(GL) != "undefined")
|
||||
gl_FragColor = vec4( color.xyz + noise * u_value1, color.a );\n\
|
||||
}\n";
|
||||
|
||||
LGraphFXGeneric.pixel_shader_gamma = "precision highp float;\n\
|
||||
LGraphFXGeneric.pixel_shader_gamma =
|
||||
"precision highp float;\n\
|
||||
varying vec2 v_coord;\n\
|
||||
uniform sampler2D u_texture;\n\
|
||||
uniform float u_value1;\n\
|
||||
@@ -591,69 +662,82 @@ if(typeof(GL) != "undefined")
|
||||
gl_FragColor = vec4( pow( color.xyz, vec3(gamma) ), color.a );\n\
|
||||
}\n";
|
||||
|
||||
LiteGraph.registerNodeType("fx/generic", LGraphFXGeneric);
|
||||
global.LGraphFXGeneric = LGraphFXGeneric;
|
||||
|
||||
LiteGraph.registerNodeType("fx/generic", LGraphFXGeneric );
|
||||
global.LGraphFXGeneric = LGraphFXGeneric;
|
||||
// Vigneting ************************************
|
||||
|
||||
function LGraphFXVigneting() {
|
||||
this.addInput("Tex.", "Texture");
|
||||
this.addInput("intensity", "number");
|
||||
|
||||
// Vigneting ************************************
|
||||
this.addOutput("Texture", "Texture");
|
||||
this.properties = {
|
||||
intensity: 1,
|
||||
invert: false,
|
||||
precision: LGraphTexture.DEFAULT
|
||||
};
|
||||
|
||||
function LGraphFXVigneting()
|
||||
{
|
||||
this.addInput("Tex.","Texture");
|
||||
this.addInput("intensity","number");
|
||||
if (!LGraphFXVigneting._shader)
|
||||
LGraphFXVigneting._shader = new GL.Shader(
|
||||
Shader.SCREEN_VERTEX_SHADER,
|
||||
LGraphFXVigneting.pixel_shader
|
||||
);
|
||||
}
|
||||
|
||||
this.addOutput("Texture","Texture");
|
||||
this.properties = { intensity: 1, invert: false, precision: LGraphTexture.DEFAULT };
|
||||
LGraphFXVigneting.title = "Vigneting";
|
||||
LGraphFXVigneting.desc = "Vigneting";
|
||||
|
||||
if(!LGraphFXVigneting._shader)
|
||||
LGraphFXVigneting._shader = new GL.Shader( Shader.SCREEN_VERTEX_SHADER, LGraphFXVigneting.pixel_shader );
|
||||
}
|
||||
LGraphFXVigneting.widgets_info = {
|
||||
precision: { widget: "combo", values: LGraphTexture.MODE_VALUES }
|
||||
};
|
||||
|
||||
LGraphFXVigneting.title = "Vigneting";
|
||||
LGraphFXVigneting.desc = "Vigneting";
|
||||
LGraphFXVigneting.prototype.onExecute = function() {
|
||||
var tex = this.getInputData(0);
|
||||
|
||||
LGraphFXVigneting.widgets_info = {
|
||||
"precision": { widget:"combo", values: LGraphTexture.MODE_VALUES }
|
||||
};
|
||||
if (this.properties.precision === LGraphTexture.PASS_THROUGH) {
|
||||
this.setOutputData(0, tex);
|
||||
return;
|
||||
}
|
||||
|
||||
LGraphFXVigneting.prototype.onExecute = function()
|
||||
{
|
||||
var tex = this.getInputData(0);
|
||||
if (!tex) return;
|
||||
|
||||
if(this.properties.precision === LGraphTexture.PASS_THROUGH )
|
||||
{
|
||||
this.setOutputData(0,tex);
|
||||
return;
|
||||
}
|
||||
this._tex = LGraphTexture.getTargetTexture(
|
||||
tex,
|
||||
this._tex,
|
||||
this.properties.precision
|
||||
);
|
||||
|
||||
if(!tex) return;
|
||||
var intensity = this.properties.intensity;
|
||||
if (this.isInputConnected(1)) {
|
||||
intensity = this.getInputData(1);
|
||||
this.properties.intensity = intensity;
|
||||
}
|
||||
|
||||
this._tex = LGraphTexture.getTargetTexture( tex, this._tex, this.properties.precision );
|
||||
gl.disable(gl.BLEND);
|
||||
gl.disable(gl.DEPTH_TEST);
|
||||
|
||||
var intensity = this.properties.intensity;
|
||||
if( this.isInputConnected(1) )
|
||||
{
|
||||
intensity = this.getInputData(1);
|
||||
this.properties.intensity = intensity;
|
||||
}
|
||||
var mesh = Mesh.getScreenQuad();
|
||||
var shader = LGraphFXVigneting._shader;
|
||||
var invert = this.properties.invert;
|
||||
|
||||
gl.disable( gl.BLEND );
|
||||
gl.disable( gl.DEPTH_TEST );
|
||||
this._tex.drawTo(function() {
|
||||
tex.bind(0);
|
||||
shader
|
||||
.uniforms({
|
||||
u_texture: 0,
|
||||
u_intensity: intensity,
|
||||
u_isize: [1 / tex.width, 1 / tex.height],
|
||||
u_invert: invert ? 1 : 0
|
||||
})
|
||||
.draw(mesh);
|
||||
});
|
||||
|
||||
var mesh = Mesh.getScreenQuad();
|
||||
var shader = LGraphFXVigneting._shader;
|
||||
var invert = this.properties.invert;
|
||||
this.setOutputData(0, this._tex);
|
||||
};
|
||||
|
||||
this._tex.drawTo( function() {
|
||||
tex.bind(0);
|
||||
shader.uniforms({u_texture:0, u_intensity: intensity, u_isize:[1/tex.width,1/tex.height], u_invert: invert ? 1 : 0}).draw(mesh);
|
||||
});
|
||||
|
||||
this.setOutputData(0, this._tex);
|
||||
}
|
||||
|
||||
LGraphFXVigneting.pixel_shader = "precision highp float;\n\
|
||||
LGraphFXVigneting.pixel_shader =
|
||||
"precision highp float;\n\
|
||||
precision highp float;\n\
|
||||
varying vec2 v_coord;\n\
|
||||
uniform sampler2D u_texture;\n\
|
||||
@@ -670,8 +754,7 @@ if(typeof(GL) != "undefined")
|
||||
}\n\
|
||||
";
|
||||
|
||||
LiteGraph.registerNodeType("fx/vigneting", LGraphFXVigneting );
|
||||
global.LGraphFXVigneting = LGraphFXVigneting;
|
||||
}
|
||||
|
||||
})(this);
|
||||
LiteGraph.registerNodeType("fx/vigneting", LGraphFXVigneting);
|
||||
global.LGraphFXVigneting = LGraphFXVigneting;
|
||||
}
|
||||
})(this);
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@@ -1,224 +1,358 @@
|
||||
(function(global){
|
||||
var LiteGraph = global.LiteGraph;
|
||||
(function(global) {
|
||||
var LiteGraph = global.LiteGraph;
|
||||
|
||||
function GamepadInput()
|
||||
{
|
||||
this.addOutput("left_x_axis","number");
|
||||
this.addOutput("left_y_axis","number");
|
||||
this.addOutput( "button_pressed", LiteGraph.EVENT );
|
||||
this.properties = { gamepad_index: 0, threshold: 0.1 };
|
||||
function GamepadInput() {
|
||||
this.addOutput("left_x_axis", "number");
|
||||
this.addOutput("left_y_axis", "number");
|
||||
this.addOutput("button_pressed", LiteGraph.EVENT);
|
||||
this.properties = { gamepad_index: 0, threshold: 0.1 };
|
||||
|
||||
this._left_axis = new Float32Array(2);
|
||||
this._right_axis = new Float32Array(2);
|
||||
this._triggers = new Float32Array(2);
|
||||
this._previous_buttons = new Uint8Array(17);
|
||||
this._current_buttons = new Uint8Array(17);
|
||||
}
|
||||
this._left_axis = new Float32Array(2);
|
||||
this._right_axis = new Float32Array(2);
|
||||
this._triggers = new Float32Array(2);
|
||||
this._previous_buttons = new Uint8Array(17);
|
||||
this._current_buttons = new Uint8Array(17);
|
||||
}
|
||||
|
||||
GamepadInput.title = "Gamepad";
|
||||
GamepadInput.desc = "gets the input of the gamepad";
|
||||
GamepadInput.title = "Gamepad";
|
||||
GamepadInput.desc = "gets the input of the gamepad";
|
||||
|
||||
GamepadInput.CENTER = 0;
|
||||
GamepadInput.LEFT = 1;
|
||||
GamepadInput.RIGHT = 2;
|
||||
GamepadInput.UP = 4;
|
||||
GamepadInput.DOWN = 8;
|
||||
GamepadInput.CENTER = 0;
|
||||
GamepadInput.LEFT = 1;
|
||||
GamepadInput.RIGHT = 2;
|
||||
GamepadInput.UP = 4;
|
||||
GamepadInput.DOWN = 8;
|
||||
|
||||
GamepadInput.zero = new Float32Array(2);
|
||||
GamepadInput.buttons = ["a","b","x","y","lb","rb","lt","rt","back","start","ls","rs","home"];
|
||||
GamepadInput.zero = new Float32Array(2);
|
||||
GamepadInput.buttons = [
|
||||
"a",
|
||||
"b",
|
||||
"x",
|
||||
"y",
|
||||
"lb",
|
||||
"rb",
|
||||
"lt",
|
||||
"rt",
|
||||
"back",
|
||||
"start",
|
||||
"ls",
|
||||
"rs",
|
||||
"home"
|
||||
];
|
||||
|
||||
GamepadInput.prototype.onExecute = function()
|
||||
{
|
||||
//get gamepad
|
||||
var gamepad = this.getGamepad();
|
||||
var threshold = this.properties.threshold || 0.0;
|
||||
GamepadInput.prototype.onExecute = function() {
|
||||
//get gamepad
|
||||
var gamepad = this.getGamepad();
|
||||
var threshold = this.properties.threshold || 0.0;
|
||||
|
||||
if(gamepad)
|
||||
{
|
||||
this._left_axis[0] = Math.abs( gamepad.xbox.axes["lx"] ) > threshold ? gamepad.xbox.axes["lx"] : 0;
|
||||
this._left_axis[1] = Math.abs( gamepad.xbox.axes["ly"] ) > threshold ? gamepad.xbox.axes["ly"] : 0;
|
||||
this._right_axis[0] = Math.abs( gamepad.xbox.axes["rx"] ) > threshold ? gamepad.xbox.axes["rx"] : 0;
|
||||
this._right_axis[1] = Math.abs( gamepad.xbox.axes["ry"] ) > threshold ? gamepad.xbox.axes["ry"] : 0;
|
||||
this._triggers[0] = Math.abs( gamepad.xbox.axes["ltrigger"] ) > threshold ? gamepad.xbox.axes["ltrigger"] : 0;
|
||||
this._triggers[1] = Math.abs( gamepad.xbox.axes["rtrigger"] ) > threshold ? gamepad.xbox.axes["rtrigger"] : 0;
|
||||
}
|
||||
if (gamepad) {
|
||||
this._left_axis[0] =
|
||||
Math.abs(gamepad.xbox.axes["lx"]) > threshold
|
||||
? gamepad.xbox.axes["lx"]
|
||||
: 0;
|
||||
this._left_axis[1] =
|
||||
Math.abs(gamepad.xbox.axes["ly"]) > threshold
|
||||
? gamepad.xbox.axes["ly"]
|
||||
: 0;
|
||||
this._right_axis[0] =
|
||||
Math.abs(gamepad.xbox.axes["rx"]) > threshold
|
||||
? gamepad.xbox.axes["rx"]
|
||||
: 0;
|
||||
this._right_axis[1] =
|
||||
Math.abs(gamepad.xbox.axes["ry"]) > threshold
|
||||
? gamepad.xbox.axes["ry"]
|
||||
: 0;
|
||||
this._triggers[0] =
|
||||
Math.abs(gamepad.xbox.axes["ltrigger"]) > threshold
|
||||
? gamepad.xbox.axes["ltrigger"]
|
||||
: 0;
|
||||
this._triggers[1] =
|
||||
Math.abs(gamepad.xbox.axes["rtrigger"]) > threshold
|
||||
? gamepad.xbox.axes["rtrigger"]
|
||||
: 0;
|
||||
}
|
||||
|
||||
if(this.outputs)
|
||||
{
|
||||
for(var i = 0; i < this.outputs.length; i++)
|
||||
{
|
||||
var output = this.outputs[i];
|
||||
if(!output.links || !output.links.length)
|
||||
continue;
|
||||
var v = null;
|
||||
if (this.outputs) {
|
||||
for (var i = 0; i < this.outputs.length; i++) {
|
||||
var output = this.outputs[i];
|
||||
if (!output.links || !output.links.length) continue;
|
||||
var v = null;
|
||||
|
||||
if(gamepad)
|
||||
{
|
||||
switch( output.name )
|
||||
{
|
||||
case "left_axis": v = this._left_axis; break;
|
||||
case "right_axis": v = this._right_axis; break;
|
||||
case "left_x_axis": v = this._left_axis[0]; break;
|
||||
case "left_y_axis": v = this._left_axis[1]; break;
|
||||
case "right_x_axis": v = this._right_axis[0]; break;
|
||||
case "right_y_axis": v = this._right_axis[1]; break;
|
||||
case "trigger_left": v = this._triggers[0]; break;
|
||||
case "trigger_right": v = this._triggers[1]; break;
|
||||
case "a_button": v = gamepad.xbox.buttons["a"] ? 1 : 0; break;
|
||||
case "b_button": v = gamepad.xbox.buttons["b"] ? 1 : 0; break;
|
||||
case "x_button": v = gamepad.xbox.buttons["x"] ? 1 : 0; break;
|
||||
case "y_button": v = gamepad.xbox.buttons["y"] ? 1 : 0; break;
|
||||
case "lb_button": v = gamepad.xbox.buttons["lb"] ? 1 : 0; break;
|
||||
case "rb_button": v = gamepad.xbox.buttons["rb"] ? 1 : 0; break;
|
||||
case "ls_button": v = gamepad.xbox.buttons["ls"] ? 1 : 0; break;
|
||||
case "rs_button": v = gamepad.xbox.buttons["rs"] ? 1 : 0; break;
|
||||
case "hat_left": v = gamepad.xbox.hatmap & GamepadInput.LEFT; break;
|
||||
case "hat_right": v = gamepad.xbox.hatmap & GamepadInput.RIGHT; break;
|
||||
case "hat_up": v = gamepad.xbox.hatmap & GamepadInput.UP; break;
|
||||
case "hat_down": v = gamepad.xbox.hatmap & GamepadInput.DOWN; break;
|
||||
case "hat": v = gamepad.xbox.hatmap; break;
|
||||
case "start_button": v = gamepad.xbox.buttons["start"] ? 1 : 0; break;
|
||||
case "back_button": v = gamepad.xbox.buttons["back"] ? 1 : 0; break;
|
||||
case "button_pressed":
|
||||
for(var j = 0; j < this._current_buttons.length; ++j)
|
||||
{
|
||||
if( this._current_buttons[j] && !this._previous_buttons[j] )
|
||||
this.triggerSlot( i, GamepadInput.buttons[j] );
|
||||
}
|
||||
break;
|
||||
default: break;
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
//if no gamepad is connected, output 0
|
||||
switch( output.name )
|
||||
{
|
||||
case "button_pressed": break;
|
||||
case "left_axis":
|
||||
case "right_axis":
|
||||
v = GamepadInput.zero;
|
||||
break;
|
||||
default:
|
||||
v = 0;
|
||||
}
|
||||
}
|
||||
this.setOutputData(i,v);
|
||||
}
|
||||
}
|
||||
}
|
||||
if (gamepad) {
|
||||
switch (output.name) {
|
||||
case "left_axis":
|
||||
v = this._left_axis;
|
||||
break;
|
||||
case "right_axis":
|
||||
v = this._right_axis;
|
||||
break;
|
||||
case "left_x_axis":
|
||||
v = this._left_axis[0];
|
||||
break;
|
||||
case "left_y_axis":
|
||||
v = this._left_axis[1];
|
||||
break;
|
||||
case "right_x_axis":
|
||||
v = this._right_axis[0];
|
||||
break;
|
||||
case "right_y_axis":
|
||||
v = this._right_axis[1];
|
||||
break;
|
||||
case "trigger_left":
|
||||
v = this._triggers[0];
|
||||
break;
|
||||
case "trigger_right":
|
||||
v = this._triggers[1];
|
||||
break;
|
||||
case "a_button":
|
||||
v = gamepad.xbox.buttons["a"] ? 1 : 0;
|
||||
break;
|
||||
case "b_button":
|
||||
v = gamepad.xbox.buttons["b"] ? 1 : 0;
|
||||
break;
|
||||
case "x_button":
|
||||
v = gamepad.xbox.buttons["x"] ? 1 : 0;
|
||||
break;
|
||||
case "y_button":
|
||||
v = gamepad.xbox.buttons["y"] ? 1 : 0;
|
||||
break;
|
||||
case "lb_button":
|
||||
v = gamepad.xbox.buttons["lb"] ? 1 : 0;
|
||||
break;
|
||||
case "rb_button":
|
||||
v = gamepad.xbox.buttons["rb"] ? 1 : 0;
|
||||
break;
|
||||
case "ls_button":
|
||||
v = gamepad.xbox.buttons["ls"] ? 1 : 0;
|
||||
break;
|
||||
case "rs_button":
|
||||
v = gamepad.xbox.buttons["rs"] ? 1 : 0;
|
||||
break;
|
||||
case "hat_left":
|
||||
v = gamepad.xbox.hatmap & GamepadInput.LEFT;
|
||||
break;
|
||||
case "hat_right":
|
||||
v = gamepad.xbox.hatmap & GamepadInput.RIGHT;
|
||||
break;
|
||||
case "hat_up":
|
||||
v = gamepad.xbox.hatmap & GamepadInput.UP;
|
||||
break;
|
||||
case "hat_down":
|
||||
v = gamepad.xbox.hatmap & GamepadInput.DOWN;
|
||||
break;
|
||||
case "hat":
|
||||
v = gamepad.xbox.hatmap;
|
||||
break;
|
||||
case "start_button":
|
||||
v = gamepad.xbox.buttons["start"] ? 1 : 0;
|
||||
break;
|
||||
case "back_button":
|
||||
v = gamepad.xbox.buttons["back"] ? 1 : 0;
|
||||
break;
|
||||
case "button_pressed":
|
||||
for (
|
||||
var j = 0;
|
||||
j < this._current_buttons.length;
|
||||
++j
|
||||
) {
|
||||
if (
|
||||
this._current_buttons[j] &&
|
||||
!this._previous_buttons[j]
|
||||
)
|
||||
this.triggerSlot(
|
||||
i,
|
||||
GamepadInput.buttons[j]
|
||||
);
|
||||
}
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
} else {
|
||||
//if no gamepad is connected, output 0
|
||||
switch (output.name) {
|
||||
case "button_pressed":
|
||||
break;
|
||||
case "left_axis":
|
||||
case "right_axis":
|
||||
v = GamepadInput.zero;
|
||||
break;
|
||||
default:
|
||||
v = 0;
|
||||
}
|
||||
}
|
||||
this.setOutputData(i, v);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
GamepadInput.prototype.getGamepad = function()
|
||||
{
|
||||
var getGamepads = navigator.getGamepads || navigator.webkitGetGamepads || navigator.mozGetGamepads;
|
||||
if(!getGamepads)
|
||||
return null;
|
||||
var gamepads = getGamepads.call(navigator);
|
||||
var gamepad = null;
|
||||
GamepadInput.prototype.getGamepad = function() {
|
||||
var getGamepads =
|
||||
navigator.getGamepads ||
|
||||
navigator.webkitGetGamepads ||
|
||||
navigator.mozGetGamepads;
|
||||
if (!getGamepads) return null;
|
||||
var gamepads = getGamepads.call(navigator);
|
||||
var gamepad = null;
|
||||
|
||||
this._previous_buttons.set( this._current_buttons );
|
||||
this._previous_buttons.set(this._current_buttons);
|
||||
|
||||
//pick the first connected
|
||||
for(var i = this.properties.gamepad_index; i < 4; i++)
|
||||
{
|
||||
if (!gamepads[i])
|
||||
continue;
|
||||
gamepad = gamepads[i];
|
||||
//pick the first connected
|
||||
for (var i = this.properties.gamepad_index; i < 4; i++) {
|
||||
if (!gamepads[i]) continue;
|
||||
gamepad = gamepads[i];
|
||||
|
||||
//xbox controller mapping
|
||||
var xbox = this.xbox_mapping;
|
||||
if(!xbox)
|
||||
xbox = this.xbox_mapping = { axes:[], buttons:{}, hat: "", hatmap: GamepadInput.CENTER };
|
||||
//xbox controller mapping
|
||||
var xbox = this.xbox_mapping;
|
||||
if (!xbox)
|
||||
xbox = this.xbox_mapping = {
|
||||
axes: [],
|
||||
buttons: {},
|
||||
hat: "",
|
||||
hatmap: GamepadInput.CENTER
|
||||
};
|
||||
|
||||
xbox.axes["lx"] = gamepad.axes[0];
|
||||
xbox.axes["ly"] = gamepad.axes[1];
|
||||
xbox.axes["rx"] = gamepad.axes[2];
|
||||
xbox.axes["ry"] = gamepad.axes[3];
|
||||
xbox.axes["ltrigger"] = gamepad.buttons[6].value;
|
||||
xbox.axes["rtrigger"] = gamepad.buttons[7].value;
|
||||
xbox.hat = "";
|
||||
xbox.hatmap = GamepadInput.CENTER;
|
||||
xbox.axes["lx"] = gamepad.axes[0];
|
||||
xbox.axes["ly"] = gamepad.axes[1];
|
||||
xbox.axes["rx"] = gamepad.axes[2];
|
||||
xbox.axes["ry"] = gamepad.axes[3];
|
||||
xbox.axes["ltrigger"] = gamepad.buttons[6].value;
|
||||
xbox.axes["rtrigger"] = gamepad.buttons[7].value;
|
||||
xbox.hat = "";
|
||||
xbox.hatmap = GamepadInput.CENTER;
|
||||
|
||||
for(var j = 0; j < gamepad.buttons.length; j++)
|
||||
{
|
||||
this._current_buttons[j] = gamepad.buttons[j].pressed;
|
||||
for (var j = 0; j < gamepad.buttons.length; j++) {
|
||||
this._current_buttons[j] = gamepad.buttons[j].pressed;
|
||||
|
||||
//mapping of XBOX
|
||||
switch(j) //I use a switch to ensure that a player with another gamepad could play
|
||||
{
|
||||
case 0: xbox.buttons["a"] = gamepad.buttons[j].pressed; break;
|
||||
case 1: xbox.buttons["b"] = gamepad.buttons[j].pressed; break;
|
||||
case 2: xbox.buttons["x"] = gamepad.buttons[j].pressed; break;
|
||||
case 3: xbox.buttons["y"] = gamepad.buttons[j].pressed; break;
|
||||
case 4: xbox.buttons["lb"] = gamepad.buttons[j].pressed; break;
|
||||
case 5: xbox.buttons["rb"] = gamepad.buttons[j].pressed; break;
|
||||
case 6: xbox.buttons["lt"] = gamepad.buttons[j].pressed; break;
|
||||
case 7: xbox.buttons["rt"] = gamepad.buttons[j].pressed; break;
|
||||
case 8: xbox.buttons["back"] = gamepad.buttons[j].pressed; break;
|
||||
case 9: xbox.buttons["start"] = gamepad.buttons[j].pressed; break;
|
||||
case 10: xbox.buttons["ls"] = gamepad.buttons[j].pressed; break;
|
||||
case 11: xbox.buttons["rs"] = gamepad.buttons[j].pressed; break;
|
||||
case 12: if( gamepad.buttons[j].pressed) { xbox.hat += "up"; xbox.hatmap |= GamepadInput.UP; }; break;
|
||||
case 13: if( gamepad.buttons[j].pressed) { xbox.hat += "down"; xbox.hatmap |= GamepadInput.DOWN; }; break;
|
||||
case 14: if( gamepad.buttons[j].pressed) { xbox.hat += "left"; xbox.hatmap |= GamepadInput.LEFT; }; break;
|
||||
case 15: if( gamepad.buttons[j].pressed) { xbox.hat += "right"; xbox.hatmap |= GamepadInput.RIGHT; }; break;
|
||||
case 16: xbox.buttons["home"] = gamepad.buttons[j].pressed; break;
|
||||
default:
|
||||
}
|
||||
}
|
||||
gamepad.xbox = xbox;
|
||||
return gamepad;
|
||||
}
|
||||
}
|
||||
//mapping of XBOX
|
||||
switch (
|
||||
j //I use a switch to ensure that a player with another gamepad could play
|
||||
) {
|
||||
case 0:
|
||||
xbox.buttons["a"] = gamepad.buttons[j].pressed;
|
||||
break;
|
||||
case 1:
|
||||
xbox.buttons["b"] = gamepad.buttons[j].pressed;
|
||||
break;
|
||||
case 2:
|
||||
xbox.buttons["x"] = gamepad.buttons[j].pressed;
|
||||
break;
|
||||
case 3:
|
||||
xbox.buttons["y"] = gamepad.buttons[j].pressed;
|
||||
break;
|
||||
case 4:
|
||||
xbox.buttons["lb"] = gamepad.buttons[j].pressed;
|
||||
break;
|
||||
case 5:
|
||||
xbox.buttons["rb"] = gamepad.buttons[j].pressed;
|
||||
break;
|
||||
case 6:
|
||||
xbox.buttons["lt"] = gamepad.buttons[j].pressed;
|
||||
break;
|
||||
case 7:
|
||||
xbox.buttons["rt"] = gamepad.buttons[j].pressed;
|
||||
break;
|
||||
case 8:
|
||||
xbox.buttons["back"] = gamepad.buttons[j].pressed;
|
||||
break;
|
||||
case 9:
|
||||
xbox.buttons["start"] = gamepad.buttons[j].pressed;
|
||||
break;
|
||||
case 10:
|
||||
xbox.buttons["ls"] = gamepad.buttons[j].pressed;
|
||||
break;
|
||||
case 11:
|
||||
xbox.buttons["rs"] = gamepad.buttons[j].pressed;
|
||||
break;
|
||||
case 12:
|
||||
if (gamepad.buttons[j].pressed) {
|
||||
xbox.hat += "up";
|
||||
xbox.hatmap |= GamepadInput.UP;
|
||||
}
|
||||
break;
|
||||
case 13:
|
||||
if (gamepad.buttons[j].pressed) {
|
||||
xbox.hat += "down";
|
||||
xbox.hatmap |= GamepadInput.DOWN;
|
||||
}
|
||||
break;
|
||||
case 14:
|
||||
if (gamepad.buttons[j].pressed) {
|
||||
xbox.hat += "left";
|
||||
xbox.hatmap |= GamepadInput.LEFT;
|
||||
}
|
||||
break;
|
||||
case 15:
|
||||
if (gamepad.buttons[j].pressed) {
|
||||
xbox.hat += "right";
|
||||
xbox.hatmap |= GamepadInput.RIGHT;
|
||||
}
|
||||
break;
|
||||
case 16:
|
||||
xbox.buttons["home"] = gamepad.buttons[j].pressed;
|
||||
break;
|
||||
default:
|
||||
}
|
||||
}
|
||||
gamepad.xbox = xbox;
|
||||
return gamepad;
|
||||
}
|
||||
};
|
||||
|
||||
GamepadInput.prototype.onDrawBackground = function(ctx)
|
||||
{
|
||||
if(this.flags.collapsed)
|
||||
return;
|
||||
GamepadInput.prototype.onDrawBackground = function(ctx) {
|
||||
if (this.flags.collapsed) return;
|
||||
|
||||
//render gamepad state?
|
||||
var la = this._left_axis;
|
||||
var ra = this._right_axis;
|
||||
ctx.strokeStyle = "#88A";
|
||||
ctx.strokeRect( (la[0] + 1) * 0.5 * this.size[0] - 4, (la[1] + 1) * 0.5 * this.size[1] - 4, 8, 8 );
|
||||
ctx.strokeStyle = "#8A8";
|
||||
ctx.strokeRect( (ra[0] + 1) * 0.5 * this.size[0] - 4, (ra[1] + 1) * 0.5 * this.size[1] - 4, 8, 8 );
|
||||
var h = this.size[1] / this._current_buttons.length
|
||||
ctx.fillStyle = "#AEB";
|
||||
for(var i = 0; i < this._current_buttons.length; ++i)
|
||||
if(this._current_buttons[i])
|
||||
ctx.fillRect( 0, h * i, 6, h);
|
||||
}
|
||||
//render gamepad state?
|
||||
var la = this._left_axis;
|
||||
var ra = this._right_axis;
|
||||
ctx.strokeStyle = "#88A";
|
||||
ctx.strokeRect(
|
||||
(la[0] + 1) * 0.5 * this.size[0] - 4,
|
||||
(la[1] + 1) * 0.5 * this.size[1] - 4,
|
||||
8,
|
||||
8
|
||||
);
|
||||
ctx.strokeStyle = "#8A8";
|
||||
ctx.strokeRect(
|
||||
(ra[0] + 1) * 0.5 * this.size[0] - 4,
|
||||
(ra[1] + 1) * 0.5 * this.size[1] - 4,
|
||||
8,
|
||||
8
|
||||
);
|
||||
var h = this.size[1] / this._current_buttons.length;
|
||||
ctx.fillStyle = "#AEB";
|
||||
for (var i = 0; i < this._current_buttons.length; ++i)
|
||||
if (this._current_buttons[i]) ctx.fillRect(0, h * i, 6, h);
|
||||
};
|
||||
|
||||
GamepadInput.prototype.onGetOutputs = function() {
|
||||
return [
|
||||
["left_axis","vec2"],
|
||||
["right_axis","vec2"],
|
||||
["left_x_axis","number"],
|
||||
["left_y_axis","number"],
|
||||
["right_x_axis","number"],
|
||||
["right_y_axis","number"],
|
||||
["trigger_left","number"],
|
||||
["trigger_right","number"],
|
||||
["a_button","number"],
|
||||
["b_button","number"],
|
||||
["x_button","number"],
|
||||
["y_button","number"],
|
||||
["lb_button","number"],
|
||||
["rb_button","number"],
|
||||
["ls_button","number"],
|
||||
["rs_button","number"],
|
||||
["start_button","number"],
|
||||
["back_button","number"],
|
||||
["hat_left","number"],
|
||||
["hat_right","number"],
|
||||
["hat_up","number"],
|
||||
["hat_down","number"],
|
||||
["hat","number"],
|
||||
["button_pressed", LiteGraph.EVENT]
|
||||
];
|
||||
}
|
||||
GamepadInput.prototype.onGetOutputs = function() {
|
||||
return [
|
||||
["left_axis", "vec2"],
|
||||
["right_axis", "vec2"],
|
||||
["left_x_axis", "number"],
|
||||
["left_y_axis", "number"],
|
||||
["right_x_axis", "number"],
|
||||
["right_y_axis", "number"],
|
||||
["trigger_left", "number"],
|
||||
["trigger_right", "number"],
|
||||
["a_button", "number"],
|
||||
["b_button", "number"],
|
||||
["x_button", "number"],
|
||||
["y_button", "number"],
|
||||
["lb_button", "number"],
|
||||
["rb_button", "number"],
|
||||
["ls_button", "number"],
|
||||
["rs_button", "number"],
|
||||
["start_button", "number"],
|
||||
["back_button", "number"],
|
||||
["hat_left", "number"],
|
||||
["hat_right", "number"],
|
||||
["hat_up", "number"],
|
||||
["hat_down", "number"],
|
||||
["hat", "number"],
|
||||
["button_pressed", LiteGraph.EVENT]
|
||||
];
|
||||
};
|
||||
|
||||
LiteGraph.registerNodeType("input/gamepad", GamepadInput );
|
||||
|
||||
})(this);
|
||||
LiteGraph.registerNodeType("input/gamepad", GamepadInput);
|
||||
})(this);
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,94 +1,78 @@
|
||||
(function(global){
|
||||
var LiteGraph = global.LiteGraph;
|
||||
(function(global) {
|
||||
var LiteGraph = global.LiteGraph;
|
||||
|
||||
function Selector()
|
||||
{
|
||||
this.addInput("sel","number");
|
||||
this.addInput("A");
|
||||
this.addInput("B");
|
||||
this.addInput("C");
|
||||
this.addInput("D");
|
||||
this.addOutput("out");
|
||||
function Selector() {
|
||||
this.addInput("sel", "number");
|
||||
this.addInput("A");
|
||||
this.addInput("B");
|
||||
this.addInput("C");
|
||||
this.addInput("D");
|
||||
this.addOutput("out");
|
||||
|
||||
this.selected = 0;
|
||||
}
|
||||
this.selected = 0;
|
||||
}
|
||||
|
||||
Selector.title = "Selector";
|
||||
Selector.desc = "selects an output";
|
||||
Selector.title = "Selector";
|
||||
Selector.desc = "selects an output";
|
||||
|
||||
Selector.prototype.onDrawBackground = function(ctx)
|
||||
{
|
||||
if(this.flags.collapsed)
|
||||
return;
|
||||
ctx.fillStyle = "#AFB";
|
||||
var y = (this.selected + 1) * LiteGraph.NODE_SLOT_HEIGHT + 6;
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(50, y);
|
||||
ctx.lineTo(50, y+LiteGraph.NODE_SLOT_HEIGHT);
|
||||
ctx.lineTo(34, y+LiteGraph.NODE_SLOT_HEIGHT*0.5);
|
||||
ctx.fill();
|
||||
}
|
||||
Selector.prototype.onDrawBackground = function(ctx) {
|
||||
if (this.flags.collapsed) return;
|
||||
ctx.fillStyle = "#AFB";
|
||||
var y = (this.selected + 1) * LiteGraph.NODE_SLOT_HEIGHT + 6;
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(50, y);
|
||||
ctx.lineTo(50, y + LiteGraph.NODE_SLOT_HEIGHT);
|
||||
ctx.lineTo(34, y + LiteGraph.NODE_SLOT_HEIGHT * 0.5);
|
||||
ctx.fill();
|
||||
};
|
||||
|
||||
Selector.prototype.onExecute = function()
|
||||
{
|
||||
var sel = this.getInputData(0);
|
||||
if(sel == null)
|
||||
sel = 0;
|
||||
this.selected = sel = Math.round(sel) % (this.inputs.length - 1);
|
||||
var v = this.getInputData(sel + 1);
|
||||
if(v !== undefined)
|
||||
this.setOutputData( 0, v );
|
||||
}
|
||||
Selector.prototype.onExecute = function() {
|
||||
var sel = this.getInputData(0);
|
||||
if (sel == null) sel = 0;
|
||||
this.selected = sel = Math.round(sel) % (this.inputs.length - 1);
|
||||
var v = this.getInputData(sel + 1);
|
||||
if (v !== undefined) this.setOutputData(0, v);
|
||||
};
|
||||
|
||||
Selector.prototype.onGetInputs = function() {
|
||||
return [["E",0],["F",0],["G",0],["H",0]];
|
||||
}
|
||||
Selector.prototype.onGetInputs = function() {
|
||||
return [["E", 0], ["F", 0], ["G", 0], ["H", 0]];
|
||||
};
|
||||
|
||||
LiteGraph.registerNodeType("logic/selector", Selector);
|
||||
LiteGraph.registerNodeType("logic/selector", Selector);
|
||||
|
||||
function Sequence() {
|
||||
this.properties = {
|
||||
sequence: "A,B,C"
|
||||
};
|
||||
this.addInput("index", "number");
|
||||
this.addInput("seq");
|
||||
this.addOutput("out");
|
||||
|
||||
this.index = 0;
|
||||
this.values = this.properties.sequence.split(",");
|
||||
}
|
||||
|
||||
function Sequence()
|
||||
{
|
||||
this.properties = {
|
||||
sequence: "A,B,C"
|
||||
};
|
||||
this.addInput("index","number");
|
||||
this.addInput("seq");
|
||||
this.addOutput("out");
|
||||
Sequence.title = "Sequence";
|
||||
Sequence.desc = "select one element from a sequence from a string";
|
||||
|
||||
this.index = 0;
|
||||
this.values = this.properties.sequence.split(",");
|
||||
}
|
||||
Sequence.prototype.onPropertyChanged = function(name, value) {
|
||||
if (name == "sequence") {
|
||||
this.values = value.split(",");
|
||||
}
|
||||
};
|
||||
|
||||
Sequence.title = "Sequence";
|
||||
Sequence.desc = "select one element from a sequence from a string";
|
||||
Sequence.prototype.onExecute = function() {
|
||||
var seq = this.getInputData(1);
|
||||
if (seq && seq != this.current_sequence) {
|
||||
this.values = seq.split(",");
|
||||
this.current_sequence = seq;
|
||||
}
|
||||
var index = this.getInputData(0);
|
||||
if (index == null) index = 0;
|
||||
this.index = index = Math.round(index) % this.values.length;
|
||||
|
||||
Sequence.prototype.onPropertyChanged = function(name,value)
|
||||
{
|
||||
if(name == "sequence")
|
||||
{
|
||||
this.values = value.split(",");
|
||||
}
|
||||
}
|
||||
this.setOutputData(0, this.values[index]);
|
||||
};
|
||||
|
||||
Sequence.prototype.onExecute = function()
|
||||
{
|
||||
var seq = this.getInputData(1);
|
||||
if(seq && seq != this.current_sequence)
|
||||
{
|
||||
this.values = seq.split(",");
|
||||
this.current_sequence = seq;
|
||||
}
|
||||
var index = this.getInputData(0);
|
||||
if(index == null)
|
||||
index = 0;
|
||||
this.index = index = Math.round(index) % this.values.length;
|
||||
|
||||
this.setOutputData( 0, this.values[ index ] );
|
||||
}
|
||||
|
||||
|
||||
LiteGraph.registerNodeType("logic/sequence", Sequence );
|
||||
|
||||
})(this);
|
||||
LiteGraph.registerNodeType("logic/sequence", Sequence);
|
||||
})(this);
|
||||
|
||||
2418
src/nodes/math.js
2418
src/nodes/math.js
File diff suppressed because it is too large
Load Diff
@@ -1,450 +1,402 @@
|
||||
(function(global){
|
||||
var LiteGraph = global.LiteGraph;
|
||||
|
||||
function Math3DVec2ToXYZ()
|
||||
{
|
||||
this.addInput("vec2","vec2");
|
||||
this.addOutput("x","number");
|
||||
this.addOutput("y","number");
|
||||
}
|
||||
|
||||
Math3DVec2ToXYZ.title = "Vec2->XY";
|
||||
Math3DVec2ToXYZ.desc = "vector 2 to components";
|
||||
|
||||
Math3DVec2ToXYZ.prototype.onExecute = function()
|
||||
{
|
||||
var v = this.getInputData(0);
|
||||
if(v == null) return;
|
||||
|
||||
this.setOutputData( 0, v[0] );
|
||||
this.setOutputData( 1, v[1] );
|
||||
}
|
||||
|
||||
LiteGraph.registerNodeType("math3d/vec2-to-xyz", Math3DVec2ToXYZ );
|
||||
|
||||
|
||||
function Math3DXYToVec2()
|
||||
{
|
||||
this.addInputs([["x","number"],["y","number"]]);
|
||||
this.addOutput("vec2","vec2");
|
||||
this.properties = {x:0, y:0};
|
||||
this._data = new Float32Array(2);
|
||||
}
|
||||
|
||||
Math3DXYToVec2.title = "XY->Vec2";
|
||||
Math3DXYToVec2.desc = "components to vector2";
|
||||
|
||||
Math3DXYToVec2.prototype.onExecute = function()
|
||||
{
|
||||
var x = this.getInputData(0);
|
||||
if(x == null) x = this.properties.x;
|
||||
var y = this.getInputData(1);
|
||||
if(y == null) y = this.properties.y;
|
||||
|
||||
var data = this._data;
|
||||
data[0] = x;
|
||||
data[1] = y;
|
||||
|
||||
this.setOutputData( 0, data );
|
||||
}
|
||||
|
||||
LiteGraph.registerNodeType("math3d/xy-to-vec2", Math3DXYToVec2 );
|
||||
|
||||
|
||||
|
||||
|
||||
function Math3DVec3ToXYZ()
|
||||
{
|
||||
this.addInput("vec3","vec3");
|
||||
this.addOutput("x","number");
|
||||
this.addOutput("y","number");
|
||||
this.addOutput("z","number");
|
||||
}
|
||||
|
||||
Math3DVec3ToXYZ.title = "Vec3->XYZ";
|
||||
Math3DVec3ToXYZ.desc = "vector 3 to components";
|
||||
|
||||
Math3DVec3ToXYZ.prototype.onExecute = function()
|
||||
{
|
||||
var v = this.getInputData(0);
|
||||
if(v == null) return;
|
||||
|
||||
this.setOutputData( 0, v[0] );
|
||||
this.setOutputData( 1, v[1] );
|
||||
this.setOutputData( 2, v[2] );
|
||||
}
|
||||
|
||||
LiteGraph.registerNodeType("math3d/vec3-to-xyz", Math3DVec3ToXYZ );
|
||||
|
||||
|
||||
function Math3DXYZToVec3()
|
||||
{
|
||||
this.addInputs([["x","number"],["y","number"],["z","number"]]);
|
||||
this.addOutput("vec3","vec3");
|
||||
this.properties = {x:0, y:0, z:0};
|
||||
this._data = new Float32Array(3);
|
||||
}
|
||||
|
||||
Math3DXYZToVec3.title = "XYZ->Vec3";
|
||||
Math3DXYZToVec3.desc = "components to vector3";
|
||||
|
||||
Math3DXYZToVec3.prototype.onExecute = function()
|
||||
{
|
||||
var x = this.getInputData(0);
|
||||
if(x == null) x = this.properties.x;
|
||||
var y = this.getInputData(1);
|
||||
if(y == null) y = this.properties.y;
|
||||
var z = this.getInputData(2);
|
||||
if(z == null) z = this.properties.z;
|
||||
|
||||
var data = this._data;
|
||||
data[0] = x;
|
||||
data[1] = y;
|
||||
data[2] = z;
|
||||
|
||||
this.setOutputData( 0, data );
|
||||
}
|
||||
|
||||
LiteGraph.registerNodeType("math3d/xyz-to-vec3", Math3DXYZToVec3 );
|
||||
|
||||
|
||||
|
||||
function Math3DVec4ToXYZW()
|
||||
{
|
||||
this.addInput("vec4","vec4");
|
||||
this.addOutput("x","number");
|
||||
this.addOutput("y","number");
|
||||
this.addOutput("z","number");
|
||||
this.addOutput("w","number");
|
||||
}
|
||||
|
||||
Math3DVec4ToXYZW.title = "Vec4->XYZW";
|
||||
Math3DVec4ToXYZW.desc = "vector 4 to components";
|
||||
|
||||
Math3DVec4ToXYZW.prototype.onExecute = function()
|
||||
{
|
||||
var v = this.getInputData(0);
|
||||
if(v == null) return;
|
||||
|
||||
this.setOutputData( 0, v[0] );
|
||||
this.setOutputData( 1, v[1] );
|
||||
this.setOutputData( 2, v[2] );
|
||||
this.setOutputData( 3, v[3] );
|
||||
}
|
||||
|
||||
LiteGraph.registerNodeType("math3d/vec4-to-xyzw", Math3DVec4ToXYZW );
|
||||
|
||||
|
||||
function Math3DXYZWToVec4()
|
||||
{
|
||||
this.addInputs([["x","number"],["y","number"],["z","number"],["w","number"]]);
|
||||
this.addOutput("vec4","vec4");
|
||||
this.properties = {x:0, y:0, z:0, w:0};
|
||||
this._data = new Float32Array(4);
|
||||
}
|
||||
|
||||
Math3DXYZWToVec4.title = "XYZW->Vec4";
|
||||
Math3DXYZWToVec4.desc = "components to vector4";
|
||||
|
||||
Math3DXYZWToVec4.prototype.onExecute = function()
|
||||
{
|
||||
var x = this.getInputData(0);
|
||||
if(x == null) x = this.properties.x;
|
||||
var y = this.getInputData(1);
|
||||
if(y == null) y = this.properties.y;
|
||||
var z = this.getInputData(2);
|
||||
if(z == null) z = this.properties.z;
|
||||
var w = this.getInputData(3);
|
||||
if(w == null) w = this.properties.w;
|
||||
|
||||
var data = this._data;
|
||||
data[0] = x;
|
||||
data[1] = y;
|
||||
data[2] = z;
|
||||
data[3] = w;
|
||||
|
||||
this.setOutputData( 0, data );
|
||||
}
|
||||
|
||||
LiteGraph.registerNodeType("math3d/xyzw-to-vec4", Math3DXYZWToVec4 );
|
||||
|
||||
|
||||
|
||||
function Math3DVec3Scale()
|
||||
{
|
||||
this.addInput("in","vec3");
|
||||
this.addInput("f","number");
|
||||
this.addOutput("out","vec3");
|
||||
this.properties = {f:1};
|
||||
this._data = new Float32Array(3);
|
||||
}
|
||||
|
||||
Math3DVec3Scale.title = "vec3_scale";
|
||||
Math3DVec3Scale.desc = "scales the components of a vec3";
|
||||
|
||||
Math3DVec3Scale.prototype.onExecute = function()
|
||||
{
|
||||
var v = this.getInputData(0);
|
||||
if(v == null)
|
||||
return;
|
||||
var f = this.getInputData(1);
|
||||
if(f == null) f = this.properties.f;
|
||||
|
||||
var data = this._data;
|
||||
data[0] = v[0] * f;
|
||||
data[1] = v[1] * f;
|
||||
data[2] = v[2] * f;
|
||||
this.setOutputData( 0, data );
|
||||
}
|
||||
|
||||
LiteGraph.registerNodeType("math3d/vec3-scale", Math3DVec3Scale );
|
||||
|
||||
function Math3DVec3Length()
|
||||
{
|
||||
this.addInput("in","vec3");
|
||||
this.addOutput("out","number");
|
||||
}
|
||||
|
||||
Math3DVec3Length.title = "vec3_length";
|
||||
Math3DVec3Length.desc = "returns the module of a vector";
|
||||
|
||||
Math3DVec3Length.prototype.onExecute = function()
|
||||
{
|
||||
var v = this.getInputData(0);
|
||||
if(v == null)
|
||||
return;
|
||||
var dist = Math.sqrt( v[0]*v[0] + v[1]*v[1] + v[2]*v[2] );
|
||||
this.setOutputData( 0, dist );
|
||||
}
|
||||
|
||||
LiteGraph.registerNodeType("math3d/vec3-length", Math3DVec3Length );
|
||||
|
||||
function Math3DVec3Normalize()
|
||||
{
|
||||
this.addInput("in","vec3");
|
||||
this.addOutput("out","vec3");
|
||||
this._data = new Float32Array(3);
|
||||
}
|
||||
|
||||
Math3DVec3Normalize.title = "vec3_normalize";
|
||||
Math3DVec3Normalize.desc = "returns the vector normalized";
|
||||
|
||||
Math3DVec3Normalize.prototype.onExecute = function()
|
||||
{
|
||||
var v = this.getInputData(0);
|
||||
if(v == null)
|
||||
return;
|
||||
var dist = Math.sqrt( v[0]*v[0] + v[1]*v[1] + v[2]*v[2] );
|
||||
var data = this._data;
|
||||
data[0] = v[0] / dist;
|
||||
data[1] = v[1] / dist;
|
||||
data[2] = v[2] / dist;
|
||||
|
||||
this.setOutputData( 0, data );
|
||||
}
|
||||
|
||||
LiteGraph.registerNodeType("math3d/vec3-normalize", Math3DVec3Normalize );
|
||||
|
||||
function Math3DVec3Lerp()
|
||||
{
|
||||
this.addInput("A","vec3");
|
||||
this.addInput("B","vec3");
|
||||
this.addInput("f","vec3");
|
||||
this.addOutput("out","vec3");
|
||||
this.properties = { f: 0.5 };
|
||||
this._data = new Float32Array(3);
|
||||
}
|
||||
|
||||
Math3DVec3Lerp.title = "vec3_lerp";
|
||||
Math3DVec3Lerp.desc = "returns the interpolated vector";
|
||||
|
||||
Math3DVec3Lerp.prototype.onExecute = function()
|
||||
{
|
||||
var A = this.getInputData(0);
|
||||
if(A == null)
|
||||
return;
|
||||
var B = this.getInputData(1);
|
||||
if(B == null)
|
||||
return;
|
||||
var f = this.getInputOrProperty("f");
|
||||
|
||||
var data = this._data;
|
||||
data[0] = A[0] * (1-f) + B[0] * f;
|
||||
data[1] = A[1] * (1-f) + B[1] * f;
|
||||
data[2] = A[2] * (1-f) + B[2] * f;
|
||||
|
||||
this.setOutputData( 0, data );
|
||||
}
|
||||
|
||||
LiteGraph.registerNodeType("math3d/vec3-lerp", Math3DVec3Lerp );
|
||||
|
||||
|
||||
function Math3DVec3Dot()
|
||||
{
|
||||
this.addInput("A","vec3");
|
||||
this.addInput("B","vec3");
|
||||
this.addOutput("out","number");
|
||||
}
|
||||
|
||||
Math3DVec3Dot.title = "vec3_dot";
|
||||
Math3DVec3Dot.desc = "returns the dot product";
|
||||
|
||||
Math3DVec3Dot.prototype.onExecute = function()
|
||||
{
|
||||
var A = this.getInputData(0);
|
||||
if(A == null)
|
||||
return;
|
||||
var B = this.getInputData(1);
|
||||
if(B == null)
|
||||
return;
|
||||
|
||||
var dot = A[0] * B[0] + A[1] * B[1] + A[2] * B[2];
|
||||
this.setOutputData( 0, dot );
|
||||
}
|
||||
|
||||
LiteGraph.registerNodeType("math3d/vec3-dot", Math3DVec3Dot );
|
||||
|
||||
|
||||
//if glMatrix is installed...
|
||||
if(global.glMatrix)
|
||||
{
|
||||
|
||||
function Math3DQuaternion()
|
||||
{
|
||||
this.addOutput("quat","quat");
|
||||
this.properties = { x:0, y:0, z:0, w: 1, normalize: false };
|
||||
this._value = quat.create();
|
||||
}
|
||||
|
||||
Math3DQuaternion.title = "Quaternion";
|
||||
Math3DQuaternion.desc = "quaternion";
|
||||
|
||||
Math3DQuaternion.prototype.onExecute = function()
|
||||
{
|
||||
this._value[0] = this.getInputOrProperty("x");
|
||||
this._value[1] = this.getInputOrProperty("y");
|
||||
this._value[2] = this.getInputOrProperty("z");
|
||||
this._value[3] = this.getInputOrProperty("w");
|
||||
if( this.properties.normalize )
|
||||
quat.normalize( this._value, this._value );
|
||||
this.setOutputData( 0, this._value );
|
||||
}
|
||||
|
||||
Math3DQuaternion.prototype.onGetInputs = function(){
|
||||
return [["x","number"],["y","number"],["z","number"],["w","number"]];
|
||||
}
|
||||
|
||||
LiteGraph.registerNodeType("math3d/quaternion", Math3DQuaternion );
|
||||
|
||||
|
||||
function Math3DRotation()
|
||||
{
|
||||
this.addInputs([["degrees","number"],["axis","vec3"]]);
|
||||
this.addOutput("quat","quat");
|
||||
this.properties = { angle:90.0, axis: vec3.fromValues(0,1,0) };
|
||||
|
||||
this._value = quat.create();
|
||||
}
|
||||
|
||||
Math3DRotation.title = "Rotation";
|
||||
Math3DRotation.desc = "quaternion rotation";
|
||||
|
||||
Math3DRotation.prototype.onExecute = function()
|
||||
{
|
||||
var angle = this.getInputData(0);
|
||||
if(angle == null) angle = this.properties.angle;
|
||||
var axis = this.getInputData(1);
|
||||
if(axis == null) axis = this.properties.axis;
|
||||
|
||||
var R = quat.setAxisAngle( this._value, axis, angle * 0.0174532925 );
|
||||
this.setOutputData( 0, R );
|
||||
}
|
||||
|
||||
|
||||
LiteGraph.registerNodeType("math3d/rotation", Math3DRotation );
|
||||
|
||||
|
||||
//Math3D rotate vec3
|
||||
function Math3DRotateVec3()
|
||||
{
|
||||
this.addInputs([["vec3","vec3"],["quat","quat"]]);
|
||||
this.addOutput("result","vec3");
|
||||
this.properties = { vec: [0,0,1] };
|
||||
}
|
||||
|
||||
Math3DRotateVec3.title = "Rot. Vec3";
|
||||
Math3DRotateVec3.desc = "rotate a point";
|
||||
|
||||
Math3DRotateVec3.prototype.onExecute = function()
|
||||
{
|
||||
var vec = this.getInputData(0);
|
||||
if(vec == null) vec = this.properties.vec;
|
||||
var quat = this.getInputData(1);
|
||||
if(quat == null)
|
||||
this.setOutputData(vec);
|
||||
else
|
||||
this.setOutputData( 0, vec3.transformQuat( vec3.create(), vec, quat ) );
|
||||
}
|
||||
|
||||
LiteGraph.registerNodeType("math3d/rotate_vec3", Math3DRotateVec3);
|
||||
|
||||
|
||||
|
||||
function Math3DMultQuat()
|
||||
{
|
||||
this.addInputs( [["A","quat"],["B","quat"]] );
|
||||
this.addOutput( "A*B","quat" );
|
||||
|
||||
this._value = quat.create();
|
||||
}
|
||||
|
||||
Math3DMultQuat.title = "Mult. Quat";
|
||||
Math3DMultQuat.desc = "rotate quaternion";
|
||||
|
||||
Math3DMultQuat.prototype.onExecute = function()
|
||||
{
|
||||
var A = this.getInputData(0);
|
||||
if(A == null) return;
|
||||
var B = this.getInputData(1);
|
||||
if(B == null) return;
|
||||
|
||||
var R = quat.multiply( this._value, A, B );
|
||||
this.setOutputData( 0, R );
|
||||
}
|
||||
|
||||
LiteGraph.registerNodeType("math3d/mult-quat", Math3DMultQuat );
|
||||
|
||||
|
||||
function Math3DQuatSlerp()
|
||||
{
|
||||
this.addInputs( [["A","quat"],["B","quat"],["factor","number"]] );
|
||||
this.addOutput( "slerp","quat" );
|
||||
this.addProperty( "factor", 0.5 );
|
||||
|
||||
this._value = quat.create();
|
||||
}
|
||||
|
||||
Math3DQuatSlerp.title = "Quat Slerp";
|
||||
Math3DQuatSlerp.desc = "quaternion spherical interpolation";
|
||||
|
||||
Math3DQuatSlerp.prototype.onExecute = function()
|
||||
{
|
||||
var A = this.getInputData(0);
|
||||
if(A == null)
|
||||
return;
|
||||
var B = this.getInputData(1);
|
||||
if(B == null)
|
||||
return;
|
||||
var factor = this.properties.factor;
|
||||
if( this.getInputData(2) != null )
|
||||
factor = this.getInputData(2);
|
||||
|
||||
var R = quat.slerp( this._value, A, B, factor );
|
||||
this.setOutputData( 0, R );
|
||||
}
|
||||
|
||||
LiteGraph.registerNodeType("math3d/quat-slerp", Math3DQuatSlerp );
|
||||
|
||||
} //glMatrix
|
||||
|
||||
})(this);
|
||||
(function(global) {
|
||||
var LiteGraph = global.LiteGraph;
|
||||
|
||||
function Math3DVec2ToXYZ() {
|
||||
this.addInput("vec2", "vec2");
|
||||
this.addOutput("x", "number");
|
||||
this.addOutput("y", "number");
|
||||
}
|
||||
|
||||
Math3DVec2ToXYZ.title = "Vec2->XY";
|
||||
Math3DVec2ToXYZ.desc = "vector 2 to components";
|
||||
|
||||
Math3DVec2ToXYZ.prototype.onExecute = function() {
|
||||
var v = this.getInputData(0);
|
||||
if (v == null) return;
|
||||
|
||||
this.setOutputData(0, v[0]);
|
||||
this.setOutputData(1, v[1]);
|
||||
};
|
||||
|
||||
LiteGraph.registerNodeType("math3d/vec2-to-xyz", Math3DVec2ToXYZ);
|
||||
|
||||
function Math3DXYToVec2() {
|
||||
this.addInputs([["x", "number"], ["y", "number"]]);
|
||||
this.addOutput("vec2", "vec2");
|
||||
this.properties = { x: 0, y: 0 };
|
||||
this._data = new Float32Array(2);
|
||||
}
|
||||
|
||||
Math3DXYToVec2.title = "XY->Vec2";
|
||||
Math3DXYToVec2.desc = "components to vector2";
|
||||
|
||||
Math3DXYToVec2.prototype.onExecute = function() {
|
||||
var x = this.getInputData(0);
|
||||
if (x == null) x = this.properties.x;
|
||||
var y = this.getInputData(1);
|
||||
if (y == null) y = this.properties.y;
|
||||
|
||||
var data = this._data;
|
||||
data[0] = x;
|
||||
data[1] = y;
|
||||
|
||||
this.setOutputData(0, data);
|
||||
};
|
||||
|
||||
LiteGraph.registerNodeType("math3d/xy-to-vec2", Math3DXYToVec2);
|
||||
|
||||
function Math3DVec3ToXYZ() {
|
||||
this.addInput("vec3", "vec3");
|
||||
this.addOutput("x", "number");
|
||||
this.addOutput("y", "number");
|
||||
this.addOutput("z", "number");
|
||||
}
|
||||
|
||||
Math3DVec3ToXYZ.title = "Vec3->XYZ";
|
||||
Math3DVec3ToXYZ.desc = "vector 3 to components";
|
||||
|
||||
Math3DVec3ToXYZ.prototype.onExecute = function() {
|
||||
var v = this.getInputData(0);
|
||||
if (v == null) return;
|
||||
|
||||
this.setOutputData(0, v[0]);
|
||||
this.setOutputData(1, v[1]);
|
||||
this.setOutputData(2, v[2]);
|
||||
};
|
||||
|
||||
LiteGraph.registerNodeType("math3d/vec3-to-xyz", Math3DVec3ToXYZ);
|
||||
|
||||
function Math3DXYZToVec3() {
|
||||
this.addInputs([["x", "number"], ["y", "number"], ["z", "number"]]);
|
||||
this.addOutput("vec3", "vec3");
|
||||
this.properties = { x: 0, y: 0, z: 0 };
|
||||
this._data = new Float32Array(3);
|
||||
}
|
||||
|
||||
Math3DXYZToVec3.title = "XYZ->Vec3";
|
||||
Math3DXYZToVec3.desc = "components to vector3";
|
||||
|
||||
Math3DXYZToVec3.prototype.onExecute = function() {
|
||||
var x = this.getInputData(0);
|
||||
if (x == null) x = this.properties.x;
|
||||
var y = this.getInputData(1);
|
||||
if (y == null) y = this.properties.y;
|
||||
var z = this.getInputData(2);
|
||||
if (z == null) z = this.properties.z;
|
||||
|
||||
var data = this._data;
|
||||
data[0] = x;
|
||||
data[1] = y;
|
||||
data[2] = z;
|
||||
|
||||
this.setOutputData(0, data);
|
||||
};
|
||||
|
||||
LiteGraph.registerNodeType("math3d/xyz-to-vec3", Math3DXYZToVec3);
|
||||
|
||||
function Math3DVec4ToXYZW() {
|
||||
this.addInput("vec4", "vec4");
|
||||
this.addOutput("x", "number");
|
||||
this.addOutput("y", "number");
|
||||
this.addOutput("z", "number");
|
||||
this.addOutput("w", "number");
|
||||
}
|
||||
|
||||
Math3DVec4ToXYZW.title = "Vec4->XYZW";
|
||||
Math3DVec4ToXYZW.desc = "vector 4 to components";
|
||||
|
||||
Math3DVec4ToXYZW.prototype.onExecute = function() {
|
||||
var v = this.getInputData(0);
|
||||
if (v == null) return;
|
||||
|
||||
this.setOutputData(0, v[0]);
|
||||
this.setOutputData(1, v[1]);
|
||||
this.setOutputData(2, v[2]);
|
||||
this.setOutputData(3, v[3]);
|
||||
};
|
||||
|
||||
LiteGraph.registerNodeType("math3d/vec4-to-xyzw", Math3DVec4ToXYZW);
|
||||
|
||||
function Math3DXYZWToVec4() {
|
||||
this.addInputs([
|
||||
["x", "number"],
|
||||
["y", "number"],
|
||||
["z", "number"],
|
||||
["w", "number"]
|
||||
]);
|
||||
this.addOutput("vec4", "vec4");
|
||||
this.properties = { x: 0, y: 0, z: 0, w: 0 };
|
||||
this._data = new Float32Array(4);
|
||||
}
|
||||
|
||||
Math3DXYZWToVec4.title = "XYZW->Vec4";
|
||||
Math3DXYZWToVec4.desc = "components to vector4";
|
||||
|
||||
Math3DXYZWToVec4.prototype.onExecute = function() {
|
||||
var x = this.getInputData(0);
|
||||
if (x == null) x = this.properties.x;
|
||||
var y = this.getInputData(1);
|
||||
if (y == null) y = this.properties.y;
|
||||
var z = this.getInputData(2);
|
||||
if (z == null) z = this.properties.z;
|
||||
var w = this.getInputData(3);
|
||||
if (w == null) w = this.properties.w;
|
||||
|
||||
var data = this._data;
|
||||
data[0] = x;
|
||||
data[1] = y;
|
||||
data[2] = z;
|
||||
data[3] = w;
|
||||
|
||||
this.setOutputData(0, data);
|
||||
};
|
||||
|
||||
LiteGraph.registerNodeType("math3d/xyzw-to-vec4", Math3DXYZWToVec4);
|
||||
|
||||
function Math3DVec3Scale() {
|
||||
this.addInput("in", "vec3");
|
||||
this.addInput("f", "number");
|
||||
this.addOutput("out", "vec3");
|
||||
this.properties = { f: 1 };
|
||||
this._data = new Float32Array(3);
|
||||
}
|
||||
|
||||
Math3DVec3Scale.title = "vec3_scale";
|
||||
Math3DVec3Scale.desc = "scales the components of a vec3";
|
||||
|
||||
Math3DVec3Scale.prototype.onExecute = function() {
|
||||
var v = this.getInputData(0);
|
||||
if (v == null) return;
|
||||
var f = this.getInputData(1);
|
||||
if (f == null) f = this.properties.f;
|
||||
|
||||
var data = this._data;
|
||||
data[0] = v[0] * f;
|
||||
data[1] = v[1] * f;
|
||||
data[2] = v[2] * f;
|
||||
this.setOutputData(0, data);
|
||||
};
|
||||
|
||||
LiteGraph.registerNodeType("math3d/vec3-scale", Math3DVec3Scale);
|
||||
|
||||
function Math3DVec3Length() {
|
||||
this.addInput("in", "vec3");
|
||||
this.addOutput("out", "number");
|
||||
}
|
||||
|
||||
Math3DVec3Length.title = "vec3_length";
|
||||
Math3DVec3Length.desc = "returns the module of a vector";
|
||||
|
||||
Math3DVec3Length.prototype.onExecute = function() {
|
||||
var v = this.getInputData(0);
|
||||
if (v == null) return;
|
||||
var dist = Math.sqrt(v[0] * v[0] + v[1] * v[1] + v[2] * v[2]);
|
||||
this.setOutputData(0, dist);
|
||||
};
|
||||
|
||||
LiteGraph.registerNodeType("math3d/vec3-length", Math3DVec3Length);
|
||||
|
||||
function Math3DVec3Normalize() {
|
||||
this.addInput("in", "vec3");
|
||||
this.addOutput("out", "vec3");
|
||||
this._data = new Float32Array(3);
|
||||
}
|
||||
|
||||
Math3DVec3Normalize.title = "vec3_normalize";
|
||||
Math3DVec3Normalize.desc = "returns the vector normalized";
|
||||
|
||||
Math3DVec3Normalize.prototype.onExecute = function() {
|
||||
var v = this.getInputData(0);
|
||||
if (v == null) return;
|
||||
var dist = Math.sqrt(v[0] * v[0] + v[1] * v[1] + v[2] * v[2]);
|
||||
var data = this._data;
|
||||
data[0] = v[0] / dist;
|
||||
data[1] = v[1] / dist;
|
||||
data[2] = v[2] / dist;
|
||||
|
||||
this.setOutputData(0, data);
|
||||
};
|
||||
|
||||
LiteGraph.registerNodeType("math3d/vec3-normalize", Math3DVec3Normalize);
|
||||
|
||||
function Math3DVec3Lerp() {
|
||||
this.addInput("A", "vec3");
|
||||
this.addInput("B", "vec3");
|
||||
this.addInput("f", "vec3");
|
||||
this.addOutput("out", "vec3");
|
||||
this.properties = { f: 0.5 };
|
||||
this._data = new Float32Array(3);
|
||||
}
|
||||
|
||||
Math3DVec3Lerp.title = "vec3_lerp";
|
||||
Math3DVec3Lerp.desc = "returns the interpolated vector";
|
||||
|
||||
Math3DVec3Lerp.prototype.onExecute = function() {
|
||||
var A = this.getInputData(0);
|
||||
if (A == null) return;
|
||||
var B = this.getInputData(1);
|
||||
if (B == null) return;
|
||||
var f = this.getInputOrProperty("f");
|
||||
|
||||
var data = this._data;
|
||||
data[0] = A[0] * (1 - f) + B[0] * f;
|
||||
data[1] = A[1] * (1 - f) + B[1] * f;
|
||||
data[2] = A[2] * (1 - f) + B[2] * f;
|
||||
|
||||
this.setOutputData(0, data);
|
||||
};
|
||||
|
||||
LiteGraph.registerNodeType("math3d/vec3-lerp", Math3DVec3Lerp);
|
||||
|
||||
function Math3DVec3Dot() {
|
||||
this.addInput("A", "vec3");
|
||||
this.addInput("B", "vec3");
|
||||
this.addOutput("out", "number");
|
||||
}
|
||||
|
||||
Math3DVec3Dot.title = "vec3_dot";
|
||||
Math3DVec3Dot.desc = "returns the dot product";
|
||||
|
||||
Math3DVec3Dot.prototype.onExecute = function() {
|
||||
var A = this.getInputData(0);
|
||||
if (A == null) return;
|
||||
var B = this.getInputData(1);
|
||||
if (B == null) return;
|
||||
|
||||
var dot = A[0] * B[0] + A[1] * B[1] + A[2] * B[2];
|
||||
this.setOutputData(0, dot);
|
||||
};
|
||||
|
||||
LiteGraph.registerNodeType("math3d/vec3-dot", Math3DVec3Dot);
|
||||
|
||||
//if glMatrix is installed...
|
||||
if (global.glMatrix) {
|
||||
function Math3DQuaternion() {
|
||||
this.addOutput("quat", "quat");
|
||||
this.properties = { x: 0, y: 0, z: 0, w: 1, normalize: false };
|
||||
this._value = quat.create();
|
||||
}
|
||||
|
||||
Math3DQuaternion.title = "Quaternion";
|
||||
Math3DQuaternion.desc = "quaternion";
|
||||
|
||||
Math3DQuaternion.prototype.onExecute = function() {
|
||||
this._value[0] = this.getInputOrProperty("x");
|
||||
this._value[1] = this.getInputOrProperty("y");
|
||||
this._value[2] = this.getInputOrProperty("z");
|
||||
this._value[3] = this.getInputOrProperty("w");
|
||||
if (this.properties.normalize)
|
||||
quat.normalize(this._value, this._value);
|
||||
this.setOutputData(0, this._value);
|
||||
};
|
||||
|
||||
Math3DQuaternion.prototype.onGetInputs = function() {
|
||||
return [
|
||||
["x", "number"],
|
||||
["y", "number"],
|
||||
["z", "number"],
|
||||
["w", "number"]
|
||||
];
|
||||
};
|
||||
|
||||
LiteGraph.registerNodeType("math3d/quaternion", Math3DQuaternion);
|
||||
|
||||
function Math3DRotation() {
|
||||
this.addInputs([["degrees", "number"], ["axis", "vec3"]]);
|
||||
this.addOutput("quat", "quat");
|
||||
this.properties = { angle: 90.0, axis: vec3.fromValues(0, 1, 0) };
|
||||
|
||||
this._value = quat.create();
|
||||
}
|
||||
|
||||
Math3DRotation.title = "Rotation";
|
||||
Math3DRotation.desc = "quaternion rotation";
|
||||
|
||||
Math3DRotation.prototype.onExecute = function() {
|
||||
var angle = this.getInputData(0);
|
||||
if (angle == null) angle = this.properties.angle;
|
||||
var axis = this.getInputData(1);
|
||||
if (axis == null) axis = this.properties.axis;
|
||||
|
||||
var R = quat.setAxisAngle(this._value, axis, angle * 0.0174532925);
|
||||
this.setOutputData(0, R);
|
||||
};
|
||||
|
||||
LiteGraph.registerNodeType("math3d/rotation", Math3DRotation);
|
||||
|
||||
//Math3D rotate vec3
|
||||
function Math3DRotateVec3() {
|
||||
this.addInputs([["vec3", "vec3"], ["quat", "quat"]]);
|
||||
this.addOutput("result", "vec3");
|
||||
this.properties = { vec: [0, 0, 1] };
|
||||
}
|
||||
|
||||
Math3DRotateVec3.title = "Rot. Vec3";
|
||||
Math3DRotateVec3.desc = "rotate a point";
|
||||
|
||||
Math3DRotateVec3.prototype.onExecute = function() {
|
||||
var vec = this.getInputData(0);
|
||||
if (vec == null) vec = this.properties.vec;
|
||||
var quat = this.getInputData(1);
|
||||
if (quat == null) this.setOutputData(vec);
|
||||
else
|
||||
this.setOutputData(
|
||||
0,
|
||||
vec3.transformQuat(vec3.create(), vec, quat)
|
||||
);
|
||||
};
|
||||
|
||||
LiteGraph.registerNodeType("math3d/rotate_vec3", Math3DRotateVec3);
|
||||
|
||||
function Math3DMultQuat() {
|
||||
this.addInputs([["A", "quat"], ["B", "quat"]]);
|
||||
this.addOutput("A*B", "quat");
|
||||
|
||||
this._value = quat.create();
|
||||
}
|
||||
|
||||
Math3DMultQuat.title = "Mult. Quat";
|
||||
Math3DMultQuat.desc = "rotate quaternion";
|
||||
|
||||
Math3DMultQuat.prototype.onExecute = function() {
|
||||
var A = this.getInputData(0);
|
||||
if (A == null) return;
|
||||
var B = this.getInputData(1);
|
||||
if (B == null) return;
|
||||
|
||||
var R = quat.multiply(this._value, A, B);
|
||||
this.setOutputData(0, R);
|
||||
};
|
||||
|
||||
LiteGraph.registerNodeType("math3d/mult-quat", Math3DMultQuat);
|
||||
|
||||
function Math3DQuatSlerp() {
|
||||
this.addInputs([
|
||||
["A", "quat"],
|
||||
["B", "quat"],
|
||||
["factor", "number"]
|
||||
]);
|
||||
this.addOutput("slerp", "quat");
|
||||
this.addProperty("factor", 0.5);
|
||||
|
||||
this._value = quat.create();
|
||||
}
|
||||
|
||||
Math3DQuatSlerp.title = "Quat Slerp";
|
||||
Math3DQuatSlerp.desc = "quaternion spherical interpolation";
|
||||
|
||||
Math3DQuatSlerp.prototype.onExecute = function() {
|
||||
var A = this.getInputData(0);
|
||||
if (A == null) return;
|
||||
var B = this.getInputData(1);
|
||||
if (B == null) return;
|
||||
var factor = this.properties.factor;
|
||||
if (this.getInputData(2) != null) factor = this.getInputData(2);
|
||||
|
||||
var R = quat.slerp(this._value, A, B, factor);
|
||||
this.setOutputData(0, R);
|
||||
};
|
||||
|
||||
LiteGraph.registerNodeType("math3d/quat-slerp", Math3DQuatSlerp);
|
||||
} //glMatrix
|
||||
})(this);
|
||||
|
||||
2538
src/nodes/midi.js
2538
src/nodes/midi.js
File diff suppressed because it is too large
Load Diff
@@ -1,337 +1,288 @@
|
||||
//event related nodes
|
||||
(function(global){
|
||||
var LiteGraph = global.LiteGraph;
|
||||
(function(global) {
|
||||
var LiteGraph = global.LiteGraph;
|
||||
|
||||
function LGWebSocket()
|
||||
{
|
||||
this.size = [60,20];
|
||||
this.addInput("send", LiteGraph.ACTION);
|
||||
this.addOutput("received", LiteGraph.EVENT);
|
||||
this.addInput("in", 0 );
|
||||
this.addOutput("out", 0 );
|
||||
this.properties = {
|
||||
url: "",
|
||||
room: "lgraph", //allows to filter messages,
|
||||
only_send_changes: true
|
||||
};
|
||||
this._ws = null;
|
||||
this._last_sent_data = [];
|
||||
this._last_received_data = [];
|
||||
}
|
||||
function LGWebSocket() {
|
||||
this.size = [60, 20];
|
||||
this.addInput("send", LiteGraph.ACTION);
|
||||
this.addOutput("received", LiteGraph.EVENT);
|
||||
this.addInput("in", 0);
|
||||
this.addOutput("out", 0);
|
||||
this.properties = {
|
||||
url: "",
|
||||
room: "lgraph", //allows to filter messages,
|
||||
only_send_changes: true
|
||||
};
|
||||
this._ws = null;
|
||||
this._last_sent_data = [];
|
||||
this._last_received_data = [];
|
||||
}
|
||||
|
||||
LGWebSocket.title = "WebSocket";
|
||||
LGWebSocket.desc = "Send data through a websocket";
|
||||
LGWebSocket.title = "WebSocket";
|
||||
LGWebSocket.desc = "Send data through a websocket";
|
||||
|
||||
LGWebSocket.prototype.onPropertyChanged = function(name,value)
|
||||
{
|
||||
if(name == "url")
|
||||
this.connectSocket();
|
||||
}
|
||||
LGWebSocket.prototype.onPropertyChanged = function(name, value) {
|
||||
if (name == "url") this.connectSocket();
|
||||
};
|
||||
|
||||
LGWebSocket.prototype.onExecute = function()
|
||||
{
|
||||
if(!this._ws && this.properties.url)
|
||||
this.connectSocket();
|
||||
LGWebSocket.prototype.onExecute = function() {
|
||||
if (!this._ws && this.properties.url) this.connectSocket();
|
||||
|
||||
if(!this._ws || this._ws.readyState != WebSocket.OPEN )
|
||||
return;
|
||||
if (!this._ws || this._ws.readyState != WebSocket.OPEN) return;
|
||||
|
||||
var room = this.properties.room;
|
||||
var only_changes = this.properties.only_send_changes;
|
||||
var room = this.properties.room;
|
||||
var only_changes = this.properties.only_send_changes;
|
||||
|
||||
for(var i = 1; i < this.inputs.length; ++i)
|
||||
{
|
||||
var data = this.getInputData(i);
|
||||
if(data == null)
|
||||
continue;
|
||||
var json;
|
||||
try
|
||||
{
|
||||
json = JSON.stringify({ type: 0, room: room, channel: i, data: data });
|
||||
}
|
||||
catch (err)
|
||||
{
|
||||
continue;
|
||||
}
|
||||
if( only_changes && this._last_sent_data[i] == json )
|
||||
continue;
|
||||
for (var i = 1; i < this.inputs.length; ++i) {
|
||||
var data = this.getInputData(i);
|
||||
if (data == null) continue;
|
||||
var json;
|
||||
try {
|
||||
json = JSON.stringify({
|
||||
type: 0,
|
||||
room: room,
|
||||
channel: i,
|
||||
data: data
|
||||
});
|
||||
} catch (err) {
|
||||
continue;
|
||||
}
|
||||
if (only_changes && this._last_sent_data[i] == json) continue;
|
||||
|
||||
this._last_sent_data[i] = json;
|
||||
this._ws.send( json );
|
||||
}
|
||||
this._last_sent_data[i] = json;
|
||||
this._ws.send(json);
|
||||
}
|
||||
|
||||
for(var i = 1; i < this.outputs.length; ++i)
|
||||
this.setOutputData( i, this._last_received_data[i] );
|
||||
for (var i = 1; i < this.outputs.length; ++i)
|
||||
this.setOutputData(i, this._last_received_data[i]);
|
||||
|
||||
if( this.boxcolor == "#AFA" )
|
||||
this.boxcolor = "#6C6";
|
||||
}
|
||||
if (this.boxcolor == "#AFA") this.boxcolor = "#6C6";
|
||||
};
|
||||
|
||||
LGWebSocket.prototype.connectSocket = function()
|
||||
{
|
||||
var that = this;
|
||||
var url = this.properties.url;
|
||||
if( url.substr(0,2) != "ws" )
|
||||
url = "ws://" + url;
|
||||
this._ws = new WebSocket( url );
|
||||
this._ws.onopen = function()
|
||||
{
|
||||
console.log("ready");
|
||||
that.boxcolor = "#6C6";
|
||||
}
|
||||
this._ws.onmessage = function(e)
|
||||
{
|
||||
that.boxcolor = "#AFA";
|
||||
var data = JSON.parse( e.data );
|
||||
if( data.room && data.room != this.properties.room )
|
||||
return;
|
||||
if( e.data.type == 1 )
|
||||
{
|
||||
if(data.data.object_class && LiteGraph[data.data.object_class] )
|
||||
{
|
||||
var obj = null;
|
||||
try
|
||||
{
|
||||
obj = new LiteGraph[data.data.object_class](data.data);
|
||||
that.triggerSlot( 0, obj );
|
||||
}
|
||||
catch (err)
|
||||
{
|
||||
return;
|
||||
}
|
||||
}
|
||||
else
|
||||
that.triggerSlot( 0, data.data );
|
||||
}
|
||||
else
|
||||
that._last_received_data[ e.data.channel || 0 ] = data.data;
|
||||
}
|
||||
this._ws.onerror = function(e)
|
||||
{
|
||||
console.log("couldnt connect to websocket");
|
||||
that.boxcolor = "#E88";
|
||||
}
|
||||
this._ws.onclose = function(e)
|
||||
{
|
||||
console.log("connection closed");
|
||||
that.boxcolor = "#000";
|
||||
}
|
||||
}
|
||||
LGWebSocket.prototype.connectSocket = function() {
|
||||
var that = this;
|
||||
var url = this.properties.url;
|
||||
if (url.substr(0, 2) != "ws") url = "ws://" + url;
|
||||
this._ws = new WebSocket(url);
|
||||
this._ws.onopen = function() {
|
||||
console.log("ready");
|
||||
that.boxcolor = "#6C6";
|
||||
};
|
||||
this._ws.onmessage = function(e) {
|
||||
that.boxcolor = "#AFA";
|
||||
var data = JSON.parse(e.data);
|
||||
if (data.room && data.room != this.properties.room) return;
|
||||
if (e.data.type == 1) {
|
||||
if (
|
||||
data.data.object_class &&
|
||||
LiteGraph[data.data.object_class]
|
||||
) {
|
||||
var obj = null;
|
||||
try {
|
||||
obj = new LiteGraph[data.data.object_class](data.data);
|
||||
that.triggerSlot(0, obj);
|
||||
} catch (err) {
|
||||
return;
|
||||
}
|
||||
} else that.triggerSlot(0, data.data);
|
||||
} else that._last_received_data[e.data.channel || 0] = data.data;
|
||||
};
|
||||
this._ws.onerror = function(e) {
|
||||
console.log("couldnt connect to websocket");
|
||||
that.boxcolor = "#E88";
|
||||
};
|
||||
this._ws.onclose = function(e) {
|
||||
console.log("connection closed");
|
||||
that.boxcolor = "#000";
|
||||
};
|
||||
};
|
||||
|
||||
LGWebSocket.prototype.send = function(data)
|
||||
{
|
||||
if(!this._ws || this._ws.readyState != WebSocket.OPEN )
|
||||
return;
|
||||
this._ws.send( JSON.stringify({ type:1, msg: data }) );
|
||||
}
|
||||
LGWebSocket.prototype.send = function(data) {
|
||||
if (!this._ws || this._ws.readyState != WebSocket.OPEN) return;
|
||||
this._ws.send(JSON.stringify({ type: 1, msg: data }));
|
||||
};
|
||||
|
||||
LGWebSocket.prototype.onAction = function( action, param )
|
||||
{
|
||||
if(!this._ws || this._ws.readyState != WebSocket.OPEN )
|
||||
return;
|
||||
this._ws.send( { type: 1, room: this.properties.room, action: action, data: param } );
|
||||
}
|
||||
LGWebSocket.prototype.onAction = function(action, param) {
|
||||
if (!this._ws || this._ws.readyState != WebSocket.OPEN) return;
|
||||
this._ws.send({
|
||||
type: 1,
|
||||
room: this.properties.room,
|
||||
action: action,
|
||||
data: param
|
||||
});
|
||||
};
|
||||
|
||||
LGWebSocket.prototype.onGetInputs = function()
|
||||
{
|
||||
return [["in",0]];
|
||||
}
|
||||
LGWebSocket.prototype.onGetInputs = function() {
|
||||
return [["in", 0]];
|
||||
};
|
||||
|
||||
LGWebSocket.prototype.onGetOutputs = function()
|
||||
{
|
||||
return [["out",0]];
|
||||
}
|
||||
LGWebSocket.prototype.onGetOutputs = function() {
|
||||
return [["out", 0]];
|
||||
};
|
||||
|
||||
LiteGraph.registerNodeType("network/websocket", LGWebSocket );
|
||||
LiteGraph.registerNodeType("network/websocket", LGWebSocket);
|
||||
|
||||
//It is like a websocket but using the SillyServer.js server that bounces packets back to all clients connected:
|
||||
//For more information: https://github.com/jagenjo/SillyServer.js
|
||||
|
||||
//It is like a websocket but using the SillyServer.js server that bounces packets back to all clients connected:
|
||||
//For more information: https://github.com/jagenjo/SillyServer.js
|
||||
function LGSillyClient() {
|
||||
//this.size = [60,20];
|
||||
this.room_widget = this.addWidget(
|
||||
"text",
|
||||
"Room",
|
||||
"lgraph",
|
||||
this.setRoom.bind(this)
|
||||
);
|
||||
this.addWidget(
|
||||
"button",
|
||||
"Reconnect",
|
||||
null,
|
||||
this.connectSocket.bind(this)
|
||||
);
|
||||
|
||||
function LGSillyClient()
|
||||
{
|
||||
//this.size = [60,20];
|
||||
this.room_widget = this.addWidget("text","Room","lgraph",this.setRoom.bind(this));
|
||||
this.addWidget("button","Reconnect",null,this.connectSocket.bind(this));
|
||||
this.addInput("send", LiteGraph.ACTION);
|
||||
this.addOutput("received", LiteGraph.EVENT);
|
||||
this.addInput("in", 0);
|
||||
this.addOutput("out", 0);
|
||||
this.properties = {
|
||||
url: "tamats.com:55000",
|
||||
room: "lgraph",
|
||||
only_send_changes: true
|
||||
};
|
||||
|
||||
this.addInput("send", LiteGraph.ACTION);
|
||||
this.addOutput("received", LiteGraph.EVENT);
|
||||
this.addInput("in", 0 );
|
||||
this.addOutput("out", 0 );
|
||||
this.properties = {
|
||||
url: "tamats.com:55000",
|
||||
room: "lgraph",
|
||||
only_send_changes: true
|
||||
};
|
||||
this._server = null;
|
||||
this.connectSocket();
|
||||
this._last_sent_data = [];
|
||||
this._last_received_data = [];
|
||||
}
|
||||
|
||||
this._server = null;
|
||||
this.connectSocket();
|
||||
this._last_sent_data = [];
|
||||
this._last_received_data = [];
|
||||
LGSillyClient.title = "SillyClient";
|
||||
LGSillyClient.desc = "Connects to SillyServer to broadcast messages";
|
||||
|
||||
}
|
||||
LGSillyClient.prototype.onPropertyChanged = function(name, value) {
|
||||
if (name == "room") this.room_widget.value = value;
|
||||
this.connectSocket();
|
||||
};
|
||||
|
||||
LGSillyClient.title = "SillyClient";
|
||||
LGSillyClient.desc = "Connects to SillyServer to broadcast messages";
|
||||
LGSillyClient.prototype.setRoom = function(room_name) {
|
||||
this.properties.room = room_name;
|
||||
this.room_widget.value = room_name;
|
||||
this.connectSocket();
|
||||
};
|
||||
|
||||
LGSillyClient.prototype.onPropertyChanged = function(name,value)
|
||||
{
|
||||
if(name == "room")
|
||||
this.room_widget.value = value;
|
||||
this.connectSocket();
|
||||
}
|
||||
//force label names
|
||||
LGSillyClient.prototype.onDrawForeground = function() {
|
||||
for (var i = 1; i < this.inputs.length; ++i) {
|
||||
var slot = this.inputs[i];
|
||||
slot.label = "in_" + i;
|
||||
}
|
||||
for (var i = 1; i < this.outputs.length; ++i) {
|
||||
var slot = this.outputs[i];
|
||||
slot.label = "out_" + i;
|
||||
}
|
||||
};
|
||||
|
||||
LGSillyClient.prototype.setRoom = function(room_name)
|
||||
{
|
||||
this.properties.room = room_name;
|
||||
this.room_widget.value = room_name;
|
||||
this.connectSocket();
|
||||
}
|
||||
LGSillyClient.prototype.onExecute = function() {
|
||||
if (!this._server || !this._server.is_connected) return;
|
||||
|
||||
//force label names
|
||||
LGSillyClient.prototype.onDrawForeground = function()
|
||||
{
|
||||
for(var i = 1; i < this.inputs.length; ++i)
|
||||
{
|
||||
var slot = this.inputs[i];
|
||||
slot.label = "in_" + i;
|
||||
}
|
||||
for(var i = 1; i < this.outputs.length; ++i)
|
||||
{
|
||||
var slot = this.outputs[i];
|
||||
slot.label = "out_" + i;
|
||||
}
|
||||
}
|
||||
var only_send_changes = this.properties.only_send_changes;
|
||||
|
||||
LGSillyClient.prototype.onExecute = function()
|
||||
{
|
||||
if(!this._server || !this._server.is_connected)
|
||||
return;
|
||||
for (var i = 1; i < this.inputs.length; ++i) {
|
||||
var data = this.getInputData(i);
|
||||
if (data != null) {
|
||||
if (only_send_changes && this._last_sent_data[i] == data)
|
||||
continue;
|
||||
this._server.sendMessage({ type: 0, channel: i, data: data });
|
||||
this._last_sent_data[i] = data;
|
||||
}
|
||||
}
|
||||
|
||||
var only_send_changes = this.properties.only_send_changes;
|
||||
for (var i = 1; i < this.outputs.length; ++i)
|
||||
this.setOutputData(i, this._last_received_data[i]);
|
||||
|
||||
for(var i = 1; i < this.inputs.length; ++i)
|
||||
{
|
||||
var data = this.getInputData(i);
|
||||
if(data != null)
|
||||
{
|
||||
if( only_send_changes && this._last_sent_data[i] == data )
|
||||
continue;
|
||||
this._server.sendMessage( { type: 0, channel: i, data: data } );
|
||||
this._last_sent_data[i] = data;
|
||||
}
|
||||
}
|
||||
if (this.boxcolor == "#AFA") this.boxcolor = "#6C6";
|
||||
};
|
||||
|
||||
for(var i = 1; i < this.outputs.length; ++i)
|
||||
this.setOutputData( i, this._last_received_data[i] );
|
||||
LGSillyClient.prototype.connectSocket = function() {
|
||||
var that = this;
|
||||
if (typeof SillyClient == "undefined") {
|
||||
if (!this._error)
|
||||
console.error(
|
||||
"SillyClient node cannot be used, you must include SillyServer.js"
|
||||
);
|
||||
this._error = true;
|
||||
return;
|
||||
}
|
||||
|
||||
if( this.boxcolor == "#AFA" )
|
||||
this.boxcolor = "#6C6";
|
||||
}
|
||||
this._server = new SillyClient();
|
||||
this._server.on_ready = function() {
|
||||
console.log("ready");
|
||||
that.boxcolor = "#6C6";
|
||||
};
|
||||
this._server.on_message = function(id, msg) {
|
||||
var data = null;
|
||||
try {
|
||||
data = JSON.parse(msg);
|
||||
} catch (err) {
|
||||
return;
|
||||
}
|
||||
|
||||
LGSillyClient.prototype.connectSocket = function()
|
||||
{
|
||||
var that = this;
|
||||
if(typeof(SillyClient) == "undefined")
|
||||
{
|
||||
if(!this._error)
|
||||
console.error("SillyClient node cannot be used, you must include SillyServer.js");
|
||||
this._error = true;
|
||||
return;
|
||||
}
|
||||
if (data.type == 1) {
|
||||
//EVENT slot
|
||||
if (
|
||||
data.data.object_class &&
|
||||
LiteGraph[data.data.object_class]
|
||||
) {
|
||||
var obj = null;
|
||||
try {
|
||||
obj = new LiteGraph[data.data.object_class](data.data);
|
||||
that.triggerSlot(0, obj);
|
||||
} catch (err) {
|
||||
return;
|
||||
}
|
||||
} else that.triggerSlot(0, data.data);
|
||||
} //for FLOW slots
|
||||
else that._last_received_data[data.channel || 0] = data.data;
|
||||
that.boxcolor = "#AFA";
|
||||
};
|
||||
this._server.on_error = function(e) {
|
||||
console.log("couldnt connect to websocket");
|
||||
that.boxcolor = "#E88";
|
||||
};
|
||||
this._server.on_close = function(e) {
|
||||
console.log("connection closed");
|
||||
that.boxcolor = "#000";
|
||||
};
|
||||
|
||||
this._server = new SillyClient();
|
||||
this._server.on_ready = function()
|
||||
{
|
||||
console.log("ready");
|
||||
that.boxcolor = "#6C6";
|
||||
}
|
||||
this._server.on_message = function(id,msg)
|
||||
{
|
||||
var data = null;
|
||||
try
|
||||
{
|
||||
data = JSON.parse( msg );
|
||||
}
|
||||
catch (err)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
if(data.type == 1) //EVENT slot
|
||||
{
|
||||
if(data.data.object_class && LiteGraph[data.data.object_class] )
|
||||
{
|
||||
var obj = null;
|
||||
try
|
||||
{
|
||||
obj = new LiteGraph[data.data.object_class](data.data);
|
||||
that.triggerSlot( 0, obj );
|
||||
}
|
||||
catch (err)
|
||||
{
|
||||
return;
|
||||
}
|
||||
}
|
||||
else
|
||||
that.triggerSlot( 0, data.data );
|
||||
}
|
||||
else //for FLOW slots
|
||||
that._last_received_data[ data.channel || 0 ] = data.data;
|
||||
that.boxcolor = "#AFA";
|
||||
}
|
||||
this._server.on_error = function(e)
|
||||
{
|
||||
console.log("couldnt connect to websocket");
|
||||
that.boxcolor = "#E88";
|
||||
}
|
||||
this._server.on_close = function(e)
|
||||
{
|
||||
console.log("connection closed");
|
||||
that.boxcolor = "#000";
|
||||
}
|
||||
if (this.properties.url && this.properties.room) {
|
||||
try {
|
||||
this._server.connect(this.properties.url, this.properties.room);
|
||||
} catch (err) {
|
||||
console.error("SillyServer error: " + err);
|
||||
this._server = null;
|
||||
return;
|
||||
}
|
||||
this._final_url = this.properties.url + "/" + this.properties.room;
|
||||
}
|
||||
};
|
||||
|
||||
if(this.properties.url && this.properties.room)
|
||||
{
|
||||
try
|
||||
{
|
||||
this._server.connect( this.properties.url, this.properties.room );
|
||||
}
|
||||
catch (err)
|
||||
{
|
||||
console.error("SillyServer error: " + err );
|
||||
this._server = null;
|
||||
return;
|
||||
}
|
||||
this._final_url = (this.properties.url + "/" + this.properties.room);
|
||||
}
|
||||
}
|
||||
LGSillyClient.prototype.send = function(data) {
|
||||
if (!this._server || !this._server.is_connected) return;
|
||||
this._server.sendMessage({ type: 1, data: data });
|
||||
};
|
||||
|
||||
LGSillyClient.prototype.send = function(data)
|
||||
{
|
||||
if(!this._server || !this._server.is_connected)
|
||||
return;
|
||||
this._server.sendMessage( { type:1, data: data } );
|
||||
}
|
||||
LGSillyClient.prototype.onAction = function(action, param) {
|
||||
if (!this._server || !this._server.is_connected) return;
|
||||
this._server.sendMessage({ type: 1, action: action, data: param });
|
||||
};
|
||||
|
||||
LGSillyClient.prototype.onAction = function( action, param )
|
||||
{
|
||||
if(!this._server || !this._server.is_connected)
|
||||
return;
|
||||
this._server.sendMessage( { type: 1, action: action, data: param } );
|
||||
}
|
||||
LGSillyClient.prototype.onGetInputs = function() {
|
||||
return [["in", 0]];
|
||||
};
|
||||
|
||||
LGSillyClient.prototype.onGetInputs = function()
|
||||
{
|
||||
return [["in",0]];
|
||||
}
|
||||
LGSillyClient.prototype.onGetOutputs = function() {
|
||||
return [["out", 0]];
|
||||
};
|
||||
|
||||
LGSillyClient.prototype.onGetOutputs = function()
|
||||
{
|
||||
return [["out",0]];
|
||||
}
|
||||
|
||||
LiteGraph.registerNodeType("network/sillyclient", LGSillyClient );
|
||||
|
||||
|
||||
})(this);
|
||||
LiteGraph.registerNodeType("network/sillyclient", LGSillyClient);
|
||||
})(this);
|
||||
|
||||
@@ -1,67 +1,84 @@
|
||||
//basic nodes
|
||||
(function(global){
|
||||
(function(global) {
|
||||
var LiteGraph = global.LiteGraph;
|
||||
|
||||
var LiteGraph = global.LiteGraph;
|
||||
function toString(a) {
|
||||
return String(a);
|
||||
}
|
||||
|
||||
function toString(a)
|
||||
{
|
||||
return String(a);
|
||||
}
|
||||
LiteGraph.wrapFunctionAsNode("string/toString", compare, ["*"], "String");
|
||||
|
||||
LiteGraph.wrapFunctionAsNode("string/toString",compare, ["*"],"String");
|
||||
|
||||
function compare(a,b)
|
||||
{
|
||||
return a==b;
|
||||
}
|
||||
function compare(a, b) {
|
||||
return a == b;
|
||||
}
|
||||
|
||||
LiteGraph.wrapFunctionAsNode("string/compare",compare, ["String","String"],"Boolean");
|
||||
LiteGraph.wrapFunctionAsNode(
|
||||
"string/compare",
|
||||
compare,
|
||||
["String", "String"],
|
||||
"Boolean"
|
||||
);
|
||||
|
||||
function concatenate(a,b)
|
||||
{
|
||||
if(a === undefined)
|
||||
return b;
|
||||
if(b === undefined)
|
||||
return a;
|
||||
return a + b;
|
||||
}
|
||||
function concatenate(a, b) {
|
||||
if (a === undefined) return b;
|
||||
if (b === undefined) return a;
|
||||
return a + b;
|
||||
}
|
||||
|
||||
LiteGraph.wrapFunctionAsNode("string/concatenate",concatenate, ["String","String"],"String");
|
||||
LiteGraph.wrapFunctionAsNode(
|
||||
"string/concatenate",
|
||||
concatenate,
|
||||
["String", "String"],
|
||||
"String"
|
||||
);
|
||||
|
||||
function contains(a,b)
|
||||
{
|
||||
if(a === undefined || b === undefined )
|
||||
return false;
|
||||
return a.indexOf(b) != -1;
|
||||
}
|
||||
function contains(a, b) {
|
||||
if (a === undefined || b === undefined) return false;
|
||||
return a.indexOf(b) != -1;
|
||||
}
|
||||
|
||||
LiteGraph.wrapFunctionAsNode("string/contains",contains, ["String","String"],"Boolean");
|
||||
LiteGraph.wrapFunctionAsNode(
|
||||
"string/contains",
|
||||
contains,
|
||||
["String", "String"],
|
||||
"Boolean"
|
||||
);
|
||||
|
||||
function toUpperCase(a)
|
||||
{
|
||||
if(a != null && a.constructor === String)
|
||||
return a.toUpperCase();
|
||||
return a;
|
||||
}
|
||||
function toUpperCase(a) {
|
||||
if (a != null && a.constructor === String) return a.toUpperCase();
|
||||
return a;
|
||||
}
|
||||
|
||||
LiteGraph.wrapFunctionAsNode("string/toUpperCase",toUpperCase, ["String"],"String");
|
||||
LiteGraph.wrapFunctionAsNode(
|
||||
"string/toUpperCase",
|
||||
toUpperCase,
|
||||
["String"],
|
||||
"String"
|
||||
);
|
||||
|
||||
function split(a,b)
|
||||
{
|
||||
if(a != null && a.constructor === String)
|
||||
return a.split(b || " ");
|
||||
return [a];
|
||||
}
|
||||
function split(a, b) {
|
||||
if (a != null && a.constructor === String) return a.split(b || " ");
|
||||
return [a];
|
||||
}
|
||||
|
||||
LiteGraph.wrapFunctionAsNode("string/split",toUpperCase, ["String","String"],"Array");
|
||||
LiteGraph.wrapFunctionAsNode(
|
||||
"string/split",
|
||||
toUpperCase,
|
||||
["String", "String"],
|
||||
"Array"
|
||||
);
|
||||
|
||||
function toFixed(a)
|
||||
{
|
||||
if(a != null && a.constructor === Number)
|
||||
return a.toFixed(this.properties.precision);
|
||||
return a;
|
||||
}
|
||||
function toFixed(a) {
|
||||
if (a != null && a.constructor === Number)
|
||||
return a.toFixed(this.properties.precision);
|
||||
return a;
|
||||
}
|
||||
|
||||
LiteGraph.wrapFunctionAsNode("string/toFixed", toFixed, ["Number"], "String", { precision: 0 } );
|
||||
|
||||
})(this);
|
||||
LiteGraph.wrapFunctionAsNode(
|
||||
"string/toFixed",
|
||||
toFixed,
|
||||
["Number"],
|
||||
"String",
|
||||
{ precision: 0 }
|
||||
);
|
||||
})(this);
|
||||
|
||||
Reference in New Issue
Block a user