Skip to content

Commit 50212ad

Browse files
authored
Merge branch 'master' into afshinm-onbeforechange
2 parents 2a86bd4 + cf080c1 commit 50212ad

File tree

11 files changed

+302
-56
lines changed

11 files changed

+302
-56
lines changed

CODE_OF_CONDUCT.md

Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
# Intro.js Code of Conduct
2+
3+
## Our Pledge
4+
5+
In the interest of fostering an open and welcoming environment, we as
6+
contributors and maintainers pledge to making participation in our project and
7+
our community a harassment-free experience for everyone, regardless of age, body
8+
size, disability, ethnicity, gender identity and expression, level of experience,
9+
nationality, personal appearance, race, religion, or sexual identity and
10+
orientation.
11+
12+
## Our Standards
13+
14+
Examples of behavior that contributes to creating a positive environment
15+
include:
16+
17+
* Using welcoming and inclusive language
18+
* Being respectful of differing viewpoints and experiences
19+
* Gracefully accepting constructive criticism
20+
* Focusing on what is best for the community
21+
* Showing empathy towards other community members
22+
23+
Examples of unacceptable behavior by participants include:
24+
25+
* The use of sexualized language or imagery and unwelcome sexual attention or
26+
advances
27+
* Trolling, insulting/derogatory comments, and personal or political attacks
28+
* Public or private harassment
29+
* Publishing others' private information, such as a physical or electronic
30+
address, without explicit permission
31+
* Other conduct which could reasonably be considered inappropriate in a
32+
professional setting
33+
34+
## Our Responsibilities
35+
36+
Project maintainers are responsible for clarifying the standards of acceptable
37+
behavior and are expected to take appropriate and fair corrective action in
38+
response to any instances of unacceptable behavior.
39+
40+
Project maintainers have the right and responsibility to remove, edit, or
41+
reject comments, commits, code, wiki edits, issues, and other contributions
42+
that are not aligned to this Code of Conduct, or to ban temporarily or
43+
permanently any contributor for other behaviors that they deem inappropriate,
44+
threatening, offensive, or harmful.
45+
46+
## Scope
47+
48+
This Code of Conduct applies both within project spaces and in public spaces
49+
when an individual is representing the project or its community. Examples of
50+
representing a project or community include using an official project e-mail
51+
address, posting via an official social media account, or acting as an appointed
52+
representative at an online or offline event. Representation of a project may be
53+
further defined and clarified by project maintainers.
54+
55+
## Enforcement
56+
57+
Instances of abusive, harassing, or otherwise unacceptable behavior may be
58+
reported by contacting the project team at <afshin.meh@gmail.com>. All
59+
complaints will be reviewed and investigated and will result in a response that
60+
is deemed necessary and appropriate to the circumstances. The project team is
61+
obligated to maintain confidentiality with regard to the reporter of an incident.
62+
Further details of specific enforcement policies may be posted separately.
63+
64+
## Attribution
65+
66+
This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4,
67+
available at [http://contributor-covenant.org/version/1/4][version]
68+
69+
[homepage]: http://contributor-covenant.org
70+
[version]: http://contributor-covenant.org/version/1/4/

CONTRIBUTING.md

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
# Contributing
2+
3+
By participating in this project, you agree to abide by the [code of conduct].
4+
5+
[code of conduct]: https://github.com/usablica/intro.js/blob/master/CODE_OF_CONDUCT.md
6+
7+
## Best Practices
8+
9+
Before you post any issue or pull request, search [the issues][issues] and [the pull requests][pulls] to see if it has already been addressed.
10+
11+
[issues]: https://github.com/usablica/intro.js/issues
12+
[pulls]: https://github.com/usablica/intro.js/pulls
13+
14+
Here are some best practices that will help us accept/address pull requests and issues:
15+
16+
* Outline one, **and only one**, specific problem/feature that you are trying to address.
17+
* Write a **good title** that summarizes the specific problem.
18+
* Introduce the problem before you write any code.
19+
* **Help us reproduce the problem** if applicable with a [jsfiddle][jsfiddle]/[codepen][codepen] showcasing the need for a solution.
20+
21+
[jsfiddle]: https://jsfiddle.net/
22+
[codepen]: https://codepen.io/
23+
24+
## Pull Requests
25+
26+
Fork, then clone the repo:
27+
28+
git clone git@github.com:your-username/intro.js.git
29+
30+
Make your changes and push to your fork and [submit a pull request][pr].
31+
32+
[pr]: https://github.com/usablica/intro.js/compare
33+
34+
At this point you're waiting on us. We may suggest some changes or improvements or alternatives.

README.md

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
# Intro.js v2.6.0
1+
# Intro.js v2.7.0
22

33
> Better introductions for websites and features with a step-by-step guide for your projects.
44
@@ -80,6 +80,9 @@ Want to learn faster and easier? Here we have **Instant IntroJs**, Packt Publish
8080

8181
[Other contributors](https://github.com/usablica/intro.js/graphs/contributors)
8282

83+
## Contributing
84+
85+
View [contribution guidlines](https://github.com/usablica/intro.js/blob/master/CONTRIBUTING.md)
8386

8487
## Support/Discussion
8588
- [Stackoverflow](http://stackoverflow.com/questions/tagged/intro.js)

changelog.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,10 @@
11
## Release History
22

3+
* **v2.7.0** - 2017-08-17
4+
- Added `onbeforeexit` callback
5+
- Added `force` parameter to `exit()`
6+
- Added Code of Conduct and Contributing guide files
7+
38
* **v2.6.0** - 2017-07-29
49
- Per step disable interaction
510
- Adding `scrollTo` option

component.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"name": "intro.js",
33
"repo": "usablica/intro.js",
44
"description": "Better introductions for websites and features with a step-by-step guide for your projects",
5-
"version": "2.6.0",
5+
"version": "2.7.0",
66
"main": "intro.js",
77
"scripts": [
88
"intro.js"

docs/docs/getting-started/examples.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,16 +18,16 @@ We have prepared a list of common examples using Introjs for both hints and intr
1818
* [Basic usage with progress-bar](http://introjs.com/example/hello-world/withProgress.html "Basic usage with progress-bar")
1919
* [Introduction without focusing on elements](http://introjs.com/example/withoutElement/index.html "Introduction without focusing on elements")
2020

21+
2122
##### Callbacks
2223

2324
* [Onbeforechange callback](http://introjs.com/example/callbacks/onbeforechange.html "Onbeforechange callback")
24-
25+
* [Confirm before exit](http://introjs.com/example/hello-world/exit-confirm.html "Shows a confirm before exit")
2526

2627
##### JSON configuration
2728

2829
* [Programmatic defining using JSON](http://introjs.com/example/programmatic/index.html "Programmatic defining using JSON")
2930

30-
3131
##### Advanced
3232

3333
* [Multi-Page introduction](http://introjs.com/example/multi-page/index.html "Multi-Page introduction")

docs/docs/intro/api.md

Lines changed: 33 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,7 @@ introJs().goToStep(2).start(); //starts introduction from step 2
6767

6868
-----
6969

70-
###introJs.goToStepNumber(step)
70+
##### introJs.goToStepNumber(step)
7171

7272
Go to specific step of introduction with the concrete step.
7373
This differs from `goToStep` in the way that `data-step`
@@ -165,12 +165,16 @@ introJs().goToStep(3).start().previousStep(); //starts introduction from step 2
165165

166166
-----
167167

168-
##### introJs.exit()
168+
##### introJs.exit([force])
169169

170170
Exit the introduction.
171171

172172
**Available since**: v0.3.0
173173

174+
**Parameters:**
175+
176+
- force : Boolean (optional) - Exit the tour even if `introJs.onbeforeexit` returns `false` (Available since 2.7.0)
177+
174178
**Returns:**
175179

176180
- introJs object.
@@ -296,6 +300,33 @@ introJs().onexit(function() {
296300

297301
-----
298302

303+
##### introJs.onbeforeexit(providedCallback)
304+
305+
Works exactly same as `onexit` but calls before closing the tour. Also, returning `false` would prevent the tour from closing.
306+
307+
**Available since:** v0.2.7
308+
309+
**Parameters:**
310+
311+
- providedCallback : Function
312+
313+
**Returns:**
314+
315+
- introJs object.
316+
317+
**Example:**
318+
319+
```javascript
320+
introJs().onbeforeexit(function() {
321+
console.log("on before exit")
322+
323+
// returning false means don't exit the intro
324+
return false;
325+
});
326+
````
327+
328+
-----
329+
299330
##### introJs.onchange(providedCallback)
300331
301332
Set callback to change of each step of introduction. Given callback function will be called after completing each step.

example/hello-world/exit-confirm.html

Lines changed: 80 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Basic usage</title>
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<meta name="description" content="Intro.js - Better introductions for websites and features with a step-by-step guide for your projects.">
8+
<meta name="author" content="Afshin Mehrabani (@afshinmeh) in usabli.ca group">
9+
10+
<!-- styles -->
11+
<link href="../assets/css/bootstrap.min.css" rel="stylesheet">
12+
<link href="../assets/css/demo.css" rel="stylesheet">
13+
14+
<!-- Add IntroJs styles -->
15+
<link href="../../introjs.css" rel="stylesheet">
16+
17+
<link href="../assets/css/bootstrap-responsive.min.css" rel="stylesheet">
18+
</head>
19+
20+
<body>
21+
22+
<div class="container-narrow">
23+
24+
<div class="masthead">
25+
<ul class="nav nav-pills pull-right" data-step="5" data-intro="Get it, use it.">
26+
<li><a href="https://github.com/usablica/intro.js/tags"><i class='icon-black icon-download-alt'></i> Download</a></li>
27+
<li><a href="https://github.com/usablica/intro.js">Github</a></li>
28+
<li><a href="https://twitter.com/usablica">@usablica</a></li>
29+
</ul>
30+
<h3 class="muted">Intro.js</h3>
31+
</div>
32+
33+
<hr>
34+
35+
<div class="jumbotron">
36+
<h1 data-step="1" data-intro="This is a tooltip!">Confirm before exit</h1>
37+
<p class="lead" data-step="4" data-intro="Another step.">Shows a confirmation box before existing the tour using <code>onbeforeexit</code> callback.</p>
38+
<a class="btn btn-large btn-success" href="javascript:void(0);" onclick="javascript:startTour();">Show me how</a>
39+
</div>
40+
41+
<hr>
42+
43+
<div class="row-fluid marketing">
44+
<div class="span6" data-step="2" data-intro="Ok, wasn't that fun?" data-position='right' data-scrollTo='tooltip'>
45+
<h4>Section One</h4>
46+
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis mollis augue a neque cursus ac blandit orci faucibus. Phasellus nec metus purus.</p>
47+
48+
<h4>Section Two</h4>
49+
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis mollis augue a neque cursus ac blandit orci faucibus. Phasellus nec metus purus.</p>
50+
51+
<h4>Section Three</h4>
52+
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis mollis augue a neque cursus ac blandit orci faucibus. Phasellus nec metus purus.</p>
53+
</div>
54+
55+
<div class="span6" data-step="3" data-intro="More features, more fun." data-position='left'>
56+
<h4>Section Four</h4>
57+
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis mollis augue a neque cursus ac blandit orci faucibus. Phasellus nec metus purus.</p>
58+
59+
<h4>Section Five</h4>
60+
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis mollis augue a neque cursus ac blandit orci faucibus. Phasellus nec metus purus.</p>
61+
62+
<h4>Section Six</h4>
63+
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis mollis augue a neque cursus ac blandit orci faucibus. Phasellus nec metus purus.</p>
64+
65+
</div>
66+
</div>
67+
68+
<hr>
69+
</div>
70+
<script type="text/javascript" src="../../intro.js"></script>
71+
72+
<script type="text/javascript">
73+
function startTour() {
74+
introJs().start().onbeforeexit(function () {
75+
return confirm("Are you sure?");
76+
});
77+
}
78+
</script>
79+
</body>
80+
</html>

intro.js

Lines changed: 27 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/**
2-
* Intro.js v2.6.0
2+
* Intro.js v2.7.0
33
* https://github.com/usablica/intro.js
44
*
55
* Copyright (C) 2017 Afshin Mehrabani (@afshinmeh)
@@ -18,7 +18,7 @@
1818
}
1919
} (this, function (exports) {
2020
//Default config/variables
21-
var VERSION = '2.6.0';
21+
var VERSION = '2.7.0';
2222

2323
/**
2424
* IntroJs main class
@@ -449,8 +449,22 @@
449449
* @api private
450450
* @method _exitIntro
451451
* @param {Object} targetElement
452+
* @param {Boolean} force - Setting to `true` will skip the result of beforeExit callback
452453
*/
453-
function _exitIntro(targetElement) {
454+
function _exitIntro(targetElement, force) {
455+
var continueExit = true;
456+
457+
// calling onbeforeexit callback
458+
//
459+
// If this callback return `false`, it would halt the process
460+
if (this._introBeforeExitCallback != undefined) {
461+
continueExit = this._introBeforeExitCallback.call(self);
462+
}
463+
464+
// skip this check if `force` parameter is `true`
465+
// otherwise, if `onbeforeexit` returned `false`, don't exit the intro
466+
if (!force && continueExit === false) return;
467+
454468
//remove overlay layers from the page
455469
var overlayLayers = targetElement.querySelectorAll('.introjs-overlay');
456470

@@ -2020,8 +2034,8 @@
20202034
_previousStep.call(this);
20212035
return this;
20222036
},
2023-
exit: function() {
2024-
_exitIntro.call(this, this._targetElement);
2037+
exit: function(force) {
2038+
_exitIntro.call(this, this._targetElement, force);
20252039
return this;
20262040
},
20272041
refresh: function() {
@@ -2092,6 +2106,14 @@
20922106
}
20932107
return this;
20942108
},
2109+
onbeforeexit: function(providedCallback) {
2110+
if (typeof (providedCallback) === 'function') {
2111+
this._introBeforeExitCallback = providedCallback;
2112+
} else {
2113+
throw new Error('Provided callback for onbeforeexit was not a function.');
2114+
}
2115+
return this;
2116+
},
20952117
addHints: function() {
20962118
_populateHints.call(this, this._targetElement);
20972119
return this;

0 commit comments

Comments
 (0)