Josh Schumacher: A PHP Developer » Javascript http://blog.joshschumacher.com The biggest and the best in the Northwest Thu, 29 Oct 2009 21:54:30 +0000 en hourly 1 http://wordpress.org/?v=3.0 Advanced iPhone Web Development http://blog.joshschumacher.com/2009/05/06/advanced-iphone-web-development/ http://blog.joshschumacher.com/2009/05/06/advanced-iphone-web-development/#comments Wed, 06 May 2009 19:06:06 +0000 Josh Schumacher http://blog.joshschumacher.com/?p=26 Yesterday (May 5th, 2009), I gave a presentation at the Seattle iPhone App Developers and Designers Meetup titled, “Advanced iPhone Web Development.” This presentation focused on the unique capabilities available in WebKit on the iPhone and on possibilities for utilizing UIWebViews inside of your native applications.

You can download a pdf version of the presentation here: Advanced iPhone Web Development [PDF]

Advanced iPhone Web Development Slideshow (Best Viewed In Fullscreen)
]]> http://blog.joshschumacher.com/2009/05/06/advanced-iphone-web-development/feed/ 3 Howto: Exclude developer hits in Analytics http://blog.joshschumacher.com/2007/03/16/howto-not-track-developer-hits-in-analytics/ http://blog.joshschumacher.com/2007/03/16/howto-not-track-developer-hits-in-analytics/#comments Fri, 16 Mar 2007 18:25:29 +0000 Josh Schumacher http://blog.joshschumacher.com/2007/03/16/howto-not-track-developer-hits-in-analytics/ When developing a site, I visit it a lot - OK Josh, that was an obvious. Point is, I was tired of tracking my visits to sites that I maintain. I really care about tracking significant users and how they navigate the site and what pages they find valuable but I don't care about my hits.

I put together a quick page that I can navigate to that will install a cookie for the browser. I can then check for the cookie in my standard header include so the Google Analytics tracking code isn't sent to the browser.

The code to set the cookie (and make sure it's installed correctly)

PLAIN TEXT
PHP:
  1. setcookie("hideAnalytics", 'true', time()+(3600*24*365*30));
  2.  
  3. if(isset($_COOKIE['hideAnalytics']) && $_COOKIE['hideAnalytics'] == 'true')
  4. {
  5.     print "Cookie installed";
  6. }

Similar (but inverse) code is then inserted in my header

PLAIN TEXT
PHP:
  1. <? if(!isset($_COOKIE['hideAnalytics']) || $_COOKIE['hideAnalytics'] != 'true') { ?>
  2. ANALYTICS TRACKING CODE
  3. <? } ?>

Analytics is a great tool and it's going to be even more useful now that I won't be tracking my own hits.

]]> http://blog.joshschumacher.com/2007/03/16/howto-not-track-developer-hits-in-analytics/feed/ 0 Playing well together: Prototype JS and PHP http://blog.joshschumacher.com/2007/03/02/playing-well-together-prototype-js-and-php/ http://blog.joshschumacher.com/2007/03/02/playing-well-together-prototype-js-and-php/#comments Sat, 03 Mar 2007 06:30:56 +0000 Josh Schumacher http://blog.joshschumacher.com/2007/03/02/playing-well-together-prototype-js-and-php/ I've decided that manipulating dates client side is a mess. I've been working on a multi-user php calendar for the past few months. One of the features I'm most proud of is an availability chart similar to a feature outlook has so you can schedule a meeting with multiple people and see when everyone is free and busy.

Availability ViewSince I'm using Prototype for my javascript library already, I took advantage of the Prototype Window Class to make modal and dialog windows. One of the downsides to this is it adds another step of complexity to ensuring everything is properly synchronized. For example, my scheduler window has to maintain in sync with it's parent window if dates where changed at that level.

To start off, I create actions for nextDay() and prevDay(). These are simply fired onclick() on buttons with corresponding labels.

PLAIN TEXT
JavaScript:
  1. function nextDay()
  2. {
  3. updateAvailabilityChart('next');
  4. }

Next we'll define the updateAvailabilityChart() function. The arrayInviteUsers holds an array of user ids (this is out of the scope of this article).

PLAIN TEXT
JavaScript:
  1. // param change = none, next or prev
  2. function updateAvailabilityChart(change)
  3. {
  4. var startString = window.parent.getStartDate();
  5. var endString = window.parent.getEndDate();
  6.  
  7. $('availabilityChart').innerHTML = 'Loading...';
  8. var counter = 0;
  9. var params = '';
  10. arrayInviteUsers.each( function(user) {
  11. counter++;
  12. params += 'userid'+counter+'='+user+'&amp;'
  13. });
  14. params += 'startString='+startString+'&amp;';
  15. params += 'endString='+endString+'&amp;';
  16. params += 'change='+change;
  17.  
  18. var url = 'get_availability.php';
  19. var myAjax = new Ajax.Request( url, { method: 'get', parameters: params, onSuccess: loadedAvail });
  20. $('q').value = '';
  21. }

The above code will make an Ajax request to get_availability.php which will increment, decrement or keep the start and end dates the same and then return some cool response text starting with the new start date, new end date and html for the availability table. I defined a delimiter of '^^;;^^' just so I can tell where data starts and stops. Below is the basic code in get_availability.php.

PLAIN TEXT
PHP:
  1. $strStartTime = isset($_REQUEST['startString']) ? strtotime($_REQUEST['startString']) : time();
  2. $strEndTime = isset($_REQUEST['endString']) ? strtotime($_REQUEST['endString']) : time();
  3.  
  4. if(!is_numeric($strStartTime)) {
  5. $strStartTime = time();
  6. }
  7.  
  8. if(!is_numeric($strEndTime)) {
  9. $strEndTime = $strStartTime;
  10. }
  11.  
  12. if($strStartTime> $strEndTime) {
  13. $strEndTime = $strStartTime;
  14. }
  15.  
  16. $change = isset($_REQUEST['change']) ? $_REQUEST['change'] : 'none';
  17. switch ($change) {
  18. case 'prev':
  19. $strTime = mktime(0,0,0,date('m',$strStartTime),date('d',$strStartTime)-1,date('Y',$strStartTime));
  20. break;
  21. case 'next':
  22. $strTime = mktime(0,0,0,date('m',$strStartTime),date('d',$strStartTime)+1,date('Y',$strStartTime));
  23. break;
  24. default:
  25. $strTime = $strStartTime;
  26. break;
  27. }
  28. $strTimeEnd = $strTime + ($strEndTime - $strStartTime);
  29.  
  30. print date('m\/d\/Y',$strTime);
  31. print "^^;;^^";
  32. print date('m\/d\/Y',$strTimeEnd);
  33. print "^^;;^^";
  34.  
  35. $display = new Display();
  36. $display->drawDayAvailibility($usersArray, $strTime);

Finally, the Ajax request defined a function to be called when the request return successfully. This function will update the innerHTML of a div on the page and tell the parent window what the new start date and end date is.

PLAIN TEXT
JavaScript:
  1. function loadedAvail(transport)
  2. {
  3. var entityParts = transport.responseText.split('^^;;^^');
  4. var newStart    = entityParts[0];
  5. var newEnd      = entityParts[1];
  6. var html       = entityParts[2];
  7. $('availabilityChart').innerHTML = html;
  8. window.parent.setStartDate(newStart);
  9. window.parent.setEndDate(newEnd);
  10. }

This is a very small piece of a very large project but it's fun to share with others. If you have questions or could benefit from some more of the details going into this basic process, let me know and I can post more.

]]> http://blog.joshschumacher.com/2007/03/02/playing-well-together-prototype-js-and-php/feed/ 3