Tuesday, April 30, 2013

Essential jQUERY

Recently, I picked up the bare essentials in jQuery from the book, jQUERY Visual Quickstart Guide by Steven Holzner, Peachpit Press, 2009.

However, a word of warning: the book is somewhat badly edited, and there is no corrected edition (still as of this writing).

From the core jQuery source code, this page also is useful. Here are my brief notes:

JQuery refers to a certain syntax $(thing) for any thing as 'jQuery-wrapping'.

The keyword $ is an alias for jquery. Both are used in the following ways:

  • $(function)  –  Append a function to the list to be run when the document is ready: a shortcut for $(document).ready(function).

  • $(CSS-selector-string)  –  Select some nodes in the document.

  • $(HTML-string)  –  Create HTML for insertion.

  • $(DOM-node)  –  Like saying simply DOM-node, but change the value of this and set context (an attribute used by jQuery). Examples are:
    •   $(document)  –  The document.
    •   $(this)  –  this.

  • $.method  –  (This one has a dot and no parentheses.) Run a utility method.

The jQuery methods selected for explanation in the book are:

  • Methods on jQuery-wrapped collections of HTML elements:
    • addClass,  after,  alt,  animate,  append,  attr,  before,  bind,  clone,  css,  each,  (event binder methods),  fadeIn,  fadeOut,  fadeTo,  height,  hide,  hover,  html,  is,  (jQuery-UI methods),  length,  load,  one,  serializeArray,  show,  size,  slice,  slideDown,  slideToggle,  slideUp,  text,  toggle,  toggleClass,  unbind,  val,  width,  wrap

  • Event binder methods:
    • Keyboard   –   keydown,  keypress,  keyup

    • Mouse   –   mousedown,  mouseenter,  mouseleave,  mousemove,  mouseout,  mouseover,  mouseup

    • The rest   –   beforeunload,  blur,  change,  click,  dblclick,  error,  focus,  load,  resize,  scroll,  select,  submit,  unload

  • jQuery-UI methods:
    • accordian,  datepicker,  dialog,  progressbar,  slider,  tabs

  • Methods on jQuery-wrapped HTML strings:
    • insertAfter,  insertBefore

  • Utility methods:
    • ajax,  browser,  each,  get,  grep,  inArray,  isArray,  isFunction,  makeArray,  map,  post,  support,  trim,  unique

Copyright (c) 2013 Mark D. Blackwell.

Thursday, April 25, 2013

Meetup authentication & email addresses

As part of its OAuth authentication process with other apps, Meetup doesn't provide email addresses of its users. (I refer to this official Meetup forum question, and to this page in the Meetup API docs—search the page for 'email'.)

Twitter doesn't provide email addresses either. However, Meetup seems nicer than Twitter.

People use multiple Twitter accounts (I know some who do). But people don't use multiple Meetup accounts (at least supposedly not).

When registering new users through this difficult class of OAuth authentication providers (those which don't supply an email address) one might ask each new user directly for some email address, or might not. Requesting this is normally recommended.

If an app uses Meetup authentication (and it doesn't request and confirm an email address during user registration), and uses another form of authentication also (even added later) then there's no way to identify the same user, if or when they sign on by a different way.

So Meetup authentication (without email) is only good if the app is forever limited to using Meetup authentication alone. With that permanent limitation, in such an app, nobody (mysteriously) will run into the problem of having more than one account.

Of course, having Meetup as the single method of authentication is useful, reasonably, only to apps which are already limited to Meetup users.

Keeping the UI simple (by not requesting an email address when people register) means the app might never have email addresses. But that might be okay if an app uses Meetup authentication alone, forever.

Then one need not bother people with asking for their email address when they first use an app. The ease of that emotional UX moment when new customers are forming their first impression of an app (and making their initial commitment to it), from the standpoint of building a customer base—depending on the app—could be considered more important than ever knowing their email addresses.

BTW, omniauth-meetup is a good gem for doing Meetup authentication in Rails.

Copyright (c) 2013 Mark D. Blackwell.

Saturday, April 20, 2013

Flat UI and Twitter Bootstrap "Mobile First" for Rails

Designmodo's announcement for their free Flat UI (which uses Sass) mentions plans (in the discussion) to release a pay version containing LESS code. And an issue on their Flat UI gem floats a suggestion of possibly porting it to LESS.

Darthdeus' gem flat-ui-rails contains Flat UI precompiled to CSS with no LESS code.

Whether Flat UI will continue to be maintained and useful for Rails doesn't relate to Darthdeus' trivially easy to maintain gem but therefore instead to Designmodo's free Flat UI product itself. So far, BTW, their Pro version seems to be vaporware.

There is a rumor Twitter Bootstrap version 3 "Mobile first" will have a flatter UI, but that's only temporary (for development purposes) according to this article.

Web searching revealed no sign how Designmodo's Flat UI might be affected by Twitter's new "Mobile first" initiative otherwise.

Copyright (c) 2013 Mark D. Blackwell.