Web Extension


  • Posts: 690
about core things of the extension
Sponsor asked to open links in he new tabs
but when opening links in the new tab on HTML5 the link is till blocking

Blocking without this extension is not it?

Because the block Open URL in other tab, no blocking.

And now also there are endless ways to use links:

Code: [Select]
<a href="http://www.google.com" target="_blank"> Click Here </a>
Code: [Select]
<a href="http://www.google.com" target="_blank">
<img src="banner.png" alt="Sponsor Banner" height="640" width="480">

And CSS3 is more easy that learning english:

This code, for example, turns the canvas 180º
Code: [Select]
#openfl-content {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);

Is not more easier, because the code is different for each browser: Opera, Chrome, Mozilla, Explorer, etc.

Another thing is that those who do not know the Triad: HTML, CSS and Javascript is practically a digital illiterate.

« Last Edit: August 03, 2016, 06:05:18 pm by gurigraphics »


  • *
  • Posts: 1285
there is strange things
old version  of the ext. where we had just  two options this tab, other tab  is blocking when  opening in other tab
In the current version link is not blocking but if you will press on the button it will not  open the link, but than when you are pressing somewhere it is opening  link in the new tab, and every time when you touch  the screen it is opening the link


  • *
  • Posts: 1285
Yeah, I see that this blocks that you've provided is very powerful, but for example I have no idea how to use it, may be you can share with your test project? with the planets, it is very amazing effect, but probably you are used a lot of coding there. so without coding knowledge I will not understand nothing


  • *
  • Posts: 1285
Sorry gurigraphics
This is not the bug of your extension this is the bug of touches in HTML5 probably.
Problem  still exist, after touch  fixes, when used "open in other  tab" just once it start triggering after each touch and opening new tabs even if you pressed on other button or even reload the scene

Thank you for you awesome extension, will  try to use other functions of it, it is very cool

« Last Edit: August 04, 2016, 01:53:21 am by 1MrPaul1 »


  • Posts: 690
I understand. I'll change the code for the click be used only once.

After of one click, only work again, after reload or change scene.

Let me know if that fixed the problem.

Update 4.1


  • *
  • Posts: 1285
it is working for mouse, even multiply times without reload, but nothing happen on the touch screen when pressing button by fingers, probably it is  blocking, why it can happen?


  • Posts: 690
Now I used modernizr to detect touch or click.

Test the file in attachment.  Let me know if that fixed the problem.

P.s: I tested in Intel XDK emulator and it worked.

« Last Edit: August 04, 2016, 08:31:19 am by gurigraphics »


  • *
  • Posts: 1285
 it is not reacting on touches but do not wrap your head
I will use two behaviors for clicks and for touches
for clicks will use your extension for touches will use regular open url block that is not blocking when using touches
Thank you very much for your help and this awesome extension 


  • Posts: 22

First of all I would like to congratulate your beautiful stencyl initiatives to support the project. I am new to this tool, so I get to know and master the first to realize my various projects. Subsequently (in months), I intend to buy an annual license to actively support its author. Until then, I will certainly have some questions on this forum that I travel already assiduously seeking already written responses for known issues.

Well, regarding the proposed extension web, I find it suitable for some of my web projects. It is excellent. All this opens up great prospects. But I have a slight problem and that is the main purpose of my message here (a little long but this is my very first message, the next will be much more concise), thank you. So :

- I would like to benefit from this extension, but I can not install it. But I respect the procedure, but without success. I'm on Windows 10.

- I downloaded the web4.2 file (zip)
- I run stencyl,
- I open my project,
- I click on Settings and extensions,
- I click on "install extensions"
- I open the zip file "web4.2" ...

Nothing happens.
No visible extension added.
I do not understand.

So I continued the procedure:

- I close the stencyl project
- I quite I stencyl reopens,
- I open my stencyl project

Still no visible web extension. So I can not activate it by clicking on "enable" since the extension is not visible.

The addition does not operate.

An explanation possible?
Solutions ?

Thank you very much for reading me and I hope in the future I also bring my little stone to the collective.

Have a good day !

« Last Edit: August 20, 2016, 10:36:47 am by Jo3m »


  • Posts: 690
Change the name of archive web4.2 to only :  web

Or try this:

1- Open Stencyl
2- Debug-> View-> View Games Folder-> engine-extensions
3- Past the "web folder" (UnZiped)
4- Close Stencyl
5- Open Stencyl
6- Open Game
7- Settings-> Extensions -> Click enable Web Extension
8- Close Stencyl
9- Open Stencyl
10- Open Game


  • Posts: 22
It works ! Thank you very much !


  • Posts: 22
It's me again ^^
Here is my problem and why I use the web extension. It may not be the right approach, or proper use.

Originally in stencyl, I do not see the possibility to launch an application or game html5 covering the total area of ​​the browser: width: auto; heigth = 100% (full page) ...

Because when you go here:
Settings >> Display >> you have the possibility to specify the width and height in pixels ... but not as a percentage. Now in a browser it would be nice to work with a percentage playground. So as to make responsive. But this is probably not possible with basic stencyl in HTML5 (?) I have not found a satisfactory answer.

That's why I use this web extension. I wish I could open my playing surface that covers the browser area fully.

It seems not to function correctly. Here is how I do:

(When created)

Code: [Select]
Web.f_css ( "width", "auto", Web.c_openfl ());
Web.f_css ( "heigth", "100%", Web.c_openfl ());
Web.f_css ( "margin", "0px" Web.c_openfl ());

CSS area properly covers the total area of ​​the browser, but it does not change for stencyl playground. The coordinates are always those I have indicated in: Settings >> Display >> px size ...

Do you understand the problem and what I want to do?

Can dynamically change the size of the area stencyl for HTML5?

Thank you.


  • Posts: 690
If you find the size of the screen and set the Width and Height it should work.

But this solution is easier:

For the game to scale just add this to the openfl settings (settings > advanced > openfl settings)

<window resizable="true" if="html5" />


  • Posts: 22
Yes, easier, Thank you !
I did not know you could insert code here. I discover each day.

But that's not really what I wanted to do.
To better explain my problem, I refer you to this topic:


In fact, I want to keep the original resolution without "upscaling" or "stretching" the pixels.

I thought one thing would be to detect the width and height of the screen to launch to dynamically adjust in height and width (html5 in browser / web navigator). But I do not know if that's possible. The problem is specific. It is not for a game but to a "site concept."

Another solution might be necessary would be to use your web extension. But for this, I understand, I have to do without conventional actors stencyl to work directly with CSS elements.

It means that I can do without the basic stencyl playground for failing to display? I want to apologize for my technical shortcomings about stencyl. I have everything it takes to work in css / html5 / php but stencyl I learn how.

I do not ask that chews me the job, just to blow me a possibility.  :D

« Last Edit: August 23, 2016, 03:22:11 am by Jo3m »


  • Posts: 22
Here is an illustration of what I would fit my project.


I used the sources of the demo and there is no problem. Of course, this is the web development. Stencyl on, I discovered your web extension, and then I told myself that I could perhaps do with my web project. Moreover, I can thus benefit from greater interractivité with css and other items, without having to break my head with js.

I understood that I had to do with the DOM, not canvas stencyl for better fluidity.

Only I would therefore like to begin, insert a simple html image.
I can not indicate the correct path for the image.

In the address of the project, I created a "images" directory to copy my image. I tested with relative and absolute address.

Code: [Select]
JQuery append <img src="E:\Users\***\AppData\Roaming\Stencyl\stencylworks\games\Site Val\Images\fond_mini.jpg"> to element : body
It does not work.

Code: [Select]
JQuery append <img src="Images\fond_mini.jpg"> to element : body
It does not work.

The picture link is dead. I do not know where to put my image to make it work with stencyl?

In your opinion, is it possible to work with css and div elements using tags stencyl to create dynamic events, like any other stencyl project ?

Thank you.