serverside javascript - Page 16

Good resources and tools for modern, heavy JavaScript development?

- by Matt Greer

I am interested in doing some projects that involve heavy use of JavaScript. Namely HTML5 based canvas games, potentially using node.js as well. I am interested in learning modern best practices, tools and resources for JavaScript. JavaScript is tough to research because you end up wading through a lot of really outdated material, hailing from the times that "JavaScript" was a four letter word. If you are heavily involved in JavaScript programming... What text editor or IDE do you use? What unit testing framework do you use? Do you use Selenium, or something else? What other tools do you use? What communities exist that discuss recent advents in JavaScript? What books do you read/refer to? What blogs do you read?

Read the article

Preserve onchange for a dropdown list when setting the value with Javascript.

- by Zac Altman

I have a dropdown list with a piece of code that is run when the value is changed: <select name="SList" onchange="javascript:setTimeout('__doPostBack(\'SList\',\'\')', 0)" id="SList"> Everything works fine when manually done. As an option is selected, the onchange code is called. The problem begins when I try to change the selected value using a piece of Javscript. I want to be able to automatically change the selected option using JS, whilst still having the onchange code called, exactly as if done manually. I try calling this: form.SList.value = "33"; The right option is selected, but the onchange code does not get called. So then I try doing this: form.SList.value = "33"; javascript:setTimeout('__doPostBack(\'SList\',\'\')', 0); The right value is not selected and nothing happens. FYI, the code is done in ASP.NET and Javascript. What can I run to change the selected option whilst still calling the onchange code?

Read the article

Hijax == sneaky Javascript redirects? Will I get banned from Google?

- by Chris Jacob

Question Will I get penalised as "sneaky Javascript redirects" by Google if I have the following Hijax setup (which requires a JavaScript redirect on the page indexed by google). Goal I want to implement Hijax to enable AJAX content to be accessibile to non-JavaScript users and search engine crawlers. Background I'm working on a static file server (GitHub Pages). No server side tricks allowed (so Google's #! "hash bang" solution is not an option). I'm trying to keep my files DRY. I don't want to repeat the common OUTER template in all my files i.e. header, navigation menu, footer, etc They will live in the main index.html Setup the Hijax index.html page contains all OUTER html/css/js... the site's template. index.html has a <div id="content"> which defaults to containing the "homepage" html. index.html has a navigation menu, with a Hijax link to an "about" page. With JavaScript disabled (e.g. crawler) it follows link to /about.html. With JavaScript enabled (e.g. most people) the link updates the url hash fragment to /#about and jQuery replaces the <div id="content"> innerHTML with $("#content").load("about.html #inner-container");. AJAX content about.html does not contain anything extra to try an cloak content for crawlers. about.html file contains enough HTML / CSS / JavaScript to display /about.html as a standalone page with it's own META data... e.g. <html><head><title>About</title>...</head><body></body></html>. about.html has NO OUTER HTML template (i.e. header, navigation menu, footer, etc). about.html <body> contains a <div id="inner-container"> which holds the content that is injected into index.html. about.html has a <noscript> tag as the first child of <body> which explains to non-JavaScript users that they are viewing the about page "inner content" - with a link to navigate to the index.html page to get the full page layout with menu. The (Sneaky?) Redirect Google indexes the /about.html page. However when a person with JavaScript enabled visits that page there is no OUTER html template (e.g. header, navigation menu, footer, etc). So I need to do a JavaScript redirect to get the person over the /#about page (deeplinking to the "about" page "state" in index.html). I'm thinking of doing a "redirect on click or after 10 seconds". The end results is that user ends up on an "enhanced" page back on index.html with all it's OUTER template - but the core "page" content is practically identical. Known issue with inbound links e.g. Share / Bookmarking It seems that if a user shares the URL /#about on their blog, when allocating inbound links to my site Google ignores everything after the # ... it allocates value to the / page - See: http://stackoverflow.com/questions/5028405/hashbang-vs-hijax/5166665#5166665. I can only try an minimise this issue offering "share" buttons on the page with the appropriate urls i.e. /about.html. Duplicate Sorry. I posted this same question over on http://stackoverflow.com/questions/5561686/hijax-sneaky-javascript-redirects-will-i-get-banned-from-google ... then realised it probably belongs more on this Stack Exchange site... Not sure if I should delete the Stack Overflow question? Or just leave it on both sites? Please leave comment.

Read the article

What are the typical reasons Javascript developed on Firefox fails on IE?

- by karlthorwald

I developed some javascript enhanced pages that run fine on recent Firefox and Safari. I missed to check in Internet Explorer, and now I find the pages don't work on IE 6 and 7 (so far). The scripts are somehow not executed, the pages show as if javascript wasn't there, although some javascript is executed. I am using own libraries with dom manipulation, from YUI 2 I use YUI-Loader and the XML-Http-Request, and on one page I use "psupload", which depends on JQuery. I am installing Microsoft Script Editor from Office XP and will now debug. I will also write specific tests now. What are the typical failing points of IE? What direction I can keep my eyes open. I found this page, which shows some differences: http://www.quirksmode.org/compatibility.html Can you from your experience name some typical things I should look for first? I will also ask more questions here for specific tasks later, but for now I am interested in your experience why IE usually fails on scripts that run fine in Firefox

Read the article

Function currying in Javascript

- by kerry

Do you catch yourself doing something like this often? 1: Ajax.request('/my/url', {'myParam': paramVal}, function() { myCallback(paramVal); }); Creating a function which calls another function asynchronously is a bad idea because the value of paramVal may change before it is called. Enter the curry function: 1: Function.prototype.curry = function(scope) { 2: var args = []; 3: for (var i=1, len = arguments.length; i < len; ++i) { 4: args.push(arguments[i]); 5: } 6: var m = this; 7: return function() { 8: m.apply(scope, args); 9: }; 10: } This function creates a wrapper around the function and ‘locks in’ the method parameters. The first parameter is the scope of the function call (usually this or window). Any remaining parameters will be passed to the method call. Using the curry method the above call changes to: 1: Ajax.request('/my/url', {'myParam': paramVal}, myCallback.curry(window,paramVal)); Remember when passing objects to the curry method that the objects members may still change.

Read the article

Pass Extra Parameters to JavaScript Callback Function

- by BRADINO

Here is a simple example of a function that takes a callback function as a parameter. query.send(handleQueryResponse); function handleQueryResponse(response){ alert('Processing...'); } If you wanted to pass extra variables to the callback function, you can do it like this. var param1 = 'something'; var param2 ='something else'; query.send(function(response) { handleQueryResponse(response, param1, param2) }); function handleQueryResponse(response,param1,param2){ alert('Processing...'); alert(param1); alert(param2); }

Read the article

javascript game loop and game update design

- by zuo

There is a main game loop in my program, which calls game update every frame. However, to make better animation and better control, there is a need to implement a function like updateEveryNFrames(n, func). I am considering implementing a counter for each update. The counter will be added by one each frame. The update function will be invoked according to the counter % n. For example, in a sequence of sprites animation, I can use the above function to control the speed of the animation. Can some give some advice or other solutions?

Read the article

Experience formula with javascript

- by StealingMana

I'm having trouble working out a formula using this experience curve to get the total exp after each level. I bet its easy and im just over thinking it. maxlvl = 10; increment = 28; baseexp = 100; function calc(){ for (i = 0;i<(maxlvl*increment);i+=increment){ expperlvl = baseexp + i; document.writeln(expperlvl); } } I figured it out. maxlvl=6; base=200; increment=56; function total(){ totalxp= (base*(maxlvl-1))+(increment*(maxlvl-2)*(maxlvl-1)/2); document.write(totalxp); }

Read the article

JavaScript objects and Crockford's The Good Parts

- by Jonathan

I've been thinking quite a bit about how to do OOP in JS, especially when it comes to encapsulation and inheritance, recently. According to Crockford, classical is harmful because of new(), and both prototypal and classical are limited because their use of constructor.prototype means you can't use closures for encapsulation. Recently, I've considered the following couple of points about encapsulation: Encapsulation kills performance. It makes you add functions to EACH member object rather than to the prototype, because each object's methods have different closures (each object has different private members). Encapsulation forces the ugly "var that = this" workaround, to get private helper functions to have access to the instance they're attached to. Either that or make sure you call them with privateFunction.apply(this) everytime. Are there workarounds for either of two issues I mentioned? if not, do you still consider encapsulation to be worth it? Sidenote: The functional pattern Crockford describes doesn't even let you add public methods that only touch public members, since it completely forgoes the use of new() and constructor.prototype. Wouldn't a hybrid approach where you use classical inheritance and new(), but also call Super.apply(this, arguments) to initialize private members and privileged methods, be superior?

Read the article

What is wrong with my Dot Product? [Javascript]

- by Clay Ellis Murray

I am trying to make a pong game but I wanted to use dot products to do the collisions with the paddles, however whenever I make a dot product objects it never changes much from .9 this is my code to make vectors vector = { make:function(object){ return [object.x + object.width/2,object.y + object.height/2] }, normalize:function(v){ var length = Math.sqrt(v[0] * v[0] + v[1] * v[1]) v[0] = v[0]/length v[1] = v[1]/length return v }, dot:function(v1,v2){ return v1[0] * v2[0] + v1[1] * v2[1] } } and this is where I am calculating the dot in my code vector1 = vector.normalize(vector.make(ball)) vector2 = vector.normalize(vector.make(object)) dot = vector.dot(vector1,vector2) Here is a JsFiddle of my code currently the paddles don't move. Any help would be greatly appreciated

Read the article

Javascript and PHP how should I en/decode my data

- by Ron

Hello everyone. I whould like to know in what encryption should I encode my data and why first of all, I use GET method because it is search engine inside website. second, I use RTL language (hebrew) and thrid which basically is why I ask this question - firefox and safari (as I understood) encode and decode urls automaticly so if I encoded url, in firefox I will see it decoded which is good but if I copy-paste the url to the address bar and than enter the site firefox encode the uncoded url to utf (i think). anyway, what en/decode should I use, and how can I overcome the firefox auto en/decode?

Read the article

javascript complex recurrsion [on hold]

- by Achilles

Given Below is my data in data array. What i am doing in code below is that from that given data i have to construct json in a special format which i also gave below. //code start here var hierarchy={}; hierarchy.name="Hierarchy"; hierarchy.children=[{"name":"","children":[{"name":"","children":[]}]}]; var countryindex; var flagExist=false; var data = [ {country :"America", city:"Kansas", employe:'Jacob'}, {country :"Pakistan", city:"Lahore", employe:'tahir'}, {country :"Pakistan", city:"Islamabad", employe:'fakhar'} , {country :"Pakistan", city:"Lahore", employe:'bilal'}, {country :"India", city:"d", employe:'ali'} , {country :"Pakistan", city:"Karachi", employe:'eden'}, {country :"America", city:"Kansas", employe:'Jeen'} , {country :"India", city:"Banglore", employe:'PP'} , {country :"India", city:"Banglore", employe:'JJ'} , ]; for(var i=0;i<data.length;i++) { for(var j=0;j<hierarchy.children.length;j++) { //for checking country match if(hierarchy.children[j].name==data[i].country) { countryindex=j; flagExist=true; break; } } if(flagExist)//country match now no need to add new country just add city in it { var cityindex; var cityflag=false; //hierarchy.children[countryindex].children.push({"name":data[i].city,"children":[]}) //if(hierarchy.children[index].children!=undefined) for(var k=0;k< hierarchy.children[countryindex].children.length;k++) { //for checking city match if(hierarchy.children[countryindex].children[k].name==data[i].city) { // hierarchy.children[countryindex].children[k].children.push({"name":data[i].employe}) cityflag=true; cityindex=k; break; } } if(cityflag)//city match now add just empolye at that city index { hierarchy.children[countryindex].children[cityindex].children.push({"name":data[i].employe}); cityflag=false; } else//no city match so add new with employe also as this is new city so its emplye will be 1st { hierarchy.children[countryindex].children.push({"name":data[i].city,children:[{"name":data[i].employe}]}); //same as above //hierarchy.children[countryindex].children[length-1].children.push({"name":data[i].employe}); } flagExist=false; } else{ //no country match adding new country //with city also as this is new city of new country console.log("sparta"); hierarchy.children.push({"name":data[i].country,"children":[{"name":data[i].city,"children":[{"name":data[i].employe}]}]}); // hierarchy.children.children.push({"name":data[i].city,"children":[]}); } //console.log(hierarchy); } hierarchy.children.shift(); var j=JSON.stringify(hierarchy); //code ends here //here is the json which i seccessfully formed from the code { "name":"Hierarchy", "children":[ { "name":"America", "children":[ { "name":"Kansas", "children":[{"name":"Jacob"},{"name":"Jeen"}]}]}, { "name":"Pakistan", "children":[ { "name":"Lahore", "children": [ {"name":"tahir"},{"name":"bilal"}]}, { "name":"Islamabad", "children":[{"name":"fakhar"}]}, { "name":"Karachi", "children":[{"name":"eden"}]}]}, { "name":"India", "children": [ { "name":"d", "children": [ {"name":"ali"}]}, { "name":"Banglore", "children":[{"name":"PP"},{"name":"JJ"}]}]}]} Now the orignal problem is that currently i am solving this problem for data of array of three keys and i have to go for 3 nested loops now i want to optimize this solution so that if data array of object has more than 3 key say 5 {country :"America", state:"NewYork",city:"newYOrk",street:"elm", employe:'Jacob'}, or more than my solution will not work and i cannot decide before how many keys will come so i thought recursion may suit best here. But i am horrible in writing recurrsion and the case is also complex. Can some awesome programmer help me writing recurrsion or suggest some other solution.

Read the article

Rotate sphere in Javascript / three.js while moving on x/z axes

- by kaipr

I have a sphere/ball in three.js which I want to "roll" arround on a x/z axis. For the z axe I could simply do this no matter what the current x and y rotation is: sphere.roll_z = function(distance) { sphere.position.z += distance; sphere.rotation.x += distance > 0 ? 0.05 : -0.05; } But how can I roll it along the x axe? And how could I properly do the roll_z? I've found a lot about quateration and matrixes, but I can't figure out how to use them properly to achieve my (rather simple) goal. I'm aware that I have to update multiple rotations and that I have to calculate how far to rotate the sphere to match the distance, but the "how" is the question. It's probably just lack of mathematical skills which I should train, but a working example/short explanation would help alot to start with.

Read the article

Drawing isometric map in canvas / javascript

- by Dave

I have a problem with my map design for my tiles. I set player position which is meant to be the middle tile that the canvas is looking at. How ever the calculation to put them in x:y pixel location is completely messed up for me and i don't know how to fix it. This is what i tried: var offset_x = 0; //used for scrolling on x var offset_y = 0; //used for scrolling on y var prev_mousex = 0; //for movePos function var prev_mousey = 0; //for movePos function function movePos(e){ if (prev_mousex === 0 && prev_mousey === 0) { prev_mousex = e.pageX; prev_mousey = e.pageY; } offset_x = offset_x + (e.pageX - prev_mousex); offset_y = offset_y + (e.pageY - prev_mousey); prev_mousex = e.pageX; prev_mousey = e.pageY; run = true; } player_posx = 5; player_posy = 55; ct = 19; for (i = (player_posx-ct); i < (player_posx+ct); i++){ //horizontal for (j=(player_posy-ct); j < (player_posy+ct); j++){ // vertical //img[0] is 64by64 but the graphic is 64by32 the rest is alpha space var x = (i-j)*(img[0].height/2) + (canvas.width/2)-(img[0].width/2); var y = (i+j)*(img[0].height/4); var abposx = x - offset_x; var abposy = y - offset_y; ctx.drawImage(img[0],abposx,abposy); } } Now based on these numbers the first render-able tile is I = 0 & J = 36. As numbers in the negative are not in the array. But for I=0 and J= 36 the position it calculates is : -1120 : 592 Does any one know how to center it to canvas view properly?

Read the article

Why are Javascript for/in loops so verbose?

- by Matthew Scharley

I'm trying to understand the reasoning behind why the language designers would make the for (.. in ..) loops so verbose. For example: for (var x in Drupal.settings.module.stuff) { alert("Index: " + x + "\nValue: " + Drupal.settings.module.stuff[x]); } It makes trying to loop over anything semi-complex like the above a real pain as you either have to alias the value locally inside the loop yourself, or deal with long access calls. This is especially painful if you have two to three nested loops. I'm assuming there is a reason why they would do things this way, but I'm struggling with the reasoning.

Read the article

Javascript A* path finding ENEMY MOVEMENT in 3D environment

- by faiz

iam trying to implement pathfinding algorithm using PATHFINDING.JS in 3D world using webgl. iam have made a matrix of 200x200. and placed my enemy(swat) in it .iam confused in implmenting the path. i have tried implementing the path by compparing the value of each array value with swat's position . it works ! but ** THE ENEMY KEEPS GOING FROM THE UNWALKABLE AREA OF MY MATRIX....like the enemy should not move from 119,100(x=119,z=100) but its moving from that co-ordinate too ..... can any one help me out in this regard .. *prob facing :* enemy (swat character keeps moving from the wall /unwalkable area) wanted solution : enemy does not move from the unwalkable path.. ** function draw() { grid = new PF.Grid(200, 200); grid.setWalkableAt( 119,100, false); grid.setWalkableAt( 107,100, false); grid.setWalkableAt( 103,104, false); grid.setWalkableAt( 103,100, false); grid.setWalkableAt( 135,100, false); grid.setWalkableAt( 103,120, false); grid.setWalkableAt( 103,112, false); grid.setWalkableAt( 127,100, false); grid.setWalkableAt( 123,100, false); grid.setWalkableAt( 139,100, false); grid.setWalkableAt( 103,124, false); grid.setWalkableAt( 103,128, false); grid.setWalkableAt( 115,100, false); grid.setWalkableAt( 131,100, false); grid.setWalkableAt( 103,116, false); grid.setWalkableAt( 103,108, false); grid.setWalkableAt( 111,100, false); grid.setWalkableAt( 103,132, false); finder = new PF.AStarFinder(); f1=Math.abs(first_person_controller.position.x); f2=Math.abs(first_person_controller.position.z); ff1=Math.round(f1); ff2=Math.round(f2); s1=Math.abs(swat.position.x); s2=Math.abs(swat.position.z); ss1=Math.round(s1); ss2=Math.round(s1); path = finder.findPath(ss1,ss2,ff1,ff2, grid); size=path.length-1; Ai(); } function Ai(){ if (i<size) { if (swat.position.x >= path[i][0]) { swat.position.x -= 0.3; if(Math.floor(swat.position.x) == path[i][0]) { i=i+1; } } else if(swat.position.x <= path[i][0]) { swat.position.x += 0.3; if(Math.floor(swat.position.x) == path[i][0]) { i=i+1; } } } if (j<size) { if((Math.abs(swat.position.z)) >= path[j][1]) { swat.position.z -= 0.3; if(Math.floor(Math.abs(swat.position.z)) == path[j][1]) { j=j+1; } } else if((Math.abs(swat.position.z)) <= path[j][1]) { swat.position.z += 0.3; if(Math.floor(Math.abs(swat.position.z)) == path[j][1]) { j=j+1; } } } }

Read the article

Parallel downloading of JavaScript files on page load

- by user359650

Below is a quote from one of the Yahoo performance pages: While a script is downloading, however, the browser won't start any other downloads, even on different hostnames. When I look at page load of our website, I can see that many scripts are being downloaded at the same time: Am I mistaken, or should the quote should instead read like this? While scripts are downloading (there can be several scripts downloading at the same time), the browser won't start any other downloads, even on different hostnames.

Read the article

For a Javascript library, what is the best or standard way to support extensibility

- by Michael Best

Specifically, I want to support "plugins" that modify the behavior of parts of the library. I couldn't find much information on the web about this subject. But here are my ideas for how a library could be extensible. The library exports an object with both public and "protected" functions. A plugin can replace any of those functions, thus modifying the library's behavior. Advantages of this method are that it's simple and that the plugin's functions can have full access to the library's "protected" functions. Disadvantages are that the library may be harder to maintain with a larger set of exposed functions and it could be hard to debug if multiple plugins are involved (how to know which plugin modified which function?). The library provides an "add plugin" function that accepts an object with a specific interface. Internally, the library will use the plugin instead of it's own code if appropriate. With this method, the internals of the library can be rearranged more freely as long as it still supports the same plugin interface. This could also support having different plugin interfaces to modify different parts of the library. A disadvantage of this method is that the plugins may have to re-implement code that is already part of the library since the library's internal functions are not exported. The library provides a "set implementation" function that accepts an object inherited from a specific base object. The library's public API calls functions in the implementation object for any functionality that can be modified and the base implementation object includes the core functionality, with both external (to the API) and internal functions. A plugin creates a new implementation object, which inherits from the base object and replaces any functions it wants to modify. This combines advantages and disadvantages of both the other methods.

Read the article

Confused about javascript module pattern implementation

- by Damon

I have a class written on a project I'm working on that I've been told is using the module pattern, but it's doing things a little differently than the examples I've seen. It basically takes this form: (function ($, document, window, undefined) { var module = { foo : bar, aMethod : function (arg) { className.bMethod(arg); }, bMethod : function (arg) { console.log('spoons'); } }; window.ajaxTable = ajaxTable; })(jQuery, document, window); I get what's going on here. But I'm not sure how this relates to most of the definitions I've seen of the module (or revealing?) module pattern. like this one from briancray var module = (function () { // private variables and functions var foo = 'bar'; // constructor var module = function () { }; // prototype module.prototype = { constructor: module, something: function () { } }; // return module return module; })(); var my_module = new module(); Is the first example basically like the second except everything is in the constructor? I'm just wrapping my head around patterns and the little things at the beginnings and endings always make me not sure what I should be doing.

Read the article

Which JavaScript carousel zooms blocks from the playlist?

- by Iain Hallam

I saw a carousel/slider for displaying featured content a while ago that does something that most don't. It started fairly simply, with the top feature large, and a playlist to the side of other featured stories: Feature 1 then began to slide towards the bottom right, while feature 2 moved to occupy the main slot, and the previews of features 3 and 4 moved up: The slider had now completed a whole swap, and was ready to do the same thing with feature 3. My Google-fu seems to be lacking in finding this again; does anyone know of this slider? I think it was based on one of the frameworks, but I'm not sure whether it was jQuery or one of the others.

Read the article

collision detection problems - Javascript/canvas game

- by Tom Burman

Ok here is a more detailed version of my question. What i want to do: i simply want the have a 2d array to represent my game map. i want a player sprite and i want that sprite to be able to move around my map freely using the keyboard and also have collisions with certain tiles of my map array. i want to use very large maps so i need a viewport. What i have: I have a loop to load the tile images into an array: /Loop to load tile images into an array var mapTiles = []; for (x = 0; x <= 256; x++) { var imageObj = new Image(); // new instance for each image imageObj.src = "images/prototype/"+x+".jpg"; mapTiles.push(imageObj); } I have a 2d array for my game map: //Array to hold map data var board = [ [1,2,3,4,3,4,3,4,5,6,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1], [17,18,19,20,19,20,19,20,21,22,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1], [33,34,35,36,35,36,35,36,37,38,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1], [49,50,51,52,51,52,51,52,53,54,1,1,1,1,1,1,1,1,1,1,1,1,1,197,198,199,1,1,1,1], [65,66,67,68,146,147,67,68,69,70,1,1,1,1,1,1,1,1,216,217,1,1,1,213,214,215,1,1,1,1], [81,82,83,161,162,163,164,84,85,86,1,1,1,1,1,1,1,1,232,233,1,1,1,229,230,231,1,1,1,1], [97,98,99,177,178,179,180,100,101,102,1,1,1,1,59,1,1,1,248,249,1,1,1,245,246,247,1,1,1,1], [1,1,238,1,1,1,1,239,240,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1], [216,217,254,1,1,1,1,255,256,1,204,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1], [232,233,1,1,1,117,118,1,1,1,220,1,1,119,120,1,1,1,1,1,1,1,1,1,1,1,119,120,1,1], [248,249,1,1,1,133,134,1,1,1,1,1,1,135,136,1,1,1,1,1,1,59,1,1,1,1,135,136,1,1], [1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1], [1,1,216,217,1,1,1,1,1,1,60,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1], [1,1,232,233,1,1,1,1,1,1,1,1,1,1,1,1,1,1,204,1,1,1,1,1,1,1,1,1,1,1], [1,1,248,249,1,1,1,1,1,1,1,1,1,1,1,1,1,1,220,1,1,1,1,1,1,216,217,1,1,1], [1,1,1,1,1,1,1,1,1,1,1,1,149,150,151,1,1,1,1,1,1,1,1,1,1,232,233,1,1,1], [12,12,12,12,12,12,12,13,1,1,1,1,165,166,167,1,1,1,1,1,1,119,120,1,1,248,249,1,1,1], [28,28,28,28,28,28,28,29,1,1,1,1,181,182,183,1,1,1,1,1,1,135,136,1,1,1,1,1,1,1], [44,44,44,44,44,15,28,29,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1], [1,1,1,1,1,27,28,29,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1], [1,1,1,1,1,27,28,29,1,1,1,1,1,1,1,1,1,59,1,1,197,198,199,1,1,1,1,119,120,1], [1,1,1,1,1,27,28,29,1,1,216,217,1,1,1,1,1,1,1,1,213,214,215,1,1,1,1,135,136,1], [1,1,1,1,1,27,28,29,1,1,232,233,1,1,1,1,1,1,1,1,229,230,231,1,1,1,1,1,1,1], [1,1,1,1,1,27,28,29,1,1,248,249,1,1,1,1,1,1,1,1,245,246,247,1,1,1,1,1,1,1], [1,1,1,197,198,199,28,29,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1], [1,1,1,213,214,215,28,29,1,1,1,1,1,60,1,1,1,1,204,1,1,1,1,1,1,1,1,1,1,1], [1,1,1,229,230,231,28,29,1,1,1,1,1,1,1,1,1,1,220,1,1,1,1,119,120,1,1,1,1,1], [1,1,1,245,246,247,28,29,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,135,136,1,1,60,1,1], [1,1,1,1,1,27,28,29,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1], [1,1,1,1,1,27,28,29,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1] ]; I have my loop to place the correct tile sin the correct positions: //Loop to place tiles onto screen in correct position for (x = 0; x <= viewWidth; x++){ for (y = 0; y <= viewHeight; y++){ var width = 32; var height = 32; context.drawImage(mapTiles[board[y+viewY][x+viewX]],x*width, y*height); } } I Have my player object : //Place player object context.drawImage(playerImg, (playerX-viewX)*32,(playerY-viewY)*32, 32, 32); I have my viewport setup: //Set viewport pos viewX = playerX - Math.floor(0.5 * viewWidth); if (viewX < 0) viewX = 0; if (viewX+viewWidth > worldWidth) viewX = worldWidth - viewWidth; viewY = playerY - Math.floor(0.5 * viewHeight); if (viewY < 0) viewY = 0; if (viewY+viewHeight > worldHeight) viewY = worldHeight - viewHeight; I have my player movement: canvas.addEventListener('keydown', function(e) { console.log(e); var key = null; switch (e.which) { case 37: // Left if (playerY > 0) playerY--; break; case 38: // Up if (playerX > 0) playerX--; break; case 39: // Right if (playerY < worldWidth) playerY++; break; case 40: // Down if (playerX < worldHeight) playerX++; break; } My Problem: I have my map loading an it looks fine, but my player position thinks it's on a different tile to what it actually is. So for instance, i know that if my player moves left 1 tile, the value of that tile should be 2, but if i print out the value it should be moving to (2), it comes up with a different value. How ive tried to solve the problem: I have tried swap X and Y values for the initialization of my player, for when my map prints. If i swap the x and y values in this part of my code: context.drawImage(mapTiles[board[y+viewY][x+viewX]],x*width, y*height); The map doesnt get draw correctly at all and tiles are placed all in random positions or orientations IF i sway the x and y values for my player in this line : context.drawImage(playerImg, (playerX-viewX)*32,(playerY-viewY)*32, 32, 32); The players movements are inversed, so up and down keys move my player left and right viceversa. My question: Where am i going wrong in my code, and how do i solve it so i have my map looking like it should and my player moving as it should as well as my player returning the correct tileID it is standing on or moving too. Thanks Again ALSO Here is a link to my whole code: prototype

Read the article

Javascript A* path finding

- by Veyha

I am trying to learn A* path finding. I am using this library - https://github.com/qiao/PathFinding.js But there is one thing I don't understand how to do. To find a path from player.x/player.y (player.x and player.y are both 0) to 10/10 I use this code var path = finder.findPath(player.x, player.y, 10, 10, grid); This gives an array of where I need to move, but how do I apply this array to my player.x and player.y? The path structure looks like this path = [[0, 0], [1, 0], [1, 1], ..., [10, 10]]

Read the article

Javascript Open a Window Full Size (Mazimized)

- by SAMIR BHOGAYTA

function f_open_window_max( aURL, aWinName ) { var wOpen; var sOptions; sOptions = 'status=yes,menubar=yes,scrollbars=yes,resizable=yes,toolbar=yes'; sOptions = sOptions + ',width=' + (screen.availWidth - 10).toString(); sOptions = sOptions + ',height=' + (screen.availHeight - 122).toString(); sOptions = sOptions + ',screenX=0,screenY=0,left=0,top=0'; wOpen = window.open( '', aWinName, sOptions ); wOpen.location = aURL; wOpen.focus(); wOpen.moveTo( 0, 0 ); wOpen.resizeTo( screen.availWidth, screen.availHeight ); return wOpen; }

Read the article

Javascript: Avoid this and new - further reading? [closed]

- by Thomas Deutsch

I do not want this to end in a sort of religious discussion, i want to collect some sources for further reading on this topic. As shown here: Node.js Style and Structure Point 1: Avoid this and new you can find a good example when it could be better to use closures instead of a prototype, and to make every argument explicit. Ok, i agree - could be nice, but i need to know more. Can anyone recommend a good link? Would this make my code 100% object-pattern-free ? (no factory-, repository-, module- pattern?)

Read the article

Storing data offline with javascript

- by Walker

My question is about storing data offline and potentially whether I will need to bring in an outside programmer or could this be learned within a few weeks? The website I am working on will have an interface where users will login and go through a series of quizzes in the form of checkbox, drop down menus, and others. Each page/quiz area could have 20-100 total checkboxes in a series of 3-5 rows because of the comprehensive nature of course. This I can do - I know how to code the quiz and return a correct or incorrect answer based on each individual checkbox and present a cumulative score (ie: you got 57% correct). The issue lies in the fact that I would like to save the users results and keep them informed of their progress. When they complete all of the quizzes, I would like to have a visual output of their performance in each area. Storing the output from their results offline is where I think I may run into a problem with my lack of coding experience. I would also like to have a sidebar with their progress of each section (10-15) with a green percentage completion bar or a % correct which would draw from this. I have never had to code something that stores information like this offline - so back to my question - would it be better to learn the language needed or bring in a coder/developer for the back end stuff.

Search Results

Search found 23794 results on 952 pages for 'serverside javascript'.

Page 16/952 | < Previous Page | 12 13 14 15 16 17 18 19 20 21 22 23 | Next Page >

- by Matt Greer

- by Zac Altman

- by Chris Jacob

- by karlthorwald

- by kerry

- by BRADINO

- by zuo

- by StealingMana

- by Jonathan

- by Clay Ellis Murray

- by Ron

- by Achilles

- by kaipr

- by Dave

- by Matthew Scharley

- by faiz

- by user359650

- by Michael Best

- by Damon

- by Iain Hallam

- by Tom Burman

- by Veyha

- by SAMIR BHOGAYTA

- by Thomas Deutsch

- by Walker

< Previous Page | 12 13 14 15 16 17 18 19 20 21 22 23 | Next Page >