Thursday, December 25, 2008

Juniors Interview Clothing

Hello world! (2 nd part)

After seeing the programs can be in C to create SVG files (programs that in principle could also be written in PHP and any language), I will explain a hello world according to blog another approach: interactive SVG files.
SVG format allows for two types of interactivity, which explained a little above would be these two:
    By
  • scripts (scripts) in this case put scripts in the SVG file (or in a separate file, which then link to the SVG file.) These scripts allow you to interact with elements of the SVG file. For example, you can get when you press a button to change the color of an element or position, or change the text of a text element. This system also allows adding new elements to the SVG file that were not originally defined (for example, every time you click on a square a circle appears on screen again in a different position). Examples:

    svgDocument.getElementById ( 'helloworld' ). FirstChild.data = "Hello world!" ;
    svgDocument.getElementById ( 'panel_epicicloides' ). SetAttributeNS (null, "visibility" , "visible" ) svgDocument.getElementById ( 'laser' ). SetAttributeNS (null, "points" points )

    The first example changes the wording (replacing its contents Hello World!). The second brings up a group (called panel_epicicloides), this group contains several figures that act as a dialogue. What it does is change its visibility property (visibility) enabled. The last case, adjust the path of a polyline (called laser) and gives him the points put before the text variable points. It changes the ownership points. By
  • SMIL Animation: in this case there are hyphens, but SVG tags which indicates the actions. These tags do not have as much power as the scripts (scripts) but make it much CreAcción some interactive effects, such as changing color of a component while passing the mouse over them. One drawback of this system is that Firefox 3 is not adapted (SVG file is shown without these effects), but I think that they do not include this improvement.
    There are two types of labels: set and animate. September lets you apply an attribute directly, without an intermediate transition (eg, a red rectangle, it immediately turns green). Instead animate a transition can produce lasting, and allows for several intermediate steps, interpolation of intermediate values. For example, you can have the rectangle red before, but to be going green for the color purple, blue and finally green colors during a transition from three seconds long. In both cases, you must specify an event that initiates the change, an attribute and the value for the attribute.
    Some examples (click to enlarge):
    In the first two lines are used set. Tickets are alternatives, the first is activated when the mouse is within the g_hola_mundo group and the second when it exits. The attribute that change is the filling (fill) and give in to the right color. Its operation allows a color change when you move your mouse over g_hola_mundo group (which would come to act as a button).
    In the third line is an animation where the color is changed through a transition of various colors that lasts a second.
The example of "Hello world!" Interactive would this code (I'll upload to a web page I'm preparing with the SVG file ready to view in the browser). The two ways are used to provide interactivity

would be something like:
Operation is simple: first you see only the button click. Pressing the button displays Hello World!. Meanwhile, the button takes a greenish color when you mouse over it (in Firefox 3 is not appreciated latter).
In can highlight several details:
  • The head of SVG hello world is different from the previous blog entry, since that did not work in animation. This new header copy of the first link of the sources (apike.ca), and also copied the first function of the script. If you are programming the SVG file seems silly and does nothing, can be two things, you're wrong in the script (a misplaced comma can stop execution), or is poorly directed header.
  • One group (called g_hola_mundo), which includes a rectangle (r_hola_mundo) and text (click). This group pointed out in green and is assigned that when you click the mouse on is called the "hello world" script. This function is mapped on the group and not on the box, because if the rectangle is assigned only work in the area is the rectangle, that is, if you just click on the letters of the text does not do anything. However, if the function is mapped on the entire group (text and rectangle), works around the area.
    Let's say this group is for all practical purposes ... a button as any dialog.
  • A script with a function (hello_world) that is activated by clicking in the "g_hola_mundo." This function modifies the text item text "helloworld" (the last entry in the SVG file), replacing the space that was originally by the Hello world!
  • Two labels to animate the background color of the rectangle forming the button to activate the hello world. The first assigns a greenish background color when the mouse passes over the group. The second assigns the original color when the mouse leaves the area. The event is to put the mouse in the group, because if it were made on the basis of the rectangle would have only one problem: when you mouse over the letters of the text is interpreted in the same way the mouse to draw the rectangle, and fail .
  • The rectangle appears on two labels instead of one. This is done when you have to add properties to animate the rectangle.
    The first line (shaded in yellow) would be to define a rectangle that is not going to be animated or anything. It is a single label and is to indicate the end bar (/) that is placed on the closing tags.
    The other lines (shaded in green) also define a rectangle, but in between you can enter tags for defining animation. It is very important to note that the slash (/) only appears in the second label, the end and never the first.
    The remaining elements (circles, lines, polylines ...) work similarly. Usually defined using a single label, but if you want to add animation, you use two tags to define the animations between.

Sources:
  • http://apike.ca/prog_svg_smil.html
  • http://rendergraf.wordpress.com/2008/09/12/animacion-svg-% E2% 80% 93-comes -the-alternative-to-flash-but-with-a-standard-free /

Saturday, December 20, 2008

How Much Does A Yonex 9900 Cost

Hello world! Brief introduction to SVG

best to start is with the classic Hello World. Have a program to generate a Hello World is not difficult, just paste the SVG file entries within fprintf and fputs function where you type the file SVG.
is very important to add a backslash (\\) before each quote ("), otherwise, it interprets the end of the chain and will fail the program or you can not compile.

Soon I'll upload the code source to another web page to publish the source code, SVG files and downloads with ease, as this blog fails to copy the source code.
would be something like:

Not much to explain this hello world :
  • The encoding (encoding = "ISO-8859-1") is to indicate the character encoding of the SVG file. If you enter bad accents and non-English punctuation appear wrong. The value entered depends on how you save the text file when you type.
  • width and height indicate the screen size it will occupy in the SVG file. If its value is 100%, indicating that the SVG file will occupy 100% of screen space or space to indicate the EMBED tag. If no percentage numbers indicate a fixed size that does not change. If the EMBED tag gives the SVG file size smaller than indicated by the figures, this will cut, and if greater, it will have a blank area unoccupied.
  • Viewbox however, indicates the portion of the SVG image is cut and fit in the box indicated by width and height.
  • label text indicates the text . The simplest way to use it is entering the text directly from the label to open and close. Its properties indicate the font, color, position ... allows anchor text-align text (left to end, right and center to start in middle) on the point indicated by the coordinates x, and (in this case 60 for the two values).
The previous source code works fine but does nothing special that can not be done with Notepad or any text editor (VI, Gedit ...) or Inkscape. Replacing some functions printf and by changing some numerical values \u200b\u200bfor variables, you can get a program that generates an SVG file of given size, with the phrase Hello world! focused on the SVG file.

The program now uses two variables to determine the width and height of the SVG image. It also places the text in the center by using the parameter text-anchor = "start" on the label text and locate the point where text is aligned right in the center of the image. Changing the height and width values, the SVG file that comes out will be bigger or smaller. Plus now the source text is a bit larger than before.
What could be out of this program?
  • can create something similar in PHP. In my case I used C for their ease of understanding in simple examples, but with PHP you could do a similar program.
  • width and height variables receive the value in the collection, but a program "well done" would take the values \u200b\u200bof these variables of parameters passed to the program, text file input, database. .. each case is different.
  • Used % .1 f in printf because the screen does not need a higher precision to one decimal place. If nothing is placed, printf would 6 decimal places, which increase the size of the file. In this example with few uses this detail does not matter much, but in a 500 point polyline if this affects more detail.
  • To put the text to use floating point numbers ( % .1 f), while the size of the SVG image whole numbers (i %). This is because the size of the image must be an integer, but then, when placing the elements within it, you can use floating point numbers.
  • is written (float ) front of each float number calculation. This is because if not done, the value is calculated first as integer and then converted to float (ie, the division would no decimals). However if it becomes the number before the float, the calculation is done as floating, and thus allows the results of operations may lead decimals, making the position of the text is more accurate than if calculated without decimals.
Source:
  • http://vanus01.net/web/generando-imagenes-svg/2/

Sunday, December 14, 2008

Mexicanas Hermosas Culiando



The main theme of this blog will be programmed using the standard vector SVG files. That standard is very similar to SWF, but has different advantages and disadvantages of different to SWF.

The main drawback is that hardly is spread on the Internet, are only compatible Opera, Google Chrome and Firefox. Internet Explorer can be compatible with Adobe extension part is installed, but few users would be willing to install it. Currently over 25% of browsers in the world would be able to use SVG without problems, although this percentage is steadily increasing. (1)

Another reason for low usage is that there are hardly any resources for SVG (forums, tutorials ...), while for SWF there are many more.

As highlight advantages SVG is text-based format and XML. This is that it be easily created without additional libraries used by any program. Another advantage is that it is a free format, without patents or royalties (royalties), and can be used without problems.

As for programming, use ECMAScript, which is a language similar to Java Script.

SVG files stored on character always open (unless you use a code obfuscator) since and have not compiled all the code visible. SWF files are created from FLA file with all "material" and distributed "compiled" in SWF format (there are special applications that can decompile, although recovery is never original code).

Another advantage of SVG is that you can use CSS style files, which are better integrated into web pages. Finally, I would emphasize that being an XML format, it is less likely to compatibility issues with different versions of SVG.

As support for mobile phones, PDAs ... SVG format can be well supported by some smaller versions called SVG Tiny and SVG Basic. These versions do not have the same opportunities as the full version (no filters, for example). Although many models are not limited to SVG Tiny and SVG Basic include some features of the full SVG format.

When deciding on one or another must assess the advantages of each.

Theoretical Yield Benzocaine

now also SVG

This is the first publication of this new blog. My goal is to loose talk about some little project I've been doing on SVG. I'll comment a little to do in each, thus contributing to others loose ideas that need to do something like what I've done.

could also talk about how to make SVG games, but do not expect me to spend has great games like those seen in flash, as much would be games where I explain some simple tricks.

Another idea also is to discuss SVG files that others have made and explain how they work.

In principle I have three projects to comment, and I'll speak slowly. These projects are also hosted on another website (to let you see the SVG directly from your browser.) This website is using popup windows (pop-ups), but this blog will not use intrusive ads (if I have future plans to add advertising Ad-sense, which is slightly annoying). Be blocked pop-ups may be enough in that other website.
  • Chart with English regions. is a program from a text document with data (such as the population in this case) generates an SVG file with some interactivity, where when you mouse silhouettes above amending the text is below. For the future it would be interesting to use several maps.
    In the first version I used this map:
    http://commons.wikimedia.org/wiki/File:Mapa_Espanha_CC_AA.png
    So the maps would be to do with the GFDL. The program will deliver you with BSD license.
  • 3D surface plot. is a C program that generates an SVG file static graphic with lighting effects and various positions. My idea is that you could turn this chart. The downside of this project is that a certain number of polygons the browser takes much to draw the graph (this is the case of the image, which can take 10''full drawings.) Ya, that is to create a complete rendering engine in SVG ... I think that cop out of my ability, lol.
  • laser simulator by Lissajous figures. is a SVG file with several buttons that change the shape of a polygon-like shapes giving a typical effect that is done with lasers, or can be displayed on oscilloscopes. A future idea would be the possibility of adding new figures, and displayed a dialog or other figure as it is.

Wednesday, December 10, 2008

Silverado Ss Concept For Sale

Thanks

After the course, also ends this tutorial. However I wish that it remains up to date so that with time, I will update some of its content.

from this site to thank each and all the colleagues and fellow bloggers that are referenced in various entries on these pages. Without them it would have been more difficult the task of assembling this tutorial on Blogger. If anyone

both course participants and those who choose to follow this tutorial want to send a comment or statement, do not hesitate to e-mail address listed below or make a comment about any of the entries in this blog. Health


Fco Daniel Sánchez Vázquez
Email: dasava [at] gmail.com

Saturday, December 6, 2008

Miniature Engine Model Kits

Task 12: Inserting

If we add to your sidebar a counter that tells us the place from which the visitors to our blog can add
a widget from Feedjit has several free widgets showing a report of site visitors and can be used anywhere without having to register.

You only go to Feedjit page and select one of the 4 offered, although the first two are the ones that most interest us: the Live Traffic Feed and Live Traffic Map. The first one presnete procedncia unarelación of our past visitors and the second we offer a world map with places where there have been visits.

can configure them in terms of colors and then copy the code that we offer in the form field to insert it into our blog by adding a text gadget and cheating on him cçódifo. But offers the possibility to use the option to add it directly to Blogger and if we are to open session (identified) in Blogger, we automatically inserts the code on the blog you want.

Prospects For Msc Finance

visitor traffic Task 11: Inserting images and text widgets

We may have seen that in many posts contain images that link to pages on campaigns, reports, etc., which, perhaps, wish they said. We usually offer a code that will display a logo or image of the campaign and the link, through him, to where the campaign said.

If you want to appear in the sidebar (widgets) you must insert the code in the "Design" Page Elements "add a gadget an HTML / Javascript or image and paste the code only. This depends on what we offer. The example is my first of a campaign that offers both the code and select a type gadget HTML / Javascript. Instead the second example is an image that must link to a URL or Internet dircción and do not give you the code, so we can use the gadget image.

can try with two examples:

CAMPAIGN: YOU ARE WHAT YOU WRITE , AS YOU WRITE . For correct use of language in blogs. Add a gadget type HTML / Javascript and paste the code that we offer.

CAMPAIGN OFFICIAL RECOGNITION OF WEB PUBLISHING . Once at the site, a wiki, in the lower page is the option Put it BANNER. Once on that page choose the banner you want depending on the size offered. Copy the path of the image, go to your blog and in the area of \u200b\u200b"Design" Page Elements ", pick a gadget-type image. It must put the URL of the image and set how external and on the other hand, you must copy the URL of the website where you want to link in the "Link". The Title and Caption, in this case need not be filled in but, if you want, do it.

Above Waist Back Left

Task 10: Google Maps in Blogger blog Configuring

In many cases may be presented with the possibility of having to give our blog a location of a particular location using a map like Google Maps .
If this is the case nothing better to offer for our visitors to locate the site that we are discussing.
To do this we must follow the following steps:
1. Go to the homepage of Google Maps .
2. Locate the place you want to view typed into the form the name of the town and country, separated by commas.
3. Once we listed the location indicated by a label, we must use the tools that allow us to visualize the location or site from various perspectives, Map, Satellite or Terrain
4. Then we use the zoom tool to view more or less accurate visual location.

5. When we managed to select the display type and appropriate zoom level we must click on the button with elratón Bind, so we will see a popup that gives us two codes. The first one permnite make the link that leads to the page you are currently watching. The second, however, allows us to take the code to embed in our blog post.
But also allows us to customize the image that we will provide in Neustr emebebida blog so we click on the option to customize what appears on the bottom line for us to present a window to help us select the size of map to be seen. To change this property form below we can see the size you submit the map.
Once chosen the size, the bottom of the page we can copy the code that Google Maps offer us posicion'sndonos on the code, clicking with the right button, selecci9onado "Select All", repeating the operation and this time , select "Copy."

6. Then we go to our blog, edit or create the entry in which we want to appear, click on "Edit HTML", picking the right mouse button and selecting the paste option. In this way we nnuestra embedded map entry.

7. If instead we decided to put a link to Google Maps page that we are viewing, we only put on a word or image link to the site.

Finally, in reference to the first comment made asking how to appear in the sidebar they consider to be brought into the area of \u200b\u200bDesign, add a widget and select the HTML / Javascript. Here, we put in the appropriate form field code that offers Google Maps. bearing in mind that we should have customized the size to fit into the width you have our sidebar. I hope he stays clear.

Wednesday, December 3, 2008

Banana Reduce Skin Redness

-Part III Configuring

We will continue discussing the possibilities with the following design Menu options Design.

Fonts and Colors: we can change the aesthetic in terms of fonts and colors on our site. A screen divided into two frames or frames . At the top presents the possibilities of changing color and font of the various sections of our blog. Just select and save or cancel changes. In the bottom frame appears our blog with the changes that are happening as you do.

HTML Edit: This option is one of the oldest in Blogger since all the changes we wished to perform type gadget had to be done by inserting the code in the template. It is thus a difficult choice and drawbacks so that you may give the erroneous manipulation ruin our blog. At first comes the recommendation to perform a backup of our staff for if we had unexpected surprises. This option lets you save the template Neustr computer to make changes to it and if we do not like or have "messed up" to restore the old template file from the hard disk Neustr. The second option presented to us is precisely to recover our staff. But it also serves to use an external template that Blogger does not come in but other Web sites such as:
Blogger Templates
More templates for Blogger
Insert a template that we provide on the Web is bajársela in a file that is the area code and from the Edit Design-HTML, taking the above option of uploading a template.
The rest of the page are options to help correct the mistakes, or undoing the changes to restore or recover the old template to Classic Template.

Pick New Template: This option has the classic templates that Blogger offers, select one of them and within each one can choose a range of colors. We preview template and the Save Template button can make the changes.

Finally at the top right we see several options such as: Desktop
: with it leads to the area of \u200b\u200bmanaging the various blogs, is like the lobby.
My account: access certain parameters of our Google account that we can change the password, security question and sites from which unauthorized access to Blogger. We can also see other services that use Google (Picasa, Calendar, Sites, Gmail, Documents ...)
Help : for now is in English. Exit
: Used when we're in a strange computer out of the zone of Blogger is not to open session and another person can access our data and blogs. Remember when Neustr accedemso a blog to manage it with your username and password, log in to the computer that serves the blog, leaving a cookie-cookie "on your computer through which we attempt to administer the blog without having to write continuously our password. This session usually lasts a long time so it is advisable to close COMPUTERS especially strangers.
This is all about shaping our blog.
There are other ways to modify the aesthetics of our blog but requires more knowledge that can be acquired by searching the Web and read entries from other colleagues who are more advanced.

Tuesday, December 2, 2008

How To Keep Snakes Out Of My Garden

blog-Part II Setting up the blog

Another of the possibilities offered by Blogger refers to design of our blog. If you time the work was omplicada today Blogger has improved this aspect and allows us to introduce our series of gadget or widget (mini applications to complete or improve our blog with very specialized functions, under this same concept is also a comb). We can also change the font and colors to use in the log, the ability to edit the HTML template or select a new template.
To immerse ourselves in this section should go to the administration area of \u200b\u200bour blog and click on the Design tab . Once we have done we are presented with several options on the bottom row of tabs to the area, already mentioned above.
The first option presented to us and that is selected by default is to Page Elements. She will add and organziar pemrite the items on the page and shows an outline of the template you are using.



From here you can edit siguienets elements:

navigation bar: clicking the edit access a window where we can only change the aesthetics of the area by selecting among several proposals. Header

our blog : clicking on the edit option appears another window through which we will change the title of the blog andthe description. Similarly we can upload an image that is hosted on your PC or on the Web. This really will completely change the aesthetics of the head because it will insert a more evocative or attractive and may be placed according to the options listed below. The header image should be 740 pixels wide by 100 pixels high 0130. Recommendation: Before making changes is better to save the template on your computer to restore it if unexpected hap. (Edit HTML tab , option Download Full Template).



Blog Entries: In this section you can make several changes in its structure. By clicking on the option to edit a window appears in which we choose how many entries can be viewed on the page, date formatting, comments, tags ... Also we have some elements of the position you want.

lateral area menu: Here you can enter widgets or gadgets that I talked to the top of this post. In this case there is the option to edit as it is replaced by the expression insert a gadget. Gadgets already entered will appear with your ability to edit. When clicking on add a gadget for us a window with the various gadgets that we can include classified by different categories. Once you choose us you get the option of filling the data that each gadget you need.
Finally we can also edit the footer adding a gadget.