Pode's Forum Posts

  • kiyoshi: it's not possible with C2 for the moment (at least not the way C2's core is implemented).

    And, for everyone that needs that information : the text is still selectable (great in some cases, not great in other cases). But, since it's generated dynamically, I'm not sure that robot crawlers and accessibility devices are going to play well with that !

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads

  • My bad ! I'm an airhead... The link is up in the original post, now...

  • A quick notice : since the Webfont aren't part of the C2's canvas per se, you can't rotate them (or apply any filter as well) inside C2. You need to specify them inside the css. Don't forget your browser vendor specific prefix !

    (For example, to rotate text 67? :

    -webkit-transform: rotate(-67deg);

    -moz-transform: rotate(-67deg);     

    And with a picture :

    <img src="http://dl.dropbox.com/u/1412774/WebFontC2Plugin/demo2.png" border="0" />

  • Noga: very nice feeling, you gave to your prototype !

  • Not to mention the fact that ImpactJS doesn't implement all of the HTML5/JSCSS3 spec, since it needs to translate the calls to OpenGL...

  • 2. Please, please, please stop using uid. It was not designed for this purpose.

    Instead use the object index, as in sprite(index). Each time you add an instance(even in the editor) it is assigned an index based on how many instances already exist. That's far more practical than trying to guess what the uid is.

    The problem is that you can't access dynamically the ID ofan object. For example, when I click witht the mouse object on a Sprite, I can store his UID in a var, but not is ID.

  • JohnJ: since the WebFont plugin I published today isn't working the same way, you can try to display HTML strings, for the moment ;).

  • Edit : added the URL for the plugin archive itself, silly me...

    Following the work on the HTMLDisplayString, I made a quick plugin to display Webfonts inside Construct 2.

    Inside Construct : <img src="http://dl.dropbox.com/u/1412774/WebFontC2Plugin/inside.png" border="0">

    And inside a browser :

    <img src="http://dl.dropbox.com/u/1412774/WebFontC2Plugin/demo.png" border="0">

    (tested with FF and Chrome, by the way).

    The URL for the demo : http://dl.dropbox.com/u/1412774/WebFontC2Plugin/index.html

    The capx : http://dl.dropbox.com/u/1412774/WebFontC2Plugin/webfontc2plugin.capx (the demo also use the CallJS plugin to display an 'alert', but it's not needed to just use the Webfont plugin).

    The plugin : http://dl.dropbox.com/u/1412774/WebFontC2Plugin/pode_webfontv1.zip

    As you can see, you can style everything via CSS (and even use images as background via background url() !)

    With a bit of ingeniosity, you can also embed some classic HTML string inside...

    To make it works, you need to provide the name of the css file which contains the @font-face declaration.

    You also need to provide the type of HTML element in which the webfont is going to be injected (for example p), and you need to give that tag an ID (for example myp).

    <img src="http://dl.dropbox.com/u/1412774/WebFontC2Plugin/info.png" border="0">

    You also need to declare a CSS file, and to place it at the root of your exported game (that means that you can't see anything when previewing the game, only at export). Something like that.

    Depending on where is your webfont, you will also need to perhaps put it at the root of your game, next to the css...

    By the way, I have no rights on the webfont used as an example, so don't use it for anything commercial, you could break some licence...

  • JohnJ : strange thing about Opera, usually they are the first to implement something, and to implement it right... I'll try to see what tey are doing to see if a workaround can be found. About Safari, I need to check also (but Safari has his lot of little inconsistencies, like Firefox...)

    I wonder, if, in the end, Ahsley solution isn't the simpler one.

    I made that because I remember that somebody here wanted to do a whole website with HTML embedded inside C2.

  • Ashley: I use the <foreignObject> tag of SVG. It allows me to embed straight HTML inside the SVG DOM. Since it's in the spec, everybody browser should render it cleanly (sort of...)

    I then set up an Image(), with the src defined as a SVG dataURI (so nothing "hackish"...)

    Here's the basis :

    var data = "data:image/svg+xml," +

    "<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'>" +

         "<foreignObject width='100%' height='100%'>" +

         "<div xmlns='http://www.w3.org/1999/xhtml'>" +

         this.HTMLString +

         "</div>" +

         "</foreignObject>"

    [...]

    var img = new Image();

    img.src = data;

    [...]

    ctx.drawImage(img);

    [...]

  • I'm currently working on it. It's difficult, because the way you declare font families inside SVG and HTML isn't the same. And I need to make the HTML part inside the SVG access that font...

  • <font color="red">Edit : 27 april</font>

    New build of the plugin.

    You can get back the HTML String as a base64 representation !

    So now, you can have whatever HTML string you want inside the plugin, and get it back to inject it as an image a Sprite, for example !

    <img src="http://dl.dropbox.com/u/1412774/HTMLStringDemo2/demo.png" border="0">

    The demo : http://dl.dropbox.com/u/1412774/HTMLStringDemo2/index.html

    The .capx : http://dl.dropbox.com/u/1412774/HTMLStringDemo2/HTMLStringDemo2.capx

    The plugin : http://dl.dropbox.com/u/1412774/HTMLStringDemo2/pode_html_string.1.3.zip

    Remember, because of the way it's handle behind the stage, don't forget to set a size for your HTML string.

    You can use something like that :

    "<p style='font-size:20px;'>your_HTML_string</p>"

    <font color="red">Edit : 08 february </font>

    I uppdated the plugin. There should be no more screen updating problem.

    Demo : http://dl.dropbox.com/u/1412774/HTMLStringC2Plugin/index.html

    Plugin : http://dl.dropbox.com/u/1412774/HTMLStringC2Plugin/pode_html_string.0.2.zip

    Capx : http://dl.dropbox.com/u/1412774/HTMLStringC2Plugin/HTMLStringC2Plugin.03.capx

    <img src="http://dl.dropbox.com/u/1412774/HTMLStringC2Plugin/demo.png" border="0">

    -------

    Since impossible isn't french (and to proove Ashley it can be done, since he is english - eternal rivalry across the Channel :p), here's a plugin made to display HTML formatted string inside C2.

    I tested it inside Firefox. Should also work in Safari and Chrome (it's some kind of a hack, but it respects the SVG specification...)

    http://dl.dropbox.com/u/1412774/HTMLStringC2Plugin/HTMLStringC2Plugin.zip

    Here's an example http://dl.dropbox.com/u/1412774/HTMLStringC2Plugin/index.html and a quick screenshot : <img src="http://dl.dropbox.com/u/1412774/HTMLStringC2Plugin/htmlstring.png" border="0"> (yes, the little blue things are images. Base64 images... Don't remember were they come from).

    As you can see, you can use CSS styling (don't forget that since we are using a SVG container via a <foreignObject> proxy, you need to use XHTML strict - ![CDATA[ and the like, as can be seen in the capx http://dl.dropbox.com/u/1412774/HTMLStringC2Plugin/HTMLStringC2Plugin.capx)

    The plugin is still a bit dirty and in alpha state, I prefer to release early & often.

    Comments & Critics are welcome, bugfixes are better ! :)

  • 0plus1: if I understood your problme, you want to click on a card, and after that on a second one. At that moment, you want to delete the previous one. If so, you can do it that way : http://dl.dropbox.com/u/1412774/cardV2.capx

  • Lprez: you can put an action like "Animation : setSpeed", run by the system every X seconds.

    And, by the wait, are you sure the image of your avatar is appropriate on a forum where underage children can read the various pages ? (it doesn't bother me, but it can offend some people...)

  • alligator: it's completely possible to do that by using the CallJS plugin...