hitTestObject not working properly within a for loop - flash-cc

I'm building a game where the hero is build with a MovieClip that has nested Movieclips. The nested MovieClips are the moves of the hero which are in different frames. Additionally, there are some MovieClips that are two levels nested.
Now here is the code of what I'm doing:
public function movesCollisions(event:Event):void{
for (var ea:int = 0; ea < enemies.length; ea++){
//parent .child .sibling
if(sketch.slidepunch.sketchfist.hitTestObject(enemies[ea])){
enemies[ea].animstate = "defeated";
//Here this first collision works fine but the next
//collsion below does not, I have no Idea why.
}else if(sketch.archforward.rhandHit.hitTestObject(enemies[ea])){
enemies[ea].animstate = "defeated";
}
}
}
The problem that I'm having is that the hitTestObject does not work when I have the else if conditional. The first one works if I comment out the else statement. How can I fix this issue since I have many more moves that I need to check for collision.
They only way that I have manage to get the moves collision to work has been by creating a different Event.ENTER_FRAME, function for each but it has a big effect on performance.
any guidance is greatly appreciated.

Related

The Three.js object cannot be embeded in the CSS3DObject

I'm trying to get a clone of a raycasted object, and move the clone of the selected object in a <div>. The raycaster works just fine, but the CSS3DObject instance (the cloned 3d Object) is not shown in the scene. I have made another renderer (namely a CSS3DRenderer), in addition to the current WebGLRenderer, and basically my css3d code consists of this:
cssRenderer = new CSS3DRenderer();
cssRenderer.setSize(window.innerWidth, window.innerHeight);
cssRenderer.domElement.style.position = 'absolute';
cssRenderer.domElement.style.top = 0;
cssScene = new THREE.Scene();
document.body.appendChild(cssRenderer.domElement);
...
thumbnail = document.querySelector('.thumbnail');
thumbObject = new CSS3DObject(thumbnail);
....
targetClone = target.clone();
thumbObject.position.copy(targetClone.position);
cssScene.add(thumbObject);
and my render loop code, pertaining to this, is:
requestAnimationFrame(update);
renderer.render(scene, camera); // WebGLRenderer
cssRenderer.render(cssScene, camera); //CSS3DRenderer
My intention is to embed the cloned object (targetClone) in the CSS3DObject (thumbObject, which in actuality is an HTML element). The console shows no error, and I cannot see any reaction to this code whatsoever (except that the div travels to the center of model!) No matter if I select the div through traversing the DOM or making a fresh element by means of createElement, nothing is being embedded in the div. I suspect that everything is behind the scene(s). Any ideas how can I achieve this, and where I'm doing it wrong?

referencing global variables in a continuous function (p5.js)

it's been years since I coded anything, and now I need to pick up p5.js. As practice I was trying to make a simple drawing program - I want my program to draw in black by default, and switch the color to red when I click on the red rectangle in the corner of the screen. I had the following very sloppy code (I know the mouse-press doesn't exactly line up with the red rectangle, the 'drawing' mechanism isn't the best, etc. I'm just messing around with it atm)
function setup() {
createCanvas(600, 600);
fill ('red');
rect(570,20,5,5);
//creates red rectangle at top right corner of screen
}
var color = 0;
function mousePressed(){
if ( mouseX > 570) {
if( mouseY > 20){
color = 4;
ellipse (10,20,50,50);
}
}
}
function draw() {
stroke(color);
if (mouseIsPressed) {
ellipse(mouseX, mouseY, 1, 1)
//creates colored dot when mouse is pressed
}
}
function keyTyped(){
if (key === 'c'){
clear();
}
}
If I don't use the 'color' variable and instead just set the stroke to 0, I can draw in black well enough. And the mousePressed function seems to work - when I press the rectangle, it draws the ellipse that I put in to test. However, I can't seem to reference var 'color' in my draw function - it's probably a silly problem, but I admit to being stumped! What am I doing wrong?
You have to be careful when naming variables. Specifically, you shouldn't name them the same thing as existing functions!
From the Processing.js help articles:
One of the powerful features of JavaScript is its dynamic, typeless nature. Where typed languages like Java, and therefore Processing, can reuse names without fear of ambiguity (e.g., method overloading), Processing.js cannot. Without getting into the inner-workings of JavaScript, the best advice for Processing developers is to not use function/class/etc. names from Processing as variable names. For example, a variable named line might seem reasonable, but it will cause issues with the similarly named line() function built-into Processing and Processing.js.
Processing.js is JavaScript, so functions can be stored in variables. For example, the color variable is the color() function! So when you create your own color variable, you're overwriting that, so you lose the ability to call the color() function.
The simplest fix is to just change the name of your color variable to something like myColor.

Full name is not visible in twin-column values in Vaadin

I'm new to vaadin. I came across with a bug that full name is not visible in twin-column component's values. I have very long names inside the left side of the twin-column. I increased the width of the component much as I can. But still some lines are there that not visible full name.
I tried to add some css, even that didn't work.
.v-select-twincol-options .v-select-twincol-break-word{word-wrap: break-word;}
I tried with this css line. Any wrong in here? Or any idea to solve this. Please help me on this..
Thank you in advance.
private TwinColSelect createTemplateSelectTwinColumn()
{
TwinColSelect twinColSelect = new TwinColSelect("Related Templates");
twinColSelect.setNullSelectionAllowed(true);
twinColSelect.setMultiSelect(true);
twinColSelect.setImmediate(true);
twinColSelect.setSizeFull();
Collection<File> templates = getTemplates();
Collections.sort((List<File>) templates, new Comparator<File>()
{
#Override
public int compare(final File f1, final File f2)
{
return f1.getName().compareTo(f2.getName());
}
});
for (File file : templates)
{
twinColSelect.addItem(file.getNodeId());
twinColSelect.setItemCaption(file.getNodeId(), file.getName());
}
return twinColSelect;
}
Method where I'm creating the twinColumn inside a FormLayout
Vaadin's TwinColSelect eventually results in two standard HTML option list controls in the DOM; see the DOM of this example: http://demo.vaadin.com/book-examples/book/#component.select.twincolselect.basic
word-wrap is, however, not possible on option list items.
Consider creating your "own" TwinColSelect from two Vaadin tables. Vaadin tables are much more flexible regarding CSS styling.

Make two QDockWidgets mutual execlusive at the same position

I have two QDockWidget's, only one of them is visible at the time, I manage that by toggleViewAction().
What I need to do is that I want the two QDockWidget's to be in the same location, with the same size and docked at the same dockWidgetArea with the same orientation and order relative to other QDockWidgets.
I did most of the that by this code:
void myMainWindow::slotToggleDocks(QAction* action) {
if(action == viewDock1) {
Dock1->setFloating(Dock2->isFloating());
Dock1->resize(Dock2->size());
Dock1->restoreGeometry(Dock2->saveGeometry());
Dock1->move(Dock2->pos());
addDockWidget(dockWidgetArea(Dock2), Dock1);
...
Dock2->hide();
} else if(action == viewDock2) {
Dock2->setFloating(Dock1->isFloating());
Dock2->resize(Dock1->size());
Dock2->restoreGeometry(Dock1->saveGeometry());
Dock2->move(Dock1->pos());
addDockWidget(dockWidgetArea(Dock2), Dock1);
...
Dock1->hide();
}
}
this code make the two have the same location and size and docked to the same area (left, right, ...) but it doesn't guarantee that the Docks will have the same layout with the other QDockWidget's in the same dockWidgetArea.
Meaning if this was the before layout:
Layout before http://holmez.net/qdockwidget/1.png
This is after toggling:
Layout after toggling http://holmez.net/qdockwidget/2.png
This is what I want:
Expected result http://holmez.net/qdockwidget/3.png
I managed to do that by a simple trick, add this line of code:
splitDockWidget(Dock1,Dock2,Qt::Horizontal);
before hiding Dock1, and this line:
splitDockWidget(Dock2,Dock1,Qt::Horizontal);
before hiding Dock2.
This fixed the problem of the arrangement of docked widgets, not sure if this is the best way but it works for me.
What about only using 2 QDockWidgets, but having QStackedWidgets INSIDE of them which you can use to swap views? That's what I'm currently doing, and it works great.
Another advantage is that swapping views is as simple as:
stackedWidget->setCurrentIndex(index);
What about using QTabWidget?
The 2 widgets will have to be in the same Qt::DockWidgetAreas

Flex 4, AdvancedDataGrid: initial column width

I got a problem with the widths of the advanceddatagrid-columns.
First of all, my layout is a HDividedBox, on the left there is the navigation, on the right there is a module, containing the advanceddatagrid.
left Side: navigation
right side: module (e.g. advanceddatagrid)
Most of the columns got a fixed width, some a minWidth. Now, initially the widths of the columns are correct.
So the problem is, whenever I load a new module and later reload the advanceddatagrid, the initial width of the columns is way different, although I change nothing in the process of loading the module. Neither the fixed widths nor the minWidths are initially correct.
I recently saw there is a solution for wrong widths of colums, it looks like that:
var oldPolicy:String = advanceddatagrid.myScrollPolicy;
advanceddatagrid.myScrollPolicy = ScrollPolicy.ON;
for(var i:int = 0; i < advanceddatagrid.columns.length; i++) {
var column:AdvancedDataGridColumn = advanceddatagrid.columns[i] as AdvancedDataGridColumn;
advanceddatagrid.column.width = column.width;
}
advanceddatagrid.validateNow();
advanceddatagrid.myScrollPolicy = oldPolicy;
advanceddatagrid.validateNow();
On the whole this is just a temporary change of the ScrollPolicy, re-setting the column-widths and then changing back. But still, it doenst work.
Does anyone have a clue?
Some relevant references that might help (the first one worked for me):
http://userflex.wordpress.com/2011/04/14/force-resize-datagrid/
http://forums.adobe.com/message/4285461
To summarize the first post (credit goes to Nick Schneble):
public function resizeColumns () : void
{
grid.validateNow ();
// forces the columns to size themselves properly
for each (var column : AdvancedDataGridColumn in grid.columns)
{
column.width = column.width;
}
}
It may seem a bit ridiculous, but if you execute this method whenever the underlying data in your data grid changes, you’ll have beautifully laid out columns.

Resources