Just another tech site

Archive for the ‘Uncategorized’ Category

Color Palette online tool

In the process of the design of a website, comes a moment where the palette of colors needed to be fixed.
Imagine you have a picture that inspire you.
Here is a nice online tool that can help with this.

Step 1:
Go to
http://www.colorhunter.com/

Step 2:
Select the image

Step 3:
upload the image in the tool et voila, you got your palette.

SVG Editor

Here is a great online tool for generating SVG images.
First of all this is a free tool that will get wou ready for HTML5

http://svg-edit.googlecode.com/svn/branches/2.5.1/editor/svg-editor.html

The tools

Build the image and add an icon

Let’s test the tool.

SVG code generated

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>‚Äč

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

Tag Cloud