Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added feature to use HTML element instead of element ID string #268

Merged
merged 1 commit into from
Jul 3, 2017
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 0 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -294,5 +294,3 @@ Thanks for checking this out. If you have any questions, I'll be on [Twitter](ht
If you're using this, let me know! I'd love to see it.

It would also be great if you mentioned me or my website somewhere. [www.mattboldt.com](http://www.mattboldt.com)


4 changes: 2 additions & 2 deletions docs/API.md
Original file line number Diff line number Diff line change
Expand Up @@ -192,7 +192,7 @@ Welcome to Typed.js!

**Parameters**

- `elementId` **[string](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)** HTML element ID
- `elementId` **[string](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)** HTML element ID _OR_ HTML element
- `options` **[object](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object)** options object

Returns **[object](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object)** a new Typed object
Expand All @@ -219,4 +219,4 @@ Reset Typed and optionally restarts

**Parameters**

- `restart` **[boolean](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean)?= rt) **
- `restart` **[boolean](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean)?= nser**
8 changes: 5 additions & 3 deletions docs/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -1849,7 +1849,9 @@ <h3 class='fl m0' id='typed'>
<div class='space-bottom0'>
<div>
<span class='code bold'>elementId</span> <code class='quiet'>(<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>)</code>
HTML element ID
HTML element ID
<em>OR</em>
HTML element

</div>

Expand Down Expand Up @@ -2084,7 +2086,7 @@ <h3 class='fl m0' id='typed'>
<p>Reset Typed and optionally restarts</p>


<div class='pre p1 fill-light mt0'>reset(restart: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a>?= rt) )</div>
<div class='pre p1 fill-light mt0'>reset(restart: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a>?= nser)</div>



Expand All @@ -2100,7 +2102,7 @@ <h3 class='fl m0' id='typed'>

<div class='space-bottom0'>
<div>
<span class='code bold'>restart</span> <code class='quiet'>(<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a>?= rt) )</code>
<span class='code bold'>restart</span> <code class='quiet'>(<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a>?= nser)</code>

</div>

Expand Down
15 changes: 6 additions & 9 deletions gulpfile.js
Original file line number Diff line number Diff line change
Expand Up @@ -72,20 +72,17 @@ gulp.task('server', function () {
gulp.watch(['docs/images/**/*'], server.notify);
});

gulp.task('serve', [
'watch',
'server'
]);

// Watch Task
gulp.task('watch', () => {
livereload({ start: true });
gulp.watch('src/*.js', ['default']);
gulp.watch('src/*.js', ['md-docs', 'html-docs', 'default']);
});

gulp.task('serve', [
'default',
'md-docs',
'html-docs',
'server',
'watch'
]);

gulp.task('default', [
'lint',
'build',
Expand Down
16 changes: 12 additions & 4 deletions lib/typed.js
Original file line number Diff line number Diff line change
Expand Up @@ -79,7 +79,7 @@ return /******/ (function(modules) { // webpackBootstrap

/**
* Welcome to Typed.js!
* @param {string} elementId HTML element ID
* @param {string} elementId HTML element ID _OR_ HTML element
* @param {object} options options object
* @returns {object} a new Typed object
*/
Expand Down Expand Up @@ -579,13 +579,17 @@ return /******/ (function(modules) { // webpackBootstrap
* Load up defaults & options on the Typed instance
* @param {Typed} self instance of Typed
* @param {object} options options object
* @param {string} elementId HTML element ID
* @param {string} elementId HTML element ID _OR_ instance of HTML element
* @private
*/

value: function load(self, options, elementId) {
// chosen element to manipulate text
self.el = document.querySelector(elementId);
if (typeof elementId === 'string') {
self.el = document.querySelector(elementId);
} else {
self.el = elementId;
}

self.options = {};
Object.assign(self.options, _defaultsJs2['default'], options);
Expand Down Expand Up @@ -639,7 +643,11 @@ return /******/ (function(modules) { // webpackBootstrap
});

// div containing strings
self.stringsElement = document.querySelector(self.options.stringsElement);
if (typeof self.options.stringsElement === 'string') {
self.stringsElement = document.querySelector(self.options.stringsElement);
} else {
self.stringsElement = self.options.stringsElement;
}

if (self.stringsElement) {
self.strings = [];
Expand Down
2 changes: 1 addition & 1 deletion lib/typed.min.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion lib/typed.min.js.map

Large diffs are not rendered by default.

14 changes: 11 additions & 3 deletions src/initializer.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,13 +8,17 @@ export default class Initializer {
* Load up defaults & options on the Typed instance
* @param {Typed} self instance of Typed
* @param {object} options options object
* @param {string} elementId HTML element ID
* @param {string} elementId HTML element ID _OR_ instance of HTML element
* @private
*/

load(self, options, elementId) {
// chosen element to manipulate text
self.el = document.querySelector(elementId);
if (typeof elementId === 'string') {
self.el = document.querySelector(elementId);
} else {
self.el = elementId;
}

self.options = {};
Object.assign(self.options, defaults, options);
Expand Down Expand Up @@ -66,7 +70,11 @@ export default class Initializer {
self.strings = self.options.strings.map((s) => s.trim());

// div containing strings
self.stringsElement = document.querySelector(self.options.stringsElement);
if (typeof self.options.stringsElement === 'string') {
self.stringsElement = document.querySelector(self.options.stringsElement);
} else {
self.stringsElement = self.options.stringsElement;
}

if (self.stringsElement) {
self.strings = [];
Expand Down
2 changes: 1 addition & 1 deletion src/typed.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { htmlParser } from './html-parser.js';

/**
* Welcome to Typed.js!
* @param {string} elementId HTML element ID
* @param {string} elementId HTML element ID _OR_ HTML element
* @param {object} options options object
* @returns {object} a new Typed object
*/
Expand Down