gistfile1.js

YUI.add('gallery-slider-captcha', function(Y){
  var isString = Y.Lang.isString,
      isBoolean = Y.Lang.isBoolean
      EVENTS = {
        RELEASE_SUCCESS : 'releaseSuccess',
        RELEASE_FAILURE : 'releaseFailure'
      };

  Y.SliderCaptcha = Y.Base.create('slider-captcha', Y.Widget, [], {

    message : null,

    handle : null,
    
    //  P U B L I C  //
    initializer : function() {
      // publish releaseSuccess event
      // publish releaseFailure event
    },

    renderUI : function() {
      // build message container
      this.message = Y.Node.create('<div class="' + this.getClassName('message') + '">' + this.get('startText') + '</div>');
      
      // build handle
      this.handle = Y.Node.create('<div class="' + this.getClassName('handle') + '"></div>');

      // append to content box
      this.get('contentBox').append(this.message).append(this.handle);
    },

    bindUI : function() {
      // add dd to handle and constrain to content box

      // add opacity change to text while dragging based on percentage to end. 100% - 10%?

      // add animation to spring back on release if not at the edge of the container

      // add release callback to fire success or failure event
    },

    //  S U G A R  //
    isHuman : function() {
      return this.get('isHuman');
    },

    //  P R O T E C T E D  //
    _defReleaseSuccessFn : function(e) {
      var frm = this.get('form'),
          submit = this.get('submitOnSuccess');

      this.message.set('text',this.get('successText'));// update text
      this.set('isHuman',true);// set isHuman to true

      if(frm && submit) {
        frm.submit();
      }      
      
    },

    _defReleaseFailureFn : function(e) {
      this.set('isHuman',false);// set isHuman to false
    }
  }, {
    EVENTS : EVENTS,
    ATTRS : {
      form : {
      },
      startText : {
        value : 'Slide To Submit',
        validator :isString
      },
      successText : {
        value : 'Submitting!',
        validator :isString
      },
      isHuman : {
        value : false
        validator :isBoolean
      },
      submitOnSuccess : {
        value : true, 
        validator :isBoolean
      }
    }
  });

}, '0.1', {'widget','dd-constrain'});