active questions tagged javascript - Stack Overflow

Why does MySQL automatically create indexes for me?

2012-02-08T13:36:49Z

{ id: 1533,
  story_type_id: 1,
  content_id: 470,
  created_at: Sun, 05 Feb 2012 07:02:43 GMT,
  updated_at: Sun, 05 Feb 2012 07:02:43 GMT,
  type_name: 'post' }

I have a JSON object with the "datetime" field like above. It's perfect. But when I stringify it (I want to store it in cache), I get this format:

"created_at":"2012-02-05T07:02:43.000Z"

This causes problems, because when I want to JSON.parse this, suddenly it's no longer datetime format and it's incompatible with my other format.

What can I do to solve this problem? I have 'created_at' littered everywhere throughout my application. I don't want to manually change each one.

Multiple javascript instances of an object in IE6

2012-02-08T13:25:07Z

I got a little problem with IE6 which doesn't appear on Chrome or Safari or Firefox. All is working fine except one thing: my web app uses one javascript but I create multiple instances of the javascript like this:

var app = {};
app.mapConceptFirst = new MapConcept("#first");
app.mapConceptSecond = new MapConcept("#second");
app.mapConceptThird = new MapConcept("#third");

Here's the constructor:

function MapConcept(id) {
    this.currentNavigator = "";
    this.start = 0;
    this.angle = 0;
    this.clientX = 0;
    this.clientY = 0;
    this.currentMenu = 2;
    this.h = 0;
    this.w = 0;
    this.itemList;
    this.firstRotation = 0;
    this.section = id;
    $(window).resize(function () {
        this.h = $(window).height();
        this.w = $(window).width();
    });
    jQuery.preLoadImages("images/anneau.png", "images/anneau1.png", "images/anneau2.png", "images/anneau3.png", "images/anneau4.png");
    this.currentNavigator = BrowserDetect.init();
    this.init();
    this.getItems();
}

Unfortunately, on IE6 the first instance works fine, all my stuff is running, but the second and third ones don't work. How can I solve my problem ?

jQuery Select list, selected text value rather than the value

2012-02-08T13:29:39Z

building on my last question jQuery getting values from multiple selects together

I have the select list like:

  <select name="access" class="change" id="staff_off"  runat="server">
                <option value="8192">Off</option>
                <option value="8192">On</option>
  </select>

And I basically want to add or subtract the value of the options if it's off, subtract if it's on add it. It's going to be stored in a cookie (it uses bitwise)

The jquery I have is:

<script>

        $(document).ready(function(){
           var currentAccess = $.cookie("access");
        })

        $("select").change(function () {
            var currentText = $(this).text()
            var value = $(this).val()

              $.cookie("access", value, { expires: 24 });

              alert(currentText);

              alert( $.cookie("access") );

            })

    </script>

I'll do the addition in the change function. The thing I can't work out is how to get the text of the select to do an if statement (so if it's yes, add the value, if it's no, subtract the value)

Tom

How do you mitigate risk when introducing multivariate testing into a dynamic web application?

2012-02-08T13:37:53Z

My company is engaging with a multivariate testing vendor (I can't disclose which one just yet), and I am being asked to integrate their system into our flagship B2C commerce site.

Usually, the word "integrate" is a heavy-duty term. However, here it means to add a <script> tag on several views, and then be out of the loop from that point forward. The mulitvariate experiments will be set up by our marketing department (and/or the vendor). Our development team will not be involved in that, and may not even be aware when it's happening.

Essentially, I am being told to deliberately add a JavaScript-injection attack vector to our flagship application... and hope for the best. My concerns are not so much with malicious code as they are with inadvertent screw-ups. Our CSS and basic page layout is a mess already, and I anticipate catiching the heat when someone else's multivariate experiment blows up the home page look-n-feel, etc. Much more importantly, there is a lot of ugly AJAX and server-side cruft that depends on predictable HTML elements, id attributes, etc... and so if an experiment changes HTML elements too much, core commerce functionality will simply break altogether in unpredictable ways.

My concerns are amplified by the lack of a real test environment. The vendor does filtering, so that only AJAX calls from our production URL are processed. Calls from our Dev or QA environments are ignored. However, that's not the same thing as having a test environment. Rather, it means that production is now our test environment for each experiment.

Given all of the above, are there any practices available to mitigate some of these risks? Multivariate testing is such a new field, the first several pages of a Google search consists of shady consultants selling buzzwords to CIO's. There's not much written for the in-house technical audience ultimately responsible for keeping an eye on risk. Are there any ways to properly QA under the above restraints, or is there simply no alternative but to push back(*) in such a scenario?

(*) Note: Given the politics of the vendor relationship, we would need to build an extraordinarily airtight case for push-back, and it may be ignored anyway.

Javascript - session.getAttribute returns undefined value

2012-02-08T11:58:40Z

I have a JSP form that reads input from the user and calls a Java servlet to process data. Once the data been proccesed, session.setAttribute is called to store important information. Then in Javascript I try to read the session variable and display it on the screen. The code looks like this (some code removed):

<script type="text/javascript">
   var test = <%= session.getAttribute( "mySessionVar" ) %>;
   document.write (test);
}

When the user enters an integer in the form, all is working as expected and the output displayed on the screen properly. However, when the user enters a String in the form, "undefined" is displayed on the screen.

Any idea what I'm doing wrong?

Simulation in a Web Browser

2012-02-07T15:22:48Z

Sorry if the title is confusing, it's hard to sum up in one phrase.

I am working a a project consisting of rendering a robot simulation in a web browser. To be more specific, at the university where I'm studying they use a simulator written in C++, this program simulates robots evolving in an environment. This simulator has many outputs available like 3D OpenGL visualisation etc. One output available is the basic text render which output for each time step, the position of every robots in the environment.

Ok, so they asked me to work on a new type of visualization taking place in a browser. This means that one could upload his code for the simulator, launch it on the server and see the simulation in the browser (in an HTML5 Canvas or SVG) WHILE it is simulated on the server!

Ok so I first thought using Ajax to get data from the simulator and use some Canvas Library to draw the robots on the screen. But they don't want to need a Web Server so I thought of writing a new type of visualization directly in the simulator (using a C++ WebSocket library if this actually exists) which would act as a WebSocket server so that the browser can directly talk to the simulator without the need of a Web Server (don't know if it is possible).

Well ... That's the idea. It would be awesome if you could tell me what you think about it and give me some advices/links. Is it possible to handle this without a Web Server ? If it's not possible without implementing the HTTP protocol in the simulator, then I'll skip this idea and do with a Web Server :)

Second question more precise: I've already looked at some HTML5 Canvas library, fabric.js, jCanvaScript, dojo.gfx, cake, doodle.js, bHive, KineticJS. I am still not sure of which one to use. I started some experiments with jCanvaScript and I'm facing a problem. I get data from the server (robots positions at each time step) and then have to draw them in the canvas. I was using some .animate function do get smooth movements. This function takes a number of ms, the time of the animation and I don't know how to synchronise the animations of all the objects I have to move at each timestep of the simulation. Do you know a framework that would help implementing that kind of simulation? (just moving objects between each timestep).

That's about it, apology for my poor english, I hope it is understandable, if not, tell me, I'll rephrase.

Thanks in advance for your help. I'm a bit lost on that project and any advice would be greatly appreciated !

Have a good day.

Balzard.

status box like twitter status box

2012-02-08T13:35:32Z

I am a new PHP learner. I need a status box which just like twitter status box. I have tried many websites and i can not find the exact solution.

What i exactly need is 1. Status box like twitter, when typing on the box it will increase its size automatically 2.If there is URL in the status, it should automatically highlight URL like twitter 3.After 500 characters user should not allowed to type in.

I don't want to use any API. I think the code might be combination of HTML,ajax and javascript. Please someone help me. I am new in this area. So if it is possible give a little explanation of your code.

I found a bit similar question in this website but the answer is not given there.

how to print the associative array in print_r() fashion from a $.getJSON call?

2012-02-08T12:06:20Z

simple thing.

$.getJSON is used and the result from the .php file being called is caught as response in the jquery callback function. The json encoded php array is an associative array.

$.getJSON("file.php",function(response){

// print the associative response array in var_dump or print_r fasion

});

file.php contains:

<?php

$my_array=array();

//$my_array['random_index1']="random_value1";

//$my_array['random_index2']="random_value2";

//$my_array['random_index3']="random_value3";
// and so on


echo json_encode($my_array);


?>

$my_array has random keys and values.

How can I print the whole 'response' array just like the print_r fashion in php?

EDIT: I want to print it on the webpage or in an alert box. Not that i just want to watch the values in the javascript console(chrome, FF or whatever).

getting a value along with html markup returned by Ajax in Jquery

2012-02-08T13:09:48Z

I use the following to retrieve some html using Jquery:

index.php

$.post(
    'get-products.php', 
    $("#offerForm").serialize() + '&lastid=' + highest, 
    function(data) {            
        $('#demo').html(data); 
    }

Is it possible to also retrieve a value of a variable from get-products.php, example:

get-products.php

<? echo $htmlOutput;
echo $variable; ?>

index.php

$.post(
    'get-products.php', 
    $("#offerForm").serialize() + '&lastid=' + highest, 
    function(data) {
        $('#demo').html(data);
        //variable processing statement goes here   
    }

is it possible to call nested function from googlemaps infowindow

2012-02-08T13:32:40Z

I have following code. Calling saveLatLng works but calling saveLatLng2 doesn't.

I like to call the nested function so i can access the infoWindow variable, or do i hava to pass the infoWindow variable to the extern method?

<script type="text/javascript">
  function initialize() {
    var myLatlng = new google.maps.LatLng({{address.@geolat}}, {{address.@geolon}});
    var myOptions = {
        zoom: 16,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    var marker = new google.maps.Marker({
        position: myLatlng,
        map: map,
        clickable: true,
        draggable: true,
        title:"Hello World!"
    });
    var infoWindow = new google.maps.InfoWindow({
    });
    google.maps.event.addListener(marker, 'click', function(event) {
        infoWindow.setContent("Mit Drag&Drop neu Position setzen!");
        infoWindow.open(map, marker);
    });
    google.maps.event.addListener(marker, 'dragend', function(event) {
        newLat = marker.position.lat();
        newLng = marker.position.lng();
        infoWindow.setContent(
            '<a href="javascript:saveLatLng(newLat, newLng);">test</a><br>'
            + '<a href="javascript:saveLatLng2(newLat, newLng);">test</a>'
        );
        infoWindow.open(map, marker);
    });
    var saveLatLng2 = function(newLat, newLng) {
        console.log(newLat + ',' + newLng);
    };
  }

  var saveLatLng = function(newLat, newLng) {
     console.log(newLat + ',' + newLng);
  };
</script>

My associative array doesnt store objects

2012-02-08T13:28:58Z

It seems it's always empty :

var idStruttura=2;
var arrayMarkers=new Array();

arrayMarkers["sede_"+idStruttura] = "ciao";
alert(arrayMarkers.length);

Prints always 0. Why? And how can I fix it?

Why am I not able to populate my Array object?

2012-02-08T13:23:05Z

if (typeof response == "object") {
    store = new dojo.data.ItemFileReadStore({
        data : response
    });
    console.warn("Loaded to Store");
    var itemArray = new Array();
    var completed = function(items) {
        for(var i = 0; i < items.length; i++) {
            console.log(store.getValue(items[i],"itemlabel"));
            itemArray.push(store.getValue(items[i]));
        }
    };
    var error = function() {
        console.log("Error in fetching data from Store");
    };

    store.fetch({onComplete: completed, onError: error});
    console.warn("Item count"+ itemArray.length);

So my Item Count gives Always 0 but

console.log(store.getValue(items[i],"itemlabel"));

In the callback method the above get print the value.

So if i want to populate my itemArray what can i do?

How to open colorbox from inside a iframe on top of parent window

2012-02-08T13:23:35Z

I have a page with an iframe. The link inside an iframe should open colorbox. It works fine.

But it opens the colorbox inside the iframe. Is it possible to open the iframe over the parent window.

I appreciate any help.

     $(function() {
          $('#ajax').colorbox({iframe: true });
     });

Replace whole DOM in javascript

2012-02-08T11:32:46Z

I need to implement undo-redo functionality in my project. But it is very complex and every change affects on many elements. I think saving and restoring whole page will be the best choice. But i have some problems with missing .data() params of DOM elements. I use next functions:

// save
var documentCopy = document.documentElement.cloneNode(true);

// restore
document.replaceChild(
documentCopy,
document.documentElement
);

How I can save and restore whole DOM with saving jQuery.data() of elements?

why doesn't refreshing Firefox reflect javascript code changes?

2012-02-08T13:17:53Z

I am working on a simple dojo comboBox (dijit.form.ComboBox) connected to a dojo.store.Memory. I'm using the latest Netbeans and Glassfish setup, with Firefox 10. My problem is that when I change or comment out code related to the combobox, the changes don't show up when I refresh the web page. I've tried clean/build, rerunning, etc, but commenting out the code seems to do nothing. Firefox seems to be running a cached version of the page, instead of rendering the latest code changes I've made. I don't want to have to clear out the browser cache every time I refresh the page. (What I ultimately want to be able to do is dictate when the autoComplete turns on and off.) Any ideas?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">                   
    <script src="http://ajax.googleapis.com/ajax/libs/dojo/1.7.1/dojo/dojo.js" type="text/javascript" ></script>

    <script type="text/javascript">
        dojo.require("dijit.form.ComboBox");
        dojo.require("dojo.store.Memory");

        var myBox, store;
        dojo.ready(function(){makeComboBox();});

        function makeComboBox(){

            store = new dojo.store.Memory({
                data: [
                    {name:"Alabama", id:"AL"},
                    {name:"Alaska", id:"AK"},
                    {name:"American Samoa", id:"AS"},
                    {name:"Arizona", id:"AZ"},
                    {name:"Arkansas", id:"AR"},
                    {name:"Armed Forces Europe", id:"AE"},
                    {name:"Armed Forces Pacific", id:"AP"},
                    {name:"Armed Forces the Americas", id:"AA"},
                    {name:"California", id:"CA"},
                    {name:"Colorado", id:"CO"},
                    {name:"Connecticut", id:"CT"},
                    {name:"Delaware", id:"DE"}                        
                ]
            });                

            myBox = new dijit.form.ComboBox({                
                id: "stateSelect",
                name: "state",
                //value: "Alabama", 
                //store: store,  <-- the box is still connected to the store, 
                                 <--even if I comment it out
                searchAttr:"name"
            }, "stateSelect");
            //myBox.set("autoComplete", "false"); <-- this doesn't work either
        }
    </script>

<div id="myDiv"  >
    <input id="stateSelect" >
    <p><button onClick="alert(dijit.byId('stateSelect').get('value'))">get value</button></p>
</div>

Chained drop down box value not showing in IE 7,8,9 or lower browser

2012-02-08T13:23:59Z

Here is my javascript code::---

//Browser Support Code function ajaxFunction(str){ var ajaxRequest; // The variable that makes Ajax possible! try{ // Opera 8.0+, Firefox, Safari ajaxRequest = new XMLHttpRequest(); } catch (e){ // Internet Explorer Browsers try{ ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try{ ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e){ // Something went wrong alert("Your browser broke!"); return false; } } } // Create a function that will receive data sent from the server var url="../frontend/views/home/category.php" + "?value="+str; ajaxRequest.onreadystatechange = function(){ if(ajaxRequest.readyState == 4){ //document.myForm.time.value = ajaxRequest.responseText; document.getElementById("class").innerHTML=ajaxRequest.responseText; } } ajaxRequest.open("GET", url, true); ajaxRequest.send(null); }

Extracting part of current page's URL in javascript

2012-02-08T13:20:13Z

In ASP.NET MVC 3 site, I open the following uri

http://myserver/incidents/supercompany/register

That page needs to make use of ajax JSON retrieval mechanism with the help of jQuery:

$.getJSON('/Incidents/[[COMPANY NAME GOES HERE]]/SearchPeople/' + request.term, function (data)

I am new to javascript. How can I obtain supercompany part of my current url to build the

/Incidents/supercompany/SearchPeople/ string?

Porting my old plain JavaScript projects to CoffeeScript and BackboneJS

2012-02-08T13:22:31Z

iam in a mood right now and thought it would be great to port my existing plain JavaScript projects to CoffeeScript and BackboneJS to get a cleaner structure for future development. I also like the CoffeeScript syntax and its ability to compile Lint-proved JavaScript.

I found some neat Information about how both of them can work together. -> http://spin.atomicobject.com/2011/05/06/using-backbone-js-with-coffeescript/

But my problem is: Iam not quite sure where to start. I usually structured my JavaScript in a pseudo class-based fashion. Like this:

var node = new function() {
    this.add = this.add = function(target) {};
    this.set = function(target, options) {};
};

Iam not very familiar with BackboneJS and CoffeeScript in practice. Is it better to start off with a BackboneJS structure and refactor my scripts into that. Or should i rewrite my code in CoffeeScript and move it to BackboneJS afterwards?

insert XML into DOM leads to not working class/id selectors

2012-02-08T12:57:46Z

I'm trying to load an XML file with ajax and insert parts of this XML DOM document into the browsers HTML DOM.

This works so far, but when I try to get an inserted element with a class or id selector with jquery it returns the empty list.

I tried it only in firefox 10 so far. does anyone have a clue why this might be? is it just not safe to do so?

test.html:

<html><head>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  <title>dom test</title>
  <script type="text/javascript">
    $(function() {
      var xml = null;
      $.ajax({
        type : "GET",
        async : false,
        url : 'test.xml',
        dataType : "xml",
        success : function(data) {
          xml = data;
        }
      });

      $('body').html($(xml).children().clone());

      console.log($('h1')); // prints the h1 element
      console.log($('.title')); // prints empty list

      console.log($('p')); // prints the p element
      console.log($('#content')); // prints empty list
    });      
  </script>
</head><body></body></html>

test.xml:

<div id="root">
  <h1 class="title">Blabla</h1>
  <p id="content">
    Lorem ipsum
  </p>
</div>

Trying to create tetris, but can't

2012-02-08T13:21:56Z

For some reason my code refuses to let me assign an x and y position to each block. Each block is 30 pixels wide and tall and will be colored according to which piece it is a part of. Gravity and a clear function haven't been implemented and the move left and move right function are so different because it wasn't working right and then recreated it as it is seen now in the left function and it works less...

Please help!

<!DOCTYPE html>
<html>
    <head>
        <title>Tetris in Canvas</title>
        <style type="text/css">
            canvas {
                border: solid 1px black;
                margin: -8px;
            }
        </style>
        <script type="text/javascript">
            var canvas = null;
            var ctx = null;
            var blockArray = [];
            var board = [];
            var blockNum = 0;
            for (var s = 0; s < 14; s++) {
                board[s] = [27];
                for (var t = 0; t < 27; t++) {
                    board[s][t] = -1;
                }
            }

            document.onkeydown = function(event) {
                var keyCode;

                if(event == null)
                    keyCode = window.event.keyCode;
                else
                    keyCode = event.keyCode;

                switch(keyCode) {
                    case 37:
                        left(blockArray.length);
                        break;
                    case 38:
                        up(blockArray.length);
                        break;
                    case 39:
                        right(blockArray.length);
                        break;
                    case 40:
                        down(blockArray.length);
                        break;
                    default:
                        break;
                }
            }

            window.onload = function init() {
                canvas = document.getElementById('Canvas1');
                ctx = canvas.getContext("2d");

                blank();
                addBlock();
                animate();
            }

            function up(i) {
                blank();
                animate();
            }

            function down(i) {
                var u = 0;
                var p = 0;
                while(u<4) {
                    if (blockArray[i].y[u] + 1 > 26) {
                        u = 10;
                    }
                    else if ((board[blockArray[i].x[u]][blockArray[i].y[u] + 1]) == -1) {
                        u++;
                    }
                    else {
                        p = u;
                        for (var g = 0; ((g < 4) && (p = u)); g++) {
                            if ((blockArray[i].x[u] == blockArray[i].x[g]) && (blockArray[i].y[u] + 1 == blockArray[i].y[g])) {
                                u++;
                            }
                        }
                        if (p == u)
                            u = 10;
                    }
                }
                if (u < 10) {
                    for (var j=0; j<4; j++) {
                        blockArray[i].y[j] +=1;
                    }
                }
                else
                    addBlock();
                animate();
            }

            function right(i) {
                var u = 0;
                var p = 0;
                while(u<4) {
                    if (blockArray[i].x[u] + 1 > 13) {
                        u = 10;
                    }
                    else if ((board[blockArray[i].x[u] + 1][blockArray[i].y[u]]) == -1)
                        u++;
                    else {
                        p = u;
                        for (var g = 0; ((g < 4) && (p = u)); g++) {
                            if ((blockArray[i].x[u] + 1 == blockArray[i].x[g]) && (blockArray[i].y[u] == blockArray[i].y[g]))
                                u++;
                        }
                        if (p == u)
                            u = 10;
                    }
                }
                if (u < 10) {
                    for (var j=0; j<4; j++) {
                        blockArray[i].x[j] +=1;
                    }
                }
                else
                    addBlock();
                animate();
            }

            function left(i) {
                var u;
                var p = 14;
                for (var w = 0; w<4; w++) {
                    if (blockArray[i].x[w] < p) {
                        p = blockArray[i].x[w];
                        u = w;
                    }
                }
                if (p > 0) {
                    if ((board[blockArray[i].x[u] - 1][blockArray[i].y[u]]) == -1) {
                        for (var j=0; j<4; j++) {
                            blockArray[i].x[j] -=1;
                        }
                    }
                }
                animate();
            }           

            function block(x, y, type) {
                blockNum += 1;
                this.id = blockNum;
                this.x = [];
                this.y = [];
                this.landed = false;
                this.type = Math.floor(Math.random() * (6)) + 1;
                typeSet(this.type);
            }

            function addBlock() {
                blockArray[blockArray.length] = new block();
            }

            function typeSet(type) {
                i = blockArray.length;
                switch (type) {
                    case 1:
                        square(i);
                        break;
                    case 2:
                        elR(i);
                        break;
                    case 3:
                        elL(i);
                        break;
                    case 4:
                        line(i);
                        break;
                    case 5:
                        zeR(i);
                        break;
                    case 6:
                        zeL(i);
                        break;
                    default:
                        break;
                }
            }


            function animate() {
                fillBoard();
                colorBoard();
            }

            function fillBoard() {
                for (var i = 0; i < 14; i++) {
                    for (var q = 0; q < 27; q++) {
                        board[i][q] = -1;
                    }
                }
                for (var i=0; i<blockArray.length; i++) {
                    for (var q=0; q<4; q++) {
                        board[blockArray[i].x[q]][blockArray[i].y[q]] = blockArray[i].type;
                    }
                }
            }

            function colorBoard() {
                blank();
                ctx.strokeStyle = "white";
                for(var q=0; q<14; q++) {
                    for(var r=0; r<27; r++) {
                        switch (board[q][r]) {
                            case 1:
                                ctx.fillStyle = "green";
                                color(q,r);
                                break;
                            case 2:
                                ctx.fillStyle = "orange";
                                color(q,r);
                                break;
                            case 3:
                                ctx.fillStyle = "cyan";
                                color(q,r);
                                break;
                            case 4:
                                ctx.fillStyle = "black";
                                color(q,r);
                                break;
                            case 5:
                                ctx.fillStyle = "yellow";
                                color(q,r);
                                break;
                            case 6:
                                ctx.fillStyle = "brown";
                                color(q,r);
                                break;
                            default: 
                                break;
                        }
                    }
                }
            }

            function color(q,r) {
                ctx.fillRect(q*30,(r-4)*30,30,30);
                ctx.strokeRect(q*30,(r-4)*30,30,30);
            }

            function square(i) {
                blockArray[i].x[0] = 7;
                blockArray[i].y[0] = 0;
                blockArray[i].x[1] = 7;
                blockArray[i].y[1] = 1;
                blockArray[i].x[2] = 8;
                blockArray[i].y[2] = 0;
                blockArray[i].x[3] = 8;
                blockArray[i].y[3] = 1;
            }
            function elR(i) {
                blockArray[i].x[0] = 7;
                blockArray[i].y[0] = 0;
                blockArray[i].x[1] = 7;
                blockArray[i].y[1] = 1;
                blockArray[i].x[2] = 7;
                blockArray[i].y[2] = 2;
                blockArray[i].x[3] = 8;
                blockArray[i].y[3] = 2;
            }
            function elL(i) {
                blockArray[i].x[0] = 7;
                blockArray[i].y[0] = 0;
                blockArray[i].x[1] = 7;
                blockArray[i].y[1] = 1;
                blockArray[i].x[2] = 7;
                blockArray[i].y[2] = 2;
                blockArray[i].x[3] = 6;
                blockArray[i].y[3] = 2;
            }
            function line(i) {
                blockArray[i].x[0] = 7;
                blockArray[i].y[0] = 0;
                blockArray[i].x[1] = 7;
                blockArray[i].y[1] = 1;
                blockArray[i].x[2] = 7;
                blockArray[i].y[2] = 2;
                blockArray[i].x[3] = 7;
                blockArray[i].y[3] = 3;
            }
            function zeR(i) {
                blockArray[i].x[0] = 6;
                blockArray[i].y[0] = 0;
                blockArray[i].x[1] = 7;
                blockArray[i].y[1] = 0;
                blockArray[i].x[2] = 7;
                blockArray[i].y[2] = 1;
                blockArray[i].x[3] = 8;
                blockArray[i].y[3] = 1;
            }
            function zeL(i) {
                blockArray[i].x[0] = 8;
                blockArray[i].y[0] = 0;
                blockArray[i].x[1] = 7;
                blockArray[i].y[1] = 0;
                blockArray[i].x[2] = 7;
                blockArray[i].y[2] = 1;
                blockArray[i].x[3] = 6;
                blockArray[i].y[3] = 1;
            }

            function blank() {
                ctx.restore();
                ctx.fillStyle = "blue";
                ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);
                ctx.save();
            }

            function blank2() {
                ctx.restore();
                ctx.fillStyle = "purple";
                ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);
                ctx.save();
            }

            function rotateImgRight() {
                for(d = 0; d < 180; d++) {
                    setTimeout(rotateImg, 50);
                }
            }

            function rotateImgLeft() {
                for(d = 0; d < 180; d++) {
                    setTimeout(rotateImg2, 50);
                }
            }

            function rotateImg2() {
                degrees = degrees - 0.5;
                radian = (Math.PI / 180.0) * degrees;

                blank();
                ctx.translate(ctx.canvas.width/2, 700);
                ctx.rotate(radian);
                ctx.drawImage(srcImg, -srcImg.width/2,-srcImg.height/2);
                slide = (degrees / 90) % 4;
            }

            function rotateImg(x,y) {
                degrees = degrees + 0.5;
                radian = (Math.PI / 180.0) * degrees;

                ctx.translate(x,y);
                ctx.rotate(radian);
                ctx.drawImage(srcImg, -srcImg.width/2,-srcImg.height/2);
                slide = (degrees / 90) % 4;
            }
        </script>
    </head>
    <body>
        <div style="width: 100%; text-align:center">
            <canvas id="Canvas1" width="421" height="690">Your browser does not support canvas.</canvas>
        </div>
    </body>
</html>

JavaScript Mobile Drag and Drop

2012-02-08T13:21:56Z

I was testing out an interface I built using jQuery UI draggable, droppable and sortable and noticed that the drag and drop doesn't work in the mobile browser. I suppose there is a different way in which events are fired in the mobile browser.

Are there any JavaScript frameworks yet, that support drag and drop in the mobile browser?

If not, any ideas on how one could go about putting together some basic drag/drop functionality?

Get htaccess URL params in JavaScript

2012-02-08T13:14:19Z

Is there any way in Javascript to get the parameters ume modified URL with htaccess? As an example: www.website.com/argument/1/argument/2 Where "/argument/2" = &product_id=2 There is some way to pick up these parameters in JavaScript?

Get original definition of redefined function

2012-02-08T13:15:14Z

I am writing a bookmarklet which performs some function on a page. As part of this function I need to use getElementsByClassName. However, during testing I found that several websites have redefined getElementsByClassName to a custom method. Presumably this was done in order to support getElementsByClassName in all browsers.

The implementation of custom getElementsByClassName is a bit sloppy and fails for several of my use cases. Is there any way I could get the original definition of getElementsByClassName?

In the chrome javascript console: getElementsByClassName points to a native function. Is there a way to access this native function, now that getElementsByClassName has been redefined?

Showing text from Resources.resx in javascript

2012-02-08T09:21:12Z

this is example code in mvc3 razor:

@section header
{
    <script type="text/javascript">

        $(function() {
            alert('@Resources.ExampleCompany');
        });
    </script>
}

<div>
    <h1>@Resources.ExampleCompany</h1>
</div>

Code above this is just only example but aslo shows my problem with encoding. This variable @Resources.ExampleCompany is a file resources.resx with value ExampleCompany = "Twoja firma / Twój biznes"

In javascript alert shows the "Twoja firma / Twój biznes"

Why character 'ó' is '&#243' ? What am i doing wrong?

In html tag <h1>@Resources.ExampleCompany</h1> is display correctly.

Jquery/Javascript Flickr Gallery.. Need help badly

2012-02-08T12:45:26Z

So i'm working on a project that basically takes the user's input as a "tag" of sorts for flicker and stores it, to then reuse it to make a gallery of the flicker images it pulls up from the tag. Now I think i've got mostly what i'm trying to do... but It's just not working 100%... or really at all because none of the images show up anymore, but here's my code

<head>
    <meta charset="utf-8" />
    <title>Image Gallery</title>

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
    <script src="js/index.js"></script>

    <script>
        $(function() {

            $("#test").keyup(function(){
                var value = $(this).val()

                $.getJSON(
                    "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?",
                    {
                        tags: "value",
                        tagmode: "any",
                        format: "json"
                    },
                    function(data) {
                        $.each(data.items, function(i,item){
                            $("<img/>").attr("src", item.media.m).appendTo("#images");
                            if ( i == 20 ) return false;
                        });
                    }
                );
            };
        });
    </script>

</head>
<body>
    <form>
        Input a Tag for Flicker Images: <input id="test" type="text" />
    </form>

    <div id="images"></div>

</body>

It seems like it's something very simple but I JUST cannot figure out what i'm doing wrong..

Redirect parent window from an iframe action using JavaScript

2009-02-24T06:24:34Z

What JavaScript do I need to use to redirect a parent window from an iframe?

I want them to click a hyperlink which, using JavaScript or any other method, would redirect the parent window to a new URL.

HTML5 appcache, Get a list of cached files in the client

2012-02-08T12:43:36Z

In my project, I'm trying to use HTML5 appcache to cache static resources like CSS and JS, and "user specific" files such as images and videos. When I say user specific images/videos, I'm trying to have separate files for each user and I need to control order of the file download as well.

Given the scenario, my manifest file will be dynamically loaded for every user. Is there a way where I can get a list of resources that are already cached in client side?

If not, is is possible to read the ".appcache" file in client?

HTML dropdown can't capture onChange() if there is only one value in dropdown

2012-02-08T12:47:04Z

I am using Jquery , for selecting value of drop-down.
I need do do some action on OnChange event (.change in jquery) , But if there is only one option in drop-down I am not able to capture it in onChange event.
My drop-down is formed dynamically , so don't know how many options I'll get how many options , but I am facing problem if there is just one option.
Is there any way to capture OnChange event for with only one ?

facebook "apprequests" with Custom URL?

2011-12-02T02:00:07Z

I have simple question, I am developing facebook app and using this code to make app requests

FB.ui({method: 'apprequests',message: 'Invite friends'}, requestCallback);

I want to set custom url when the user accept the request. for example: stackoverflow.com

any suggestions ?

Mootools DatePicker standalone

2012-02-07T17:16:17Z

I have a problem using the Mootools DatePicker .

When i use the standalone version (no clicks needed to show the datePicker , it show an empty box)

Here is what i have until now :

http://jsfiddle.net/PcHkD/3/

As you can see if you click inside the input the date show's correctly but onLoad it just show an empty box .

Any idea of what I'm doing wrong ?

Thanks