Just another tech site

Archive for April, 2011

Google Code Playground & Feed API

Google Playground

Google provides a web based test environement for the diferent API that are available.

http://code.google.com/apis/ajax/playground/

Feed API

simple Feed composant

The code


<!--
You are free to copy and use this sample in accordance with the terms of the
Apache license (http://www.apache.org/licenses/LICENSE-2.0.html)
-->

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>Dynamic Feed Control</title>
    <script src="http://www.google.com/jsapi" type="text/javascript"></script>

    <!-- Dynamic Feed Control and Stylesheet -->
    <script src="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.js"
            type="text/javascript"></script>
    <style type="text/css">
      @import url("http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.css");
    </style>

    <script type="text/javascript">
    /*
    *  How to use the Dynamic Feed Control, which has pretty UI already made for you!
    *  Don't forget to check out the options:
    *  http://www.google.com/uds/solutions/dynamicfeed/reference.html
    */

    google.load('feeds', '1');

    function OnLoad() {
      var feeds = [
        {
          title: 'Blog',
          url: 'https://devreminder.wordpress.com/feed/atom/'
        },
        {
          title: 'E-Online',
          url: 'http://rss.cnn.com/rss/edition.rss'
        },
      ];

      var options = {
        stacked : true,
        horizontal : false,
        title : "Test Feed"
      };

      new GFdynamicFeedControl(feeds, 'content', options);
      document.getElementById('content').style.width = "500px";
    }

    google.setOnLoadCallback(OnLoad);
    </script>
  </head>
  <body style="font-family: Arial, sans-serif;border: 0 none;">
  <div id="content">
    <span style="color:#676767;font-size:11px;margin:10px;padding:4px;">Loading...</span>
  </div>
  </body>
</html>‚Äč
Advertisements

Flash calling a new Flash in IE

Supose you developpe a FLASH loader that calls a new FLASH (swf) in the browser.
Well the behaviour depends on the browser you’ve got

In the Flash, ActionScript

<pre>loadMovie("products.swf",_root.dropZone);</pre>

here is the Javascript trick

<object id="Object1" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="998" height="515">
    <param name="movie" value="flash/Preloader_images.swf" />
    <param name="quality" value="high" />
    <param name="wmode" value="transparent" />
    <param name="allowScriptAccess" value="always" />
    <param name="swfversion" value="6.0.65.0" />

    <!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don't want users to see the prompt. -->
    <param name="expressinstall" value="js/expressInstall.swf" />

    <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
    <!--[if !IE]>-->
        <object type="application/x-shockwave-flash" data="flash/Preloader_images.swf" width="998" height="515">
    <!--<![endif]-->
            <param name="quality" value="high" />
            <param name="wmode" value="transparent" />
            <param name="allowScriptAccess" value="always" />
            <param name="swfversion" value="6.0.65.0" />
            <param name="expressinstall" value="js/expressInstall.swf" />
            <!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->
            <div id="Div1">
                <h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
                <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" width="112" height="33" /></a></p>
            </div>
        <!--[if !IE]>-->
        </object>
    <!--<![endif]-->
</object>

HTML5 : Mind Blowing Demo

DEMO 1:

Enter your address and you will see the google earth images inserted in the video …. incredible!

http://www.thewildernessdowntown.com/

DEMO 2:

http://craftymind.com/factory/html5video/CanvasVideo.html

ASP.MVC3 @ TechDays2011

Introduction

Double goal of this new release

  • simplify your code
  • allow deeper extensibility.

The main improvement are

  • The Razor View Engine
  • Support for Multiple View Engines
  • Controller Improvements
  • JavaScript and Ajax
  • Model Validation Improvements
  • Dependency Injection Improvements

What’s new

The Razor View Engine

The syntax is concise.

IntelliSense support in Visual Studio.
-> short learning curv

Razor also includes new HTML helpers

Support for Multiple View Engines

Razor is the default View engine. but the user can use open source View engines

Controller Improvements

Global Action Filters

Sometimes you want to perform logic either before an action method runs or after an action method runs. To support this, ASP.NET MVC 2 provided action filters.

New “ViewBag” Property

MVC controllers support a ViewData property that enables you to pass data to a view template using a late-bound dictionary API. ViewBag is a dynamic property. It does the same that the ViewData


ViewData["Message"]="text",
//is equivalent to 
ViewBag.Message="text".

New “ActionResult” Types

for example HttpNotFoundResult. Returns a 404 HTTP status code to the client.

HttpNotFound: This return type returns a error 404 on client.
RedirectResult:This returns a temporary redirect code 302 or permanent redirect code 302 depending upon a Boolean flag. This kind of redirection is very important for Search Engine optimization.
HttpStatusCodeResult: Returns a user specified code so developer have choice to return specific error code.

public ActionResult SpecificResult()
{
    return new HttpStatusCodeResult(404);
}
 
public ActionResult NotFound()
{
    return HttpNotFound();
}
 
public ActionResult PermanentRedidrect()
{
    return new RedirectResult("http://www.test.com");
}

JavaScript and Ajax

This is maybe one of the biggest simplification. Unobtrusive JavaScript avoids injecting inline JavaScript into HTML.

Client-Side Validation Enabled by Default

In order for client-side validation to work, you still need to reference the appropriate jQuery and jQuery Validation libraries in your site.

Remote Validator

A new RemoteAttribute class that enables you to use of the jQuery Validation plug-in’s remote validator support.
Generation des appels AJAX pour des validation cote client.

  • in the model use the [Remote] attribute
  • In the Controler the validation function will be implemented and returns JSONResult
  • in the View a tag

Model Validation Improvements

public class User
{
[Required]
public string Password { get; set; }
[Required, Compare("Password")]
public string ComparePassword { get; set; }
}

Dependency Injection Improvements

..

NuGet Integration

ASP.NET MVC 3 automatically installs and enables NuGet as part of its setup. NuGet is a free open-source package manager that makes it easy to find, install, and use .NET libraries and tools in your projects.

Conclusion

The improvement from MVC 2 are aimed to simplify coding with the Razor view engine and integration with complex built in validation.

Tag Cloud