hust-epi/admin-ui/yvanui/yvanui.radiobutton.js

/**
 * YvanUI
 *
 * Copyright (c) 2018 www.yvanui.com. All rights reserved.
 * @author luoyifan@qq.com
 * @time 2018-11-27 11:16:00
 */
(function ($) {
  var idx = 1;

  function createBox(target) {
    //_2
    var $dom = $(
      '<div class="yvan-radio">\n' +
      '<input type="radio" class="radiobutton-value" style="display: none;">\n' +
      '<i class="fa fa-circle-o yvan-anim yvan-anim-scaleSpring"></i>\n' +
      '<div></div>\n' +
      '</div>'
    ).insertAfter(target);

    var t = $(target);
    t.addClass("radiobutton-f").hide();
    var name = t.attr("name");
    if (name) {
      //安排新的 input 框，取代他的名字
      t.removeAttr("name").attr("radiobuttonName", name);
      $dom.find(".radiobutton-value").attr("name", name);
    }
    return $dom;
  }

  function init(target) {
    //_6
    var state = $.data(target, "radiobutton");
    var opts = state.options;
    var $dom = state.radiobutton;
    var id = "_yvan_radiobutton_" + (++idx);
    $dom.find(".radiobutton-value").attr("id", id);

    if (opts.label) {
      $dom.find('div').html(opts.label);
    } else {
      $dom.find('div').html('');
    }

    $(target).radiobutton("setValue", opts.value);
    setValue(target, opts.checked);
    setDisable(target, opts.disabled);
  }

  function bindEvent(target) {
    //_e
    var state = $.data(target, "radiobutton");
    var opts = state.options;
    var $dom = state.radiobutton;
    $dom.unbind(".radiobutton").bind("click.radiobutton", function () {
      if (!opts.disabled) {
        setValue(target, true);
      }
    });
  }

  function setValue(target, value) {
    if (value) {
      var f = $(target).closest('form');
      var name = $(target).attr('radiobuttonName');
      f.find(".radiobutton-f[radiobuttonName=\"" + name + "\"]").each(function () {
        if (this !== target) {
          setV(this, false);
        }
      });
      setV(target, true);
    } else {
      setV(target, false);
    }

    function setV(b, value) {
      //_c
      var state = $.data(b, "radiobutton");
      var opts = state.options;
      var $dom = state.radiobutton;
      $dom.find(".radiobutton-value")._propAttr("checked", value);

      if (value) {
        $dom.addClass('yvan-radioed');
        $dom.find('i').remove();
        $('<i class="fa fa-dot-circle-o yvan-anim yvan-anim-scaleSpring"></i>')
          .insertAfter($dom.find(".radiobutton-value")[0]);
      } else {
        $dom.removeClass('yvan-radioed');
        $dom.find('i').remove();
        $('<i class="fa fa-circle-o"></i>')
          .insertAfter($dom.find(".radiobutton-value")[0]);
      }

      if (opts.checked !== value) {
        opts.checked = value;
        opts.onChange.call(b, value);
      }
    }
  }

  function setDisable(target, value) {
    //_d
    var state = $.data(target, "radiobutton");
    var opts = state.options;
    var $dom = state.radiobutton;
    var rv = $dom.find(".radiobutton-value");
    opts.disabled = value;
    if (value) {
      $(target).add(rv)._propAttr("disabled", true);
      $dom.addClass('yvan-radio-disabled').addClass('yvan-disabled');
    } else {
      $(target).add(rv)._propAttr("disabled", false);
      $dom.removeClass('yvan-radio-disabled').removeClass('yvan-disabled');
    }
  }

  $.fn.radiobutton = function (options, param) {
    if (typeof options == 'string') {
      return $.fn.radiobutton.methods[options](this, param);
    }

    options = options || {};
    return this.each(function () {
      var state = $.data(this, 'radiobutton');
      if (state) {
        $.extend(state.options, options);
      } else {
        state = $.data(this, 'radiobutton', {
          options: $.extend({},
            $.fn.radiobutton.defaults,
            $.fn.radiobutton.parseOptions(this), options),
          radiobutton: createBox(this)
        });
      }
      state.options.originalChecked = state.options.checked;
      init(this); //_6
      bindEvent(this); //_e
      //_13
    });
  };

  $.fn.radiobutton.methods = {
    options: function (jq) {
      var opts = jq.data("radiobutton");
      return $.extend(opts.options, { value: opts.radiobutton.find(".radiobutton-value").val() });

    }, radiobutton: function (jq, value) {
      var state = $.data(jq[0], "radiobutton");
      return state.radiobutton;

    }, setValue: function (jq, value) {
      return jq.each(function () {
        $(this).val(value);
        $.data(this, "radiobutton").radiobutton.find(".radiobutton-value").val(value);
      });

    }, isChecked: function (jq, value) {
      return $.data(jq[0], "radiobutton").radiobutton.find(".radiobutton-value").is(':checked');

    }, enable: function (jq) {
      return jq.each(function () {
        setDisable(this, false);
      });

    }, disable: function (jq) {
      return jq.each(function () {
        setDisable(this, true);
      });

    }, check: function (jq) {
      return jq.each(function () {
        setValue(this, true);
      });

    }, uncheck: function (jq) {
      return jq.each(function () {
        setValue(this, false);
      });

    }, clear: function (jq) {
      return jq.each(function () {
        setValue(this, false);
      });

    }, reset: function (jq) {
      return jq.each(function () {
        var _28 = $(this).radiobutton("options");
        setValue(this, _28.originalChecked);
      });
    }
  };

  $.fn.radiobutton.parseOptions = function (html) {
    var t = $(html);
    return $.extend({},
      $.parser.parseOptions(html, ["label", { labelWidth: "number" }]),
      {
        value: (t.val() || undefined),
        checked: (t.attr("checked") ? true : undefined),
        disabled: (t.attr("disabled") ? true : undefined)
      });
  };

  $.fn.radiobutton.defaults = {
    value: null,
    disabled: false,
    checked: false,
    label: null,
    onChange: function (value) {
    }
  };

})(jQuery);