|
I wrote this script some time ago, it works fine on PC's, but on mobile devices, I need to optimize it and get it to run faster in speed.
So like on a iPhone 4, it takes about 3 seconds to run.on a PC it takes 1 second, which is slow.
Just looking for ideas or tips, or another set of eyes to check it out.
1. Confirms a value in the textbox, if not, textbox turns pink, and the error arrow shows
2. checks if it's a number
3. increments value.
function jquery_Add2Cart_Numeric_Up() {
var vFlag = true;
var txtFocus = $('[id*="_txt_Focus_Field"]').val();
var txtError = $('[id*="_txt_Error_Field"]').val();
var qty_value = $('[id*="_txt_Modal_Add2Cart_SelectQty"]').val();
if (qty_value.length < 1) {
$('[id*="_txt_Modal_Add2Cart_SelectQty"]').css('background-color', txtError);
vFlag = false;
}
else if (qty_value.length > 0) {
$('[id*="_txt_Modal_Add2Cart_SelectQty"]').css('background-color', txtFocus);
var re_Qty = new RegExp("^([1-9]|[1-9][0-9]|[1-9][0-9][0-9])$")
var txt_Qty = $('[id*="_txt_Modal_Add2Cart_SelectQty"]').val();
var match_Qty = re_Qty.exec(txt_Qty);
if (match_Qty == null) {
$('[id*="_txt_Modal_Add2Cart_SelectQty"]').css('background-color', txtError);
$('[id*="_lbl_Modal_Add2Cart_Center_Container_QtyMessage"]').text("Invalid Quantity!");
$('[id*="_txt_Modal_Add2Cart_SelectQty"]').val("1");
vFlag = false;
}
else if (match_Qty !== null) {
$('[id*="_txt_Modal_Add2Cart_SelectQty"]').css('background-color', txtFocus).show();
$('[id*="_lbl_Modal_Add2Cart_Center_Container_QtyMessage"]').text("Select your quantity:");
var qty = parseInt($('[id*="_txt_Modal_Add2Cart_SelectQty"]').val());
if (qty < 1000) {
qty ++
$('[id*="_txt_Modal_Add2Cart_SelectQty"]').val(qty);
}
}
}
return false;
}
|
|
|
|
|
Jeepers, in 6-7 secs on a 650Mhz android phone, I can generate an image thats 256x256, with 2 calls to _each_ of square root, sin and cos - perPixel.
Something I notice is that you've got many instances of $('[id*="_txt_Modal_Add2Cart_SelectQty"]') in your code. I'd try just evaluating that statement once, before then using it later - much like you did for the css rules.
I dont jQuery, I apologise if the syntax is incorrect.
In any case,the point is - evaluate expensive things as few times as possible.
In my code, this could be done by pre-computing sin cos and sqrt tables. In yours I'd assume you could evaluate the statement I've mentioned. I expect it takes jQuery some time to parse the statement before finding the element that you wish to target.
I.e
var txtModalSelectQtyEl = $('[id*="_txt_Modal_Add2Cart_SelectQty"]');
...
...
var qty_value = txtModalSelectQtyEl.val();
...
...
txtModalSelectQtyEl.css('background-color', txtFocus);
..
..
Make it work. Then do it better - Andrei Straut
|
|
|
|
|
What I did think of, is that perhaps I should just assume that the value is correct or an integer, and if not, then run the rest of the script. It's really fast now, and does not hesitate anymore.
On the iPhone, it was a matter of making the increment buttons bigger for a more positive contact with the finger or thumb.
Did I mention that it's just a webpage running on a phone?
Love the feedback though, this function has been giving me trouble for quite a while now, if you think my new idea is bad, just let me know.
[Edit]
Hey Eric, just saw your name on the post. Let me know what you think of the new design below, if it sucks, please let me know so I can work on it again. Thanks Jim
function jquery_Add2Cart_Numeric_Up() {
try {
var qty = parseInt($('[id*="_txt_Modal_Add2Cart_SelectQty"]').val());
if (qty < 1000) {
qty++;
$('[id*="_txt_Modal_Add2Cart_SelectQty"]').val(qty);
}
}
catch (err) {
var vFlag = true;
var txtFocus = $('[id*="_txt_Focus_Field"]').val();
var txtError = $('[id*="_txt_Error_Field"]').val();
var qty_value = $('[id*="_txt_Modal_Add2Cart_SelectQty"]').val();
if (qty_value.length < 1) {
$('[id*="_txt_Modal_Add2Cart_SelectQty"]').css('background-color', txtError);
vFlag = false;
}
else if (qty_value.length > 0) {
$('[id*="_txt_Modal_Add2Cart_SelectQty"]').css('background-color', txtFocus);
var re_Qty = new RegExp("^([1-9]|[1-9][0-9]|[1-9][0-9][0-9])$")
var txt_Qty = $('[id*="_txt_Modal_Add2Cart_SelectQty"]').val();
var match_Qty = re_Qty.exec(txt_Qty);
if (match_Qty == null) {
$('[id*="_txt_Modal_Add2Cart_SelectQty"]').css('background-color', txtError);
$('[id*="_lbl_Modal_Add2Cart_Center_Container_QtyMessage"]').text("Invalid Quantity!");
$('[id*="_txt_Modal_Add2Cart_SelectQty"]').val("1");
vFlag = false;
}
else if (match_Qty !== null) {
$('[id*="_txt_Modal_Add2Cart_SelectQty"]').css('background-color', txtFocus).show();
$('[id*="_lbl_Modal_Add2Cart_Center_Container_QtyMessage"]').text("Select your quantity:");
}
}
}
return false;
}
|
|
|
|
|
Ah, that looks a little less processor intensive. I continually forget about try-catch blocks myself.
Thanks for the reminder Jim. 
Though I do notice, if the user passes a non-integer, the code will still try to parse it as an int again. It will also make the repeated calls to jQuery to evaluate the statement I mentioned earlier. But as always, less optimization is often better than more - since readability is often the casualty. Optimization is good - where necessary. That's why we only write asm when we have to etc.
I probably shouldn't... but here goes:
At a job I worked at once, I'd often have a cigarette with one of the guys from the English Learning Center. Somehow, he'd remembered my name as David. I considered a couple of times correcting him, but in the end, figured - we've no reason to communicate in an official capacity at work, nor did we have any reason to discuss one-another during the course of normal duties. I couldn't see it as really mattering.
So, this went on for about 2 1/2 years or so. In my last week there, one of the girls let the cat out of the bag and called me Simon. Somewhat shocked and incredulous, he asked why I'd never corrected him. I simply told him that he'd been consistent - he'd called me David for as long as I could remember. Clearly I was identified as being me - did it really matter what he called me? We had a good laugh and decided that it really didn't matter.
Boy did we have a good laugh over that one.
Make it work. Then do it better - Andrei Straut
|
|
|
|
|
ha ha ha
I forgot it was Simon;
I don't know what made me think of Eric.
I think I know, it's the enh in your handle, Eric just popped up in my head for some reason.
Thanks for pointing out that extra parseInt, I'll take care of it right now.
That should do the trick for now. Thanks for the eyes on the script!
Jim
|
|
|
|
|
It's a pleasure as always, Jim.
Make it work. Then do it better - Andrei Straut
|
|
|
|
|
I thought I would get back to playing with KnockoutJs in a simple HTML and JS environment using JQuery to access JSON data from Web Services.
My question is, how do/would you set up the various JS files and folders in your web application?
I mean, physically, do you create a single JS file per ViewModel and a single HTML file for the view ? Do you put them in the same folder, or have everything at the root?
I'm not a web developer, so be gentle - use shot words
Also, does anyone have experience using Typescript with KnockoutJs. I'm just about to start and would appreciate any help/advice.
MVVM # - I did it My Way
___________________________________________
Man, you're a god. - walterhevedeich 26/05/2011
.\\axxx
(That's an 'M')
|
|
|
|
|
_Maxxx_ wrote:
My question is, how do/would you set up the various JS files and folders in your web application?
My own JS goes into "scripts" folder. The rest, JQuery, Knockout etc. are fetched from CDNs.
_Maxxx_ wrote: do you create a single JS file per ViewModel and a single HTML file for the view ?
Nope... but some say to do so.
_Maxxx_ wrote: using Typescript with KnockoutJs
I'ven't use Knockout yet, Typescript it's good... atleast from the documentation, I'm also starting to use it. It's a compiler that compiles typescript into javascript. Write your code, feed it to the compiler and use the generated JS in your website. Easy Peasy! 
|
|
|
|
|
Amitosh Swain wrote: My own JS goes into "scripts" folder. The rest, JQuery, Knockout etc. are fetched from CDNs.
Yep - I do that - but I wasn't sure about the VMs created for Knockout - whether they go with the scripts, in a subfolder of scripts, or with the html 'views'
The TypeScript idea is great (I actually thought about doing something like it myself but MS must have been tapping my thoughts )
What I am trying to figure out is exactly how to write a Knockout VM using TypeScript "properly"
MVVM # - I did it My Way
___________________________________________
Man, you're a god. - walterhevedeich 26/05/2011
.\\axxx
(That's an 'M')
|
|
|
|
|
_Maxxx_ wrote: Knockout VM using TypeScript "properly"
Knockout + Typescript... Good Idea, but never tried it.
|
|
|
|
|
_Maxxx_ wrote: I mean, physically, do you create a single JS file per ViewModel and a single HTML file for the view ? Do you put them in the same folder, or have everything at the root?
I've used both Knockoutjs and Typescript in a project. I kept my jquery knockout etc in the Scripts folder, but then created a folder structure that matched the namespaces of my project.
At that point, if I were working on controls for the application, I would create all my VM's and HTML files separately but keep them together in that folder.
_Maxxx_ wrote: Also, does anyone have experience using Typescript with KnockoutJs. I'm just about to start and would appreciate any help/advice.
Typescript is a great tool for developing javascript. As a C# developer initially, it made the transition to javascript rather painless. The features in the latest release which include being able to develop with generics has the potential to greatly reduce the amount of code needed to be written by hand for a project.
Typescript also has ambient declaration files that support a wide range of javascript libraries. You can find them all here.
Hope this helps! 
"In the middle of difficulty lies opportunity." Albert Einstein
|
|
|
|
|
Payrok wrote: Hope this helps!
Thanks - yes it does - following that link right now!
MVVM # - I did it My Way
___________________________________________
Man, you're a god. - walterhevedeich 26/05/2011
.\\axxx
(That's an 'M')
|
|
|
|
|
hey guys.
I m looking for 1 or 2 people to start creating a RPG online game with HTML5, nodejs and any other technology that is needed.
the thing i have in mind is a 3d game with low res but good looking game like http://www.playtankworld.com/
three js is awesome but i dont know if it's just in a point that such a game can be created with.
the alternative idea is a classic 2d sprite base game.
i have really good ideas in mind so it can be really awesome.
any suggestion, help will be appreciated.
lets be the first.
|
|
|
|
|
|
sure, thanks, help me delete this here please
|
|
|
|
|
Hi,
Below code is not working in IE-8 but it is working good in all other browsers. I am not able to understand what is wrong in this code as it is very simple one.
<a href="abc.htm" target="_blank;">Click here</a>
When I click on a link nothing happen. Please let me know how to fix this for IE.
Thanks in advance,
Inder...
|
|
|
|
|
InderK wrote: target="_blank;"
Try removing the semi-colon from the end of your target value.
"These people looked deep within my soul and assigned me a number based on the order in which I joined."
- Homer
|
|
|
|
|
No, not working after removing semi-colon. 
|
|
|
|
|
should work is this working?
<A href="http://facebook.com/" target=_blank><IMG border=0 align=center src="images/1.png"></A>
??
|
|
|
|
|
<A id="id" href="aa" target="_blank"><IMG class=bn alt=banner src="banner/Water lilies.jpg" width=170 height=284></A>
try likethisone
|
|
|
|
|
I am trying to create a dynamic collapsible-set which would contain text and image. Texts are appearing fine but as soon as I try to write code (see commented line) for image, browser doesn't display it correctly. It takes 2-3 clicks to open the collapsible, and it gets stuck most of the time. Here is my code:
<pre lang="Javascript">
$("#dvAccordion").empty();
var outdiv = $('<div data-role="collapsible-set"></div>');
$(strXML).find('Category').each(function(){
var colldiv = $('<div data-role="collapsible" data-collapsed="true"></div>');
colldiv.append('<h3>' + $(this).find('Category_Name').text() + '</h3>');
var uldiv = $('<ul data-role="listview" data-inset="false"></ul>');
colldiv.append(uldiv);
$(this).find('Menu_Item').each(function(){
var sItemName = $(this).find('item_name').text() ;
var sImageUrl = "images/food1.jpg" ;
uldiv.append('<li><a href="menu.html" rel="external">' + sItemName + '</li>');
});
outdiv.append(colldiv);
outdiv.appendTo('#dvAccordion');
});
$('#dvAccordion').trigger('create');
Where am I wrong? If I try to generate the collapsible with listview and images static way in html - everything works fine.
jsFiddle - http://jsfiddle.net/yesprasoon/68v8p/
Surprisingly, images are appearing properly in fiddle. But it doesn't appear in my local file/ localhost address/ phonegap application.
modified 15-Jun-13 9:45am.
|
|
|
|
|
I am generating a dynamic collapsible-set with listViews using XML data. It's generated correctly, but I need a click/touch event to display some data before it goes to another page. Here is my code:
$("#dvAccordion").empty();
var outdiv = $('<div data-role="collapsible-set"></div>');
$(strXML).find('Category').each(function(){
var colldiv = $('<div data-role="collapsible" data-collapsed="true"></div>');
colldiv.append('<h3>' + $(this).find('Category_Name').text() + '</h3>');
var uldiv = $('<ul data-role="listview" data-inset="false"></ul>');
colldiv.append(uldiv);
$(this).find('Menu_Item').each(function(){
var sItemName = $(this).find('item_name').text() ;
uldiv.append('<li data-name="baby"><a href="menu.html" rel="external">' + sItemName + '</a></li>');
});
outdiv.append(colldiv);
outdiv.appendTo('#dvAccordion');
});
$('#dvAccordion').trigger('create');
I am adding an eventListener on page load like this:
$('#dvAccordion ul').children('li').bind('vclick', function(e) {
alert('Selected Name=' + $(this).attr('data-name'));
});
Where am I wrong? If I try to write the same event listner after developing collapsible in static way in html - everything works fine.
jsfiddle - http://jsfiddle.net/yesprasoon/MvcHm/
modified 15-Jun-13 9:41am.
|
|
|
|
|
Java?
Post it elsewhere, Java has no connection to Javascript, and it doesn't qualify as a question either. 
|
|
|
|
|
He's a spammer.
Use the best guess
|
|
|
|
|
ok.
|
|
|
|
|
General 
News 
Suggestion 
Question 
Bug 
Answer 
Joke 
Praise 
Rant 
Admin 
Submit an article or tip
