natural-gallery-js
Advanced tools
Comparing version 2.5.0 to 2.6.0
@@ -1,9 +0,8 @@ | ||
import {Item} from './Item'; | ||
import {IItemFields} from './Item'; | ||
import {Header} from './filter/Header'; | ||
import {Category} from './filter/Category'; | ||
import {SearchFilter} from './filter/SearchFilter'; | ||
import {CategoryFilter} from './filter/CategoryFilter'; | ||
import {Utility} from './Utility'; | ||
import {Organizer} from './Organizer'; | ||
import { IItemFields, Item } from './Item'; | ||
import { Header } from './filter/Header'; | ||
import { Category } from './filter/Category'; | ||
import { SearchFilter } from './filter/SearchFilter'; | ||
import { CategoryFilter } from './filter/CategoryFilter'; | ||
import { Utility } from './Utility'; | ||
import { Organizer } from './Organizer'; | ||
@@ -30,2 +29,3 @@ export interface IGalleryOptions { | ||
labelImages: string; | ||
selectable: boolean; | ||
} | ||
@@ -57,4 +57,14 @@ | ||
labelImages: 'Images', | ||
selectable: false, | ||
}; | ||
private _events: any = {}; | ||
/** | ||
* Used to test the scroll direction | ||
* Avoid to load more images when scrolling up in the detection zone | ||
* @type {number} | ||
*/ | ||
private old_scroll_top = 0; | ||
private _id: string; | ||
@@ -104,24 +114,33 @@ | ||
private _selected: Item[] = []; | ||
/** | ||
* Initiate gallery | ||
* @param position | ||
* @param options | ||
* @param categories | ||
* @param rootElement | ||
* @param pswp | ||
* @param scrollElement | ||
* @param data | ||
*/ | ||
public constructor(gallery, pswp: HTMLElement) { | ||
public constructor(rootElement: HTMLElement, pswp: HTMLElement, data, scrollElement: HTMLElement = null) { | ||
this.pswpElement = pswp; | ||
// Complete options with default values | ||
for (var key in this.options) { | ||
if (typeof gallery.options[key] === 'undefined') { | ||
gallery.options[key] = this.options[key]; | ||
for (const key in this.options) { | ||
if (typeof data.options[key] === 'undefined') { | ||
data.options[key] = this.options[key]; | ||
} | ||
} | ||
this.options = gallery.options; | ||
this.categories = gallery.categories ? <Category[]> gallery.categories : []; | ||
this.rootElement = gallery.element ? gallery.element : <HTMLElement> document.getElementById(gallery.id); | ||
this.options = data.options; | ||
this.categories = data.categories ? <Category[]> data.categories : []; | ||
this.rootElement = rootElement; | ||
Utility.addClass(this.rootElement, 'natural-gallery'); | ||
// Events | ||
this._events = data.events ? data.events : {}; | ||
if (this._events.select) { | ||
this.options.selectable = true; | ||
} | ||
// header | ||
@@ -144,6 +163,10 @@ if (this.options.searchFilter || this.options.categoriesFilter || this.options.showCount) { | ||
if (gallery.images) { | ||
this.collection = gallery.images; | ||
if (data.images) { | ||
this.collection = data.images; | ||
} | ||
if (this.options.limit === 0) { | ||
this.bindScroll(scrollElement !== null ? scrollElement : document); | ||
} | ||
} | ||
@@ -174,7 +197,5 @@ | ||
clearTimeout(timer); | ||
timer = setTimeout( | ||
function() { | ||
self.resize(); | ||
}, | ||
100); | ||
timer = setTimeout(function() { | ||
self.resize(); | ||
}, 100); | ||
}); | ||
@@ -211,8 +232,6 @@ }); | ||
// Complete collection | ||
items.forEach( | ||
function(item) { | ||
item.id = this._collection.length; | ||
this._collection.push(new Item(<IItemFields> item, this)); | ||
}, | ||
this); | ||
items.forEach(function(item) { | ||
item.id = this._collection.length; | ||
this._collection.push(new Item(<IItemFields> item, this)); | ||
}, this); | ||
@@ -322,6 +341,6 @@ // Compute sizes | ||
let winHeight = window.outerHeight; | ||
let winHeight = window.innerHeight; | ||
let galleryVisibleHeight = winHeight - gallery.bodyElement.offsetTop; | ||
// ratio to be more close from reality average row height | ||
let nbRows = Math.floor(galleryVisibleHeight / (this.options.rowHeight * 0.7 )); | ||
let nbRows = Math.floor(galleryVisibleHeight / (this.options.rowHeight * 0.7)); | ||
@@ -332,3 +351,3 @@ return nbRows < this.options.minRowsAtStart ? this.options.minRowsAtStart : nbRows; | ||
/** | ||
* Check whetever we need to resize a gallery (only if parent container width changes) | ||
* Check if we need to resize a gallery (only if parent container width changes) | ||
* The keep full rows, it recomputes sizes with new dimension, and reset everything, then add the same number of row. | ||
@@ -374,2 +393,53 @@ * It results in not partial row. | ||
private bindScroll(element: HTMLElement | Document) { | ||
const scrollable = element; | ||
let wrapper = null; | ||
if (element instanceof Document) { | ||
wrapper = element.documentElement; | ||
} else { | ||
wrapper = element; | ||
} | ||
scrollable.addEventListener('scroll', () => { | ||
let endOfGalleryAt = this.rootElement.offsetTop + this.rootElement.offsetHeight; | ||
// Avoid to expand gallery if we are scrolling up | ||
let current_scroll_top = wrapper.scrollTop - (wrapper.clientTop || 0); | ||
let wrapperHeight = wrapper.clientHeight; | ||
let scroll_delta = current_scroll_top - this.old_scroll_top; | ||
this.old_scroll_top = current_scroll_top; | ||
// "enableMoreLoading" is a setting coming from the BE bloking / enabling dynamic loading of thumbnail | ||
if (scroll_delta > 0 && current_scroll_top + wrapperHeight >= endOfGalleryAt) { | ||
// When scrolling only add a row at once | ||
this.addElements(1); | ||
} | ||
}); | ||
} | ||
public select(item: Item) { | ||
const index = this._selected.indexOf(item); | ||
if (index === -1) { | ||
this._selected.push(item); | ||
this._events.select(this._selected.map(i => i.fields)); | ||
} | ||
} | ||
public unselect(item: Item) { | ||
const index = this._selected.indexOf(item); | ||
if (index > -1) { | ||
this._selected.splice(index, 1); | ||
this._events.select(this._selected.map(i => i.fields)); | ||
} | ||
} | ||
public unselectAll() { | ||
for (let i = this._selected.length - 1; i >= 0; i--) { | ||
this._selected[i].toggleSelect(); | ||
} | ||
this._selected = []; | ||
} | ||
/** | ||
@@ -387,2 +457,6 @@ * Pseudo attribute, works like a "post-add-images". | ||
get events(): any { | ||
return this._events; | ||
} | ||
get id(): string { | ||
@@ -481,2 +555,1 @@ return this._id; | ||
} | ||
@@ -1,6 +0,7 @@ | ||
import {Gallery} from './Gallery'; | ||
import {Utility} from './Utility'; | ||
import { Gallery } from './Gallery'; | ||
import { Utility } from './Utility'; | ||
import * as PhotoSwipe from 'photoswipe'; | ||
import * as PhotoSwipeUI_Default from 'photoswipe/dist/photoswipe-ui-default'; | ||
// import * as PhotoSwipeUI_Default from 'photoswipe/dist/photoswipe-ui-default'; | ||
export interface IItemFields { | ||
@@ -54,2 +55,4 @@ id?: number; | ||
private selected = false; | ||
/** | ||
@@ -60,2 +63,4 @@ * Dom elements | ||
private image: HTMLElement; | ||
private selectBtn: HTMLElement; | ||
private _fields: IItemFields; | ||
@@ -66,4 +71,5 @@ /** | ||
*/ | ||
public constructor(private fields: IItemFields, private gallery: Gallery) { | ||
public constructor(fields: IItemFields, private gallery: Gallery) { | ||
this._fields = fields; | ||
this.id = fields.id; | ||
@@ -121,3 +127,3 @@ this.thumbnail = fields.thumbnail; | ||
link: null, | ||
linkTarget: null | ||
linkTarget: null, | ||
}; | ||
@@ -145,3 +151,7 @@ | ||
let label = null; | ||
if (this.title && ['true', 'hover'].indexOf(options.showLabels) > -1) { | ||
const showLabelValues = [ | ||
'true', | ||
'hover', | ||
]; | ||
if (this.title && showLabelValues.indexOf(options.showLabels) > -1) { | ||
label = true; | ||
@@ -170,2 +180,3 @@ } | ||
label = document.createElement('div'); | ||
label.classList.add('button'); | ||
@@ -178,3 +189,2 @@ } else if (!options.lightbox && label && !link) { | ||
// Pointer cursor is shown, but additionnal effect could be even better. | ||
} | ||
@@ -206,4 +216,26 @@ | ||
if (this.gallery.options.selectable) { | ||
this.selectBtn = document.createElement('div'); | ||
this.selectBtn.appendChild(Utility.getIcon('icon-select')); | ||
this.selectBtn.classList.add('selectBtn'); | ||
this.selectBtn.addEventListener('click', () => { | ||
this.toggleSelect(); | ||
}); | ||
this.element.appendChild(this.selectBtn); | ||
} | ||
} | ||
public toggleSelect() { | ||
this.selected = !this.selected; | ||
if (this.selected) { | ||
this.element.classList.add('selected'); | ||
this.gallery.select(this); | ||
} else { | ||
this.element.classList.remove('selected'); | ||
this.gallery.unselect(this); | ||
} | ||
} | ||
private getLinkElement() { | ||
@@ -214,6 +246,15 @@ let link = null; | ||
link = document.createElement('a'); | ||
link.setAttribute('href', this.link); | ||
Utility.addClass(link, 'link'); | ||
if (this.linkTarget) { | ||
link.setAttribute('target', this.linkTarget); | ||
if (this.gallery.events.link) { | ||
link.addEventListener('click', (ev) => { | ||
if (this.gallery.events.link.preventDefault) { | ||
ev.preventDefault(); | ||
} | ||
this.gallery.events.link.callback(this._fields); | ||
}); | ||
} else { | ||
link.setAttribute('href', this.link); | ||
Utility.addClass(link, 'link'); | ||
if (this.linkTarget) { | ||
link.setAttribute('target', this.linkTarget); | ||
} | ||
} | ||
@@ -244,11 +285,6 @@ } | ||
this.image.style.width = String(this.width + 'px'); | ||
this.image.style.height = String(this.height + 'px'); | ||
const self = this; | ||
window.setTimeout( | ||
function() { | ||
Utility.addClass(self.element, 'visible'); | ||
}, | ||
0); | ||
window.setTimeout(function() { | ||
Utility.addClass(self.element, 'visible'); | ||
}, 0); | ||
} | ||
@@ -259,7 +295,5 @@ | ||
Utility.removeClass(this.element, 'visible'); | ||
window.setTimeout( | ||
function() { | ||
Utility.addClass(self.element, 'visible'); | ||
}, | ||
0); | ||
window.setTimeout(function() { | ||
Utility.addClass(self.element, 'visible'); | ||
}, 0); | ||
} | ||
@@ -319,6 +353,7 @@ | ||
showHideOpacity: true, | ||
loop: false | ||
loop: false, | ||
}; | ||
let pswp = new PhotoSwipe(this.gallery.pswpElement, PhotoSwipeUI_Default, this.gallery.pswpContainer, options); | ||
// PhotoSwipeUI_Default | ||
let pswp = new PhotoSwipe(this.gallery.pswpElement, null, this.gallery.pswpContainer, options); | ||
this.gallery.pswpApi = pswp; | ||
@@ -332,3 +367,4 @@ pswp.init(); | ||
// Positive delta indicates 'go to next' action, we don't load more objects on looping back the gallery (same logic when scrolling) | ||
// Positive delta indicates 'go to next' action, we don't load more objects on looping back the gallery (same logic when | ||
// scrolling) | ||
if (delta > 0 && pswp.getCurrentIndex() === pswp.items.length - 1) { | ||
@@ -356,3 +392,3 @@ self.gallery.addElements(); | ||
h: this._eHeight, | ||
title: this._title | ||
title: this._title, | ||
}; | ||
@@ -381,7 +417,5 @@ } | ||
// Detect errored images and hide them smartly | ||
img.addEventListener( | ||
'error', | ||
function() { | ||
Utility.addClass(self.element, 'errored'); | ||
}); | ||
img.addEventListener('error', function() { | ||
Utility.addClass(self.element, 'errored'); | ||
}); | ||
@@ -533,3 +567,5 @@ return this.element; | ||
get fields(): IItemFields { | ||
return this._fields; | ||
} | ||
} | ||
{ | ||
"name": "natural-gallery-js", | ||
"version": "2.5.0", | ||
"version": "2.6.0", | ||
"description": "A lazy load, infinite scroll and natural layout list gallery", | ||
@@ -15,7 +15,14 @@ "author": "Samuel Baptista <samuel.baptista@ecodev.ch>", | ||
"homepage": "https://github.com/Ecodev/natural-gallery-js#readme", | ||
"main": "dist/natural-gallery.full.js", | ||
"module": "app/app.light.ts", | ||
"main": "dist/natural-gallery.js", | ||
"module": "dist/natural-gallery.js", | ||
"jsnext:main": "dist/natural-gallery.js", | ||
"types": "dist/index.d.ts", | ||
"typings": "dist/index.d.ts", | ||
"scripts": { | ||
"dev": "webpack --progress --colors --watch", | ||
"prod": "NODE_ENV='production' webpack; NODE_ENV='production' webpack --env.nodependencies" | ||
"watch": "webpack --progress --colors --watch --env.nodependencies", | ||
"dev": "webpack-dev-server --open", | ||
"light": "NODE_ENV='production' webpack --env.nodependencies", | ||
"light:watch": "NODE_ENV='production' webpack --env.nodependencies --watch", | ||
"full": "NODE_ENV='production' webpack", | ||
"build": "NODE_ENV='production' webpack; NODE_ENV='production' webpack --env.nodependencies" | ||
}, | ||
@@ -37,65 +44,68 @@ "keywords": [ | ||
"dependencies": { | ||
"photoswipe": "^4.1.1" | ||
"photoswipe": "^4.1.2" | ||
}, | ||
"devDependencies": { | ||
"autoprefixer": "^6.7.7", | ||
"awesome-typescript-loader": "^3.1.3", | ||
"autoprefixer": "^7.1.6", | ||
"awesome-typescript-loader": "^3.4.0", | ||
"babili-webpack-plugin": "^0.1.2", | ||
"bootstrap": "^3.3.6", | ||
"browser-sync": "^2.11.1", | ||
"browserify": "^13.0.0", | ||
"browserify": "^14.5.0", | ||
"browserify-typescript": "0.0.1", | ||
"css-loader": "^0.28.4", | ||
"del": "^2.0.2", | ||
"extract-text-webpack-plugin": "^2.1.2", | ||
"file-loader": "^0.11.2", | ||
"del": "^3.0.0", | ||
"dts-bundle": "^0.7.3", | ||
"extract-text-webpack-plugin": "^3.0.2", | ||
"file-loader": "^1.1.5", | ||
"gulp": "^3.9.1", | ||
"gulp-autoprefixer": "^3.1.0", | ||
"gulp-changed": "^1.3.0", | ||
"gulp-autoprefixer": "^4.0.0", | ||
"gulp-changed": "^3.1.1", | ||
"gulp-concat": "^2.6.0", | ||
"gulp-extend": "^0.2.0", | ||
"gulp-file": "^0.2.0", | ||
"gulp-file": "^0.3.0", | ||
"gulp-if": "^2.0.0", | ||
"gulp-jshint": "^1.12.0", | ||
"gulp-notify": "^2.2.0", | ||
"gulp-protractor": "^1.0.0", | ||
"gulp-jshint": "^2.0.4", | ||
"gulp-notify": "^3.0.0", | ||
"gulp-protractor": "^4.1.0", | ||
"gulp-rename": "^1.2.2", | ||
"gulp-sass": "^2.2.0", | ||
"gulp-sourcemaps": "^1.6.0", | ||
"gulp-sass": "^3.1.0", | ||
"gulp-sourcemaps": "^2.6.1", | ||
"gulp-streamify": "^1.0.2", | ||
"gulp-tslint": "^3.5.0", | ||
"gulp-tslint": "^8.1.2", | ||
"gulp-typescript": "^3.1.4", | ||
"gulp-uglify": "^1.5.2", | ||
"gulp-uglify": "^3.0.0", | ||
"gulp-util": "^3.0.7", | ||
"gulp-watch": "^4.3.5", | ||
"gulp-wrap": "^0.11.0", | ||
"gulp-wrap": "^0.13.0", | ||
"image-webpack-loader": "^3.3.1", | ||
"isparta": "^3.5.1", | ||
"isparta": "^4.0.0", | ||
"jasmine-core": "^2.3.4", | ||
"jshint": "^2.9.5", | ||
"jshint-stylish": "^2.0.1", | ||
"karma": "^0.13.14", | ||
"karma-chrome-launcher": "^0.2.1", | ||
"karma-coverage": "^0.5.3", | ||
"karma-firefox-launcher": "^0.1.6", | ||
"karma-jasmine": "^0.3.6", | ||
"karma": "^1.7.1", | ||
"karma-chrome-launcher": "^2.2.0", | ||
"karma-coverage": "^1.1.1", | ||
"karma-firefox-launcher": "^1.0.1", | ||
"karma-jasmine": "^1.1.0", | ||
"karma-phantomjs-launcher": "^1.0.0", | ||
"ms": "^0.7.1", | ||
"node-sass": "^4.5.3", | ||
"optimize-css-assets-webpack-plugin": "^2.0.0", | ||
"phantomjs-prebuilt": "^2.1.7", | ||
"ms": "^2.0.0", | ||
"node-sass": "^4.7.2", | ||
"optimize-css-assets-webpack-plugin": "^3.2.0", | ||
"phantomjs-prebuilt": "^2.1.16", | ||
"postcss-loader": "^2.0.6", | ||
"pretty-hrtime": "^1.0.1", | ||
"protractor": "^2.5.1", | ||
"run-sequence": "^1.1.4", | ||
"protractor": "^5.2.0", | ||
"run-sequence": "^2.2.0", | ||
"sass-loader": "^6.0.6", | ||
"source-map-loader": "^0.2.1", | ||
"style-loader": "^0.18.2", | ||
"tiny-lr": "^0.2.1", | ||
"tslint": "^2.5.1", | ||
"typescript": "^2.3.4", | ||
"uglifyify": "^3.0.1", | ||
"style-loader": "^0.19.0", | ||
"tiny-lr": "^1.0.5", | ||
"tslint": "^5.8.0", | ||
"typescript": "^2.6.1", | ||
"uglifyify": "^4.0.5", | ||
"vinyl-source-stream": "^1.1.0", | ||
"webpack": "^3.0.0" | ||
} | ||
"webpack": "^3.8.1", | ||
"webpack-dev-server": "^2.9.4" | ||
}, | ||
"peerDependencies": {} | ||
} |
{ | ||
"compilerOptions": { | ||
"target": "es2015", | ||
"lib": ["es2016", "dom"], | ||
"declaration": true, | ||
"target": "es5", | ||
"lib": ["es2017", "dom"], | ||
"noImplicitAny": false, | ||
@@ -6,0 +7,0 @@ "sourceMap": true, |
185
tslint.json
{ | ||
"rules": { | ||
"align": [true, | ||
"parameters", | ||
"arguments", | ||
"statements"], | ||
"class-name": true, | ||
"comment-format": [true, "check-space"], | ||
"curly": true, | ||
"eofline": true, | ||
"forin": true, | ||
"indent": [true, "spaces"], | ||
"interface-name": true, | ||
"jsdoc-format": true, | ||
"label-position": true, | ||
"member-access": true, | ||
"member-ordering": [true, | ||
"static-before-instance", | ||
"variables-before-functions" | ||
], | ||
"no-any": false, | ||
"no-arg": true, | ||
"no-bitwise": true, | ||
"no-conditional-assignment": true, | ||
"no-console": [true, | ||
"debug", | ||
"info", | ||
"time", | ||
"timeEnd", | ||
"trace" | ||
], | ||
"no-consecutive-blank-lines": true, | ||
"no-construct": true, | ||
"no-parameter-properties": false, | ||
"no-debugger": true, | ||
"no-duplicate-variable": true, | ||
"no-empty": true, | ||
"no-eval": true, | ||
"no-internal-module": false, | ||
"no-require-imports": false, | ||
"no-shadowed-variable": true, | ||
"no-string-literal": true, | ||
"no-switch-case-fall-through": true, | ||
"trailing-comma": [true, {"multiline": "never", "singleline": "never"}], | ||
"no-trailing-whitespace": true, | ||
"no-unused-expression": true, | ||
"no-use-before-declare": true, | ||
"no-var-keyword": true, | ||
"no-var-requires": false, | ||
"one-line": [true, | ||
"check-catch", | ||
"check-else", | ||
"check-open-brace", | ||
"check-whitespace" | ||
], | ||
"quotemark": [true, "single"], | ||
"radix": true, | ||
"semicolon": true, | ||
"object-literal-sort-keys": false, | ||
"switch-default": true, | ||
"triple-equals": [true, "allow-null-check"], | ||
"typedef": [false, | ||
"call-signature", | ||
"parameter", | ||
"property-declaration", | ||
"variable-declaration", | ||
"member-variable-declaration" | ||
], | ||
"typedef-whitespace": [true, { | ||
"call-signature": "nospace", | ||
"index-signature": "nospace", | ||
"parameter": "nospace", | ||
"property-declaration": "nospace", | ||
"variable-declaration": "nospace" | ||
}], | ||
"variable-name": false, | ||
"whitespace": [true, | ||
"check-branch", | ||
"check-decl", | ||
"check-operator", | ||
"check-module", | ||
"check-separator", | ||
"check-type", | ||
"check-typecast" | ||
] | ||
} | ||
"rules": { | ||
"class-name": true, | ||
"comment-format": [ | ||
true, | ||
"check-space" | ||
], | ||
"curly": true, | ||
"eofline": true, | ||
"forin": true, | ||
"indent": [ | ||
true, | ||
"spaces" | ||
], | ||
"interface-name": true, | ||
"jsdoc-format": true, | ||
"label-position": true, | ||
"member-access": true, | ||
"member-ordering": [ | ||
true, | ||
"static-before-instance", | ||
"variables-before-functions" | ||
], | ||
"no-any": false, | ||
"no-arg": true, | ||
"no-bitwise": true, | ||
"no-conditional-assignment": true, | ||
"no-console": [ | ||
true, | ||
"debug", | ||
"info", | ||
"time", | ||
"timeEnd", | ||
"trace" | ||
], | ||
"no-consecutive-blank-lines": true, | ||
"no-construct": true, | ||
"no-parameter-properties": false, | ||
"no-debugger": true, | ||
"no-duplicate-variable": true, | ||
"no-empty": true, | ||
"no-eval": true, | ||
"no-internal-module": false, | ||
"no-require-imports": false, | ||
"no-shadowed-variable": true, | ||
"no-string-literal": true, | ||
"no-switch-case-fall-through": true, | ||
"no-trailing-whitespace": true, | ||
"no-unused-expression": true, | ||
"no-use-before-declare": true, | ||
"no-var-keyword": true, | ||
"no-var-requires": false, | ||
"one-line": [ | ||
true, | ||
"check-catch", | ||
"check-else", | ||
"check-open-brace", | ||
"check-whitespace" | ||
], | ||
"quotemark": [ | ||
true, | ||
"single" | ||
], | ||
"radix": true, | ||
"semicolon": true, | ||
"object-literal-sort-keys": false, | ||
"switch-default": true, | ||
"triple-equals": [ | ||
true, | ||
"allow-null-check" | ||
], | ||
"typedef": [ | ||
false, | ||
"call-signature", | ||
"parameter", | ||
"property-declaration", | ||
"variable-declaration", | ||
"member-variable-declaration" | ||
], | ||
"typedef-whitespace": [ | ||
true, | ||
{ | ||
"call-signature": "nospace", | ||
"index-signature": "nospace", | ||
"parameter": "nospace", | ||
"property-declaration": "nospace", | ||
"variable-declaration": "nospace" | ||
} | ||
], | ||
"variable-name": false, | ||
"whitespace": [ | ||
true, | ||
"check-branch", | ||
"check-decl", | ||
"check-operator", | ||
"check-module", | ||
"check-separator", | ||
"check-type", | ||
"check-typecast" | ||
] | ||
} | ||
} |
@@ -7,2 +7,4 @@ const webpack = require('webpack'); | ||
const name = 'natural-gallery'; | ||
module.exports = function(env) { | ||
@@ -12,15 +14,13 @@ | ||
const dependencies = !(env && env.nodependencies === true); | ||
const name = 'natural-gallery'; | ||
let entry = {'app': './app/app.ts'}; | ||
let outName = name; | ||
if (dependencies) { | ||
entry = {'full': './app/full.ts'}; | ||
outName = name + '.full'; | ||
} | ||
const extractCSS = new ExtractTextPlugin("themes/natural.css"); | ||
const extractSASS = new ExtractTextPlugin(name + ".[name].css"); | ||
const extractSASS = new ExtractTextPlugin(outName + ".css"); | ||
let externals = {}; | ||
if (!dependencies) { | ||
externals = { | ||
'photoswipe': 'PhotoSwipe', | ||
'photoswipe/dist/photoswipe-ui-default': 'PhotoSwipeUI_Default' | ||
} | ||
} | ||
let plugins = [ | ||
@@ -40,2 +40,14 @@ extractCSS, | ||
let externals = {}; | ||
if (!dependencies) { | ||
plugins.push(new DtsBundlePlugin()); | ||
plugins.push(new webpack.WatchIgnorePlugin([ | ||
/\.d\.ts$/ | ||
])); | ||
externals = { | ||
'photoswipe': 'PhotoSwipe', | ||
'photoswipe/dist/photoswipe-ui-default': 'PhotoSwipeUI_Default' | ||
} | ||
} | ||
if (prod) { | ||
@@ -45,9 +57,2 @@ plugins.push(new BabiliPlugin()); | ||
const entry = {}; | ||
let entryName = 'light'; | ||
if (dependencies) { | ||
entryName = 'full'; | ||
} | ||
entry[entryName] = './app/app.' + entryName + '.ts'; | ||
return { | ||
@@ -57,3 +62,3 @@ entry: entry, | ||
path: __dirname + '/dist', | ||
filename: name + '.[name].js', | ||
filename: outName + '.js', | ||
library: "NaturalGallery", | ||
@@ -63,11 +68,11 @@ libraryTarget: 'umd', | ||
}, | ||
devtool: prod ? false : "source-map", | ||
devServer: { | ||
contentBase: './demo' | ||
}, | ||
devtool: prod ? false : "source-map", // 'inline-source-map' | ||
resolve: { | ||
extensions: [".ts", ".js"], | ||
}, | ||
plugins: plugins, | ||
externals: externals, | ||
module: { | ||
@@ -113,3 +118,3 @@ rules: [ | ||
{ | ||
loader : 'file-loader', | ||
loader: 'file-loader', | ||
options: { | ||
@@ -122,3 +127,5 @@ name: 'images/[name].[ext]' | ||
query: { | ||
progressive: true, | ||
mozjpeg: { | ||
progressive: true, | ||
}, | ||
pngquant: { | ||
@@ -129,3 +136,2 @@ quality: '65-90', | ||
interlaced: false, | ||
}, | ||
@@ -142,10 +148,20 @@ gifsicle: { | ||
}, | ||
} | ||
}; | ||
// When importing a module whose path matches one of the following, just | ||
// assume a corresponding global variable exists and use that instead. | ||
// This is important because it allows us to avoid bundling all of our | ||
// dependencies, which allows browsers to cache those libraries between builds. | ||
externals: externals | ||
function DtsBundlePlugin(name, main) { | ||
} | ||
} | ||
DtsBundlePlugin.prototype.apply = function(compiler) { | ||
compiler.plugin('done', function() { | ||
var dts = require('dts-bundle'); | ||
dts.bundle({ | ||
name: name, | ||
main: 'app/app.d.ts', | ||
out: '../dist/index.d.ts', | ||
removeSource: false, | ||
outputAsModuleFolder: true // to use npm in-package typings | ||
}); | ||
}); | ||
}; |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
710860
48
4137
61
Updatedphotoswipe@^4.1.2