Call container page function from child iframe

The simplest way i got to call a function that exists in the iframe container page is using:

 

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>title>
head>
<body>
    <form id="form1" runat="server">
    <div>
        <script language="javascript" type="text/javascript">
            function AlertFromParent() {
                alert('I am parent');
            }
        script>
        <iframe src="IFramePage.aspx" id="myIframe">
        iframe>

    div>
    form>
body>
html>

 

 

Notes:

– This function is working just if the 2 pages ‘the parent and the child’ are in the same domain name, and if they are in 2 different domains you will get permission denied error.

– If you will run the javascript code inside the iframe on load ‘as in the previous example’, make sure that the parent script function exists before the iframe tag, because the iframe will break loading the page till it finish loading and everything after it will wait till it completely loads.

Flash Javascript communication first look

 

I did a fast research about how to make flash interact with the container website, and i collected some good information.

4_flash

There are 2 main techniques to implement communications between flash and the container website:

Example: http://www.kongregate.com/developer_center/docs/kongregate-api

1- Client API technique:

Reference: http://www.adobe.com/devnet/flash/javascript_api.html

Using this technique, the flash will communicate with the website through JavaScript.

So in brief, the flash can send and receive variable from the website using Javascript, and for this first research I got 2 main ways to make flash interact with Javascript:

a- Using the ExternalInterface which exist in the action script classes, http://livedocs.adobe.com/flex/3/langref/flash/external/ExternalInterface.html, http://kb2.adobe.com/cps/156/tn_15683.html#about,

Example: http://jodieorourke.com/view.php?id=122&blog=news

b- Using normal Javascript calls as in this example: http://www.permadi.com/tutorial/flashjscommand/ which describes the main functions to interact with the flash using Javascript.

2- Server API technique:

Example: http://www.puarcade.com/demo/classic-games/snake

Using this technique, flash will call the server side APIs directly, and will post variables to the API URL, also there is another way is to send these variables using Querystrings, which will not be the right way all the time and may be not possible in some cases ‘put in mind for example the max number of query string characters’.

Conclusion:

Most of game websites use the server side APIs, but big famous website give both options, server or client side APIs. http://www.kongregate.com/developer_center/docs/kongregate-api

Server Side advantages from my point of view:

– More secure calls.

– Works whatever the user enabled javascript in the browser or not.

– No problems with different browsers compatibilities.

Client Side advantages:

– Middle layer, between the server side code and the flash, which encapsulates the server side methods and don’t let the flash call the server APIs directly but will be through this JS layer.

– Gives the ability to submit values to the server using Ajax style ‘without refreshing the whole page’.

– The flash will need less information from the website, as the Javascript code will handle most of the common variables ‘such as the current user, the current page URL, …’.

By the way in both cases we will need to implement the server side API first and then will let the Javascript and flash code interact with this APIs.

http://stackoverflow.com/questions/3179476/whats-the-best-practices-to-let-flash-files-communicate-with-my-website

HOW TO TELL WHEN IMAGES HAVE LOADED

4328553366_e4789ac407_z

Its a common requirement in some websites specially which are dealing with many images and JavaScript, such as image galleries websites or websites that has images slide shows made using JavaScript.

In a project i just finished, i was making a slide show animation which start automatically when the page load and animate to a certain image based on a query string.

I was using JQuery to implement this simple slide show.

The Problem i faced is that the JQuery animation start to run before the images inside the slide show are loaded, and them make the animation seams as its animate on white screens not images, and will look worse on IE browsers which may give the ‘x’ sign on images which didn’t load yet.

So my mission was to find a way to don’t start the automatic animation until all images have loaded.

At first i just wrote my code in the document.ready JQuery function, but this made my code to run just after JUST the document html have loaded and will not wait till images load.

I found a good solution:

See $(document).ready vs. $(window).load

 

Also found a solution which will work with just an image, incase you want to wait just for an image to load:

Different ways to watermark html input text

watermarktext

 

There are many ways to add a watermark text to an input text, which will go when you focus the control or start writing inside.

I will list here some good ways to this behavior:

This is an easy and short way to it just using the onfocus and onblur events of the textbox or input field.

But lets make the code cleaner by geting this text from the server side, which will give us many options such as supporting localization.


 Also you can find online a lot of other ways which will fit in some cases such as the following:

jQuery Watermark

Watermark Input Plugin

TextBoxWatermark (AjaxToolKit)

In-Field Labels jQuery Plugin

Guidelines for high-quality URLs

url-1024x768

Usability expert Jakob Nielsen (www.useit.com) urges developers to pay attention to URLs and
provides the following guidelines for high-quality URLs:
❑ A domain name that is easy to remember and easy to spell
❑ Short URLs
❑ Easy-to-type URLs
❑ URLs that refl ect the site structure
❑ URLs that are “hackable” to allow users to move to higher levels of the information
architecture by hacking off the end of the URL
❑ Persistent URLs, which don’t change

 

 

copied from wrox professional mvc 1.0

Send email from gmail using asp.net, godaddy shared hosting

godaddy[1]

“Sending email is working local, but when i put online its not sending and returning errors”,

We hear a lot of people online suffer from this annoying problem, i had the same problem but rather than spending a lot of time searching for solutions on google and forums, i went to godaddy support website, and i found the answer very clear, answers are on these to articles:

How should I send email from my IIS 7 Windows shared hosting Web site?

Using CDOSYS to Send Email from Your Windows Hosting Account

I tested this solution and worked perfect after launching the website on my godaddy windows shared hosting.

Indexed pixel format problem in GDI+

Exception : "A Graphics object cannot be created from an image that has an indexed pixel format".

this exception happed in my application while trying to draw string on a .gif image,

I read about this problem and found in MSDN that: If the image has an indexed pixel format, this method throws an exception with the message, "A Graphics object cannot be created from an image that has an indexed pixel format." The indexed pixel formats are shown in the following list.

And found hundreds of articles talking about solving this problem, some a little complex and some really simple, i tested the simple way:

 

 

C# : indexed pixel problem

And its simply worked, just create a temp Bitmap and use it to create the Graphics.

Strange but worked!!

Trick to resize transparent images

I wanted to make a small image resize function in my asp.net website, and everything worked fine, but i faced a problem resizing transparent .png and .gif images.

After resizing done, i find that the output resized images transparent parts become white color and not transparent anymore.

This was my code:

 

And searched to find a solution for this problem with no hope for a complete easy solution.

 

And while trying to find a way, i remembered that i did a small resize tool “windows application” 4 years ago, i decided to try it and see the output, and i found after resize the image, the output is very nice and preserve transparent :).

I traced the code, and found the only difference is that in my windows application i was using the PictureBox control not the Graphics class.

I copies the code from there and put in my asp.net “sure needed to import System.Windows.Forms library in my asp.net to use the PictureBox control”.

 

And the Code became:

 

 

I believe that using Windows form control in asp.net is odd, but it solved my current problem, it may need some more testing for performance issues.

Deploying ajax wcf service on shared hosting.

2 day ago i suffered from launching a testing website version on my shared hosting account, what i suffered from is that the website had a wcf ajax service which i was using in ajax calls from jquery to server.

I faced a lot of small problem in configuring the website to work the same as it works local.

The main problem i faced, that i didn’t find anyone on the internet talking about how to solve this problem completely.

After reading many articles and editing my web.config many times, i got it, and here is the result web.config which is running now on server and everything is working fine with wfc.

 

Notes:

My hosting was shared hosting godaddy, with IIS7 installed.

 

Also check this article, you may face this problem as me: http://blog.abstractlabs.net/2009/02/ajax-wcf-services-and-httphttps.html

 

Edit: after some days trying with ajax wcf on my shared hosting in my current project, i decided to remove it and get back to normal webservices, i don’t have time for “shared hosting-wcf” hassles, at least for now.