Fixed oversight in view visible state.
This commit is contained in:
parent
9cb3c1e1d9
commit
24d9fef94c
3 changed files with 23 additions and 17 deletions
|
@ -45,6 +45,7 @@ const MamiViewsControl = function(options) {
|
||||||
const element = extractElement(elementInfo);
|
const element = extractElement(elementInfo);
|
||||||
element.classList.toggle('views-item', true);
|
element.classList.toggle('views-item', true);
|
||||||
element.classList.toggle('views-background', false);
|
element.classList.toggle('views-background', false);
|
||||||
|
element.classList.toggle('hidden', false);
|
||||||
|
|
||||||
if(!targetBody.contains(element))
|
if(!targetBody.contains(element))
|
||||||
targetBody.appendChild(element);
|
targetBody.appendChild(element);
|
||||||
|
@ -75,6 +76,8 @@ const MamiViewsControl = function(options) {
|
||||||
fromElem: prevElem,
|
fromElem: prevElem,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
prevElem.classList.toggle('hidden', false);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -91,6 +94,7 @@ const MamiViewsControl = function(options) {
|
||||||
const nextElemInfo = views[views.length - 1];
|
const nextElemInfo = views[views.length - 1];
|
||||||
const nextElem = extractElement(nextElemInfo);
|
const nextElem = extractElement(nextElemInfo);
|
||||||
|
|
||||||
|
nextElem.classList.toggle('hidden', false);
|
||||||
nextElem.classList.toggle('views-background', false);
|
nextElem.classList.toggle('views-background', false);
|
||||||
|
|
||||||
if(typeof nextElemInfo.onViewForeground === 'function')
|
if(typeof nextElemInfo.onViewForeground === 'function')
|
||||||
|
@ -110,6 +114,8 @@ const MamiViewsControl = function(options) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
element.classList.toggle('hidden', true);
|
||||||
|
|
||||||
if(typeof elementInfo.onViewBackground === 'function')
|
if(typeof elementInfo.onViewBackground === 'function')
|
||||||
await elementInfo.onViewBackground();
|
await elementInfo.onViewBackground();
|
||||||
|
|
||||||
|
@ -174,6 +180,7 @@ const MamiViewsControl = function(options) {
|
||||||
|
|
||||||
element.classList.toggle('views-item', true);
|
element.classList.toggle('views-item', true);
|
||||||
element.classList.toggle('views-background', true);
|
element.classList.toggle('views-background', true);
|
||||||
|
element.classList.toggle('hidden', true);
|
||||||
|
|
||||||
if(!targetBody.contains(element))
|
if(!targetBody.contains(element))
|
||||||
targetBody.appendChild(element);
|
targetBody.appendChild(element);
|
||||||
|
|
|
@ -99,23 +99,7 @@ const MamiSockChatHandlers = function(ctx, client, setLoadingOverlay, sockChatRe
|
||||||
Umi.Parsing.Init();
|
Umi.Parsing.Init();
|
||||||
|
|
||||||
if(ctx.views.count() > 1)
|
if(ctx.views.count() > 1)
|
||||||
ctx.views.pop(ctx => MamiAnimate({
|
ctx.views.pop();
|
||||||
async: true,
|
|
||||||
duration: 120,
|
|
||||||
easing: 'inOutSine',
|
|
||||||
start: () => {
|
|
||||||
ctx.toElem.style.zIndex = '100';
|
|
||||||
ctx.fromElem.style.pointerEvents = 'none';
|
|
||||||
ctx.fromElem.style.zIndex = '200';
|
|
||||||
},
|
|
||||||
update: t => {
|
|
||||||
ctx.fromElem.style.transform = `scale(${1 + (.25 * t)})`;
|
|
||||||
ctx.fromElem.style.opacity = 1 - (1 * t).toString();
|
|
||||||
},
|
|
||||||
end: () => {
|
|
||||||
ctx.toElem.style.zIndex = null;
|
|
||||||
},
|
|
||||||
}));
|
|
||||||
};
|
};
|
||||||
handlers['session:fail'] = ev => {
|
handlers['session:fail'] = ev => {
|
||||||
if(dumpEvents) console.log('session:fail', ev.detail);
|
if(dumpEvents) console.log('session:fail', ev.detail);
|
||||||
|
|
|
@ -44,5 +44,20 @@ Umi.UI.LoadingOverlay = function(icon, header, message) {
|
||||||
getElement: function() {
|
getElement: function() {
|
||||||
return html;
|
return html;
|
||||||
},
|
},
|
||||||
|
getViewTransition: mode => {
|
||||||
|
if(mode === 'pop')
|
||||||
|
return ctx => MamiAnimate({
|
||||||
|
async: true,
|
||||||
|
duration: 200,
|
||||||
|
easing: 'inOutSine',
|
||||||
|
start: () => {
|
||||||
|
ctx.fromElem.style.pointerEvents = 'none';
|
||||||
|
},
|
||||||
|
update: t => {
|
||||||
|
ctx.fromElem.style.transform = `scale(${1 + (.25 * t)})`;
|
||||||
|
ctx.fromElem.style.opacity = 1 - (1 * t).toString();
|
||||||
|
},
|
||||||
|
});
|
||||||
|
},
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
Loading…
Reference in a new issue