Skip to content

Commit db9d1fb

Browse files
jedrzejchalubekjedrzejchalubek
committed
Stop sliding when only having 1 image? #158 
1 parent b6ff6ad commit db9d1fb

15 files changed

+224
-56
lines changed

‎dist/css/glide.theme.css

+6-10
Original file line numberDiff line numberDiff line change
@@ -21,8 +21,12 @@
2121
background-color: transparent;
2222
border: 2px solid rgba(255, 255, 255, 0.5);
2323
border-radius: 4px;
24-
-webkit-transition: border 300ms ease-in-out;
25-
transition: border 300ms ease-in-out;
24+
opacity: 1;
25+
-webkit-transition: opacity 150ms ease, border 300ms ease-in-out;
26+
transition: opacity 150ms ease, border 300ms ease-in-out;
27+
}
28+
.glide__arrow.disabled {
29+
opacity: 0.33;
2630
}
2731
.glide__arrow:focus {
2832
outline: none;
@@ -102,11 +106,3 @@
102106
border: 2px solid white;
103107
background-color: rgba(255, 255, 255, 0.5);
104108
}
105-
.glide--slider .glide__arrow {
106-
opacity: 1;
107-
-webkit-transition: opacity 150ms ease;
108-
transition: opacity 150ms ease;
109-
}
110-
.glide--slider .glide__arrow.disabled {
111-
opacity: 0.33;
112-
}

‎dist/css/glide.theme.min.css

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/glide.js

+65-9
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@ var Animation = function(Glide, Core) {
2828
* Animation constructor.
2929
*/
3030
function Animation() {
31+
3132
}
3233

3334
/**
@@ -37,6 +38,11 @@ var Animation = function(Glide, Core) {
3738
* @return {self}
3839
*/
3940
Animation.prototype.make = function(displacement) {
41+
// Do not run if we have only one slide.
42+
if (! Core.Run.canProcess()) {
43+
return Core.Arrows.disable();
44+
}
45+
4046
// Parse displacement to integer before use.
4147
offset = (typeof displacement !== 'undefined') ? parseInt(displacement) : 0;
4248

@@ -226,6 +232,7 @@ var Api = function(Glide, Core) {
226232
* Api constructor.
227233
*/
228234
function Api() {
235+
229236
}
230237

231238
/**
@@ -356,6 +363,8 @@ var Api = function(Glide, Core) {
356363
Core.Arrows.unbind();
357364
Core.Bullets.unbind();
358365

366+
Glide.destroyed = true;
367+
359368
delete Glide.slider;
360369
delete Glide.track;
361370
delete Glide.slides;
@@ -421,14 +430,18 @@ var Arrows = function(Glide, Core) {
421430

422431

423432
/**
424-
* Disable next/previous arrow.
433+
* Disable next/previous arrow and enable another.
425434
*
426435
* @param {String} type
427436
* @return {Void}
428437
*/
429438
Arrows.prototype.disable = function(type) {
430439
var classes = Glide.options.classes;
431440

441+
if (!type) {
442+
return this.disableBoth();
443+
}
444+
432445
this.items.filter('.' + classes['arrow' + Core.Helper.capitalise(type)])
433446
.unbind('click.glide touchstart.glide')
434447
.addClass(classes.disabled)
@@ -439,6 +452,17 @@ var Arrows = function(Glide, Core) {
439452
.removeClass(classes.disabled);
440453
};
441454

455+
/**
456+
* Disable both arrows.
457+
*
458+
* @return {Void}
459+
*/
460+
Arrows.prototype.disableBoth = function() {
461+
this.items
462+
.unbind('click.glide touchstart.glide')
463+
.addClass(Glide.options.classes.disabled);
464+
};
465+
442466

443467
/**
444468
* Show both arrows.
@@ -1049,12 +1073,14 @@ var Events = function(Glide, Core) {
10491073
Events.prototype.resize = function() {
10501074

10511075
$(window).on('resize.glide.' + Glide.uuid, Core.Helper.throttle(function() {
1052-
Core.Transition.jumping = true;
1053-
Glide.setup();
1054-
Core.Build.init();
1055-
Core.Run.make('=' + Glide.current, false);
1056-
Core.Run.play();
1057-
Core.Transition.jumping = false;
1076+
if(!Glide.destroyed) {
1077+
Core.Transition.jumping = true;
1078+
Glide.setup();
1079+
Core.Build.init();
1080+
Core.Run.make('=' + Glide.current, false);
1081+
Core.Run.play();
1082+
Core.Transition.jumping = false;
1083+
}
10581084
}, Glide.options.throttle));
10591085

10601086
};
@@ -1421,6 +1447,10 @@ var Run = function(Glide, Core) {
14211447

14221448
var that = this;
14231449

1450+
if (! this.canProcess()) {
1451+
return;
1452+
}
1453+
14241454
if (Glide.options.autoplay || this.running) {
14251455

14261456
if (typeof this.interval === 'undefined') {
@@ -1508,6 +1538,11 @@ var Run = function(Glide, Core) {
15081538
// Extract move steps.
15091539
this.steps = (move.substr(1)) ? move.substr(1) : 0;
15101540

1541+
// Do not run if we have only one slide.
1542+
if (! this.canProcess()) {
1543+
return this.stop();
1544+
}
1545+
15111546
// Stop autoplay until hoverpause is not set.
15121547
if (!Glide.options.hoverpause) {
15131548
this.pause();
@@ -1600,6 +1635,24 @@ var Run = function(Glide, Core) {
16001635

16011636
};
16021637

1638+
/**
1639+
* Stop slider from running.
1640+
*
1641+
* @return {void}
1642+
*/
1643+
Run.prototype.stop = function() {
1644+
this.pause();
1645+
};
1646+
1647+
/**
1648+
* Stop slider from running.
1649+
*
1650+
* @return {void}
1651+
*/
1652+
Run.prototype.canProcess = function() {
1653+
return Glide.slides.length > 1;
1654+
};
1655+
16031656
// Return class.
16041657
return new Run();
16051658

@@ -2043,6 +2096,9 @@ var Glide = function(element, options) {
20432096
this.collect();
20442097
this.setup();
20452098

2099+
// Mark the glide as not destroyed
2100+
this.destroyed = false;
2101+
20462102
// Call before init callback.
20472103
this.options.beforeInit({
20482104
index: this.current,
@@ -2060,11 +2116,11 @@ var Glide = function(element, options) {
20602116
Helper: Helper,
20612117
Translate: Translate,
20622118
Transition: Transition,
2119+
Arrows: Arrows,
2120+
Bullets: Bullets,
20632121
Run: Run,
20642122
Animation: Animation,
20652123
Clones: Clones,
2066-
Arrows: Arrows,
2067-
Bullets: Bullets,
20682124
Height: Height,
20692125
Build: Build,
20702126
Events: Events,

‎dist/glide.min.js

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/glide.min.js.map

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎examples/basic.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -118,4 +118,4 @@
118118
</script>
119119

120120
</body>
121-
</html>
121+
</html>

‎src/Glide.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -91,11 +91,11 @@ var Glide = function(element, options) {
9191
Helper: Helper,
9292
Translate: Translate,
9393
Transition: Transition,
94+
Arrows: Arrows,
95+
Bullets: Bullets,
9496
Run: Run,
9597
Animation: Animation,
9698
Clones: Clones,
97-
Arrows: Arrows,
98-
Bullets: Bullets,
9999
Height: Height,
100100
Build: Build,
101101
Events: Events,

‎src/less/glide.theme.less

+7-15
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,12 @@
3838
background-color: transparent;
3939
border: 2px solid rgba(255, 255, 255, 0.5);
4040
border-radius: 4px;
41-
transition: border 300ms ease-in-out;
41+
opacity: 1;
42+
transition: opacity 150ms ease, border 300ms ease-in-out;
43+
44+
&.disabled {
45+
opacity: 0.33;
46+
}
4247

4348
&:focus { outline: none; }
4449
&:hover { border-color: white; }
@@ -110,22 +115,9 @@
110115
}
111116

112117

113-
&--slider {
114-
115-
@{that}__arrow {
116-
opacity: 1;
117-
transition: opacity 150ms ease;
118-
119-
&.disabled {
120-
opacity: 0.33;
121-
}
122-
}
123-
124-
}
125-
118+
&--slider {}
126119

127120
&--carousel {}
128121

129-
130122
&--slideshow {}
131123
}

‎src/modules/Animation.js

+6
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ var Animation = function(Glide, Core) {
1818
* Animation constructor.
1919
*/
2020
function Animation() {
21+
2122
}
2223

2324
/**
@@ -27,6 +28,11 @@ var Animation = function(Glide, Core) {
2728
* @return {self}
2829
*/
2930
Animation.prototype.make = function(displacement) {
31+
// Do not run if we have only one slide.
32+
if (! Core.Run.canProcess()) {
33+
return Core.Arrows.disable();
34+
}
35+
3036
// Parse displacement to integer before use.
3137
offset = (typeof displacement !== 'undefined') ? parseInt(displacement) : 0;
3238

‎src/modules/Api.js

+1
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ var Api = function(Glide, Core) {
1111
* Api constructor.
1212
*/
1313
function Api() {
14+
1415
}
1516

1617
/**

‎src/modules/Arrows.js

+16-1
Original file line numberDiff line numberDiff line change
@@ -29,14 +29,18 @@ var Arrows = function(Glide, Core) {
2929

3030

3131
/**
32-
* Disable next/previous arrow.
32+
* Disable next/previous arrow and enable another.
3333
*
3434
* @param {String} type
3535
* @return {Void}
3636
*/
3737
Arrows.prototype.disable = function(type) {
3838
var classes = Glide.options.classes;
3939

40+
if (!type) {
41+
return this.disableBoth();
42+
}
43+
4044
this.items.filter('.' + classes['arrow' + Core.Helper.capitalise(type)])
4145
.unbind('click.glide touchstart.glide')
4246
.addClass(classes.disabled)
@@ -47,6 +51,17 @@ var Arrows = function(Glide, Core) {
4751
.removeClass(classes.disabled);
4852
};
4953

54+
/**
55+
* Disable both arrows.
56+
*
57+
* @return {Void}
58+
*/
59+
Arrows.prototype.disableBoth = function() {
60+
this.items
61+
.unbind('click.glide touchstart.glide')
62+
.addClass(Glide.options.classes.disabled);
63+
};
64+
5065

5166
/**
5267
* Show both arrows.

‎src/modules/Run.js

+27
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,10 @@ var Run = function(Glide, Core) {
3232

3333
var that = this;
3434

35+
if (! this.canProcess()) {
36+
return;
37+
}
38+
3539
if (Glide.options.autoplay || this.running) {
3640

3741
if (typeof this.interval === 'undefined') {
@@ -119,6 +123,11 @@ var Run = function(Glide, Core) {
119123
// Extract move steps.
120124
this.steps = (move.substr(1)) ? move.substr(1) : 0;
121125

126+
// Do not run if we have only one slide.
127+
if (! this.canProcess()) {
128+
return this.stop();
129+
}
130+
122131
// Stop autoplay until hoverpause is not set.
123132
if (!Glide.options.hoverpause) {
124133
this.pause();
@@ -211,6 +220,24 @@ var Run = function(Glide, Core) {
211220

212221
};
213222

223+
/**
224+
* Stop slider from running.
225+
*
226+
* @return {void}
227+
*/
228+
Run.prototype.stop = function() {
229+
this.pause();
230+
};
231+
232+
/**
233+
* Stop slider from running.
234+
*
235+
* @return {void}
236+
*/
237+
Run.prototype.canProcess = function() {
238+
return Glide.slides.length > 1;
239+
};
240+
214241
// Return class.
215242
return new Run();
216243

0 commit comments

Comments
 (0)