Archive for the ‘Websites’ Category

23Apr

This week has been a bit intense. I am currently sitting at the San Jose Airport waiting for my flight to DC. Can’t wait to get on the plane because it is the first time I will have had a chance to sleep in the past 36 hours. (There are not enough hours in the day…)

Between binging on coffee and binging on energy drinks Andy and myself got a significant amount of work done, including but not limited to: having our program becoming autonomous and killing off Visual Studios, staring at code for about 2 hours before realizing it just needs to be pluralized to make it work, and of course a celebrator breaking of chair after I realized yet again that the letter “s” has ruined another  2 hours of my life! WOO!

Not only did we break chairs, but we also got an awesome GUI going and I migrated the original Tesla app into a plugin for Croogo. This allowed for Access Control, Auth, and an awesome template system. It also allowed for making Tesla modular enough to be run on any server!

I got 2 more features to wrap up before tomorrow night though :(. So there may be 1 more all nighter in my future for this contest. But hey, this is what I live for! It feels like 4 years ago when I was getting on stage for my first “big” concert. Lovin’ the pressure :-D!

Share/Save
19Apr

We need your help!!!

Andy Manoske and myself are representing the fine people of SJSU, CS Club, Game Dev, California and our respective organizations and communities this Friday in Washington D.C. for Project Tesla, a software tool.

But we need your help. Tesla has been well-recieved with 33,000 votes by people all around the world, and it’s battling neck and neck with some other folks for the coveted People’s Choice award. We need YOUR vote to help us clinch this award and EVERY vote counts.

How do you vote?

1.) Go to http://www.imaginecup.us/peopleschoice.aspx
2.) Click on “The Tesla Project”
3.) At the bottom rank us x-number of stars and submit your vote.

Please tell EVERYONE you know! We’re SO close to winning this, and we really need all of your guys’ help!

I will post video updates as the week goes on showing off our progress towards and during our stay in DC.
Technologies Used: CakePHP, .net C# (client), and tons of math!

We have significantly upgraded our project since the video mentioned earlier.

If you would like to be part of our testimonials at the competition please leave me a comment with your name and organization! You just need to discuss the value and importance of the Tesla Project!

Thanks! 🙂

15Feb

Hi All,

If you haven’t seen this awesome menu system check it out: http://www.andrewsellick.com/examples/sliding-side-bar-scriptaculous/

Or check out the how-to here: http://www.andrewsellick.com/44/sexy-sliding-menu-for-scriptaculous

I really thought this menu system was cool and with a few tweaks can function as integral part of the user experience on a website. Recently I had decided to leave the fabulous world of Prototype/Scriptaculous and move to JQuery. Mostly because it seems the industry has standardized around JQuery. It had some what of a learning curve, but it took about a day to really make the switch. Having to convert this sideBar script really helped with that process.

As a final note before I post the code. The animations aren’t exactly the same, but with JQuery you can create your own custom animations so feel free to modify as you wish. Changes are below!

side-bar.js:


var isExtended = 0;

$(document).ready(function(){
$("#sideBarTab").click(function(){
$("#sideBarContents").animate({ "width":"toggle"},{duration:2000,queue:false}
);

if(isExtended==0){
$('#sideBarTab').html($('#sideBarTab').html().replace(/(\.[^.]+)$/, '-active$1'));
isExtended++;
}
else{
$('#sideBarTab').html($('#sideBarTab').html().replace(/-active(\.[^.]+)$/, '$1'));
isExtended=0;
}
}
 );
});

So thats cool… In my script I also wanted somewhat accordion style items expanding within my sidebar so I use the following line of JS to dynamically add items into the sidebar (well sort of, without giving too much away).


$("#divIdToAppenedTo").append("<li><a class='header' href='#' onclick='$(\"#"+slug(name)+"\").animate({\"height\":\"toggle\"},{duration:1000,queue:false});'><div style='margin:10px 0 0 15px;'>"+name+"</div></a><div id='"+slug(name)+"' style='display: none; padding-left:15px;'>");

Woo enjoy!

Update: someone requested (via comment) the css for this. Please note you will need to modify width, colors, backgrounds, etc… I stripped down a ton of visuals in order to not release proprietary content: sb-package

10Feb

So I have been struggling for the past month trying to get a Perl CGI script that acts as a proxy to work on certain servers. The client only supports/allowed perl (as far as i knew) and didn’t allow it to output data to a browser for some reason. So you can see my dilemma. I tried various means. Worked with their IT team, etc… I kept trying to find alternative methods. I knew JSONP was an option but it’s not like RSS feeds are in JSON or are coming from a JSONP server. Finally someone told me about YQL. In short, I am pretty impressed. I essentially used it as a proxy and XML -> JSON converter. The script in JQuery is really short and goes like this:

var maxEntries = 5; // if 0 then there will be no limit

function slug(str){
 return str.replace(/\s/g,'-').replace(/[^a-zA-Z0-9\-]/g,'').toLowerCase();
}
/**
 * This function appends rss feed items to divs with the same slug
 * Name is the title of the feed, when slugged i use it as a div id
 * File is the rss feed
 */
function newFeed(name, file) {
 $.getJSON("http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20xml%20where%20url%3D%22"+encodeURIComponent(file)+"%22&format=json&callback=?", function(d) {
  var count = 0;
  //grab ever rss item from the json result request
  $(d.query.results.rss.channel.item).each(function() {
    //if set up to be infinite or the limit is not reached, keep grabbing items
    if(maxEntries == 0 || maxEntries>count){
     var title = this.title;
     var link = this.link;
     var description = this.description;
     var pubDate = this.pubDate;
     // Format however you want, I only went for link and title
     var anItem = "<a href='"+link+"' target='_blank'>"+title+"</a><br>";
     //append to the div
     $("#"+slug(name)).append(anItem);
     count++;
    }
   });
 });
};

I hope you guys find this useful. It made my life a ton easier to deal with. Coming soon… I’ll show you how to convert Andrew Sellick’s Sexy Slide Menu for Prototype to JQuery! WOO!

21Nov

The following video shows off Andy’s and mine’s Imagine Cup 2010 submission. The project dubbed Tesla is about conserving and monitoring energy consumption across a home or office network (or any other for that matter). Tesla has 2 aspects the client side which records data of individual computers and the server/web side which will create new users, networks and display device data.

Currently the user experience is not that amazing; however, the website almost looks awesome and the functionality exists! We are looking to expand in user experience of course; however, we are also looking to make functional enhancements (if we get into the next round). These include enhancing our database of known products (to get more accurate statistics), making an awesome visualizer for the data, and giving alternatives for your computer components in order to reduce consumption. I hope you guys enjoy our video. More coming from us soon on this hopefully!

Someone also mentioned how this could also be applied for overclocking machines and trying to get the biggest bang for the buck/power.

PS: We were running on fumes while recording this, please discard my lame explanations :)!