@tomasvn/glightbox 0.0.0-stage → 3.3.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.editorconfig +16 -0
- package/.eslintrc.json +94 -0
- package/.github/FUNDING.yml +3 -0
- package/.github/ISSUE_TEMPLATE/bug_report.md +41 -0
- package/.github/ISSUE_TEMPLATE/feature_request.md +23 -0
- package/.github/stale.yml +21 -0
- package/.github/workflows/greetings.yml +13 -0
- package/.lando.yml +10 -0
- package/.prettierignore +1 -0
- package/.prettierrc.json +31 -0
- package/CHANGELOG.md +247 -0
- package/CONTRIBUTING.md +29 -0
- package/LICENSE.md +21 -0
- package/README.md +710 -2
- package/bower.json +29 -0
- package/development/jscompiler.js +84 -0
- package/development/notifications.js +15 -0
- package/development/package.js +116 -0
- package/development/postcss.js +63 -0
- package/development/watcher.js +105 -0
- package/dist/css/glightbox.css +939 -0
- package/dist/css/glightbox.min.css +1 -0
- package/dist/js/glightbox.js +3087 -0
- package/dist/js/glightbox.min.js +1 -0
- package/index.d.ts +570 -0
- package/package.json +55 -4
- package/src/js/.jshintrc +6 -0
- package/src/js/core/drag.js +219 -0
- package/src/js/core/keyboard-navigation.js +98 -0
- package/src/js/core/slide-parser.js +231 -0
- package/src/js/core/slide.js +245 -0
- package/src/js/core/touch-events.js +378 -0
- package/src/js/core/touch-navigation.js +287 -0
- package/src/js/core/zoom.js +156 -0
- package/src/js/glightbox.js +1341 -0
- package/src/js/slides/iframe.js +24 -0
- package/src/js/slides/image.js +56 -0
- package/src/js/slides/inline.js +71 -0
- package/src/js/slides/video.js +105 -0
- package/src/js/utils/helpers.js +541 -0
- package/src/postcss/glightbox.css +723 -0
package/bower.json
ADDED
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "glightbox",
|
|
3
|
+
"description": "JavaScript animation engine",
|
|
4
|
+
"main": "dist/js/glightbox.min.js",
|
|
5
|
+
"repository": {
|
|
6
|
+
"type": "git",
|
|
7
|
+
"url": "https://github.com/mcstudios/glightbox"
|
|
8
|
+
},
|
|
9
|
+
"keywords": [
|
|
10
|
+
"lightbox",
|
|
11
|
+
"javascript",
|
|
12
|
+
"gallery",
|
|
13
|
+
"popup"
|
|
14
|
+
],
|
|
15
|
+
"authors": [
|
|
16
|
+
"MC Studios <manuel@mcstudios.com.mx>"
|
|
17
|
+
],
|
|
18
|
+
"license": "MIT",
|
|
19
|
+
"homepage": "https://glightbox.mcstudios.com.mx",
|
|
20
|
+
"ignore": [
|
|
21
|
+
"**/.*",
|
|
22
|
+
"node_modules",
|
|
23
|
+
"bower_components",
|
|
24
|
+
"*.psd",
|
|
25
|
+
"demo",
|
|
26
|
+
"test",
|
|
27
|
+
"tests"
|
|
28
|
+
]
|
|
29
|
+
}
|
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
const { rollup } = require('rollup');
|
|
2
|
+
const babel = require('rollup-plugin-babel');
|
|
3
|
+
const resolve = require('rollup-plugin-node-resolve');
|
|
4
|
+
const commonjs = require('rollup-plugin-commonjs');
|
|
5
|
+
const path = require('path');
|
|
6
|
+
|
|
7
|
+
global.rollupCache = global.rollupCache || {};
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
function camelCase(str) {
|
|
11
|
+
return str.replace(/(?:^\w|[A-Z]|\b\w|[-_])/g, (letter, index) => {
|
|
12
|
+
return index == 0 ? letter.toLowerCase() : letter.toUpperCase();
|
|
13
|
+
}).replace(/\s+/g, '').replace(/[`~!@#$%^&*()_|+\-=?;:'",.<>\{\}\[\]\\\/]/gi, '');
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
function jscompiler(config) {
|
|
17
|
+
const {
|
|
18
|
+
file,
|
|
19
|
+
dest
|
|
20
|
+
} = config;
|
|
21
|
+
|
|
22
|
+
const fileName = path.basename(file);
|
|
23
|
+
const extension = path.extname(fileName);
|
|
24
|
+
const singleFileName = fileName.replace(extension, '');
|
|
25
|
+
const cache = global.rollupCache[fileName] ? global.rollupCache[fileName] : null;
|
|
26
|
+
const format = (config.hasOwnProperty('format') ? config.format : 'iife');
|
|
27
|
+
const strict = (config.hasOwnProperty('strict') ? config.strict : true);
|
|
28
|
+
const sourcemap = (config.hasOwnProperty('sourcemap') ? config.sourcemap : false);
|
|
29
|
+
const moduleID = (config.hasOwnProperty('moduleID') ? config.moduleID : false);
|
|
30
|
+
|
|
31
|
+
let name = (config.hasOwnProperty('name') ? config.name : camelCase(singleFileName));
|
|
32
|
+
let outPutFile = path.join(__dirname, '../', dest, fileName);
|
|
33
|
+
let customFileName = (config.hasOwnProperty('fileName') ? config.fileName : false);
|
|
34
|
+
|
|
35
|
+
if (customFileName) {
|
|
36
|
+
customFileName = customFileName.replace('{name}', singleFileName);
|
|
37
|
+
outPutFile = outPutFile.replace(fileName, customFileName);
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
return new Promise((res, rej) => {
|
|
41
|
+
rollup({
|
|
42
|
+
input: file,
|
|
43
|
+
cache: cache,
|
|
44
|
+
plugins: [
|
|
45
|
+
resolve({
|
|
46
|
+
mainFields: ['module', 'main'],
|
|
47
|
+
browser: true,
|
|
48
|
+
}),
|
|
49
|
+
commonjs(),
|
|
50
|
+
babel({
|
|
51
|
+
comments: false,
|
|
52
|
+
exclude: 'node_modules/**',
|
|
53
|
+
presets: [
|
|
54
|
+
['@babel/preset-env', {
|
|
55
|
+
modules: false
|
|
56
|
+
}]
|
|
57
|
+
]
|
|
58
|
+
}),
|
|
59
|
+
]
|
|
60
|
+
}).then((bundle) => {
|
|
61
|
+
global.rollupCache[fileName] = bundle.cache;
|
|
62
|
+
bundle.write({
|
|
63
|
+
file: outPutFile,
|
|
64
|
+
format: format, // amd, cjs, esm, iife, umd
|
|
65
|
+
strict: strict,
|
|
66
|
+
sourcemap: sourcemap,
|
|
67
|
+
name: (moduleID ? moduleID : name)
|
|
68
|
+
}).then(() => {
|
|
69
|
+
res(true);
|
|
70
|
+
}).catch(error => {
|
|
71
|
+
console.error(error)
|
|
72
|
+
rej(error);
|
|
73
|
+
});
|
|
74
|
+
|
|
75
|
+
return outPutFile;
|
|
76
|
+
|
|
77
|
+
}).catch(error => {
|
|
78
|
+
console.log(error)
|
|
79
|
+
throw new Error(error);
|
|
80
|
+
})
|
|
81
|
+
})
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
module.exports = jscompiler;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
const path = require('path');
|
|
2
|
+
const notifier = require('node-notifier');
|
|
3
|
+
|
|
4
|
+
function notify(title, body) {
|
|
5
|
+
const icon = path.join(__dirname, 'icon.png');
|
|
6
|
+
|
|
7
|
+
notifier.notify({
|
|
8
|
+
title: title,
|
|
9
|
+
message: body,
|
|
10
|
+
icon: icon
|
|
11
|
+
});
|
|
12
|
+
console.log(`${title}, ${body}`);
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
module.exports = notify;
|
|
@@ -0,0 +1,116 @@
|
|
|
1
|
+
const fs = require('fs');
|
|
2
|
+
const os = require('os');
|
|
3
|
+
const jetpack = require('fs-jetpack');
|
|
4
|
+
const path = require('path');
|
|
5
|
+
const archiver = require('archiver');
|
|
6
|
+
const args = process.argv.slice(2);
|
|
7
|
+
const folder = path.join(__dirname, '/..');
|
|
8
|
+
|
|
9
|
+
/**
|
|
10
|
+
* Realease new version
|
|
11
|
+
* calling
|
|
12
|
+
* node development/package.js versionhere
|
|
13
|
+
* then npm publish
|
|
14
|
+
*/
|
|
15
|
+
|
|
16
|
+
async function createFolder() {
|
|
17
|
+
jetpack.remove(path.join(folder, 'glightbox-master.zip'));
|
|
18
|
+
|
|
19
|
+
const tmpfolder = path.join(os.tmpdir(), 'glightbox-master');
|
|
20
|
+
const newVersion = args[0];
|
|
21
|
+
|
|
22
|
+
await updateFileVersion({
|
|
23
|
+
file: path.join(folder, 'index.html'),
|
|
24
|
+
search: /download\/(.*)\/glightbox/g,
|
|
25
|
+
replace: newVersion
|
|
26
|
+
});
|
|
27
|
+
|
|
28
|
+
await updateFileVersion({
|
|
29
|
+
file: path.join(folder, 'package.json'),
|
|
30
|
+
search: /"version":\s?"(.*)",/g,
|
|
31
|
+
replace: newVersion
|
|
32
|
+
});
|
|
33
|
+
|
|
34
|
+
await updateFileVersion({
|
|
35
|
+
file: path.join(folder, 'README.md'),
|
|
36
|
+
search: /v([0-9-.]+)/g,
|
|
37
|
+
replace: newVersion
|
|
38
|
+
});
|
|
39
|
+
|
|
40
|
+
await updateFileVersion({
|
|
41
|
+
file: path.join(folder, 'src/js/glightbox.js'),
|
|
42
|
+
search: /version\s?=\s?'(.*)';/g,
|
|
43
|
+
replace: newVersion
|
|
44
|
+
});
|
|
45
|
+
|
|
46
|
+
jetpack.copy(folder, tmpfolder, {
|
|
47
|
+
matching: [
|
|
48
|
+
'!node_modules',
|
|
49
|
+
'!node_modules/**/*',
|
|
50
|
+
'!.git',
|
|
51
|
+
'!.git/**/*',
|
|
52
|
+
'!.github',
|
|
53
|
+
'!.github/**/*',
|
|
54
|
+
'!.vscode',
|
|
55
|
+
'!.idea',
|
|
56
|
+
'!.idea/**/*',
|
|
57
|
+
'!.nova',
|
|
58
|
+
'!.nova/**/*',
|
|
59
|
+
'!icons.zip',
|
|
60
|
+
'!.vscode/**/*',
|
|
61
|
+
'!*.psd',
|
|
62
|
+
'!.DS_Store'
|
|
63
|
+
]
|
|
64
|
+
});
|
|
65
|
+
console.log('Created folder', `Created folder correctly`);
|
|
66
|
+
|
|
67
|
+
const zip = await createZip(tmpfolder).catch((error) => {
|
|
68
|
+
jetpack.remove(tmpfolder);
|
|
69
|
+
});
|
|
70
|
+
|
|
71
|
+
const folderName = path.basename(folder);
|
|
72
|
+
jetpack.remove(tmpfolder);
|
|
73
|
+
jetpack.move(zip, path.join(folder, folderName + '-master.zip'));
|
|
74
|
+
|
|
75
|
+
console.log('Done', `Packaging process ended correctly`);
|
|
76
|
+
}
|
|
77
|
+
createFolder();
|
|
78
|
+
|
|
79
|
+
async function createZip(folder) {
|
|
80
|
+
return new Promise((resolve, reject) => {
|
|
81
|
+
const name = folder + '.zip';
|
|
82
|
+
const output = fs.createWriteStream(name);
|
|
83
|
+
const archive = archiver('zip', { zlib: { level: 9 } });
|
|
84
|
+
|
|
85
|
+
output.on('close', () => {
|
|
86
|
+
console.log('Zipped', `zip archive was created correctly`);
|
|
87
|
+
resolve(name);
|
|
88
|
+
});
|
|
89
|
+
archive.on('error', (err) => {
|
|
90
|
+
console.log('Package Error', `The was an error creating the zip.`);
|
|
91
|
+
reject(err);
|
|
92
|
+
});
|
|
93
|
+
|
|
94
|
+
archive.pipe(output);
|
|
95
|
+
archive.directory(folder, false);
|
|
96
|
+
archive.finalize();
|
|
97
|
+
});
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
async function updateFileVersion(data) {
|
|
101
|
+
return new Promise((resolve, reject) => {
|
|
102
|
+
jetpack.readAsync(data.file).then((str) => {
|
|
103
|
+
let regexp = new RegExp(data.search);
|
|
104
|
+
|
|
105
|
+
while ((matches = regexp.exec(str)) !== null) {
|
|
106
|
+
let foundLine = matches[0];
|
|
107
|
+
let newLine = foundLine.replace(matches[1], data.replace);
|
|
108
|
+
str = str.replace(foundLine, newLine);
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
jetpack.writeAsync(data.file, str).then(() => {
|
|
112
|
+
resolve(data.file);
|
|
113
|
+
});
|
|
114
|
+
});
|
|
115
|
+
});
|
|
116
|
+
}
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
const postcss = require('postcss');
|
|
2
|
+
const cssnext = require('postcss-preset-env');
|
|
3
|
+
const cssnested = require('postcss-nested');
|
|
4
|
+
const cssmqpacker = require('css-mqpacker');
|
|
5
|
+
const cssprettify = require('postcss-prettify');
|
|
6
|
+
const cssclean = require('clean-css');
|
|
7
|
+
const path = require('path');
|
|
8
|
+
const fs = require('fs');
|
|
9
|
+
|
|
10
|
+
function postcssCompiler(config) {
|
|
11
|
+
const { file, dest, minify = true } = config;
|
|
12
|
+
const fileName = path.basename(file);
|
|
13
|
+
const from = path.join(__dirname, '../', file);
|
|
14
|
+
const to = path.join(__dirname, '../', dest, fileName);
|
|
15
|
+
const fileNameMin = path.extname(fileName);
|
|
16
|
+
const min = path.join(__dirname, '../', dest, fileName.replace(fileNameMin, `.min${fileNameMin}`));
|
|
17
|
+
const css = fs.readFileSync(from, 'utf8');
|
|
18
|
+
|
|
19
|
+
return new Promise((resolve, reject) => {
|
|
20
|
+
return postcss([
|
|
21
|
+
cssnested(),
|
|
22
|
+
cssnext({
|
|
23
|
+
stage: 0,
|
|
24
|
+
browsers: ['last 2 version'],
|
|
25
|
+
features: {
|
|
26
|
+
calc: false
|
|
27
|
+
}
|
|
28
|
+
}),
|
|
29
|
+
cssmqpacker({
|
|
30
|
+
sort: true
|
|
31
|
+
}),
|
|
32
|
+
cssprettify()
|
|
33
|
+
])
|
|
34
|
+
.process(css, {
|
|
35
|
+
from,
|
|
36
|
+
to
|
|
37
|
+
})
|
|
38
|
+
.then((result) => {
|
|
39
|
+
if (result && result.css) {
|
|
40
|
+
fs.writeFile(to, result.css, 'utf8', (err) => reject(err));
|
|
41
|
+
|
|
42
|
+
if (minify) {
|
|
43
|
+
const minified = new cssclean({}).minify(result.css);
|
|
44
|
+
fs.writeFile(min, minified.styles, 'utf8', (err) => reject(err));
|
|
45
|
+
|
|
46
|
+
if (result.map) {
|
|
47
|
+
fs.writeFile(to + '.map', result.map, 'utf8', (err) => reject(err));
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
resolve(to);
|
|
52
|
+
} else {
|
|
53
|
+
reject(result);
|
|
54
|
+
}
|
|
55
|
+
})
|
|
56
|
+
.catch((err) => {
|
|
57
|
+
console.log(err);
|
|
58
|
+
reject(err);
|
|
59
|
+
});
|
|
60
|
+
});
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
module.exports = postcssCompiler;
|
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
const fs = require('node:fs');
|
|
2
|
+
const chokidar = require('chokidar');
|
|
3
|
+
const path = require('node:path');
|
|
4
|
+
const jscompiler = require('./jscompiler');
|
|
5
|
+
const postcssCompiler = require('./postcss');
|
|
6
|
+
const terser = require('terser');
|
|
7
|
+
|
|
8
|
+
let config = {
|
|
9
|
+
js: {
|
|
10
|
+
src: 'src/js',
|
|
11
|
+
dest: 'dist/js',
|
|
12
|
+
},
|
|
13
|
+
css: {
|
|
14
|
+
src: 'src/postcss',
|
|
15
|
+
dest: 'dist/css',
|
|
16
|
+
}
|
|
17
|
+
};
|
|
18
|
+
|
|
19
|
+
/**
|
|
20
|
+
* Handle Javascript files
|
|
21
|
+
* compile the javascript files
|
|
22
|
+
* to es2015, minify and sync the files
|
|
23
|
+
*
|
|
24
|
+
* @param {string} file path
|
|
25
|
+
*/
|
|
26
|
+
async function handleJavascript(file) {
|
|
27
|
+
file = path.join(config.js.src, 'glightbox.js');
|
|
28
|
+
|
|
29
|
+
const name = path.basename(file);
|
|
30
|
+
|
|
31
|
+
const res = await jscompiler({
|
|
32
|
+
file,
|
|
33
|
+
dest: config.js.dest,
|
|
34
|
+
format: 'umd',
|
|
35
|
+
sourcemap: false,
|
|
36
|
+
moduleID: 'GLightbox'
|
|
37
|
+
}).catch(error => console.log(error));
|
|
38
|
+
|
|
39
|
+
if (!res) {
|
|
40
|
+
console.log('Build Error', `View logs for more info`);
|
|
41
|
+
console.log(res)
|
|
42
|
+
return false;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
const minName = name.replace('.js', '.min.js');
|
|
46
|
+
const processed = path.join(config.js.dest, name);
|
|
47
|
+
const code = fs.readFileSync(processed, 'utf8');
|
|
48
|
+
const minified = terser.minify(code);
|
|
49
|
+
const minifyPath = path.join(config.js.dest, minName);
|
|
50
|
+
fs.writeFileSync(minifyPath, minified.code);
|
|
51
|
+
|
|
52
|
+
console.log('Javascript Build', `Compiled and Minified ${name}`);
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
|
|
56
|
+
/**
|
|
57
|
+
* Handle Postcss files
|
|
58
|
+
* compile the css files
|
|
59
|
+
*
|
|
60
|
+
* @param {string} file path
|
|
61
|
+
*/
|
|
62
|
+
async function handlePostCSS(file) {
|
|
63
|
+
const name = path.basename(file);
|
|
64
|
+
const dest = config.css.dest;
|
|
65
|
+
|
|
66
|
+
let res = await postcssCompiler({
|
|
67
|
+
file,
|
|
68
|
+
dest,
|
|
69
|
+
minify: true
|
|
70
|
+
}).catch(error => console.log(error));
|
|
71
|
+
if (!res) {
|
|
72
|
+
return false;
|
|
73
|
+
}
|
|
74
|
+
console.log('PostCSS Build', `Compiled and Minified ${name}`);
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
|
|
78
|
+
|
|
79
|
+
/**
|
|
80
|
+
* Watcher
|
|
81
|
+
* what the files for the backedn
|
|
82
|
+
* this includes js and css files
|
|
83
|
+
*/
|
|
84
|
+
function filesWatcher() {
|
|
85
|
+
const watcher = chokidar.watch(['src'], {
|
|
86
|
+
ignored: ['.DS_Store', 'src/js/.jshintrc', 'src/js/.babelrc'],
|
|
87
|
+
persistent: true,
|
|
88
|
+
depth: 3,
|
|
89
|
+
awaitWriteFinish: {
|
|
90
|
+
stabilityThreshold: 500,
|
|
91
|
+
pollInterval: 500
|
|
92
|
+
},
|
|
93
|
+
});
|
|
94
|
+
|
|
95
|
+
watcher.on('change', path => {
|
|
96
|
+
if (path.endsWith('.js')) {
|
|
97
|
+
return handleJavascript(path);
|
|
98
|
+
}
|
|
99
|
+
if (path.endsWith('.css')) {
|
|
100
|
+
return handlePostCSS(path);
|
|
101
|
+
}
|
|
102
|
+
})
|
|
103
|
+
watcher.on('ready', () => console.log('Watching files', 'Initial scan complete. Ready for changes'))
|
|
104
|
+
}
|
|
105
|
+
filesWatcher();
|