Initialize project
commit
fb74b92de1
@ -0,0 +1,21 @@
|
||||
MIT License
|
||||
|
||||
Copyright (c) 2020-2022 Hyperzlib
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
@ -0,0 +1,78 @@
|
||||
{
|
||||
"name": "Isekai Background Widget",
|
||||
"namemsg": "isekai-background-widget",
|
||||
"author": "Hyperzlib",
|
||||
"version": "1.0.0",
|
||||
"url": "https://www.isekai.cn",
|
||||
"descriptionmsg": "isekai-background-widget-desc",
|
||||
"license-name": "GPL-2.0-or-later",
|
||||
"type": "parserhook",
|
||||
"requires": {
|
||||
|
||||
},
|
||||
"MessagesDirs": {
|
||||
"IsekaiBackgroundWidget": [
|
||||
"i18n"
|
||||
]
|
||||
},
|
||||
"DefaultUserOptions": {
|
||||
"isekai-bgimg-visible-desktop": true,
|
||||
"isekai-bgimg-visible-mobile": true
|
||||
},
|
||||
"AutoloadClasses": {
|
||||
"Isekai\\BackgroundWidget": "includes/BackgroundWidget.php"
|
||||
},
|
||||
"Hooks": {
|
||||
"ParserFirstCallInit": [
|
||||
"Isekai\\BackgroundWidget::onParserSetup"
|
||||
],
|
||||
"BeforePageDisplay": [
|
||||
"Isekai\\BackgroundWidget::addModules"
|
||||
],
|
||||
"GetPreferences": [
|
||||
"Isekai\\BackgroundWidget::onGetPreferences"
|
||||
]
|
||||
},
|
||||
"ResourceModules": {
|
||||
"ext.isekai.backgroundWidget": {
|
||||
"scripts": "ext.isekai.backgroundWidget/BgImage.js",
|
||||
"styles": "ext.isekai.backgroundWidget/global.less",
|
||||
"targets": [
|
||||
"desktop",
|
||||
"mobile"
|
||||
],
|
||||
"messages": [
|
||||
"isekai-background-widget-param-error"
|
||||
]
|
||||
},
|
||||
"ext.isekai.backgroundWidget-timeless": {
|
||||
"scripts": "ext.isekai.backgroundWidget/timeless.js",
|
||||
"styles": "ext.isekai.backgroundWidget/timeless.less",
|
||||
"targets": [
|
||||
"desktop",
|
||||
"mobile"
|
||||
]
|
||||
},
|
||||
"ext.isekai.backgroundWidget-minerva": {
|
||||
"scripts": "ext.isekai.backgroundWidget/minerva.js",
|
||||
"styles": "ext.isekai.backgroundWidget/minerva.less",
|
||||
"targets": [
|
||||
"desktop",
|
||||
"mobile"
|
||||
]
|
||||
},
|
||||
"ext.isekai.backgroundWidget-vector": {
|
||||
"scripts": "ext.isekai.backgroundWidget/vector.js",
|
||||
"styles": "ext.isekai.backgroundWidget/vector.less",
|
||||
"targets": [
|
||||
"desktop",
|
||||
"mobile"
|
||||
]
|
||||
}
|
||||
},
|
||||
"ResourceFileModulePaths": {
|
||||
"localBasePath": "modules",
|
||||
"remoteExtPath": "Isekai/modules"
|
||||
},
|
||||
"manifest_version": 1
|
||||
}
|
||||
@ -0,0 +1,9 @@
|
||||
{
|
||||
"isekai-background-widget": "异世界百科 页面背景图片",
|
||||
"isekai-background-widget-desc": "设置页面的背景图片",
|
||||
"isekai-background-widget-param-error": "背景图片参数错误：",
|
||||
|
||||
"prefs-isekai-bgimg": "页面背景图片",
|
||||
"isekai-perfs-bgimg-visible-desktop": "在桌面设备上显示",
|
||||
"isekai-perfs-bgimg-visible-mobile": "在移动设备上显示"
|
||||
}
|
||||
@ -0,0 +1,76 @@
|
||||
<?php
|
||||
namespace Isekai;
|
||||
|
||||
use MWNamespace;
|
||||
use MediaWiki\MediaWikiServices;
|
||||
use Title;
|
||||
|
||||
class BackgroundWidget {
|
||||
public static function onParserSetup(&$parser){
|
||||
$parser->setHook('background', self::class . '::onCreateBackgroundWidget');
|
||||
return true;
|
||||
}
|
||||
|
||||
public static function onCreateBackgroundWidget($text, array $args, \Parser $parser, \PPFrame $frame){
|
||||
/** @var \ParserOutput */
|
||||
$output = $parser->getOutput();
|
||||
|
||||
$output->addModules('ext.isekai.backgroundWidget');
|
||||
|
||||
$allowKeys = ['src', 'xcenter', 'ycenter'];
|
||||
|
||||
$args = array_filter($args, function($key) use($allowKeys){
|
||||
return in_array($key, $allowKeys);
|
||||
}, ARRAY_FILTER_USE_KEY);
|
||||
|
||||
foreach($args as $key => $one){
|
||||
$args[$key] = $parser->recursiveTagParse($one, $frame);
|
||||
|
||||
if($key == 'xcenter' || $key == 'ycenter'){
|
||||
$args[$key] = intval($args[$key]);
|
||||
}
|
||||
}
|
||||
|
||||
if(isset($args['src'])){
|
||||
if(preg_match('/<img.*[^>]src="(?<file>.*?)"/' , $args['src'], $matches)
|
||||
&& isset($matches['file'])){
|
||||
$args['src'] = $matches['file'];
|
||||
}
|
||||
$output->addJsConfigVars('isekaiBackgroundWidgetData', $args);
|
||||
}
|
||||
|
||||
return '';
|
||||
}
|
||||
|
||||
public static function addModules(\OutputPage $output){
|
||||
if(in_array('ext.isekai.backgroundWidget', $output->getModules())){
|
||||
//$output->addBodyClasses('has-bgimg');
|
||||
|
||||
switch(strtolower($output->getSkin()->getSkinName())){
|
||||
case 'timeless':
|
||||
$output->addModules('ext.isekai.backgroundWidget-timeless');
|
||||
break;
|
||||
case 'minerva':
|
||||
$output->addModules('ext.isekai.backgroundWidget-minerva');
|
||||
break;
|
||||
case 'vector':
|
||||
$output->addModules('ext.isekai.backgroundWidget-vector');
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
public static function onGetPreferences(\User $user, array &$preferences){
|
||||
$preferences['isekai-bgimg-visible-desktop'] = [
|
||||
'type' => 'toggle',
|
||||
'label-message' => 'isekai-perfs-bgimg-visible-desktop',
|
||||
'section' => 'rendering/isekai-bgimg',
|
||||
];
|
||||
|
||||
$preferences['isekai-bgimg-visible-mobile'] = [
|
||||
'type' => 'toggle',
|
||||
'label-message' => 'isekai-perfs-bgimg-visible-mobile',
|
||||
'section' => 'rendering/isekai-bgimg',
|
||||
];
|
||||
}
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
@ -0,0 +1,30 @@
|
||||
@globalTransition: opacity 250ms linear;
|
||||
|
||||
.has-bgimg {
|
||||
.bgimg-background-blur {
|
||||
z-index: 1;
|
||||
|
||||
&::before {
|
||||
position: absolute;
|
||||
content: '';
|
||||
z-index: -1;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
&::after {
|
||||
position: absolute;
|
||||
content: '';
|
||||
z-index: -2;
|
||||
transition: @globalTransition;
|
||||
opacity: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
background-attachment: fixed;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,56 @@
|
||||
$(function(){
|
||||
function isMobile(){
|
||||
var userAgentInfo = navigator.userAgent;
|
||||
var mobileAgents = ["Android", "iPhone",
|
||||
"SymbianOS", "Windows Phone",
|
||||
"iPad", "iPod"];
|
||||
var flag = true;
|
||||
for(var i = 0; i < mobileAgents.length; i ++){
|
||||
if (userAgentInfo.indexOf(mobileAgents[isFinite]) != -1) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
function initBackgroundImage(params){
|
||||
let bgImg = new isekai.BgImage();
|
||||
|
||||
bgImg.addBlurBackground($('#mw-mf-page-center'));
|
||||
|
||||
if(!('xcenter' in params)){
|
||||
params.xcenter = 50;
|
||||
}
|
||||
if(!('ycenter' in params)){
|
||||
params.ycenter = 50;
|
||||
}
|
||||
|
||||
bgImg.loadImage(params.src, params.xcenter, params.ycenter);
|
||||
}
|
||||
|
||||
var showBackgroundWidget = true;
|
||||
if(isMobile() && !mw.user.options.get('isekai-bgimg-visible-mobile', true)){
|
||||
showBackgroundWidget = false;
|
||||
} else if(!mw.user.options.get('isekai-bgimg-visible-desktop', true)) {
|
||||
showBackgroundWidget = false;
|
||||
}
|
||||
|
||||
if(showBackgroundWidget){
|
||||
var params = mw.config.get('isekaiBackgroundWidgetData');
|
||||
if(params && params.src){
|
||||
$('body').addClass('has-bgimg');
|
||||
|
||||
if(window.requestAnimationFrame){
|
||||
window.requestAnimationFrame(function(){
|
||||
initBackgroundImage(params);
|
||||
});
|
||||
} else {
|
||||
setTimeout(function(){
|
||||
initBackgroundImage(params);
|
||||
}, 0);
|
||||
}
|
||||
} else {
|
||||
console.log(mw.message('isekai-background-widget-param-error').parse(), params);
|
||||
}
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,40 @@
|
||||
@globalRadius: 0.4em;
|
||||
@globalBgColor: rgba(255, 255, 255, 0.85);
|
||||
@headerBgColor: rgba(242, 242, 242, 0.8);
|
||||
@footerBgColor: rgba(255, 255, 255, 0.75);
|
||||
@globalBoxShadow: 0 3px 5px -1px rgba(0,0,0,.2),0 5px 8px 0 rgba(0,0,0,.14),0 1px 14px 0 rgba(0,0,0,.12);
|
||||
@globalTransition: opacity 250ms linear;
|
||||
@headerBlurDepth: 10px;
|
||||
|
||||
.has-bgimg {
|
||||
.isekai-bgimg {
|
||||
position: fixed;
|
||||
opacity: 0;
|
||||
transition: @globalTransition;
|
||||
|
||||
z-index: -2;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
#mw-mf-page-center {
|
||||
background-color: transparent;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.header-container.header-chrome {
|
||||
background-color: @headerBgColor;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.minerva-footer {
|
||||
background-color: @footerBgColor;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#content {
|
||||
background-color: @globalBgColor;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,64 @@
|
||||
$(function(){
|
||||
function isMobile(){
|
||||
var userAgentInfo = navigator.userAgent;
|
||||
var mobileAgents = ["Android", "iPhone",
|
||||
"SymbianOS", "Windows Phone",
|
||||
"iPad", "iPod"];
|
||||
var flag = true;
|
||||
for(var i = 0; i < mobileAgents.length; i ++){
|
||||
if (userAgentInfo.indexOf(mobileAgents[i]) != -1) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
function initBackgroundImage(params){
|
||||
let bgImg = new isekai.BgImage();
|
||||
|
||||
let bgImgElement = $('body').append('<div class="isekai-bgimg"></div>').find('div.isekai-bgimg:last');
|
||||
let navbarBg = $('body').append('<div class="isekai-navbar-bg"></div>').find('div.isekai-navbar-bg:last');
|
||||
|
||||
bgImg.addViewport(bgImgElement);
|
||||
|
||||
bgImg.addBlurBackground(navbarBg);
|
||||
bgImg.addBlurBackground($('.sidebar-chunk'));
|
||||
bgImg.addBlurBackground($('#mw-content'));
|
||||
bgImg.addBlurBackground($('#mw-content-container'));
|
||||
bgImg.addBlurBackground($('#mw-footer-container'));
|
||||
|
||||
if(!('xcenter' in params)){
|
||||
params.xcenter = 50;
|
||||
}
|
||||
if(!('ycenter' in params)){
|
||||
params.ycenter = 50;
|
||||
}
|
||||
|
||||
bgImg.loadImage(params.src, params.xcenter, params.ycenter);
|
||||
}
|
||||
|
||||
var showBackgroundWidget = true;
|
||||
if(isMobile() && !mw.user.options.get('isekai-bgimg-visible-mobile', true)){
|
||||
showBackgroundWidget = false;
|
||||
} else if(!mw.user.options.get('isekai-bgimg-visible-desktop', true)) {
|
||||
showBackgroundWidget = false;
|
||||
}
|
||||
|
||||
if(showBackgroundWidget){
|
||||
var params = mw.config.get('isekaiBackgroundWidgetData');
|
||||
if(params && params.src){
|
||||
$('body').addClass('has-bgimg');
|
||||
if(window.requestAnimationFrame){
|
||||
window.requestAnimationFrame(function(){
|
||||
initBackgroundImage(params);
|
||||
});
|
||||
} else {
|
||||
setTimeout(function(){
|
||||
initBackgroundImage(params);
|
||||
}, 0);
|
||||
}
|
||||
} else {
|
||||
console.error(mw.message('isekai-background-widget-param-error').parse(), params);
|
||||
}
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,157 @@
|
||||
@globalRadius: 0.4em;
|
||||
@globalBgColor: rgba(255, 255, 255, 0.75);
|
||||
@headerBgColor: rgba(252, 252, 252, 0.75);
|
||||
@footerBgColor: rgba(149, 149, 149, 0.7);
|
||||
@globalBoxShadow: 0 3px 5px -1px rgba(0,0,0,.2),0 5px 8px 0 rgba(0,0,0,.14),0 1px 14px 0 rgba(0,0,0,.12);
|
||||
@globalTransition: opacity 250ms linear;
|
||||
@headerBlurDepth: 10px;
|
||||
|
||||
.has-bgimg {
|
||||
.isekai-bgimg {
|
||||
position: fixed;
|
||||
opacity: 0;
|
||||
transition: @globalTransition;
|
||||
|
||||
z-index: -2;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.isekai-navbar-bg {
|
||||
position: fixed;
|
||||
z-index: 99;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 3.125em;
|
||||
}
|
||||
|
||||
body {
|
||||
background: #f3f3f3;
|
||||
}
|
||||
|
||||
#mw-content-container {
|
||||
background: none;
|
||||
}
|
||||
|
||||
#mw-footer-container {
|
||||
position: relative;
|
||||
|
||||
&::before {
|
||||
background: @footerBgColor;
|
||||
}
|
||||
}
|
||||
|
||||
#mw-content {
|
||||
background: none;
|
||||
border: none;
|
||||
border-bottom-left-radius: @globalRadius;
|
||||
border-bottom-right-radius: @globalRadius;
|
||||
box-shadow: @globalBoxShadow;
|
||||
|
||||
&::before {
|
||||
background: @globalBgColor;
|
||||
}
|
||||
}
|
||||
|
||||
#mw-content-container::after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#mw-header-container {
|
||||
background: @headerBgColor;
|
||||
}
|
||||
|
||||
#simpleSearch {
|
||||
background: rgba(0, 0, 0, 0.07);
|
||||
border: solid 1px #a2a9b1;
|
||||
box-shadow: none;
|
||||
|
||||
#searchInput-container input[type="search"]:focus {
|
||||
background: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
#mw-content {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 850px) {
|
||||
.isekai-navbar-bg {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1099px) {
|
||||
#mw-content {
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
border: none;
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
|
||||
&::before {
|
||||
background: none;
|
||||
}
|
||||
|
||||
&::after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
#mw-content-block {
|
||||
background: none;
|
||||
}
|
||||
|
||||
#mw-content-container {
|
||||
&::before {
|
||||
background: @globalBgColor;
|
||||
}
|
||||
|
||||
&::after {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
#mw-header-nav-hack {
|
||||
background: rgba(255,255,255,0.5);
|
||||
}
|
||||
|
||||
#mw-header-hack {
|
||||
z-index: 99;
|
||||
}
|
||||
|
||||
.isekai-bgimg {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1100px) {
|
||||
#mw-site-navigation .sidebar-chunk,
|
||||
#mw-related-navigation .sidebar-chunk {
|
||||
position: relative;
|
||||
border: none;
|
||||
border-radius: @globalRadius;
|
||||
box-shadow: @globalBoxShadow;
|
||||
|
||||
&::before {
|
||||
background: @globalBgColor;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1099px) {
|
||||
#mw-site-navigation .sidebar-chunk,
|
||||
#mw-related-navigation .sidebar-chunk {
|
||||
&::after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.comment-body textarea, .comment-preview {
|
||||
background: @globalBgColor;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,66 @@
|
||||
$(function(){
|
||||
function isMobile(){
|
||||
var userAgentInfo = navigator.userAgent;
|
||||
var mobileAgents = ["Android", "iPhone",
|
||||
"SymbianOS", "Windows Phone",
|
||||
"iPad", "iPod"];
|
||||
var flag = true;
|
||||
for(var i = 0; i < mobileAgents.length; i ++){
|
||||
if (userAgentInfo.indexOf(mobileAgents[i]) != -1) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
function initBackgroundImage(params){
|
||||
let bgImg = new isekai.BgImage();
|
||||
|
||||
let bgImgElement = $('body').append('<div class="isekai-bgimg"></div>').find('div.isekai-bgimg:last');
|
||||
|
||||
bgImg.addViewport(bgImgElement);
|
||||
|
||||
bgImg.addBlurBackground($('#mw-panel .portal'));
|
||||
bgImg.addBlurBackground($('#p-personal'));
|
||||
bgImg.addBlurBackground($('#footer'));
|
||||
bgImg.addBlurBackground($('#left-navigation'));
|
||||
bgImg.addBlurBackground($('#right-navigation'));
|
||||
bgImg.addBlurBackground($('#content'));
|
||||
|
||||
if(!('xcenter' in params)){
|
||||
params.xcenter = 50;
|
||||
}
|
||||
if(!('ycenter' in params)){
|
||||
params.ycenter = 50;
|
||||
}
|
||||
|
||||
bgImg.loadImage(params.src, params.xcenter, params.ycenter);
|
||||
}
|
||||
|
||||
var showBackgroundWidget = true;
|
||||
if(isMobile() && !mw.user.options.get('isekai-bgimg-visible-mobile', true)){
|
||||
showBackgroundWidget = false;
|
||||
} else if(!mw.user.options.get('isekai-bgimg-visible-desktop', true)) {
|
||||
showBackgroundWidget = false;
|
||||
}
|
||||
|
||||
|
||||
|
||||
if(showBackgroundWidget){
|
||||
var params = mw.config.get('isekaiBackgroundWidgetData');
|
||||
if(params && params.src){
|
||||
$('body').addClass('has-bgimg');
|
||||
if(window.requestAnimationFrame){
|
||||
window.requestAnimationFrame(function(){
|
||||
initBackgroundImage(params);
|
||||
});
|
||||
} else {
|
||||
setTimeout(function(){
|
||||
initBackgroundImage(params);
|
||||
}, 0);
|
||||
}
|
||||
} else {
|
||||
console.log(mw.message('isekai-background-widget-param-error').parse(), params);
|
||||
}
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,83 @@
|
||||
@globalRadius: 0.4em;
|
||||
@globalBgColor: rgba(255, 255, 255, 0.75);
|
||||
@headerBgColor: rgba(252, 252, 252, 0.6);
|
||||
@footerBgColor: rgba(149, 149, 149, 0.7);
|
||||
@globalBoxShadow: 0 3px 5px -1px rgba(0,0,0,.2),0 5px 8px 0 rgba(0,0,0,.14),0 1px 14px 0 rgba(0,0,0,.12);
|
||||
@globalTransition: opacity 250ms linear;
|
||||
@headerBlurDepth: 10px;
|
||||
|
||||
.has-bgimg {
|
||||
.isekai-bgimg {
|
||||
position: fixed;
|
||||
opacity: 0;
|
||||
transition: @globalTransition;
|
||||
|
||||
z-index: -2;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
#mw-panel {
|
||||
.portal {
|
||||
position: relative;
|
||||
margin: 0;
|
||||
padding-right: 0.6em;
|
||||
padding-left: 0.7em;
|
||||
&::before {
|
||||
background-color: @headerBgColor;
|
||||
}
|
||||
|
||||
h3 {
|
||||
color: #222;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#p-personal,
|
||||
#left-navigation,
|
||||
#right-navigation {
|
||||
&::before {
|
||||
background-color: @headerBgColor;
|
||||
}
|
||||
}
|
||||
|
||||
#left-navigation,
|
||||
#right-navigation {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#mw-page-base {
|
||||
background: none;
|
||||
}
|
||||
|
||||
#content {
|
||||
background: transparent;
|
||||
position: relative;
|
||||
|
||||
&::before {
|
||||
background-color: @globalBgColor;
|
||||
}
|
||||
}
|
||||
|
||||
#footer {
|
||||
position: relative;
|
||||
|
||||
&::before {
|
||||
background-color: @footerBgColor;
|
||||
}
|
||||
|
||||
ul li {
|
||||
color: #fff;
|
||||
|
||||
a {
|
||||
color: #ccddff;
|
||||
|
||||
&:visited {
|
||||
color: #ccddff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,595 @@
|
||||
(function (global, factory) {
|
||||
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
|
||||
typeof define === 'function' && define.amd ? define(['exports'], factory) :
|
||||
(global = global || self, factory(global.StackBlur = {}));
|
||||
}(this, (function (exports) { 'use strict';
|
||||
|
||||
function _typeof(obj) {
|
||||
"@babel/helpers - typeof";
|
||||
|
||||
if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
|
||||
_typeof = function (obj) {
|
||||
return typeof obj;
|
||||
};
|
||||
} else {
|
||||
_typeof = function (obj) {
|
||||
return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
|
||||
};
|
||||
}
|
||||
|
||||
return _typeof(obj);
|
||||
}
|
||||
|
||||
function _classCallCheck(instance, Constructor) {
|
||||
if (!(instance instanceof Constructor)) {
|
||||
throw new TypeError("Cannot call a class as a function");
|
||||
}
|
||||
}
|
||||
|
||||
/* eslint-disable no-bitwise, unicorn/prefer-query-selector */
|
||||
|
||||
/**
|
||||
* StackBlur - a fast almost Gaussian Blur For Canvas
|
||||
*
|
||||
* In case you find this class useful - especially in commercial projects -
|
||||
* I am not totally unhappy for a small donation to my PayPal account
|
||||
* mario@quasimondo.de
|
||||
*
|
||||
* Or support me on flattr:
|
||||
* {@link https://flattr.com/thing/72791/StackBlur-a-fast-almost-Gaussian-Blur-Effect-for-CanvasJavascript}.
|
||||
*
|
||||
* @module StackBlur
|
||||
* @author Mario Klingemann
|
||||
* Contact: mario@quasimondo.com
|
||||
* Website: {@link http://www.quasimondo.com/StackBlurForCanvas/StackBlurDemo.html}
|
||||
* Twitter: @quasimondo
|
||||
*
|
||||
* @copyright (c) 2010 Mario Klingemann
|
||||
*
|
||||
* Permission is hereby granted, free of charge, to any person
|
||||
* obtaining a copy of this software and associated documentation
|
||||
* files (the "Software"), to deal in the Software without
|
||||
* restriction, including without limitation the rights to use,
|
||||
* copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
* copies of the Software, and to permit persons to whom the
|
||||
* Software is furnished to do so, subject to the following
|
||||
* conditions:
|
||||
*
|
||||
* The above copyright notice and this permission notice shall be
|
||||
* included in all copies or substantial portions of the Software.
|
||||
*
|
||||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
||||
* EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
|
||||
* OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
||||
* NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
|
||||
* HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
|
||||
* WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
|
||||
* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
|
||||
* OTHER DEALINGS IN THE SOFTWARE.
|
||||
*/
|
||||
|
||||
/* eslint-disable max-len */
|
||||
var mulTable = [512, 512, 456, 512, 328, 456, 335, 512, 405, 328, 271, 456, 388, 335, 292, 512, 454, 405, 364, 328, 298, 271, 496, 456, 420, 388, 360, 335, 312, 292, 273, 512, 482, 454, 428, 405, 383, 364, 345, 328, 312, 298, 284, 271, 259, 496, 475, 456, 437, 420, 404, 388, 374, 360, 347, 335, 323, 312, 302, 292, 282, 273, 265, 512, 497, 482, 468, 454, 441, 428, 417, 405, 394, 383, 373, 364, 354, 345, 337, 328, 320, 312, 305, 298, 291, 284, 278, 271, 265, 259, 507, 496, 485, 475, 465, 456, 446, 437, 428, 420, 412, 404, 396, 388, 381, 374, 367, 360, 354, 347, 341, 335, 329, 323, 318, 312, 307, 302, 297, 292, 287, 282, 278, 273, 269, 265, 261, 512, 505, 497, 489, 482, 475, 468, 461, 454, 447, 441, 435, 428, 422, 417, 411, 405, 399, 394, 389, 383, 378, 373, 368, 364, 359, 354, 350, 345, 341, 337, 332, 328, 324, 320, 316, 312, 309, 305, 301, 298, 294, 291, 287, 284, 281, 278, 274, 271, 268, 265, 262, 259, 257, 507, 501, 496, 491, 485, 480, 475, 470, 465, 460, 456, 451, 446, 442, 437, 433, 428, 424, 420, 416, 412, 408, 404, 400, 396, 392, 388, 385, 381, 377, 374, 370, 367, 363, 360, 357, 354, 350, 347, 344, 341, 338, 335, 332, 329, 326, 323, 320, 318, 315, 312, 310, 307, 304, 302, 299, 297, 294, 292, 289, 287, 285, 282, 280, 278, 275, 273, 271, 269, 267, 265, 263, 261, 259];
|
||||
var shgTable = [9, 11, 12, 13, 13, 14, 14, 15, 15, 15, 15, 16, 16, 16, 16, 17, 17, 17, 17, 17, 17, 17, 18, 18, 18, 18, 18, 18, 18, 18, 18, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24];
|
||||
/* eslint-enable max-len */
|
||||
|
||||
/**
|
||||
* @param {string|HTMLImageElement} img
|
||||
* @param {string|HTMLCanvasElement} canvas
|
||||
* @param {Float} radius
|
||||
* @param {boolean} blurAlphaChannel
|
||||
* @returns {undefined}
|
||||
*/
|
||||
|
||||
function processImage(img, canvas, radius, blurAlphaChannel) {
|
||||
if (typeof img === 'string') {
|
||||
img = document.getElementById(img);
|
||||
}
|
||||
|
||||
if (!img || !('naturalWidth' in img)) {
|
||||
return;
|
||||
}
|
||||
|
||||
var w = img.naturalWidth;
|
||||
var h = img.naturalHeight;
|
||||
|
||||
if (typeof canvas === 'string') {
|
||||
canvas = document.getElementById(canvas);
|
||||
}
|
||||
|
||||
if (!canvas || !('getContext' in canvas)) {
|
||||
return;
|
||||
}
|
||||
|
||||
canvas.style.width = w + 'px';
|
||||
canvas.style.height = h + 'px';
|
||||
canvas.width = w;
|
||||
canvas.height = h;
|
||||
var context = canvas.getContext('2d');
|
||||
context.clearRect(0, 0, w, h);
|
||||
context.drawImage(img, 0, 0);
|
||||
|
||||
if (isNaN(radius) || radius < 1) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (blurAlphaChannel) {
|
||||
processCanvasRGBA(canvas, 0, 0, w, h, radius);
|
||||
} else {
|
||||
processCanvasRGB(canvas, 0, 0, w, h, radius);
|
||||
}
|
||||
}
|
||||
/**
|
||||
* @param {string|HTMLCanvasElement} canvas
|
||||
* @param {Integer} topX
|
||||
* @param {Integer} topY
|
||||
* @param {Integer} width
|
||||
* @param {Integer} height
|
||||
* @throws {Error|TypeError}
|
||||
* @returns {ImageData} See {@link https://html.spec.whatwg.org/multipage/canvas.html#imagedata}
|
||||
*/
|
||||
|
||||
|
||||
function getImageDataFromCanvas(canvas, topX, topY, width, height) {
|
||||
if (typeof canvas === 'string') {
|
||||
canvas = document.getElementById(canvas);
|
||||
}
|
||||
|
||||
if (!canvas || _typeof(canvas) !== 'object' || !('getContext' in canvas)) {
|
||||
throw new TypeError('Expecting canvas with `getContext` method ' + 'in processCanvasRGB(A) calls!');
|
||||
}
|
||||
|
||||
var context = canvas.getContext('2d');
|
||||
|
||||
try {
|
||||
return context.getImageData(topX, topY, width, height);
|
||||
} catch (e) {
|
||||
throw new Error('unable to access image data: ' + e);
|
||||
}
|
||||
}
|
||||
/**
|
||||
* @param {HTMLCanvasElement} canvas
|
||||
* @param {Integer} topX
|
||||
* @param {Integer} topY
|
||||
* @param {Integer} width
|
||||
* @param {Integer} height
|
||||
* @param {Float} radius
|
||||
* @returns {undefined}
|
||||
*/
|
||||
|
||||
|
||||
function processCanvasRGBA(canvas, topX, topY, width, height, radius) {
|
||||
if (isNaN(radius) || radius < 1) {
|
||||
return;
|
||||
}
|
||||
|
||||
radius |= 0;
|
||||
var imageData = getImageDataFromCanvas(canvas, topX, topY, width, height);
|
||||
imageData = processImageDataRGBA(imageData, topX, topY, width, height, radius);
|
||||
canvas.getContext('2d').putImageData(imageData, topX, topY);
|
||||
}
|
||||
/**
|
||||
* @param {ImageData} imageData
|
||||
* @param {Integer} topX
|
||||
* @param {Integer} topY
|
||||
* @param {Integer} width
|
||||
* @param {Integer} height
|
||||
* @param {Float} radius
|
||||
* @returns {ImageData}
|
||||
*/
|
||||
|
||||
|
||||
function processImageDataRGBA(imageData, topX, topY, width, height, radius) {
|
||||
var pixels = imageData.data;
|
||||
var x, y, i, p, yp, yi, yw, rSum, gSum, bSum, aSum, rOutSum, gOutSum, bOutSum, aOutSum, rInSum, gInSum, bInSum, aInSum, pr, pg, pb, pa, rbs;
|
||||
var div = 2 * radius + 1; // const w4 = width << 2;
|
||||
|
||||
var widthMinus1 = width - 1;
|
||||
var heightMinus1 = height - 1;
|
||||
var radiusPlus1 = radius + 1;
|
||||
var sumFactor = radiusPlus1 * (radiusPlus1 + 1) / 2;
|
||||
var stackStart = new BlurStack();
|
||||
var stack = stackStart;
|
||||
var stackEnd;
|
||||
|
||||
for (i = 1; i < div; i++) {
|
||||
stack = stack.next = new BlurStack();
|
||||
|
||||
if (i === radiusPlus1) {
|
||||
stackEnd = stack;
|
||||
}
|
||||
}
|
||||
|
||||
stack.next = stackStart;
|
||||
var stackIn = null;
|
||||
var stackOut = null;
|
||||
yw = yi = 0;
|
||||
var mulSum = mulTable[radius];
|
||||
var shgSum = shgTable[radius];
|
||||
|
||||
for (y = 0; y < height; y++) {
|
||||
rInSum = gInSum = bInSum = aInSum = rSum = gSum = bSum = aSum = 0;
|
||||
rOutSum = radiusPlus1 * (pr = pixels[yi]);
|
||||
gOutSum = radiusPlus1 * (pg = pixels[yi + 1]);
|
||||
bOutSum = radiusPlus1 * (pb = pixels[yi + 2]);
|
||||
aOutSum = radiusPlus1 * (pa = pixels[yi + 3]);
|
||||
rSum += sumFactor * pr;
|
||||
gSum += sumFactor * pg;
|
||||
bSum += sumFactor * pb;
|
||||
aSum += sumFactor * pa;
|
||||
stack = stackStart;
|
||||
|
||||
for (i = 0; i < radiusPlus1; i++) {
|
||||
stack.r = pr;
|
||||
stack.g = pg;
|
||||
stack.b = pb;
|
||||
stack.a = pa;
|
||||
stack = stack.next;
|
||||
}
|
||||
|
||||
for (i = 1; i < radiusPlus1; i++) {
|
||||
p = yi + ((widthMinus1 < i ? widthMinus1 : i) << 2);
|
||||
rSum += (stack.r = pr = pixels[p]) * (rbs = radiusPlus1 - i);
|
||||
gSum += (stack.g = pg = pixels[p + 1]) * rbs;
|
||||
bSum += (stack.b = pb = pixels[p + 2]) * rbs;
|
||||
aSum += (stack.a = pa = pixels[p + 3]) * rbs;
|
||||
rInSum += pr;
|
||||
gInSum += pg;
|
||||
bInSum += pb;
|
||||
aInSum += pa;
|
||||
stack = stack.next;
|
||||
}
|
||||
|
||||
stackIn = stackStart;
|
||||
stackOut = stackEnd;
|
||||
|
||||
for (x = 0; x < width; x++) {
|
||||
pixels[yi + 3] = pa = aSum * mulSum >> shgSum;
|
||||
|
||||
if (pa !== 0) {
|
||||
pa = 255 / pa;
|
||||
pixels[yi] = (rSum * mulSum >> shgSum) * pa;
|
||||
pixels[yi + 1] = (gSum * mulSum >> shgSum) * pa;
|
||||
pixels[yi + 2] = (bSum * mulSum >> shgSum) * pa;
|
||||
} else {
|
||||
pixels[yi] = pixels[yi + 1] = pixels[yi + 2] = 0;
|
||||
}
|
||||
|
||||
rSum -= rOutSum;
|
||||
gSum -= gOutSum;
|
||||
bSum -= bOutSum;
|
||||
aSum -= aOutSum;
|
||||
rOutSum -= stackIn.r;
|
||||
gOutSum -= stackIn.g;
|
||||
bOutSum -= stackIn.b;
|
||||
aOutSum -= stackIn.a;
|
||||
p = yw + ((p = x + radius + 1) < widthMinus1 ? p : widthMinus1) << 2;
|
||||
rInSum += stackIn.r = pixels[p];
|
||||
gInSum += stackIn.g = pixels[p + 1];
|
||||
bInSum += stackIn.b = pixels[p + 2];
|
||||
aInSum += stackIn.a = pixels[p + 3];
|
||||
rSum += rInSum;
|
||||
gSum += gInSum;
|
||||
bSum += bInSum;
|
||||
aSum += aInSum;
|
||||
stackIn = stackIn.next;
|
||||
rOutSum += pr = stackOut.r;
|
||||
gOutSum += pg = stackOut.g;
|
||||
bOutSum += pb = stackOut.b;
|
||||
aOutSum += pa = stackOut.a;
|
||||
rInSum -= pr;
|
||||
gInSum -= pg;
|
||||
bInSum -= pb;
|
||||
aInSum -= pa;
|
||||
stackOut = stackOut.next;
|
||||
yi += 4;
|
||||
}
|
||||
|
||||
yw += width;
|
||||
}
|
||||
|
||||
for (x = 0; x < width; x++) {
|
||||
gInSum = bInSum = aInSum = rInSum = gSum = bSum = aSum = rSum = 0;
|
||||
yi = x << 2;
|
||||
rOutSum = radiusPlus1 * (pr = pixels[yi]);
|
||||
gOutSum = radiusPlus1 * (pg = pixels[yi + 1]);
|
||||
bOutSum = radiusPlus1 * (pb = pixels[yi + 2]);
|
||||
aOutSum = radiusPlus1 * (pa = pixels[yi + 3]);
|
||||
rSum += sumFactor * pr;
|
||||
gSum += sumFactor * pg;
|
||||
bSum += sumFactor * pb;
|
||||
aSum += sumFactor * pa;
|
||||
stack = stackStart;
|
||||
|
||||
for (i = 0; i < radiusPlus1; i++) {
|
||||
stack.r = pr;
|
||||
stack.g = pg;
|
||||
stack.b = pb;
|
||||
stack.a = pa;
|
||||
stack = stack.next;
|
||||
}
|
||||
|
||||
yp = width;
|
||||
|
||||
for (i = 1; i <= radius; i++) {
|
||||
yi = yp + x << 2;
|
||||
rSum += (stack.r = pr = pixels[yi]) * (rbs = radiusPlus1 - i);
|
||||
gSum += (stack.g = pg = pixels[yi + 1]) * rbs;
|
||||
bSum += (stack.b = pb = pixels[yi + 2]) * rbs;
|
||||
aSum += (stack.a = pa = pixels[yi + 3]) * rbs;
|
||||
rInSum += pr;
|
||||
gInSum += pg;
|
||||
bInSum += pb;
|
||||
aInSum += pa;
|
||||
stack = stack.next;
|
||||
|
||||
if (i < heightMinus1) {
|
||||
yp += width;
|
||||
}
|
||||
}
|
||||
|
||||
yi = x;
|
||||
stackIn = stackStart;
|
||||
stackOut = stackEnd;
|
||||
|
||||
for (y = 0; y < height; y++) {
|
||||
p = yi << 2;
|
||||
pixels[p + 3] = pa = aSum * mulSum >> shgSum;
|
||||
|
||||
if (pa > 0) {
|
||||
pa = 255 / pa;
|
||||
pixels[p] = (rSum * mulSum >> shgSum) * pa;
|
||||
pixels[p + 1] = (gSum * mulSum >> shgSum) * pa;
|
||||
pixels[p + 2] = (bSum * mulSum >> shgSum) * pa;
|
||||
} else {
|
||||
pixels[p] = pixels[p + 1] = pixels[p + 2] = 0;
|
||||
}
|
||||
|
||||
rSum -= rOutSum;
|
||||
gSum -= gOutSum;
|
||||
bSum -= bOutSum;
|
||||
aSum -= aOutSum;
|
||||
rOutSum -= stackIn.r;
|
||||
gOutSum -= stackIn.g;
|
||||
bOutSum -= stackIn.b;
|
||||
aOutSum -= stackIn.a;
|
||||
p = x + ((p = y + radiusPlus1) < heightMinus1 ? p : heightMinus1) * width << 2;
|
||||
rSum += rInSum += stackIn.r = pixels[p];
|
||||
gSum += gInSum += stackIn.g = pixels[p + 1];
|
||||
bSum += bInSum += stackIn.b = pixels[p + 2];
|
||||
aSum += aInSum += stackIn.a = pixels[p + 3];
|
||||
stackIn = stackIn.next;
|
||||
rOutSum += pr = stackOut.r;
|
||||
gOutSum += pg = stackOut.g;
|
||||
bOutSum += pb = stackOut.b;
|
||||
aOutSum += pa = stackOut.a;
|
||||
rInSum -= pr;
|
||||
gInSum -= pg;
|
||||
bInSum -= pb;
|
||||
aInSum -= pa;
|
||||
stackOut = stackOut.next;
|
||||
yi += width;
|
||||
}
|
||||
}
|
||||
|
||||
return imageData;
|
||||
}
|
||||
/**
|
||||
* @param {HTMLCanvasElement} canvas
|
||||
* @param {Integer} topX
|
||||
* @param {Integer} topY
|
||||
* @param {Integer} width
|
||||
* @param {Integer} height
|
||||
* @param {Float} radius
|
||||
* @returns {undefined}
|
||||
*/
|
||||
|
||||
|
||||
function processCanvasRGB(canvas, topX, topY, width, height, radius) {
|
||||
if (isNaN(radius) || radius < 1) {
|
||||
return;
|
||||
}
|
||||
|
||||
radius |= 0;
|
||||
var imageData = getImageDataFromCanvas(canvas, topX, topY, width, height);
|
||||
imageData = processImageDataRGB(imageData, topX, topY, width, height, radius);
|
||||
canvas.getContext('2d').putImageData(imageData, topX, topY);
|
||||
}
|
||||
/**
|
||||
* @param {ImageData} imageData
|
||||
* @param {Integer} topX
|
||||
* @param {Integer} topY
|
||||
* @param {Integer} width
|
||||
* @param {Integer} height
|
||||
* @param {Float} radius
|
||||
* @returns {ImageData}
|
||||
*/
|
||||
|
||||
|
||||
function processImageDataRGB(imageData, topX, topY, width, height, radius) {
|
||||
var pixels = imageData.data;
|
||||
var x, y, i, p, yp, yi, yw, rSum, gSum, bSum, rOutSum, gOutSum, bOutSum, rInSum, gInSum, bInSum, pr, pg, pb, rbs;
|
||||
var div = 2 * radius + 1; // const w4 = width << 2;
|
||||
|
||||
var widthMinus1 = width - 1;
|
||||
var heightMinus1 = height - 1;
|
||||
var radiusPlus1 = radius + 1;
|
||||
var sumFactor = radiusPlus1 * (radiusPlus1 + 1) / 2;
|
||||
var stackStart = new BlurStack();
|
||||
var stack = stackStart;
|
||||
var stackEnd;
|
||||
|
||||
for (i = 1; i < div; i++) {
|
||||
stack = stack.next = new BlurStack();
|
||||
|
||||
if (i === radiusPlus1) {
|
||||
stackEnd = stack;
|
||||
}
|
||||
}
|
||||
|
||||
stack.next = stackStart;
|
||||
var stackIn = null;
|
||||
var stackOut = null;
|
||||
yw = yi = 0;
|
||||
var mulSum = mulTable[radius];
|
||||
var shgSum = shgTable[radius];
|
||||
|
||||
for (y = 0; y < height; y++) {
|
||||
rInSum = gInSum = bInSum = rSum = gSum = bSum = 0;
|
||||
rOutSum = radiusPlus1 * (pr = pixels[yi]);
|
||||
gOutSum = radiusPlus1 * (pg = pixels[yi + 1]);
|
||||
bOutSum = radiusPlus1 * (pb = pixels[yi + 2]);
|
||||
rSum += sumFactor * pr;
|
||||
gSum += sumFactor * pg;
|
||||
bSum += sumFactor * pb;
|
||||
stack = stackStart;
|
||||
|
||||
for (i = 0; i < radiusPlus1; i++) {
|
||||
stack.r = pr;
|
||||
stack.g = pg;
|
||||
stack.b = pb;
|
||||
stack = stack.next;
|
||||
}
|
||||
|
||||
for (i = 1; i < radiusPlus1; i++) {
|
||||
p = yi + ((widthMinus1 < i ? widthMinus1 : i) << 2);
|
||||
rSum += (stack.r = pr = pixels[p]) * (rbs = radiusPlus1 - i);
|
||||
gSum += (stack.g = pg = pixels[p + 1]) * rbs;
|
||||
bSum += (stack.b = pb = pixels[p + 2]) * rbs;
|
||||
rInSum += pr;
|
||||
gInSum += pg;
|
||||
bInSum += pb;
|
||||
stack = stack.next;
|
||||
}
|
||||
|
||||
stackIn = stackStart;
|
||||
stackOut = stackEnd;
|
||||
|
||||
for (x = 0; x < width; x++) {
|
||||
pixels[yi] = rSum * mulSum >> shgSum;
|
||||
pixels[yi + 1] = gSum * mulSum >> shgSum;
|
||||
pixels[yi + 2] = bSum * mulSum >> shgSum;
|
||||
rSum -= rOutSum;
|
||||
gSum -= gOutSum;
|
||||
bSum -= bOutSum;
|
||||
rOutSum -= stackIn.r;
|
||||
gOutSum -= stackIn.g;
|
||||
bOutSum -= stackIn.b;
|
||||
p = yw + ((p = x + radius + 1) < widthMinus1 ? p : widthMinus1) << 2;
|
||||
rInSum += stackIn.r = pixels[p];
|
||||
gInSum += stackIn.g = pixels[p + 1];
|
||||
bInSum += stackIn.b = pixels[p + 2];
|
||||
rSum += rInSum;
|
||||
gSum += gInSum;
|
||||
bSum += bInSum;
|
||||
stackIn = stackIn.next;
|
||||
rOutSum += pr = stackOut.r;
|
||||
gOutSum += pg = stackOut.g;
|
||||
bOutSum += pb = stackOut.b;
|
||||
rInSum -= pr;
|
||||
gInSum -= pg;
|
||||
bInSum -= pb;
|
||||
stackOut = stackOut.next;
|
||||
yi += 4;
|
||||
}
|
||||
|
||||
yw += width;
|
||||
}
|
||||
|
||||
for (x = 0; x < width; x++) {
|
||||
gInSum = bInSum = rInSum = gSum = bSum = rSum = 0;
|
||||
yi = x << 2;
|
||||
rOutSum = radiusPlus1 * (pr = pixels[yi]);
|
||||
gOutSum = radiusPlus1 * (pg = pixels[yi + 1]);
|
||||
bOutSum = radiusPlus1 * (pb = pixels[yi + 2]);
|
||||
rSum += sumFactor * pr;
|
||||
gSum += sumFactor * pg;
|
||||
bSum += sumFactor * pb;
|
||||
stack = stackStart;
|
||||
|
||||
for (i = 0; i < radiusPlus1; i++) {
|
||||
stack.r = pr;
|
||||
stack.g = pg;
|
||||
stack.b = pb;
|
||||
stack = stack.next;
|
||||
}
|
||||
|
||||
yp = width;
|
||||
|
||||
for (i = 1; i <= radius; i++) {
|
||||
yi = yp + x << 2;
|
||||
rSum += (stack.r = pr = pixels[yi]) * (rbs = radiusPlus1 - i);
|
||||
gSum += (stack.g = pg = pixels[yi + 1]) * rbs;
|
||||
bSum += (stack.b = pb = pixels[yi + 2]) * rbs;
|
||||
rInSum += pr;
|
||||
gInSum += pg;
|
||||
bInSum += pb;
|
||||
stack = stack.next;
|
||||
|
||||
if (i < heightMinus1) {
|
||||
yp += width;
|
||||
}
|
||||
}
|
||||
|
||||
yi = x;
|
||||
stackIn = stackStart;
|
||||
stackOut = stackEnd;
|
||||
|
||||
for (y = 0; y < height; y++) {
|
||||
p = yi << 2;
|
||||
pixels[p] = rSum * mulSum >> shgSum;
|
||||
pixels[p + 1] = gSum * mulSum >> shgSum;
|
||||
pixels[p + 2] = bSum * mulSum >> shgSum;
|
||||
rSum -= rOutSum;
|
||||
gSum -= gOutSum;
|
||||
bSum -= bOutSum;
|
||||
rOutSum -= stackIn.r;
|
||||
gOutSum -= stackIn.g;
|
||||
bOutSum -= stackIn.b;
|
||||
p = x + ((p = y + radiusPlus1) < heightMinus1 ? p : heightMinus1) * width << 2;
|
||||
rSum += rInSum += stackIn.r = pixels[p];
|
||||
gSum += gInSum += stackIn.g = pixels[p + 1];
|
||||
bSum += bInSum += stackIn.b = pixels[p + 2];
|
||||
stackIn = stackIn.next;
|
||||
rOutSum += pr = stackOut.r;
|
||||
gOutSum += pg = stackOut.g;
|
||||
bOutSum += pb = stackOut.b;
|
||||
rInSum -= pr;
|
||||
gInSum -= pg;
|
||||
bInSum -= pb;
|
||||
stackOut = stackOut.next;
|
||||
yi += width;
|
||||
}
|
||||
}
|
||||
|
||||
return imageData;
|
||||
}
|
||||
/**
|
||||
*
|
||||
*/
|
||||
|
||||
|
||||
var BlurStack =
|
||||
/**
|
||||
* Set properties.
|
||||
*/
|
||||
function BlurStack() {
|
||||
_classCallCheck(this, BlurStack);
|
||||
|
||||
this.r = 0;
|
||||
this.g = 0;
|
||||
this.b = 0;
|
||||
this.a = 0;
|
||||
this.next = null;
|
||||
};
|
||||
|
||||
exports.BlurStack = BlurStack;
|
||||
exports.canvasRGB = processCanvasRGB;
|
||||
exports.canvasRGBA = processCanvasRGBA;
|
||||
exports.image = processImage;
|
||||
exports.imageDataRGB = processImageDataRGB;
|
||||
exports.imageDataRGBA = processImageDataRGBA;
|
||||
|
||||
Object.defineProperty(exports, '__esModule', { value: true });
|
||||
|
||||
})));
|
||||
Loading…
Reference in New Issue