easy jQuery -> Scroll to top with jQuery!

So, in getting more and more familiar with jQuery and other fun JS frameworks, I wanted to create something I have seen in the past: scrolling to the top and detecting when you are at the bottom. It’s really easy! I have to thank my buddy Brian for the inspiration; his site is where I first saw it. So, let’s cover the HTML first.

Here’s the style (nothing fancy, just large enough for a scroller):

    < style>
div {
  position:absolute;
  background-color:#FFF;
}

#test{
margin-left:100px;
height:900px;
position:relative;
}

#bottom{
position:relative;

}
< /style>

Aaand here’s the two divs I used:

< div id="test">Blah Blah Stuff at the top< /div>

< div id="bottom">< a class="gototop" href="#">Back to Top!< /a>< /div>

Finally, here’s the jQuery to pull it all together:

  < script src="jquery-1.6.2.js">< /script>
   < script type="text/javascript">
  $(document).ready(function(){
  $("#bottom").hide();

  $(window).scroll(function() {
   if($(window).scrollTop() + $(window).height() == $(document).height()) {
          $("#bottom").fadeIn();
   }
});
< /script>

Check out a basic demo here Of course, just because I used…

fadeIn();

there’s no reason you can’t use some other fancy jQuery animation. Questions? Feel free to comment!

My Educause 2011 Itinerary

This is mostly for my reference, but feel free to check out what classes/lectures I am attending. 

Educause 2011 Itinerary

Wednesday, October 19^th:

• 8 AM: Seth Godin Speaks

• 9 AM: Exhibit Halls Open/Refreshment Break in Exhibit Hall

• 10AM: Open Source Evolution in EDU – Meeting Room 115C

• 11:30AM: Web Portals [Discussion] – Meeting Room 203B

• 12:30PM: Lunch in Exhibit Hall

• 1:30PM: DIY To CMS – Modernizing SFU’s Web Presence – Table 73 Exhibit Hall A/B/C

• 2:30PM: Performing Space: Foursquare and Digital Presence - 103C

• 3:30PM: Innovation Trenz – 113A

• 4:00PM: Refreshment Break in Exhibit Hall

• 4:50PM: The iPad: Implications for Higher Education – Meeting Room 107A/B

Thursday, October 20^th

• 8AM: Using Agile with Koiale – Meeting Room 103A

• 9AM: Web Professionals – Meeting Room 115C

• 10:30AM: Privacy in the Era of Social Media – Ballroom A/B

• 11-12PM: Lunch and Poster Sessions

• 1PM: Mobile Learning: Applications That Change Distraction to Discussion – Meeting Room 113B/C

• 2:30PM: Transforming Research in the Cloud – Meeting Room 111A/B

• 3PM: Refreshments in Exhibit Hall

• 4PM: You Need to go Mobile Now – Meeting Room 108A

Friday, October 21^st

• 8:30AM: Implementing a Sharepoint Portal: A Roadmap to Success – Meeting Room 202A

• 9:30AM: Cloud Computing and Mobility – Meeting Room 102A/B

[Ruby on] Rails Route Root Trick

I’ve wanted to get into Rails for awhile now, but never had time to sit down and concentrate on it because of my CS theory courses and my Wordpress studies.  Finally, I graduated and about a month or so ago I started getting into Ruby and now Rails. Anyway, I digress; I was working on a new rails project, as I am newer at it (special thanks to @jaybetts for his guidance and suggestions on moving to Rails), and I was having a good time, when I decided I wanted to change my root route in config/routes.rb. I was able to send it to my localhost:3000/controller[index] page, but I really wanted it to route to a specific page id (page 1 to be exact). Originally, Rails comments out the example root route:

  root :to => ‘welcome#index’

Ok, so this goes to the welcome index page. Great. But what if we want to go to page 2 or page 3 (if you have created any number of pages). Easy! 

  root :to => ‘pages#show’, :defaults => { :id => 1 }

And, you can specify any :id, as long as it is a valid page id! 
I searched ALL OVER the net to find the solution to something so simple, so I hope this gets to the top of Google search to help people :)

Brand-to-User Engagement. Its there, but nobody measures it.

While writing my rather in-depth senior thesis, I have come across problems when looking for data that will pinpoint user to brand engagement and vice versa. Although there are ways to estimate the impact of a brand’s interaction with its users, it really is difficult to get a “Score” like Klout has, or just solid numbers in general regarding such an issue. As frustrating as this may be, this certainly means that there is an opportunity to quantify user-to-brand engagement levels and provide a baseline for other firms, researchers, etc to draw from and properly measure their interaction.

Twitter tools like Klout certainly are helpful when finding this information, but are far from perfect when attempting to write an entire case study based on this stuff. Facebook is even worse, as many analytics companies base their “engagement” ratings on user posts (which is nice data, but without actual INTERACTION data, this is quite useless for measuring true engagement). SocialBakers is guilty of these statistics, but it isn’t necessarily their fault; brands have not yet realized that this level of engagement is necessary for great relationships with their user/customers/friends, whatever you wish to call them. You can have all the posts in the world on a Facebook fan page, but if you don’t listen and respond accordingly, you’re definitely leaving your fans hanging.

@Garyvee is huge in this sector because he believes that “caring is scaleable” and “small town rules” apply. This is all true, but it would be nice to have clear, analytical results with certain parameters to properly measure this experience.  Something to think about? Certainly. This is a big opportunity for analytics firms to capitalize on, and if someone made a free service? I bet they could make lots of money off of a freemium based model. Of course, it’s probably a bit more complex than that, creating algorithms and such to reflect such a score is of course difficult, but definitely do-able.

I think a video post will be in order to clear up my thoughts a bit, I’m so sick of writing because of my thesis!  Well not really, but I enjoy talking about it!

CodeIgniter->ASmallOrange

A small note for myself:  CodeIgniter works only if you put all of the /system libraries in your application/libraries folder.  That is all.  I was working like crazy, contacted ASO and the like, but never thought in a thousand years it’d be a user error :).

Oh, and A Small Orange is awesome.

A Touch of Elitism - Why HTML Editing is Not “Coding”

Recently, a number of people I know who are actively engaged on social media have asked me “Pat, do you think I should learn HTML5?  Is this important/big?”  

I always respond with the same answer “No, you should learn how HTML works first.”  The reaction is usually one of shock and/or disappointment that they do not get to learn this new and fancy set of tools.  They do not understand that, like everything else, there is in fact a starting point; you don’t just go head first into HTML.  For example, you cannot learn how to write a magazine if you don’t know how to write your name.  Many people I know think that because they have edited simple HTML tags in the past, they can create an entire website and claim that they know “HTML coding” or “website design” on resumes, CVs, LinkedIn, whatever.  There’s certainly a lot more to it than that, and it’s something that I have noticed for a good period of time.  

So in essence, whenever I see the words HTML, programming and coding come together in the same sentence (HTML being referred to as “coding”) I just laugh because it doesn’t come close to languages such as PHP, Python, Ruby, Scala, Lisp, etc etc I could go on and on there.  Something important to know is that there are different types of programming languages, that do different specialities.  

Here’s an example.  There is a programming language called R.  The functionality of R is to take a series of inputs and commands (via so called “code”) and spit out complex graphs from data given to it through methods in the language itself.  R’s purpose is not to create websites, but to deal with complex data and spit it out into a form we understand easily.  Though more based on a GUI, Microsoft Excel does a similar function, though it is certainly not as customizable as R.

Let’s do one more example, I have time to kill before lunch here.  We’ll take MySQL on for this little paragraph.  MySQL stands for My Structured Query Language (My stands for the creator’s daughter also with the same name).  It is a relations database language who’s primary focus is manipulating and creating databases (and database table structures) for sorting and storing all kinds of data.  

Finally, we come to HTML.  HTML is a Markup Language, it stands for HyperText Markup Language.  Markup languages have opening and closing tags (usually) that signify an external source to display or do something.  HTML, for instance, uses <tag> </tag> format to create basic functions the browser can output (like bolding text, creating lists, making ::shudder:: tables, etc).  It’s a language, but it’s a Markup Language, not a programming language.  Big difference.

Sure it’s an essential tool, but it is not the end-all be-all for web design.  In other words, it is very very important, but it isn’t going to get you a job anywhere if you know JUST HTML.  HTML coding was impressive in the early 90s and into the 00s, but nowadays, if you want to “flaunt” web skills on a resume, don’t just put “HTML” and expect miracles.  

I guess I should end this in /rant, but it was more informationally intended than critical :).  Off to lunch! 

Understanding Ruby Basics

So I know that’s a long title, but I promise this won’t be too long of a post…. Well, maybe.

In my travels on the interwebs, I have seen a lot about the functionality of Ruby and Ruby on Rails (RoR), and at one point had a potential internship phone interview ask about my knowledge of it (at the time I only knew RoR was a framework and Ruby was foreign and weird). Soon after that I started playing around with Ruby (using online command lines such as TryRuby.org and checking out tutorials for blogs based on RoR).  Unfortunately, both then and now, school and work got in the way of my language studies (read: real learning) and I never grasped concepts of Ruby.  Oh sure, I know Java and PHP inside and out (well, I don’t know ALL of the documentation :)) but Ruby, even by the looks of it, is different (but obviously the same principles are there).

Many people on the web describe it as more “human” or “readable” than other languages, but to a programmer, this can prove to be more difficult.  As a whole, we aren’t used to inserting grammatical syntax into our code, using ! or ? as if you are asking questions.  Quite a strange dynamic indeed.  

I digress.  

The several times I attempted to learn bascis of Ruby proved to be ineffective in my exploration into the language.  I was distracted and too busy to work on inane tutorials.  I wanted to explore the language without guidelines, but how?  Well, I had to go back to my Computer Science 111 class and redo the basic lab assignments— only in Ruby instead of Java.  Turns out (as previously stated), that pretty much any algorithm can transfer easily from Ruby to Java (in other news, sky is blue, water is too and grass is green).  I just wanted to share a couple basic code snippets with everyone, simple stuff that those wanting to learn BASICS of Ruby can understand without being cryptic or elitist.   

Let’s start with the simple “Hello World” that everyone loves

1. Start by creating test.rb in a directory.  Doesn’t matter where :)
2. Open Command Line or a similar tool and navigate to directory (shown below)

pat-canellas-macbook:~ patcanella$ cd Desktop/Projects

pat-canellas-macbook:~ patcanella$ ruby testruby.rb

For context: in Java, to compile, you have to use something like javac (or equivalent) to compile and then the java command to run the code.  Here, Ruby does it all in one fell swoop!  Cool, huh?
Moving on, here’s some test code, the famous Hello World! example: 
Notice:  Unlike Java or C, there’s no end line here (such as a ; or another equivalent).  From what I understand, Ruby works like 68K MIPS assembly does: on lines.  Each line is a different command and indentation is also important.  Now, how to I extend this and have the user say “Hi World!”  Easy.  

Here it is, the gets.chomp method is you answer!  What’s chomp mean?  It’s a string method, specifics can be found in the Ruby Documentation.  
I’ve done a lot more than this, but to sum it up, these are the basics of printing and receiving input, as well as compiling

• ruby rubyfile.rb in console (make sure you have Ruby installed on your machine)
• puts & print are equal
• gets.chomp asks for input

Any questions on the basics?  Send me an email (patrick.canella AT gmail dot com) or leave a comment!