altinn-designsystem
Version:
Altinn Design system based on Pattern Lab.
1,235 lines (1,144 loc) • 272 kB
JavaScript
/* globals defaultListSort */
// prototype only
var moveRowToTable = function(tableId, $row, rowCopiedClass) {
var $rowCopy = $row.clone();
var $existingRowCopy = $('#copy-' + $row.attr('id'));
var $action = $row.find('a.a-fullWidthLink span').first();
if ($action.text().trim() === 'Gi rettigheter') {
$action.text('Gi og fjerne rettigheter');
} else if ($action.text().trim() === 'Gi og fjerne rettigheter') {
$action.text('Gi rettigheter');
}
// replace original row with dummy row in source list
$rowCopy.insertAfter($row);
// check if target list has corresponding deleted row
if ($existingRowCopy.length > 0) {
// replace dummy row with original row in target list
$row.insertAfter($existingRowCopy);
$existingRowCopy.remove();
} else {
// add row to list
$('#' + tableId).append($row);
}
// change styling for source list and set id
$rowCopy.addClass(rowCopiedClass).addClass('a-disabled');
$rowCopy.attr('id', 'copy-' + $row.attr('id'));
$('#' + $rowCopy.attr('id') + ' .a-js-removeMe').remove();
defaultListSort();
};
var setupAddRightsHandler = function() {
var $row;
var targetTableId;
var sourceTableId;
var currentTableId;
function editingSourceTable() {
return targetTableId && currentTableId && currentTableId !== targetTableId;
}
function editingTargetTable() {
return targetTableId && currentTableId && currentTableId === targetTableId;
}
function actionsRowHasSelectedElements() {
return $row.has('.a-switch input[type="checkbox"]:checked').length > 0;
}
$('.a-list .collapse').on('hide.bs.collapse', function() {
targetTableId = $(this).closest('li')[0].dataset.targetTable;
sourceTableId = $(this).closest('li')[0].dataset.sourceTable;
if (targetTableId && sourceTableId) {
$(this).addClass('a-js-removeMe');
}
return $(this).closest('li').removeClass('a-expanded');
});
$('.a-list .collapse').on('show.bs.collapse', function() {
return $(this).closest('li').addClass('a-expanded');
});
$('.a-list').on('click', '.a-js-confirmAddRightBtn', function() {
$row = $(this).closest('li').removeClass('a-expanded');
currentTableId = $(this).closest('ul').attr('id');
targetTableId = $row[0].dataset.targetTable;
sourceTableId = $row[0].dataset.sourceTable;
$row.find('.collapse').collapse('hide');
$row.removeClass('a-expanded');
if (actionsRowHasSelectedElements() && editingSourceTable()) {
moveRowToTable(targetTableId, $($row), 'a-completed');
} else if (!actionsRowHasSelectedElements() && editingTargetTable()) {
moveRowToTable(sourceTableId, $($row), 'a-deleted');
}
});
};
var _anchors = function() {
window.anchors.options.placement = 'left';
window.anchors.options.class = 'a-sg-anchor';
window.anchors.remove('.sg-pattern-example h3');
window.anchors.remove('.a-page h1');
window.anchors.remove('.a-page h2');
window.anchors.remove('.a-page h3');
window.anchors.remove('.a-page h4');
window.anchors.remove('.a-page h5');
window.anchors.remove('.a-page h6');
};
var certificateHandler = function() {
$('.a-js-certificateContainer').on('focus', function() {
$('.a-js-certificateContainer').closest('label').addClass('a-custom-fileupload--focused');
});
$('.a-js-certificateContainer').on('blur', function() {
$('.a-js-certificateContainer').closest('label').removeClass('a-custom-fileupload--focused');
});
$('.a-js-fileInputChangeHandler').on('change', function() {
var $parent = $(this).parent();
var $fileListContainer = $parent.next();
var $listItemText = $fileListContainer.find('.a-js-listItemText');
var $listItem = $fileListContainer.find('li');
var $listItemLabel = $fileListContainer.find('li').attr('aria-label');
var fileName = $(this).val().split('\\')[$(this).val().split('\\').length - 1];
$parent.hide();
$fileListContainer.show();
$listItemText.text(fileName);
$listItem.attr('aria-label', $listItemLabel + fileName);
});
$('.a-js-certificateContainer').on('change', function() {
$('.a-js-certificateEdit').removeClass('d-none');
$('.a-js-certificateContainer1').removeClass('d-none');
$('.a-js-certificateUpload').addClass('d-none');
});
$('.a-js-certificateStep1').on('click', function() {
$('.a-js-certificateContainer1').addClass('d-none');
$('.a-js-certificateContainer2').removeClass('d-none');
});
$('.a-js-certificateStep2').on('click', function() {
$('.a-js-certificateEdit').addClass('d-none');
$('.a-js-certificateContainer1').addClass('d-none');
$('.a-js-certificateUpload').removeClass('d-none');
});
$('.a-js-addcertificate').on('click', function() {
$('.a-js-certificateList').addClass('d-none');
$('.a-js-certificateUpload').removeClass('d-none');
$('.a-js-certificateUpload').find('input').focus();
});
$('.a-custom-certupload').on('change', function() {
$('.a-js-certificateList').removeClass('d-none');
$('.a-js-certificateUpload').addClass('d-none');
$('#loginInfoEnterprisePanelHeader').find('a').first().focus();
});
$('#cancel-upload').on('click', function() {
$('.a-js-certificateList').removeClass('d-none');
$('.a-js-certificateUpload').addClass('d-none');
$('#loginInfoEnterprisePanelHeader').find('a').first().focus();
});
$('.a-js-certificateEdit').on('click', function() {
$('.a-js-edit-userpass').removeClass('d-none');
$('.a-js-certificates').addClass('d-none');
});
$('.a-js-certificateSave').on('click', function() {
$('.a-js-certificates').removeClass('d-none');
$('.a-js-edit-userpass').addClass('d-none');
});
};
/* globals Clipboard */
var clipboard = new ClipboardJS('.a-js-btnCopy');
clipboard.on('success', function(e) {
$('.a-js-clipboardMsg').html('Kopiert til utklippstavlen');
e.clearSelection();
});
clipboard.on('error', function(e) {
$('.a-js-clipboardMsg').html('Trykk CTRL+C/CMD+C for å kopiere org.nr.');
});
/* globals $ */
var codeLookup = function() {
var capIt = function(string) {
return string.charAt(0).toUpperCase() + string.slice(1);
};
var lastKeypress; var now; var iterate;
var legend = $('.a-js-lookup').find('.a-legend');
var loader = $('.a-js-lookup').find('.modal-body').find('.a-loader');
var empty = $('.a-js-lookup').find('.a-js-noResults');
var container = $('.a-js-lookup').find('.modal-body').find('.a-radioButtons');
var check = function() {
if ($('form').find('input[type=radio]:checked').length > 0) {
$('form').find('button[type=submit]').removeAttr('disabled');
$('form').find('input[type=radio]').parent().removeClass('a-js-radioParentGray');
$('form').find('input[type=radio]:checked').parent()
.addClass('a-js-radioParentGray');
} else {
$('form').find('button[type=submit]').attr('disabled', 'disabled');
}
};
var query; var base = container.html(); container.html(''); loader.hide();
empty.hide(); legend.hide();
if ($('.a-js-lookup').length > 0) {
$('form').on('change', check);
$.getJSON('../../data/ssb.json', function(data) {
function createPath(dest, str) {
var _str = str; var _dest = data[dest.parentCode];
if (_dest !== undefined) {
if (dest.name === _dest.name) {
return createPath(_dest, _str);
}
if (str.indexOf(_dest.name) !== -1) {
return str;
}
_str = _dest.name + ' / ' + _str; return createPath(_dest, _str);
}
return str;
}
$('.a-js-lookup').find('input[type=text]').on('keypress', function() {
lastKeypress = new Date().getTime(); iterate = true;
loader.show(); legend.hide(); empty.hide(); container.html(''); check();
});
setInterval(function() {
if ($('.a-js-lookup').find('input[type=text]').val() !== undefined) {
query = $('.a-js-lookup').find('input[type=text]').val().toLowerCase();
} else {
query = '';
}
now = new Date().getTime();
if (query.length > 0 && (now - lastKeypress > 1500) && iterate) {
iterate = false;
Object.keys(data).forEach(function(item) {
var method; var var1 = ' ' + query + ' ';
var var2 = '-' + query + ' '; var var3 = ' ' + query + '-';
var var4 = ' ' + query; var var5 = query + ' ';
var var6 = capIt(query); var re1 = new RegExp(var1, 'g');
var re2 = new RegExp(var2, 'g'); var re3 = new RegExp(var3, 'g');
var re4 = new RegExp(var4, 'g'); var re5 = new RegExp(var5, 'g');
var re6 = new RegExp(var6, 'g');
var out1 = ' <strong style="color:inherit">' + query + '</strong> ';
var out2 = '-<strong style="color:inherit">' + query + '</strong> ';
var out3 = ' <strong style="color:inherit">' + query + '</strong>-';
var out4 = ' <strong style="color:inherit">' + query + '</strong>';
var out5 = '<strong style="color:inherit">' + query + '</strong> ';
var out6 = '<strong style="color:inherit">' + capIt(query) +
'</strong>';
if (
(
data[item].name.toLowerCase().indexOf(var1) !== -1 ||
data[item].name.toLowerCase().indexOf(var2) !== -1 ||
data[item].name.toLowerCase().indexOf(var3) !== -1 ||
data[item].name.toLowerCase().indexOf(var4) !== -1 ||
data[item].name.toLowerCase().indexOf(var5) !== -1 ||
data[item].name.toLowerCase().indexOf(var6) !== -1 ||
data[item].shortName.toLowerCase().indexOf(var1) !== -1 ||
data[item].shortName.toLowerCase().indexOf(var2) !== -1 ||
data[item].shortName.toLowerCase().indexOf(var3) !== -1 ||
data[item].shortName.toLowerCase().indexOf(var4) !== -1 ||
data[item].shortName.toLowerCase().indexOf(var5) !== -1 ||
data[item].shortName.toLowerCase().indexOf(var6) !== -1 ||
data[item].notes.toLowerCase().indexOf(var1) !== -1 ||
data[item].notes.toLowerCase().indexOf(var2) !== -1 ||
data[item].notes.toLowerCase().indexOf(var3) !== -1 ||
data[item].notes.toLowerCase().indexOf(var4) !== -1 ||
data[item].notes.toLowerCase().indexOf(var5) !== -1 ||
data[item].notes.toLowerCase().indexOf(var6) !== -1
) &&
data[item].level === 5
) {
if (
data[item].name.toLowerCase().indexOf(var1) !== -1 ||
data[item].name.toLowerCase().indexOf(var2) !== -1 ||
data[item].name.toLowerCase().indexOf(var3) !== -1 ||
data[item].name.toLowerCase().indexOf(var4) !== -1 ||
data[item].name.toLowerCase().indexOf(var5) !== -1 ||
data[item].name.toLowerCase().indexOf(var6) !== -1
) {
method = 'prepend';
} else {
method = 'append';
}
container[method](base
.replace('%NAME%', data[item].name
.replace(re1, out1)
.replace(re2, out2)
.replace(re3, out3)
.replace(re4, out4)
.replace(re5, out5)
.replace(re6, out6)
)
.replace('%DESCRIPTION%', data[item].notes
.replace(re1, out1)
.replace(re2, out2)
.replace(re3, out3)
.replace(re4, out4)
.replace(re5, out5)
.replace(re6, out6)
)
.replace('%ID%', data[item].shortName)
.replace('%PATH%', createPath(data[item], '')
.replace(re1, out1)
.replace(re2, out2)
.replace(re3, out3)
.replace(re4, out4)
.replace(re5, out5)
.replace(re6, out6)
)
);
}
});
loader.hide(); legend.show();
if (container.html() === '') {
empty.show(); legend.hide();
}
}
}, 2000);
});
}
};
/* globals $ */
var fixPatternLinks = function() {
if (window.location.pathname.indexOf('DesignSystem') === 1) {
$('a').each(function() {
if (typeof $(this).attr('href') !== typeof undefined && $(this).attr('href') !== false && $(this).attr('href').indexOf('DesignSystem') === -1) {
$(this).attr('href', $(this).attr('href').replace('/patterns/', '/DesignSystem/public/patterns/'));
}
});
$('*[onclick]').each(function() {
if ($(this).attr('onclick').indexOf('location.href=\'/patterns/') > -1) {
$(this).attr('onclick', $(this).attr('onclick').replace('location.href=\'/patterns/', 'location.href=\'/DesignSystem/public/patterns/'));
}
});
}
};
/* globals $ */
var goBack = function() {
var arr = [];
$('.container').addClass('a-tempAnim');
};
/* globals $ */
var nameChecker = function() {
var btnText; var initAction; var toggleBtns;
if ($('.a-js-validator').length > 0) {
btnText = $('.a-js-validator').find('.a-btn-group').find('.a-btn').eq(0)
.text();
initAction = '$(".a-js-validator").find("input[type=text]")' +
'.attr("disabled", "disabled").parent().addClass("disabled")' +
'.addClass("a-input-approved");' +
'$(".a-js-validator").find(".a-validatorInfo").eq(0).hide();' +
'$(".a-js-validator").find(".a-validatorInfo").eq(1).show();' +
'$(".a-js-validator").find(".a-btn-group").find(".a-btn").eq(0)' +
'.html("Velg navn").removeAttr("onclick");' +
'$(".a-js-tryAnother").show();';
$('.a-js-validator').find('.a-validatorInfo').eq(1).find('i')
.addClass('a-validatorInfo-icon-approved');
$('.a-js-validator').find('.a-validatorInfo').css('display', 'inline-block')
.eq(1)
.hide();
if ($('.a-js-tryAnother').length === 0) {
$('<button/>', {
type: 'button',
class: 'a-btn-link a-js-tryAnother',
text: 'Prøv et annet navn'
}).appendTo('.a-btn-group', '.a-js-validator');
}
$('.a-js-tryAnother').hide().on('click', function() {
$('.a-js-validator').find('input[type=text]').removeAttr('disabled')
.parent()
.removeClass('disabled')
.removeClass('a-input-approved');
$('.a-js-tryAnother').hide();
$('.a-js-validator').find('.a-validatorInfo').eq(0).show();
$('.a-js-validator').find('.a-validatorInfo').eq(1).hide();
$('.a-js-validator').find('.a-btn-group').find('.a-btn').eq(0)
.html(btnText)
.attr('onclick', '$(".a-js-validator").find(".a-message-error").show()')
.hide();
$('.a-js-validator').find('input[type=text]').val('');
$('.a-js-validator').find('.a-btn-group').find('.a-btn').eq(1)
.show();
});
$('.a-js-validator').find('.a-message-error');
toggleBtns = function(el) {
if ($(el).length > 0 && $(el).val().length > 0) {
$('.a-js-validator').find('.a-btn-group').find('.a-btn').eq(0)
.show();
$('.a-js-validator').find('.a-btn-group').find('.a-btn').eq(1)
.hide();
if (
$('.a-js-validator').find('input[type=text]').val()
.indexOf($('.a-personSwitcher-name').attr('title').toLowerCase()
.split(' ')[1]) !== -1 ||
$('.a-js-validator').find('input[type=text]').val()
.indexOf($('.a-personSwitcher-name').attr('title')
.split(' ')[1]) !== -1
) {
$('.a-js-validator').find('.a-btn-group').find('.a-btn').eq(0)
.attr('onclick', initAction);
} else {
$('.a-js-validator').find('.a-btn-group').find('.a-btn').eq(0)
.attr('onclick',
'$(".a-js-validator").find(".a-message-error").show()');
}
} else {
$('.a-js-validator').find('.a-btn-group').find('.a-btn').eq(0)
.hide();
$('.a-js-validator').find('.a-btn-group').find('.a-btn').eq(1)
.show();
}
};
toggleBtns($('.a-js-validator').find('input[type=text]'));
$('.a-js-validator').find('input[type=text]').on('keyup', function(e) {
if (e.which !== 13) {
$('.a-js-validator').find('.a-message-error').hide();
}
toggleBtns(this);
});
$('.a-js-validator').find('input[type=text]').on('keydown', function(e) {
$('.a-js-validator').find('.a-message-error').hide();
if (e.which === 13) {
e.preventDefault(); e.stopPropagation();
if ($('.a-js-validator').find('.a-btn-group').find('.a-btn').eq(0)
.is(':visible')) {
$('.a-js-validator').find('.a-btn-group').find('.a-btn').eq(0)
.click();
}
}
});
$('.a-js-validator').find('input[type=text]').on('change', function() {
$('.a-js-validator').find('.a-message-error').hide();
toggleBtns(this);
});
}
};
/* globals $, onboardingStep, onboardingOnShow, onboardingSeek, onboardingHide,
onboardingCrawl, onboardingBlank */
var onboarding = function() {
var count = -1; var steps;
$('body').addClass($('.a-js-bodyClassPersist').attr('data-body'));
$('.a-page').eq(0).append('<span class="onboarding-wrapper"><span ' +
'class="a-js-circle"></span></span><span class="onboarding-neutral"></span>'
);
if ($('body').width() < 768 && $('.a-onboarding').length > 0) {
$('.onboarding-wrapper').css('position', 'fixed');
$('.onboarding-neutral').css('position', 'fixed');
$('.a-onboarding').css('top', '-120px').css('height', '100%').css('overflow', 'scroll')
.css('padding-bottom', '0')
.css('min-height', '110vh');
$('.navbar-toggler')[0].click();
}
steps = onboardingCrawl();
$('.modal-open').css('overflow-x', 'hidden');
$('.onboarding-neutral').hide();
$('.onboarding-wrapper').hide();
$('.onboarding-wrapper')
.css('transform', 'translate3d(0, 0, 0) matrix(1, 0, 0, 1, 570, 700)')
.css('-webkit-transform', 'translate3d(0, 0, 0) matrix(1, 0, 0, 1, 570, 700)');
$('.a-onboarding').find('.a-btn').on('click', function(e) {
e.preventDefault(); e.stopPropagation();
if ($(this).hasClass('a-btn-success')) {
onboardingHide(onboardingStep(0));
} else {
if (count === -1) {
$('.a-js-circle').css('background-color', 'rgba(2, 47, 81, 0)');
} else if ($('body').width() < 768 && count === 1) {
$('.navbar-toggler')[0].click();
}
count += 1;
if (steps[count]) {
onboardingSeek(count, steps);
} else {
$('.a-js-circle').css('background-color', 'rgba(2, 47, 81, 1)');
onboardingBlank(true, 450);
}
onboardingStep(count + 1);
}
});
$('.a-onboarding').find('.a-btn-link').on('click', function(e) {
e.preventDefault(); e.stopPropagation();
if (count === -1) {
onboardingHide(onboardingStep(0));
} else {
count = -1; onboardingBlank(true); onboardingStep(0);
if ($('body').width() < 768) {
$('.navbar-toggler')[0].click();
}
}
});
$('.a-js-modalLauncher').each(function() {
onboardingOnShow($(this).attr('data-target'), function() {
count = -1; onboardingStep(0);
});
});
$('#modalOnboarding').modal('show');
};
var isIE11 = !!window.MSInputMethodContext && !!document.documentMode;
var onboardingBlank = function(bool, delay) {
$('.onboarding-wrapper')
.css('transform', 'translate3d(0, 0, 0) matrix(1, 0, 0, 1, 570, 700)')
.css('-webkit-transform', 'translate3d(0, 0, 0) matrix(1, 0, 0, 1, 570, 700)');
setTimeout(function() {
if (bool) {
$('html, body').animate({ scrollTop: 0 }, 200);
setTimeout(function() {
$('.onboarding-neutral').css('opacity', '0.9');
$('.onboarding-wrapper').css('opacity', '0');
}, 200);
} else {
$('.onboarding-neutral').css('opacity', '0');
$('.onboarding-wrapper').css('opacity', '0.9');
}
}, delay || 0);
};
var onboardingCrawl = function(callback) {
var stepCrawlCount = 1; var arr = [];
while (
$('.a-page').find('.a-js-onboardingTarget-' + stepCrawlCount).length > 0
) {
arr.push($('.a-page').find('.a-js-onboardingTarget-' + stepCrawlCount));
stepCrawlCount += 1;
}
if (callback) {
callback();
}
return arr;
};
var onboardingStep = function(i) {
$('.a-onboarding').find('.modal-content').hide().eq(i)
.show();
};
var onboardingOnShow = function(el, fn) {
$(el).on('show.bs.modal', function() {
if ($(el).hasClass('a-onboarding')) {
$('.onboarding-neutral').fadeIn(200, 'linear');
$('.onboarding-wrapper').show(); $('body').css('overflow-y', 'hidden');
$('body').css('overflow-x', 'hidden');
if (fn) {
fn();
}
}
});
};
var onboardingHide = function(fn) {
if (fn) {
setTimeout(function() {
$('body').css('overflow-x', 'auto');
fn();
}, 200);
} else {
setTimeout(function() {
$('body').css('overflow-x', 'auto');
}, 200);
}
$('.a-js-modalLauncher').each(function() {
$($(this).attr('data-target')).modal('hide');
$('.onboarding-wrapper').hide();
});
$('.onboarding-neutral').fadeOut(200, 'linear');
$('body').css('overflow-x', 'hidden');
$('body').css('overflow-y', 'scroll');
};
var onboardingSeek = function(_count, _steps) {
var count = _count; var steps = _steps; var mod; var horizontalJiggle; var verticalJiggle;
var ratio;
if (count === 0) {
$('.a-js-circle').css('background-color', 'rgba(2, 47, 81, 1)');
setTimeout(function() {
$('.onboarding-neutral').css('opacity', '0');
$('.onboarding-wrapper').css('opacity', '0.9');
$('.a-js-circle').css('background-color', 'rgba(2, 47, 81, 0)');
}, 250);
} else {
onboardingBlank(false);
}
ratio = (steps[count].width() / 7.5);
if (ratio > 12.5) {
ratio = 12.5;
}
if (steps[count - 1]) {
if (steps[count - 1].offset().left < steps[count].offset().left) {
horizontalJiggle = 10;
} else if (
steps[count - 1].offset().left > steps[count].offset().left
) {
horizontalJiggle = -10;
} else {
horizontalJiggle = 0;
}
if (steps[count - 1].offset().top < steps[count].offset().top) {
verticalJiggle = 10;
} else if (
steps[count - 1].offset().top > steps[count].offset().top
) {
verticalJiggle = -10;
} else {
verticalJiggle = 0;
}
} else {
horizontalJiggle = 10; verticalJiggle = 0;
}
if ($('body').width() < 768) {
ratio = 7.5;
if (steps[count].offset().top > 30) {
mod = (steps[count].offset().top - (steps[count].offset().top - (50)));
} else {
mod = 31;
}
$('.onboarding-wrapper')
.css(
'transform',
'translate3d(0, 0, 0) matrix(' + (ratio / 5) + ', 0, 0, ' + (ratio / 5) + ',' +
(steps[count].offset().left + (isIE11 ? (570 * ((ratio / 5))) : 0) + (steps[count].width() / 2)) + ',' +
((steps[count].height() / 2)) + ')'
)
.css(
'-webkit-transform',
'translate3d(0, 0, 0) matrix(' + (ratio / 5) + ', 0, 0, ' + (ratio / 5) + ',' +
(steps[count].offset().left + (isIE11 ? (570 * ((ratio / 5))) : 0) + (steps[count].width() / 2)) + ',' +
((steps[count].height() / 2)) + ')'
)
.css('top', mod + 'px')
.css('left', '0.5px');
$('html, body').animate({
scrollTop: steps[count].offset().top - (50)
}, 200);
} else {
if (steps[count].offset().top - (100) > 0) {
mod = 141;
} else {
mod = -1;
}
$('.onboarding-wrapper')
.css(
'transform',
'translate3d(0, 0, 0) matrix(' + (ratio / 5) + ', 0, 0, ' + (ratio / 5) + ',' +
(steps[count].offset().left + (isIE11 ? (570 * ((ratio / 5))) : 0) + (steps[count].width() / 2)) + ',' +
(steps[count].offset().top + (steps[count].height() / 2)) + ')'
)
.css(
'-webkit-transform',
'translate3d(0, 0, 0) matrix(' + (ratio / 5) + ', 0, 0, ' + (ratio / 5) + ',' +
(steps[count].offset().left + (isIE11 ? (570 * ((ratio / 5))) : 0) + (steps[count].width() / 2)) + ',' +
(steps[count].offset().top + (steps[count].height() / 2)) + ')'
)
.css('top', verticalJiggle + 'px')
.css('left', horizontalJiggle + 'px');
$('.onboarding-wrapper').css('top', (-1 - mod) + 'px').css('left', '2px');
setTimeout(function() {
$('.onboarding-wrapper')
.css('top', ((verticalJiggle * -0.5) - mod) + 'px')
.css('left', (horizontalJiggle * -0.5) + 'px');
setTimeout(function() {
$('.onboarding-wrapper')
.css('top', ((verticalJiggle * 0.25) - mod) + 'px')
.css('left', (horizontalJiggle * 0.25) + 'px');
setTimeout(function() {
$('.onboarding-wrapper')
.css('top', ((verticalJiggle * -0.125) - mod) + 'px')
.css('left', (horizontalJiggle * -0.125) + 'px');
setTimeout(function() {
$('.onboarding-wrapper').css('top', (-1 - mod) + 'px').css('left', '2px');
}, 100);
}, 100);
}, 100);
}, 450);
$('html, body').animate({
scrollTop: steps[count].offset().top - (100)
}, 200);
}
};
/* globals $ */
window.openGitMD = function(target) {
window.open('https://github.com/Altinn/DesignSystem/edit/dev/source' +
$(target).closest('.sg-pattern').find('.patternLink')
.attr('href')
.replace('DesignSystem/', '')
.replace(/\.\.\//g, '')
.replace('patterns', '/_patterns')
.replace(/(?:[^//*]*)$/, '/')
.replace('//', '.md')
.replace(/-([0-9]{2})/g, '/$1'), '_blank'
);
};
/* globals $ */
var preOpenModals = function() {
$('#modalExample').addClass('show');
};
/* globals $ */
var prototypingInteractionStarteENK = function() {
var emptyField = 0; /* Counting the number of times the "bransje"-textfield is empty */
/* Prototyping that place will be visible after typing in postnumber */
$('#postnummer').keyup(function() {
if (this.value === '0123') {
$('.a-js-place').css('display', 'inline');
} else {
$('.a-js-place').css('display', 'none');
}
});
/* Prototyping that radiobuttons for "Virksomhet" will be visible after typing in keywords */
$('#bransje').keyup(function() {
if (this.value === 'tekstil') {
$('#a-js-radio-bransje').css('display', 'inline');
} else {
$('#a-js-radio-bransje').css('display', 'none');
}
});
/* Step 3 will start when user has typed in three different keywords without success */
$('#bransje').keyup(function() {
if (this.value.length === 0) {
emptyField += 1;
}
if (emptyField >= 3) {
window.location = '../../patterns/04-sider-80-prosess-00-starte-enk-3/04-sider-80-prosess-00-starte-enk-3.html';
}
});
/* Toggling chat */
$('#link-chat').on('click', function() {
$('#chat').css('display', 'block');
});
$('#close-chat').on('click', function() {
$('#chat').css('display', 'none');
});
};
// Hard-coded data, should be replaced with JSON
var availableTags = [
{ label: 'ACC Security level 2 MAG, Accenture Test', service: 'ACC Security level 2 MAG', serviceOwner: 'Accenture Test' },
{ label: 'Corres test 250116, Accenture Test', service: 'Corres test 250116', serviceOwner: 'Accenture Test' },
{ label: 'PSA Skatteoppgjør personlig, Skatteetaten', service: 'PSA Skatteoppgjør personlig', serviceOwner: 'Skatteetaten' },
{ label: 'RF-1400 Melding om flytting innenlands,Skatteetaten', service: 'RF-1400 Melding om flytting innenlands', serviceOwner: 'Skatteetaten' },
{ label: 'Aksjeoppgaven 2014, Skatteetaten', service: 'Aksjeoppgaven 2014', serviceOwner: 'Skatteetaten' },
{ label: 'Et veldig langt punkt i lista som bør gå over alle bredder og grenser, men samtidig oppføre seg riktig i layout. Se så lang tekst dette her er., accenture', service: 'Et veldig langt punkt i lista som bør gå over alle bredder og grenser, men samtidig oppføre seg riktig i layout. Se så lang tekst dette her er.', serviceOwner: 'accenture' }
];
// Hard-coded texts, should be replaced with custom strings
var title = 'Vanligste skjema og tjenester i din organisasjon';
var numberOfResultsLabel = ' treff. Bruk pil opp og pil ned for å navigere i resultatene.';
var noResultsLabel = 'Ingen treff';
var moreThanMaxLabel = 'Listen viser kun de første 100 treff. Vennligst begrens søket ditt';
var searchWithAutocomplete = function() {
$.widget('custom.catcomplete', $.ui.autocomplete, ({
_create: function() {
this._super();
this.widget().menu('option', 'items', '> :not(.a-js-autocomplete-header)');
$('.ui-helper-hidden-accessible').addClass('sr-only');
},
_renderMenu: function(ul, items) {
var that = this;
var iLength = items.length;
$.each(items, function(index, item) {
// build item in the list
var innerHtmlForItem = '<div class="row">' +
'<div class="col-sm-7 col-md-5 col-lg-6 pl-md-2 pl-lg-2 pr-2" data-searchable="true">' +
'<span class="a-js-sortValue a-list-longtext" title="ACC Security level 2 MAG">' + item.service + '</span>' +
'</div>' +
'<div class="d-none d-md-block col-md-3 col-lg-4 pl-md-2 pl-lg-1 pr-2" data-searchable="true">' +
'<span class="a-js-sortValue a-list-longtext" title="Testetat for Accenture">' + item.serviceOwner + '</span>' +
'</div>' +
'</div>';
var li = that._renderItemData(ul, item);
li.data('item.autocomplete', item);
li.children().first().remove();
li.append(innerHtmlForItem);
li.children().first().attr('role', 'button');
li.attr('role', 'menu');
li.addClass('a-dotted a-selectable');
li.attr('id', 'menu-item-' + index);
li.attr('onclick', 'location.href="/patterns/04-sider-portal-92-andre-med-rettigheter-00-andre-med-rettigheter-tildel-enkeltrettigheter/04-sider-portal-92-andre-med-rettigheter-00-andre-med-rettigheter-tildel-enkeltrettigheter.html"');
});
if (iLength === availableTags.length) {
ul.prepend('<li class=\'a-js-autocomplete-header a-dotted\'>' + title + '</li>');
} else if (!items[0].isNoResultsLabel) {
ul.prepend('<li class=\'a-js-autocomplete-header a-dotted\'>' + iLength + ' treff </li>');
} else {
$('.ui-autocomplete').children().first().addClass('a-js-autocomplete-header');
}
if (iLength >= 3) {
ul.append('<li class=\'a-js-autocomplete-header a-dotted a-info\'>' + moreThanMaxLabel + '</li>');
}
}
}));
$('.a-js-autocomplete').catcomplete({
// delay: 200, // set appropriate delay for ajax call
source: availableTags,
appendTo: '.a-autocomplete-container',
minLength: 0,
classes: {
'ui-autocomplete': 'a-list',
'ui-menu-item': 'a-dotted'
},
open: function(event, ui) {
$('.ui-autocomplete').removeAttr('style'); // remove inline positioning and display of amount results
$('.ui-autocomplete .ui-menu-item').not(':first-of-type').addClass('a-clickable');
},
messages: {
noResults: noResultsLabel,
results: function(count) {
if (count === availableTags.length) {
return title + '. ' + count + ' ' + numberOfResultsLabel;
}
return count + ' ' + numberOfResultsLabel;
}
},
response: function(event, ui) {
var el;
if (ui.content.length === 0) {
el = {
isNoResultsLabel: true,
label: noResultsLabel,
title: noResultsLabel
};
ui.content.push(el);
}
}
}).bind('click', function(e) { // TODO should also open on tab focus? issue 3766
if ($(this).catcomplete('widget').is(':visible')) {
$(this).catcomplete('close');
}
});
};
// Hard-coded data, should be replaced with JSON
var availableTags = [
{ label: 'ACC Security level 2 MAG, Accenture Test', service: 'ACC Security level 2 MAG', serviceOwner: 'Accenture Test' },
{ label: 'Corres test 250116, Accenture Test', service: 'Corres test 250116', serviceOwner: 'Accenture Test' },
{ label: 'PSA Skatteoppgjør personlig, Skatteetaten', service: 'PSA Skatteoppgjør personlig', serviceOwner: 'Skatteetaten' },
{ label: 'RF-1400 Melding om flytting innenlands,Skatteetaten', service: 'RF-1400 Melding om flytting innenlands', serviceOwner: 'Skatteetaten' },
{ label: 'Aksjeoppgaven 2014, Skatteetaten', service: 'Aksjeoppgaven 2014', serviceOwner: 'Skatteetaten' },
{ label: 'Et veldig langt punkt i lista som bør gå over alle bredder og grenser, men samtidig oppføre seg riktig i layout. Se så lang tekst dette her er., accenture', service: 'Et veldig langt punkt i lista som bør gå over alle bredder og grenser, men samtidig oppføre seg riktig i layout. Se så lang tekst dette her er.', serviceOwner: 'accenture' }
];
// Hard-coded texts, should be replaced with custom strings
var title = 'Vanligste skjema og tjenester i din organisasjon';
var numberOfResultsLabel = ' treff. Bruk pil opp og pil ned for å navigere i resultatene.';
var noResultsLabel = 'Ingen treff';
var moreThanMaxLabel = 'Listen viser kun de første 100 treff. Vennligst begrens søket ditt';
var searchWithAutocompleteVarsel = function() {
$.widget('custom.catcomplete', $.ui.autocomplete, ({
_create: function() {
this._super();
this.widget().menu('option', 'items', '> :not(.a-js-autocomplete-header)');
$('.ui-helper-hidden-accessible').addClass('sr-only');
},
_renderMenu: function(ul, items) {
var that = this;
var iLength = items.length;
$.each(items, function(index, item) {
// build item in the list
var innerHtmlForItem = '<div class="row">' +
'<div class="col-sm-7 col-md-5 col-lg-6 pl-md-2 pl-lg-2 pr-2" data-searchable="true">' +
'<span class="a-js-sortValue a-list-longtext" title="ACC Security level 2 MAG">' + item.service + '</span>' +
'</div>' +
'<div class="d-none d-md-block col-md-3 col-lg-4 pl-md-2 pl-lg-1 pr-2" data-searchable="true">' +
'<span class="a-js-sortValue a-list-longtext" title="Testetat for Accenture">' + item.serviceOwner + '</span>' +
'</div>' +
'<div class="text-right col-sm-5 col-md-4 col-lg-2 pl-md-2 pl-lg-1 pr-sm-0 pr-md-2">' +
'<span class="a-fontBold a-btn-icon-text a-hiddenWhenSelected ">+Legg til</span>' +
'<span class="a-fontBold d-sm-block a-visibleWhenSelected">Lagt til</span>' +
'</div>' +
'</div>';
var li = that._renderItemData(ul, item);
li.data('item.autocomplete', item);
li.children().first().remove();
li.append(innerHtmlForItem);
li.children().first().attr('role', 'button');
li.attr('role', 'menu');
li.addClass('a-dotted a-selectable');
li.attr('id', 'menu-item-' + index);
});
if (iLength === availableTags.length) {
ul.prepend('<li class=\'a-js-autocomplete-header a-dotted\'>' + title + '</li>');
} else if (!items[0].isNoResultsLabel) {
ul.prepend('<li class=\'a-js-autocomplete-header a-dotted\'>' + iLength + ' treff </li>');
} else {
$('.ui-autocomplete').children().first().addClass('a-js-autocomplete-header');
}
if (iLength >= 3) {
ul.append('<li class=\'a-js-autocomplete-header a-dotted a-info\'>' + moreThanMaxLabel + '</li>');
}
}
}));
$('.a-js-autocomplete-varsel').catcomplete({
// delay: 200, // set appropriate delay for ajax call
source: availableTags,
appendTo: '.a-autocomplete-container',
minLength: 0,
classes: {
'ui-autocomplete': 'a-list',
'ui-menu-item': 'a-dotted'
},
open: function(event, ui) {
$('.ui-autocomplete').removeAttr('style'); // remove inline positioning and display of amount results
$('.ui-autocomplete .ui-menu-item').not(':first-of-type').addClass('a-clickable');
},
messages: {
noResults: noResultsLabel,
results: function(count) {
if (count === availableTags.length) {
return title + '. ' + count + ' ' + numberOfResultsLabel;
}
return count + ' ' + numberOfResultsLabel;
}
},
response: function(event, ui) {
var el;
if (ui.content.length === 0) {
el = {
isNoResultsLabel: true,
label: noResultsLabel,
title: noResultsLabel
};
ui.content.push(el);
}
},
// Select configured to stop setting the default input and modify the menu
select: function(event, ui) {
// Find menu element
var autocompleteMenu = $('#ui-id-1');
// Find selected right and add classes to closest list-item
autocompleteMenu.find('span:contains(' + ui.item.service + ')')
.closest('li')
.addClass('a-dotted a-disabled a-success a-selectable a-selected');
// Find menu and set focus to closest list-item of selected right
autocompleteMenu.menu('focus', null, autocompleteMenu.find('span:contains(' + ui.item.service + ')').closest('li'));
// ONLY FOR DESIGNSYSTEM PROTOTYPING
// eslint-disable-next-line
console.log('Prototyping feature needs to be commented out in searchWithAutocompleteVarselEnkeltTjeneste.js');
// Add the clicked rights to list, only if if not already in list
if ($('.a-list-container').find('div:contains(' + ui.item.service + ')').length === 0) {
// eslint-disable-next-line
var firstListItem = $('#hiddenMalRow').clone();
firstListItem.removeClass('a-hiddenRow');
firstListItem.attr('id', 'last');
firstListItem.find('div div:nth-child(1)').text(function() {
return ui.item.service;
});
firstListItem.first().addClass('a-selected a-success');
firstListItem.find('button:nth-of-type(3) > i').removeClass('a-iconStrikeThrough a-disabledIcon');
$('.a-list-container > ul').append(firstListItem);
}
return false;
},
// Focus configured to stop input from updating input when keyboard is used
focus: function(event, ui) {
return false;
}
}).bind('click', function(e) { // TODO should also open on tab focus? issue 3766
if ($(this).catcomplete('widget').is(':visible')) {
$(this).catcomplete('close');
}
});
};
// When pressing "ESC"
$(document).on('keyup', function(evt) {
if (evt.keyCode === 27) {
$('.a-multipleSelectInAutoComplete').attr('style', 'display:none');
}
});
/* eslint vars-on-top: 1 */
// Hard-coded data, should be replaced with JSON
var availableTags = [
{ label: 'ACC Security level 2 MAG, Accenture Test', service: 'ACC Security level 2 MAG', serviceOwner: 'Accenture Test' },
{ label: 'Corres test 250116, Accenture Test', service: 'Corres test 250116', serviceOwner: 'Accenture Test' },
{ label: 'PSA Skatteoppgjør personlig, Skatteetaten', service: 'PSA Skatteoppgjør personlig', serviceOwner: 'Skatteetaten' },
{ label: 'RF-1400 Melding om flytting innenlands,Skatteetaten', service: 'RF-1400 Melding om flytting innenlands', serviceOwner: 'Skatteetaten' },
{ label: 'Aksjeoppgaven 2014, Skatteetaten', service: 'Aksjeoppgaven 2014', serviceOwner: 'Skatteetaten' },
{ label: 'Et veldig langt punkt i lista som bør gå over alle bredder og grenser, men samtidig oppføre seg riktig i layout. Se så lang tekst dette her er., accenture', service: 'Et veldig langt punkt i lista som bør gå over alle bredder og grenser, men samtidig oppføre seg riktig i layout. Se så lang tekst dette her er.', serviceOwner: 'accenture' }
];
// Hard-coded texts, should be replaced with custom strings
var title = 'Vanligste skjema og tjenester i din organisasjon';
var numberOfResultsLabel = ' treff. Bruk pil opp og pil ned for å navigere i resultatene.';
var noResultsLabel = 'Ingen treff';
var moreThanMaxLabel = 'Listen viser kun de første 100 treff. Vennligst begrens søket ditt';
var searchWithMultipleSelectInAutoComplete = function() {
$.widget('custom.catcomplete', $.ui.autocomplete, ({
_create: function() {
this._super();
this.widget().menu('option', 'items', '> :not(.a-js-autocomplete-header)');
$('.ui-helper-hidden-accessible').addClass('sr-only');
},
_renderMenu: function(ul, items) {
var that = this;
var iLength = items.length;
$.each(items, function(index, item) {
// build item in the list
var innerHtmlForItem = '<div class="row">' +
'<div class="col-sm-7 col-md-5 col-lg-6 pl-md-2 pl-lg-2 pr-2" data-searchable="true">' +
'<span class="a-js-sortValue a-list-longtext" title="ACC Security level 2 MAG">' + item.service + '</span>' +
'</div>' +
'<div class="d-none d-md-block col-md-3 col-lg-4 pl-md-2 pl-lg-1 pr-2" data-searchable="true">' +
'<span class="a-js-sortValue a-list-longtext" title="Testetat for Accenture">' + item.serviceOwner + '</span>' +
'</div>' +
'<div class="text-right col-sm-5 col-md-4 col-lg-2 pl-md-2 pl-lg-1 pr-sm-0 pr-md-2">' +
'<span class="a-fontBold a-btn-icon-text a-hiddenWhenSelected ">+Legg til</span>' +
'<span class="a-fontBold d-sm-block a-visibleWhenSelected">Lagt til</span>' +
'</div>' +
'</div>';
var li = that._renderItemData(ul, item);
li.data('item.autocomplete', item);
li.children().first().remove();
li.append(innerHtmlForItem);
li.children().first().attr('role', 'button');
li.attr('role', 'menu');
li.addClass('a-dotted a-selectable');
li.attr('id', 'menu-item-' + index);
/* var li = that._renderItemData(ul, item);
console.log(li);
li.attr('role', 'menu');
li.addClass('a-dotted');
li.children().first().attr('role', 'button');*/
});
if (iLength === availableTags.length) {
ul.prepend('<li class=\'a-js-autocomplete-header a-dotted\'>' + title + '</li>');
} else if (!items[0].isNoResultsLabel) {
ul.prepend('<li class=\'a-js-autocomplete-header a-dotted\'>' + iLength + ' treff </li>');
} else {
$('.ui-autocomplete').children().first().addClass('a-js-autocomplete-header');
}
if (iLength >= 3) {
ul.append('<li class=\'a-js-autocomplete-header a-dotted a-info\'>' + moreThanMaxLabel + '</li>');
}
// Lukkeknapp
/*
ul.append('<li class="a-js-autocomplete-header ml-2 a-no-border-bottom">' +
'<div class="mt-1 mb-1 d-flex justify-content-center">' +
'<button id="closeAutoCompleteMenu" class="a-btn pl-1 pr-1">Lukk</button>' +
'</div>' +
'</li>');
*/
},
oldClose: $.ui.autocomplete.prototype.close,
close: function(event) {
var bolClose;
if (event) {
bolClose = false;
} else {
bolClose = true;
$('button:contains(\'Lagre\')').removeAttr('disabled');
}
// Actuall close
if (bolClose) {
this.oldClose(event);
}
return false;
}
}));
$('.a-js-autocomplete-multiplecolumns').catcomplete({
// delay: 200, // set appropriate delay for ajax call
source: availableTags,
appendTo: '.a-autocomplete-container',
minLength: 0,
classes: {
'ui-autocomplete': 'a-list a-multipleSelectInAutoComplete',
'ui-menu-item': 'a-dotted'
},
open: function(event, ui) {
$('button:contains(\'Lagre\')').attr('disabled', 'disabled');
$('.ui-autocomplete').removeAttr('style'); // remove inline positioning and display of amount results
$('.ui-autocomplete .ui-menu-item').not(':first-of-type').addClass('a-clickable');
},
messages: {
noResults: noResultsLabel,
results: function(count) {
if (count === availableTags.length) {
return title + '. ' + count + ' ' + numberOfResultsLabel;
}
return count + ' ' + numberOfResultsLabel;
}
},
response: function(event, ui) {
var el;
// console.log(ui.content.length);
if (ui.content.length === 0) {
el = {
isNoResultsLabel: true,
label: noResultsLabel,
title: noResultsLabel
};
ui.content.push(el);
}
},
// Select configured to stop setting the default input and modify the menu
select: function(event, ui) {
// Find menu element
var autocompleteMenu = $('#ui-id-1');
// Find selected right and add classes to closest list-item
autocompleteMenu.find('span:contains(' + ui.item.service + ')')
.closest('li')
.addClass('a-dotted a-disabled a-success a-selectable a-selected');
// Find menu and set focus to closest list-item of selected right
autocompleteMenu.menu('focus', null, autocompleteMenu.find('span:contains(' + ui.item.service + ')').closest('li'));
// ONLY FOR DESIGNSYSTEM PROTOTYPING
// eslint-disable-next-line
console.log('Prototyping feature needs to be commented out in searchWithMultipleSelectInAutoComplete.js');
// Add the clicked rights to list, only if if not already in list
if ($('.a-list-container').find('div:contains(' + ui.item.service + ')').length === 0) {
// eslint-disable-next-line
var emptyListItem = $('#emptyRow');
var firstListItem = $('#hiddenMalRow').clone();
firstListItem.removeClass('a-hiddenRow');
firstListItem.attr('id', 'last');
firstListItem.find('div div:nth-child(1)').text(function() {
return ui.item.service;
});
firstListItem.first().addClass('a-selected a-success');
firstListItem.find('button:nth-of-type(3) > i').removeClass('a-iconStrikeThrough a-disabledIcon');
emptyListItem.addClass('a-hiddenRow');
$('.a-list-container > ul').append(firstListItem);
}
return false;
},
// Focus configured to stop input from updating input when keyboard is used
focus: function(event, ui) {
return false;
}
}).bind('click', function(e) { // TODO should also open on tab focus? issue 3766
if ($(this).catcomplete('widget').is(':visible')) {
$(this).catcomplete('close');
}
});
};
// When pressing "ESC"
$(document).on('keyup', function(evt) {
if (evt.keyCode === 27) {
$('.a-multipleSelectInAutoComplete').attr('style', 'display:none');
}
});
/*
Search datatable with highlight using external package mark.js
Search field needs attribute data-search-algorithm="show-and-highlight"
Searchable elements need attribute data-searchable="true"
List elements that should be ignored during search need the class a-js-ignoreDuringSearch
*/
var mark = function() {
var $elements;
var input = $(this).val();
var options = {
// comment out to ignore html tags in searchable strings
// ie: string1 <tag>string2</tag>
separateWordSearch: false
};
$.each(this.dataset.searchTarget.split(','), function() {
// Reset visibility of all rows
var target = '#' + this.toString();
$(target + ' li:not(.a-js-ignoreDuringSearch):not(.a-list-header)').show();
$(target).find('*[data-searchable="true"]').unmark().mark(input, options);
// Hide unmarked rows
if (input.length > 0) {
$elements = $(target + ' li:not(.a-js-ignoreDuringSearch):not(.a-list-header)');
$elements.each(function() {
if ($(this).find('mark').length === 0) {
$(this).hide();
}
});
} else {
$elements = null;
}
if (!$elements || $elements.find('mark').length > 0) {
$(target + ' .a-js-noSearchResults').closest('li').hide();
} else {
$(target + ' .a-js-noSearchResults-phrase').text(input);
$(target + ' .a-js-noSearchResults').closest('li').show();
}
});
};
var initSearchWithHighlight = function() {
$('.a-js-noSearchResults').closest('li').hide();
$('input[data-search-algorithm="show-and-highlight"]').on('input', mark);
};
/* globals $ */
var selectAll = function() {
var ctrlDown = false;
var ctrlKey = 17;
var cmdKey = 91;
var aKey = 65;
var selectText = function(element) {
var doc = document;
var text = $(element);
var range;
var selection;
text.each(function(index, value) {
if ($(value).is(':visible')) {
if (doc.body.createTextRange) {
range =