Skip to content

Commit d665e7e

Browse files
committed
editor: added grab button, added gui for adding components & graphics
1 parent 0d540ac commit d665e7e

File tree

6 files changed

+108
-10
lines changed

6 files changed

+108
-10
lines changed

.tern-project

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
{
2+
"ecmaVersion": 8,
3+
"libs": [
4+
"browser"
5+
],
6+
"loadEagerly": [
7+
"jscf/**/*.js",
8+
"jscf/namespaces.js"
9+
],
10+
"plugins": {
11+
"es_modules": {},
12+
"node": {},
13+
"doc_comment": {
14+
"fullDocs": true
15+
}
16+
}
17+
}

editor/editor_dev.html

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,8 @@
2222
<script type="text/javascript" src="../jscf/components/script.js"></script>
2323
<script type="text/javascript" src="../jscf/components/layoutHandler.js"></script>
2424
<script type="text/javascript" src="../jscf/components/buttonHandler.js"></script>
25+
<script type="text/javascript" src="../jscf/components/collider.js"></script>
26+
<script type="text/javascript" src="../jscf/components/rigidbody.js"></script>
2527
<script type="text/javascript" src="../jscf/components/rectangleEditor.js"></script>
2628
<script type="text/javascript" src="../jscf/core/time.js"></script>
2729
<script type="text/javascript" src="../jscf/core/transform.js"></script>

editor/scripts/game.js

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,15 @@ function loadResources()
1111
function loadScene()
1212
{
1313
game.debug = true;
14+
game.inputManager.setOnMouseDown(function() {
15+
if (game.inputManager.isKeyDown(__RECTANGLE_GRAB_BUTTON)) {
16+
var tb = game.getCurrentScene().getEntity(__GUIMANAGER_DEBUG_PANEL_NAME).getChildAt(6);
17+
var name = "";
18+
if (RectangleEditor.currently_selected)
19+
name = RectangleEditor.currently_selected.name;
20+
tb.getChildAt(0).textBox.value(name);
21+
}
22+
});
1423
editor.toggleDebugPanel();
1524
}
1625

editor/scripts/jscf-editor.js

Lines changed: 73 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,19 @@
11
// JSCFEditor consts
2+
const __JSCFEDITOR_ADD_WINDOW_NAME = "add-window";
23
const __JSCFEDITOR_HELP_PANEL_NAME = "help-panel";
34
const __JSCFEDITOR_LIST_PANEL_NAME = "panel-script";
45
const __JSCFEDITOR_ID = "jscf-editor";
56
const __JSCFEDITOR_SAVE_ID = "jscf-editor-save-button";
67
const __JSCFEDITOR_CANCEL_ID = "jscf-editor-cancel-button";
78
const __JSCFEDITOR_PANEL_ID = "jscf-editor-panel";
9+
// debug panel consts
10+
const __JSCFEDITOR_HELP_TEXT = "Welcome to the JSCF editor!\n\
11+
- Mod key: left ctrl\n\
12+
- Use Mod+left-click to drag entities\n\
13+
- Use Mod+right-click to resize\n\
14+
- Use ~ button to toggle";
815
// keybinds
9-
const __JSCFEDITOR_KB_DEV_TOGGLE = 192;
16+
const __JSCFEDITOR_KB_DEV_TOGGLE = 192;
1017

1118
/**
1219
* conservingBind: keeps code but applies native binding
@@ -273,6 +280,11 @@ function JSCFEditor (game)
273280
SceneUtils.saveToFile(game.getCurrentScene().serialize(), "scene");
274281
});
275282

283+
var createBtn = guim.createDefaultButton(0,0,"Create Entity",function() {
284+
var e = game.getCurrentScene().createNewEntity();
285+
tb.value(e.name);
286+
});
287+
276288
// Create the panel
277289
var panel = guim.createContainer(__GUIMANAGER_DEBUG_PANEL_NAME,
278290
panelWidth/2, panelHeight/2, panelWidth,
@@ -281,8 +293,9 @@ function JSCFEditor (game)
281293
panel.getComponentOfType(LayoutHandler).layoutType = LinedLayout;
282294

283295
panel.insertChild(fpsLabel);
284-
panel.insertChild(saveBtn);
285296
panel.insertChild(toggleBtn);
297+
panel.insertChild(saveBtn);
298+
panel.insertChild(createBtn);
286299
panel.insertChild(searchTB);
287300
panel.insertChild(listLabel);
288301
panel.addChild(__JSCFEDITOR_LIST_PANEL_NAME, panelScript);
@@ -369,6 +382,13 @@ function JSCFEditor (game)
369382
// seperator
370383
panel.insertChild(guim.createLabel(0,0,"______________________"));
371384

385+
// add button
386+
var addBtn = guim.createDefaultButton(0, 0, "Add");
387+
addBtn.getComponentOfType(ButtonHandler).onClick = function() {
388+
game.getCurrentScene().addEntity(self.createAddWindow(obj, panel));
389+
};
390+
panel.insertChild(addBtn);
391+
372392
// close button
373393
var closeBtn = guim.createDefaultButton(0, 0, "Close");
374394
closeBtn.getComponentOfType(ButtonHandler).onClick = function() {
@@ -384,22 +404,68 @@ function JSCFEditor (game)
384404
};
385405

386406
/**
387-
* create help panel
407+
* creates add property window for object
408+
*
409+
* @method
410+
* @param {Entity} obj the object to add property to
411+
* @param {Entity} panel the creating panel
412+
* @return {Entity} the window entity
413+
*/
414+
this.createAddWindow = function(obj, panel)
415+
{
416+
var guim = game.guiManager;
417+
418+
const PANEL_WIDTH = guim.theme.getSize("panel", "width");
419+
const DP_WIDTH = PANEL_WIDTH + guim.theme.getSize("panel", "margin");
420+
const COMPONENT_LIST = [ LayoutHandler, ButtonHandler, Script, Collider, Rigidbody, RectangleEditor ];
421+
422+
var addWindow = guim.createDefaultWindow(DP_WIDTH*2, PANEL_WIDTH);
423+
addWindow.name = guim.generateUIName(__JSCFEDITOR_ADD_WINDOW_NAME);
424+
addWindow.addComponent(LayoutHandler);
425+
addWindow.getComponentOfType(LayoutHandler).layoutType = FitLayout;
426+
427+
var self = this;
428+
var closeFn = function() {
429+
game.getCurrentScene().delEntity(panel.name);
430+
self.createInspectionPanel(obj);
431+
game.getCurrentScene().delEntity(addWindow.name);
432+
};
433+
434+
for (var i = 0; i < COMPONENT_LIST.length; i++) {
435+
var btn = guim.createDefaultButton(0,0,COMPONENT_LIST[i].component_name,null);
436+
btn.componentType = COMPONENT_LIST[i];
437+
btn.getComponentOfType(ButtonHandler).onClick = function() {
438+
obj.addComponent(this.componentType);
439+
closeFn();
440+
}.bind(btn);
441+
addWindow.insertChild(btn);
442+
}
443+
444+
var planeBtn = guim.createDefaultButton(0,0,"Plane",function() {
445+
obj.insertChild(new Plane(game,100,100,"black"));
446+
closeFn();
447+
});
448+
addWindow.insertChild(planeBtn);
449+
450+
return addWindow;
451+
};
452+
453+
/**
454+
* create help window
388455
*
389456
* @method
390457
* @return {Core.Entity} a help popup entity
391458
*/
392-
this.createHelpPanel = function()
459+
this.createHelpWindow = function()
393460
{
394461
var guim = game.guiManager;
395462

396-
const HELP_TEXT = "Welcome to the JSCF editor!\n- Use left-click to drag entities\n- Use right-click to resize\n- Use ~ button to toggle";
397463
const PANEL_WIDTH = guim.theme.getSize("panel", "width");
398464
const DP_WIDTH = PANEL_WIDTH + guim.theme.getSize("panel", "margin");
399465

400466
var helpPanel = guim.createDefaultWindow(DP_WIDTH*2, PANEL_WIDTH);
401467
helpPanel.name = guim.generateUIName(__JSCFEDITOR_HELP_PANEL_NAME);
402-
helpPanel.insertChild(guim.createLabel(0, 0, HELP_TEXT));
468+
helpPanel.insertChild(guim.createLabel(0, 0, __JSCFEDITOR_HELP_TEXT));
403469

404470
return helpPanel;
405471
};
@@ -437,7 +503,7 @@ function JSCFEditor (game)
437503
// Create debug panel
438504
var debugPanel = this.createDebugPanel();
439505
// Create debug help panel
440-
var helpPanel = this.createHelpPanel();
506+
var helpPanel = this.createHelpWindow();
441507

442508
// Insert panels
443509
game.getCurrentScene().addEntity(debugPanel);

jscf/components/rectangleEditor.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
const __RECTANGLE_EDITOR_NAME = "[rectangle_editor]";
66
const __RECTANGLE_DEFAULT_ACTIVE_STYLE = "red";
77
const __RECTANGLE_DEFAULT_PASSIVE_STYLE = "black";
8+
const __RECTANGLE_GRAB_BUTTON = 17; // ctrl
89

910
/**
1011
* @class
@@ -48,7 +49,8 @@ function RectangleEditor(owner, style)
4849
this.rectangle.height = dims.y;
4950
}
5051

51-
if (this.bb.containsPoint(mx, my) && this.parent.game.inputManager.isMouseDown()) {
52+
if (this.bb.containsPoint(mx, my) && this.parent.game.inputManager.isMouseDown()
53+
&& this.parent.game.inputManager.isKeyDown(__RECTANGLE_GRAB_BUTTON)) {
5254
if (this.parent.game.inputManager.isLMBDown()) {
5355
this.selectOwner();
5456
this.parent.transform.pos = mousePos;

jscf/scene/scene.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -177,7 +177,8 @@ function Scene(game)
177177
this.createEntity = function(name, x, y, firstChild)
178178
{
179179
var e = new Entity(game, name, true, x, y, true);
180-
e.addChild(this.getChildName(e, firstChild), firstChild);
180+
if (firstChild)
181+
e.addChild(this.getChildName(e, firstChild), firstChild);
181182
return this.addEntity(e);
182183
};
183184

@@ -191,7 +192,8 @@ function Scene(game)
191192
this.createNewEntity = function(firstChild)
192193
{
193194
var e = new Entity(game, this.getEntityName(), true, 0, 0, true);
194-
e.addChild(this.getChildName(e, firstChild), firstChild);
195+
if (firstChild)
196+
e.addChild(this.getChildName(e, firstChild), firstChild);
195197
return this.addEntity(e);
196198
};
197199

0 commit comments

Comments
 (0)