118 lines
3.8 KiB
JavaScript
118 lines
3.8 KiB
JavaScript
(function () {
|
|
var DESIGN_WIDTH = 375;
|
|
var app = document.getElementById('appViewport');
|
|
var page = app ? app.querySelector('.page') : null;
|
|
var tabs = app
|
|
? Array.prototype.slice.call(app.querySelectorAll('[data-tab-target]'))
|
|
: [];
|
|
var panels = app
|
|
? Array.prototype.slice.call(app.querySelectorAll('[data-tab-panel]'))
|
|
: [];
|
|
var relationTabs = app
|
|
? Array.prototype.slice.call(
|
|
app.querySelectorAll('[data-relation-target]')
|
|
)
|
|
: [];
|
|
var rightsTable = app ? app.querySelector('.rights-table') : null;
|
|
var backButton = app ? app.querySelector('.back-button') : null;
|
|
|
|
function updateScale() {
|
|
var available = Math.max(320, window.innerWidth || DESIGN_WIDTH);
|
|
var scale = Math.min(1, available / DESIGN_WIDTH);
|
|
document.documentElement.style.setProperty(
|
|
'--app-scale',
|
|
String(scale)
|
|
);
|
|
if (app) {
|
|
document.body.style.minHeight = app.offsetHeight * scale + 'px';
|
|
}
|
|
}
|
|
|
|
function setActiveTab(nextTab) {
|
|
var tab = nextTab === 'rights' ? 'rights' : 'note';
|
|
app.setAttribute('data-active-tab', tab);
|
|
if (page) {
|
|
page.classList.toggle('note-page', tab === 'note');
|
|
page.classList.toggle('rights-page', tab === 'rights');
|
|
}
|
|
tabs.forEach(function (button) {
|
|
var active = button.getAttribute('data-tab-target') === tab;
|
|
button.setAttribute('aria-selected', active ? 'true' : 'false');
|
|
});
|
|
panels.forEach(function (panel) {
|
|
panel.hidden = panel.getAttribute('data-tab-panel') !== tab;
|
|
});
|
|
window.scrollTo({ top: 0, left: 0, behavior: 'auto' });
|
|
updateScale();
|
|
}
|
|
|
|
function setActiveRelation(nextRelation) {
|
|
var relation =
|
|
nextRelation === 'brother' || nextRelation === 'sisters'
|
|
? nextRelation
|
|
: 'cp';
|
|
if (rightsTable) {
|
|
rightsTable.setAttribute('data-active-relation', relation);
|
|
}
|
|
relationTabs.forEach(function (button) {
|
|
var active =
|
|
button.getAttribute('data-relation-target') === relation;
|
|
button.classList.toggle('is-active', active);
|
|
button.setAttribute('aria-selected', active ? 'true' : 'false');
|
|
});
|
|
}
|
|
|
|
function closePage() {
|
|
if (window.HyAppBridge && window.HyAppBridge.back) {
|
|
window.HyAppBridge.back();
|
|
return;
|
|
}
|
|
if (
|
|
window.WebViewJavascriptBridge &&
|
|
window.WebViewJavascriptBridge.callHandler
|
|
) {
|
|
window.WebViewJavascriptBridge.callHandler('close');
|
|
return;
|
|
}
|
|
if (window.history.length > 1) {
|
|
window.history.back();
|
|
}
|
|
}
|
|
|
|
function bindEvents() {
|
|
tabs.forEach(function (button) {
|
|
button.addEventListener('click', function () {
|
|
setActiveTab(button.getAttribute('data-tab-target'));
|
|
});
|
|
});
|
|
relationTabs.forEach(function (button) {
|
|
button.addEventListener('click', function () {
|
|
setActiveRelation(button.getAttribute('data-relation-target'));
|
|
});
|
|
});
|
|
if (backButton) {
|
|
backButton.addEventListener('click', closePage);
|
|
}
|
|
window.addEventListener('resize', updateScale);
|
|
window.addEventListener('orientationchange', updateScale);
|
|
}
|
|
|
|
function init() {
|
|
bindEvents();
|
|
setActiveRelation('cp');
|
|
setActiveTab('note');
|
|
updateScale();
|
|
}
|
|
|
|
window.HyCpRules = {
|
|
setActiveTab: setActiveTab,
|
|
setActiveRelation: setActiveRelation,
|
|
};
|
|
|
|
if (document.readyState === 'loading') {
|
|
document.addEventListener('DOMContentLoaded', init);
|
|
} else {
|
|
init();
|
|
}
|
|
})();
|