fanruan
/
fineui
4
1
Fork 3
Code Issues 1 Pull Requests Releases Wiki Activity
Browse Source

Merging in latest from upstream (VISUAL/fineui:refs/heads/master) 

* commit 'd33b3e9fe2e0dcd1a3137c7cb981b485d20d5b7c':
  auto upgrade version to 2.0.20220109145409
  动画
  auto upgrade version to 2.0.20220109143158
  动画
  动画
  auto upgrade version to 2.0.20220109135245
  样式
es6
windy 3 years ago
parent
25bae6661c d33b3e9fe2
commit
77a322a12a
6 changed files with 138 additions and 35 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      package.json
  2. 6
      src/case/combo/bubblecombo/combo.bubble.js
  3. 47
      src/core/4.widget.js
  4. 77
      src/less/base/single/button/button.less
  5. 15
      src/less/lib/theme.less
  6. 24
      src/less/motion.less

2
package.json
Unescape View File

@ -1,6 +1,6 @@
{
"name": "fineui",
"version": "2.0.20220106142259",
"version": "2.0.20220109145409",
"description": "fineui",
"main": "dist/fineui.min.js",
"types": "dist/lib/index.d.ts",

6
src/case/combo/bubblecombo/combo.bubble.js
Unescape View File

@ -55,9 +55,9 @@ BI.BubbleCombo = BI.inherit(BI.Widget, {
el: o.el,
popup: BI.extend({
type: "bi.bubble_popup_view",
}, o.popup, {
cls: (o.popup.cls || "") + " bi-zoom-big-enter bi-zoom-big-enter-active"
})
animation: "bi-zoom-big",
animationDuring: 200,
}, o.popup)
});
this.combo.on(BI.Combo.EVENT_TRIGGER_CHANGE, function () {
self.fireEvent(BI.BubbleCombo.EVENT_TRIGGER_CHANGE, arguments);

47
src/core/4.widget.js
Unescape View File

@ -7,6 +7,15 @@
*/
!(function () {
var cancelAnimationFrame =
_global.cancelAnimationFrame ||
_global.webkitCancelAnimationFrame ||
_global.mozCancelAnimationFrame ||
_global.oCancelAnimationFrame ||
_global.msCancelAnimationFrame ||
_global.clearTimeout;
var requestAnimationFrame = _global.requestAnimationFrame || _global.webkitRequestAnimationFrame || _global.mozRequestAnimationFrame || _global.oRequestAnimationFrame || _global.msRequestAnimationFrame || _global.setTimeout;
function callLifeHook (self, life) {
var hooks = [], hook;
hook = self[life];
@ -34,6 +43,8 @@
tag: null,
disabled: false,
invisible: false,
animation: "",
animationDuring: 0,
invalid: false,
baseCls: "",
extraCls: "",
@ -467,14 +478,50 @@
},
setVisible: function (visible) {
var self = this, o = this.options;
var lastVisible = !o.invisible;
this._setVisible(visible);
if (visible === true) {
// 用this.element.show()会把display属性改成block
this.element.css("display", "");
this._mount();
if (o.animation && !lastVisible) {
this.element.removeClass(o.animation + "-leave").removeClass(o.animation + "-leave-active").addClass(o.animation + "-enter");
if (this._requestAnimationFrame) {
cancelAnimationFrame(this._requestAnimationFrame);
}
this._requestAnimationFrame = function () {
self.element.addClass(o.animation + "-enter-active");
};
requestAnimationFrame(this._requestAnimationFrame);
if (this._animationDuring){
clearTimeout(this._animationDuring);
}
this._animationDuring = setTimeout(function () {
self.element.removeClass(o.animation + "-enter").removeClass(o.animation + "-enter-active");
}, o.animationDuring);
}
} else if (visible === false) {
if (o.animation && lastVisible) {
this.element.removeClass(o.animation + "-enter").removeClass(o.animation + "-enter-active").addClass(o.animation + "-leave");
if (this._requestAnimationFrame) {
cancelAnimationFrame(this._requestAnimationFrame);
}
this._requestAnimationFrame = function () {
self.element.addClass(o.animation + "-leave-active");
};
requestAnimationFrame(this._requestAnimationFrame);
if (this._animationDuring){
clearTimeout(this._animationDuring);
}
this._animationDuring = setTimeout(function () {
self.element.removeClass(o.animation + "-leave").removeClass(o.animation + "-leave-active");
self.element.css("display", "none");
}, o.animationDuring);
} else {
this.element.css("display", "none");
}
}
this.fireEvent(BI.Events.VIEW, visible);
},

77
src/less/base/single/button/button.less
Unescape View File

@ -84,6 +84,19 @@ body .bi-button, #body .bi-button {
background-color: transparent;
border-width: 0;
}
&.ghost {
&, & .b-font:before {
color: @color-bi-text-success-ghost-button;
}
background-color: transparent;
&:hover {
color: @color-bi-text;
background-color: @color-bi-background-success-button;
}
&:active {
background-color: @color-bi-background-success-button;
}
}
}
&.button-warning {
& {
@ -100,6 +113,19 @@ body .bi-button, #body .bi-button {
background-color: transparent;
border-width: 0;
}
&.ghost {
&, & .b-font:before {
color: @color-bi-text-warning-ghost-button;
}
background-color: transparent;
&:hover {
color: @color-bi-text;
background-color: @color-bi-background-warning-button;
}
&:active {
background-color: @color-bi-background-warning-button;
}
}
}
&.button-error {
& {
@ -111,11 +137,24 @@ body .bi-button, #body .bi-button {
}
&.clear {
&, & .b-font:before {
color: @color-bi-text-clear-error-button;
color: @color-bi-text-error-clear-button;
}
background-color: transparent;
border-width: 0;
}
&.ghost {
&, & .b-font:before {
color: @color-bi-text-error-ghost-button;
}
background-color: transparent;
&:hover {
color: @color-bi-text;
background-color: @color-bi-background-error-button;
}
&:active {
background-color: @color-bi-background-error-button;
}
}
}
&.button-common.disabled,
&.button-success.disabled,
@ -161,13 +200,45 @@ body .bi-button, #body .bi-button {
}
&.ghost {
&, & .b-font:before {
color: @color-bi-text-disabled-ignore-ghost-button !important;
// color: @color-bi-text-disabled-ignore-ghost-button !important;
}
background: transparent !important;
border-color: @color-bi-border-disabled-ignore-ghost-button !important;
// border-color: @color-bi-border-disabled-ignore-ghost-button !important;
.opacity(0.5);
}
}
&.button-common.disabled {
&.ghost {
&, & .b-font:before {
color: @color-bi-text-disabled-common-ghost-button !important;
}
border-color: @color-bi-border-disabled-common-ghost-button !important;
}
}
&.button-success.disabled {
&.ghost {
&, & .b-font:before {
color: @color-bi-text-disabled-success-ghost-button !important;
}
border-color: @color-bi-border-disabled-success-ghost-button !important;
}
}
&.button-warning.disabled {
&.ghost {
&, & .b-font:before {
color: @color-bi-text-disabled-warning-ghost-button !important;
}
border-color: @color-bi-border-disabled-warning-ghost-button !important;
}
}
&.button-error.disabled {
&.ghost {
&, & .b-font:before {
color: @color-bi-text-disabled-error-ghost-button !important;
}
border-color: @color-bi-border-disabled-error-ghost-button !important;
}
}
}
.bi-basic-button {

15
src/less/lib/theme.less
Unescape View File

@ -77,14 +77,17 @@
@color-bi-background-success-button: @color-bi-background-success;
@color-bi-border-success-button: @color-bi-border-success;
@color-bi-text-success-clear-button: @color-bi-text-success;
@color-bi-text-success-ghost-button: @color-bi-text-success;
@color-bi-text-warning-button: @color-bi-text;
@color-bi-background-warning-button: @color-bi-background-warning;
@color-bi-border-warning-button: @color-bi-border-warning;
@color-bi-text-warning-clear-button: @color-bi-text-redmark;
@color-bi-text-warning-ghost-button: @color-bi-text-redmark;
@color-bi-text-error-button: @color-bi-text;
@color-bi-background-error-button: @color-bi-background-failure;
@color-bi-border-error-button: @color-bi-border-failure;
@color-bi-text-clear-error-button: @color-bi-text-failure;
@color-bi-text-error-clear-button: @color-bi-text-failure;
@color-bi-text-error-ghost-button: @color-bi-text-failure;
@color-bi-text-disabled-button: @color-bi-text-disabled;
@color-bi-background-disabled-button: @color-bi-background-light-disabled;
@color-bi-border-disabled-button: @color-bi-border-disabled;
@ -92,8 +95,14 @@
@color-bi-background-disabled-ignore-button: @color-bi-background-default;
@color-bi-border-disabled-ignore-button: @color-bi-border-line;
@color-bi-text-disabled-ignore-clear-button: @color-bi-text-disabled;
@color-bi-text-disabled-ignore-ghost-button: @color-bi-text-highlight;
@color-bi-border-disabled-ignore-ghost-button: @color-bi-border-highlight;
@color-bi-text-disabled-common-ghost-button: @color-bi-text-highlight;
@color-bi-border-disabled-common-ghost-button: @color-bi-border-highlight;
@color-bi-text-disabled-success-ghost-button: @color-bi-text-success;
@color-bi-border-disabled-success-ghost-button: @color-bi-border-success;
@color-bi-text-disabled-warning-ghost-button: @color-bi-text-redmark;
@color-bi-border-disabled-warning-ghost-button: @color-bi-border-warning;
@color-bi-text-disabled-error-ghost-button: @color-bi-text-failure;
@color-bi-border-disabled-error-ghost-button: @color-bi-border-failure;
@color-bi-background-disabled-button-theme-dark: @color-bi-background-light-disabled-theme-dark;
// 单选按钮

24
src/less/motion.less
Unescape View File

@ -52,27 +52,3 @@
pointer-events: none;
}
}
.zoom-big-motion-enter() {
transform: scale(0);
opacity: 0;
animation-timing-function: @ease-out-circ;
.motion-common(@animation-duration-base);
animation-play-state: paused;
}
.zoom-big-motion-enter-active() {
animation-name: biZoomBigIn;
animation-play-state: running;
}
.zoom-big-motion-leave() {
animation-timing-function: @ease-in-out-circ;
.motion-common-leave(@animation-duration-base);
}
.zoom-big-motion-leave-active() {
animation-name: biZoomBigOut;
animation-play-state: running;
pointer-events: none;
}

Write Preview
Loading…
Cancel
Save