Mon 21 Jul 22:43:21 CEST 2025
This commit is contained in:
parent
14c6da2c31
commit
295a1c716b
288
js/ui/mxgraph/src/js/util/mxCodeEditor.js
Normal file
288
js/ui/mxgraph/src/js/util/mxCodeEditor.js
Normal file
|
|
@ -0,0 +1,288 @@
|
|||
/**
|
||||
* Copyright (c) 2006-2015, JGraph Ltd
|
||||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
var mxCodeEditor =
|
||||
{
|
||||
/**
|
||||
* Class: mxCodeEditor
|
||||
*
|
||||
* A singleton class that implements a simple JS inspector.
|
||||
*
|
||||
* Variable: Name
|
||||
*
|
||||
* Specifies the name of the console window. Default is 'Console'.
|
||||
*/
|
||||
Name: 'Code Editor',
|
||||
|
||||
/**
|
||||
* Variable: TRACE
|
||||
*
|
||||
* Specified if the output for <enter> and <leave> should be visible in the
|
||||
* console. Default is false.
|
||||
*/
|
||||
TRACE: false,
|
||||
|
||||
/**
|
||||
* Variable: DEBUG
|
||||
*
|
||||
* Specifies if the output for <debug> should be visible in the console.
|
||||
* Default is true.
|
||||
*/
|
||||
DEBUG: true,
|
||||
|
||||
/**
|
||||
* Variable: WARN
|
||||
*
|
||||
* Specifies if the output for <warn> should be visible in the console.
|
||||
* Default is true.
|
||||
*/
|
||||
WARN: true,
|
||||
|
||||
/**
|
||||
* Variable: buffer
|
||||
*
|
||||
* Buffer for pre-initialized content.
|
||||
*/
|
||||
buffer: '',
|
||||
|
||||
template :
|
||||
"var classes = {\n"+
|
||||
" // Type your AgentJS here\n"+
|
||||
" a1 : function () {\n"+
|
||||
" this.act = {\n"+
|
||||
" init : function () {},\n"+
|
||||
" first : function () {}\n"+
|
||||
" };\n"+
|
||||
" this.trans = {\n"+
|
||||
" init : function () {}\n"+
|
||||
" };\n"+
|
||||
" this.next=init;\n"+
|
||||
" }\n"+
|
||||
"}\n",
|
||||
|
||||
/**
|
||||
* Function: init
|
||||
*
|
||||
* Initializes the DOM node for the console. This requires document.body to
|
||||
* point to a non-null value. This is called from within <setVisible> if the
|
||||
* log has not yet been initialized.
|
||||
*/
|
||||
init: function()
|
||||
{
|
||||
if (mxCodeEditor.window == null && document.body != null)
|
||||
{
|
||||
var title = mxCodeEditor.Name + ' - mxGraph ' + mxClient.VERSION;
|
||||
|
||||
// Creates a table that maintains the layout
|
||||
var table = document.createElement('table');
|
||||
table.setAttribute('width', '100%');
|
||||
table.setAttribute('height', '100%');
|
||||
|
||||
var tbody = document.createElement('tbody');
|
||||
var tr = document.createElement('tr');
|
||||
var td = document.createElement('td');
|
||||
td.style.verticalAlign = 'top';
|
||||
|
||||
// Adds the actual console as a textarea
|
||||
mxCodeEditor.wrapper = document.createElement('div');
|
||||
mxCodeEditor.wrapper.setAttribute('id',mxCodeEditor.Name+'Wrapper');
|
||||
mxCodeEditor.wrapper.setAttribute('overflow-y','scroll');
|
||||
mxCodeEditor.wrapper.style.height = '100%';
|
||||
mxCodeEditor.wrapper.style.resize = 'none';
|
||||
|
||||
|
||||
mxCodeEditor.obj = {};
|
||||
mxCodeEditor.callback = function () {};
|
||||
|
||||
td.appendChild(mxCodeEditor.wrapper);
|
||||
tr.appendChild(td);
|
||||
tbody.appendChild(tr);
|
||||
|
||||
// Creates the container div
|
||||
tr = document.createElement('tr');
|
||||
mxCodeEditor.td = document.createElement('td');
|
||||
mxCodeEditor.td.style.verticalAlign = 'top';
|
||||
mxCodeEditor.td.setAttribute('height', '30px');
|
||||
|
||||
tr.appendChild(mxCodeEditor.td);
|
||||
tbody.appendChild(tr);
|
||||
table.appendChild(tbody);
|
||||
|
||||
|
||||
mxCodeEditor.tabs =
|
||||
[{
|
||||
name:'Untitled.js',
|
||||
modified:false,
|
||||
data:''
|
||||
}
|
||||
];
|
||||
mxCodeEditor.tab=0;
|
||||
|
||||
// Adds various buttons
|
||||
mxCodeEditor.addButtonIcon('images/open.gif', function (evt)
|
||||
{
|
||||
// Open
|
||||
mxCodeEditor.popup_load_file.show(mxCodeEditor.editor.getNode(), {pos:'top'});
|
||||
});
|
||||
|
||||
|
||||
mxCodeEditor.addButtonIcon('images/save.gif', function (evt)
|
||||
{
|
||||
// Save
|
||||
var sourcetext = mxCodeEditor.editor.getValue();
|
||||
mxCodeEditor.tabs[mxCodeEditor.tab].data=sourcetext;
|
||||
saveTextAsFile(sourcetext, mxCodeEditor.tabs[mxCodeEditor.tab].name);
|
||||
});
|
||||
|
||||
mxCodeEditor.addButtonIcon('images/close.png', function (evt)
|
||||
{
|
||||
// Close
|
||||
});
|
||||
|
||||
mxCodeEditor.addButtonIcon('images/new.gif', function (evt)
|
||||
{
|
||||
// New
|
||||
});
|
||||
|
||||
mxCodeEditor.tabs[mxCodeEditor.tab].button=
|
||||
mxCodeEditor.addButton(mxCodeEditor.tabs[mxCodeEditor.tab].name, function (evt)
|
||||
{
|
||||
|
||||
});
|
||||
|
||||
// Cross-browser code to get window size
|
||||
var h = 0;
|
||||
var w = 0;
|
||||
|
||||
if (typeof(window.innerWidth) === 'number')
|
||||
{
|
||||
h = window.innerHeight;
|
||||
w = window.innerWidth;
|
||||
}
|
||||
else
|
||||
{
|
||||
h = (document.documentElement.clientHeight || document.body.clientHeight);
|
||||
w = document.body.clientWidth;
|
||||
}
|
||||
|
||||
mxCodeEditor.window = new mxWindow(title, table, Math.max(0, w - 320), Math.max(0, h - 210), 300, 160);
|
||||
mxCodeEditor.window.setMaximizable(true);
|
||||
mxCodeEditor.window.setScrollable(false);
|
||||
mxCodeEditor.window.setResizable(true);
|
||||
mxCodeEditor.window.setClosable(true);
|
||||
mxCodeEditor.window.destroyOnClose = false;
|
||||
|
||||
mxCodeEditor.editor = webix.ui({
|
||||
id : 'SourceText',
|
||||
width:'95%',
|
||||
height:100,
|
||||
container: mxCodeEditor.wrapper,
|
||||
view: "codemirror-editor"
|
||||
});
|
||||
|
||||
mxCodeEditor.editor.setValue(mxCodeEditor.template);
|
||||
mxCodeEditor.tabs[mxCodeEditor.tab].data=mxCodeEditor.template;
|
||||
|
||||
mxCodeEditor.window.addListener(mxEvent.RESIZE_END, function(e) {
|
||||
// Resize tree widget, TODO: assuming button bar height = 60
|
||||
mxCodeEditor.editor.define('height',mxCodeEditor.window.div.offsetHeight-60);
|
||||
mxCodeEditor.editor.resize();
|
||||
});
|
||||
|
||||
var popup_load_file_id = (Math.random()*1000000)|0;
|
||||
mxCodeEditor.popup_load_file=webix.ui({
|
||||
view:"popup",
|
||||
id:"popup_load_file"+popup_load_file_id,
|
||||
body: {
|
||||
view:"toolbar",
|
||||
elements:[
|
||||
{ template:'<input type="file" id="load_file_input'+popup_load_file_id+'">', width:240 },
|
||||
{ view:"button", label:"Ok", width:80, click:function () {
|
||||
loadFileAsText('load_file_input'+popup_load_file_id,function(data,filehandle) {
|
||||
// console.log(filename);
|
||||
//unhighlight('SourceText');
|
||||
mxCodeEditor.tabs[mxCodeEditor.tab].name=filehandle.name;
|
||||
mxUtils.setTextContent(mxCodeEditor.tabs[mxCodeEditor.tab].button,filehandle.name);
|
||||
mxCodeEditor.editor.setValue(data);
|
||||
mxCodeEditor.popup_load_file.hide();
|
||||
});
|
||||
}},
|
||||
{ view:"button", label:"Cancel", width:80, click:function () {
|
||||
mxCodeEditor.popup_load_file.hide();
|
||||
}}
|
||||
]
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
/**
|
||||
* Function: addButton
|
||||
*
|
||||
* Adds a button to the console using the given label and function.
|
||||
*/
|
||||
addButton: function(lab, funct)
|
||||
{
|
||||
var button = document.createElement('button');
|
||||
mxUtils.write(button, lab);
|
||||
mxEvent.addListener(button, 'click', funct);
|
||||
mxCodeEditor.td.appendChild(button);
|
||||
return button;
|
||||
},
|
||||
addButtonIcon: function(icon, funct)
|
||||
{
|
||||
var button = document.createElement('button');
|
||||
var img = mxUtils.createImage(icon);
|
||||
button.appendChild(img);
|
||||
mxEvent.addListener(button, 'click', funct);
|
||||
mxCodeEditor.td.appendChild(button);
|
||||
return button;
|
||||
},
|
||||
|
||||
/**
|
||||
* Function: isVisible
|
||||
*
|
||||
* Returns true if the console is visible.
|
||||
*/
|
||||
isVisible: function()
|
||||
{
|
||||
if (mxCodeEditor.window != null)
|
||||
{
|
||||
return mxCodeEditor.window.isVisible();
|
||||
}
|
||||
|
||||
return false;
|
||||
},
|
||||
|
||||
|
||||
/**
|
||||
* Function: show
|
||||
*
|
||||
* Shows the console.
|
||||
*/
|
||||
show: function()
|
||||
{
|
||||
mxCodeEditor.setVisible(true);
|
||||
},
|
||||
|
||||
/**
|
||||
* Function: setVisible
|
||||
*
|
||||
* Shows or hides the console.
|
||||
*/
|
||||
setVisible: function(visible)
|
||||
{
|
||||
if (mxCodeEditor.window == null)
|
||||
{
|
||||
mxCodeEditor.init();
|
||||
}
|
||||
|
||||
if (mxCodeEditor.window != null)
|
||||
{
|
||||
mxCodeEditor.window.setVisible(visible);
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
Loading…
Reference in New Issue
Block a user