How can I create a constructor for a static library

Question

I'm using the introjs library.

See the original code here.

I want to be able to write var = new IntroJs() rather than call the start() method.

How can I achieve that?

Can we assume the difference in capitalization on the first line is a typo? Is it supposed to be **I** ntroJs.fn = ... ? — Scott Sauyet, May 09 '13 at 20:07
Just `function IntroJs(/*optional*/oldInstance){ /* do what needs to be done */ }`? We don't know what you need. — Bergi, May 09 '13 at 20:07
@Bergi I said what I need. I need an instance to call the `start()` method later. — Daniel Ribeiro, May 09 '13 at 20:08
Then an empty function should suffice if `start` does all the work? — Bergi, May 09 '13 at 20:09
How did you come up with this without creating the constructor? — Joseph, May 09 '13 at 20:09
So you have an `introJs` object with a property `fn`, and an `IntroJs` constructor function, with a prototype that is the same as that `fn` property? — Scott Sauyet, May 09 '13 at 20:10
jQuery does something similar with a `fn` reference to a prototype, but not with the `jQuery`/`JQuery` difference. — Scott Sauyet, May 09 '13 at 20:13
What is the relationship between `introJs`, the object, and `IntroJs`, the constructor function? — Scott Sauyet, May 09 '13 at 20:14
No relationship. I just need the library loaded into a local variable, so I can choose whenever I like to call any methods of it, but without having to call `start()` to do so. — Daniel Ribeiro, May 09 '13 at 20:15

score 2 · Answer 1 · answered May 09 '13 at 20:31

2

Why not simply wrap up the factory that introJs provides and call start on it in your wrapper?

You can do it externally with something like this (untested):

var introJsWrapper = function(targetElm) {
    var ijs = introJs(targetElm);
    ijs.start();
    return ijs;
};

Or you can do that inside a fork of the introJs code by exposing it as a property of the main function, e.g.:

var introJs = function (targetElm) {
    if (typeof (targetElm) === 'object') {
    // ...
}
introJs.autoStart = function(targetElm) {
    var ijs = introJs(targetElm);
    ijs.start();
    return ijs;
};

Note that in introJs, the main function is just a very thin parameter-testing/changing wrapper already around the internal constructor. Calling it indirectly invokes the constructor. So there is really no need to access this internal constructor function directly, as far as I can see.

answered May 09 '13 at 20:31

Scott Sauyet

49,207
4
49
103

Read my question again. This is NOT what I want. – Daniel Ribeiro May 09 '13 at 20:35
This returns a new IntroJs object when called, and automatically calls the `start` function on it. It does not expose what the original author had intentionally kept hidden, but what is functionally different from what you want? – Scott Sauyet May 09 '13 at 20:38
I don't want to call the start() method. But I guess your answer is the closest to what I wanted. Thanks. – Daniel Ribeiro May 09 '13 at 20:39
No, if I read your solution, I think it's really nothing like it. You didn't want a constructor at all. You were looking for a static reference to the prototype, right? – Scott Sauyet May 09 '13 at 20:42
I'm really newbie when it comes to JS. What I needed was the library inside a local variable. Call that an instance, a static reference or whatever. I'm still a bit confused. – Daniel Ribeiro May 09 '13 at 20:44
1

And I think we're talking past each other still. "The library" doesn't mean much to me here, except that I'm starting to get it based on your own solution... I'm glad you found something that worked. – Scott Sauyet May 09 '13 at 20:47

score 1 · Answer 2 · answered May 09 '13 at 20:17

Well, this should be it. I assume these are enclosed in a closure since the code seems to imply that there is some internal functions going on. Here's what I gathered. It's not a complete implementation since I don't know how the this when calling new IntroJS gets used in the constructor. All I know is that your prototype functions are operating on some properties.

//internal functions
function _mergeOptions(target){/*implementation*/}
function _introForElement(el){/*implementation*/}
function _goToStep(step){/*implementation*/}
function _exitIntro(target){/*implementation*/}
function _setHelperLayerPosition(nodeList){/*implementation*/}

//constructor
function IntroJs(first){
  this._options = {};
  this._introChangeCallback;
  this._introCompleteCallback;
  this._introExitCallback;
}

I've pasted half the code, so the snippet wouldn't get giant. — Daniel Ribeiro, May 09 '13 at 20:18

score 0 · Answer 3 · answered May 09 '13 at 20:11

0

Just an empty constructor will suffice. As Jan said, it's pretty useless, but if you like the notation...

http://plnkr.co/edit/eFzkKJ14TeaMY44GDxR2

answered May 09 '13 at 20:11

Dek Dekku

1,441
11
28

`Uncaught ReferenceError: IntroJs is not defined` – Daniel Ribeiro May 09 '13 at 20:13
Works for me. Did you `return this`? – Dek Dekku May 09 '13 at 20:32
@DanielRibeiro: No. The error in the Plunker example is `Unhandled Error: Undefined variable: _introForElement` - which you didn't gave us, the constructor works correctly. – Bergi May 09 '13 at 20:35

score 0 · Accepted Answer · answered May 09 '13 at 20:37

0

Ok, so basically this solved my problem:

introJs.fn = IntroJs.prototype = {
    ... 
    initialize: function() {
        return this;
    }
    ...
}

Now, calling introJs().initialize() gives me the library without calling the start() method.

answered May 09 '13 at 20:37

Daniel Ribeiro

10,156
12
47
79

1

So your description (both of them) had little to do with the problem you were trying to solve? – Scott Sauyet May 09 '13 at 20:41
Or maybe you just didn't get it. – Daniel Ribeiro May 09 '13 at 20:43
2

Perhaps. But generally in Javascript discussing `var obj = new MyConstructor()` is discussing a constructed object. One wants to create an instance of an object whose behavior is described by the function MyConstructor. If I understand correctly, what you really want is an object that holds references to the functions of public API (`clone`, `setOption`, `goToStep`, etc) that such constructed objects would have, but not one that would be in a runnable state. If that's what you want, you don't need to do anything. You already have such a public reference: `introJs.fn`! – Scott Sauyet May 09 '13 at 20:54
So I would just need to do `var foo = introJs.fn`? – Daniel Ribeiro May 10 '13 at 12:03
If you like. But do you need `foo`? Or will `introJs.fn` serve just as well? It's still not clear precisely **what** you want to do with it. – Scott Sauyet May 10 '13 at 12:24
I need to pass that "instance" to some objects in order to call some methods at run-time later inside them, such as `start()` and `refresh()`. – Daniel Ribeiro May 10 '13 at 12:51
Then it simply looks like you can use the API supplied, by calling `var foo = introJs("whatever")`. Later you can call `foo.start()` or whatever else you like on the `introJs` API. I think this is all much simpler than you were trying... – Scott Sauyet May 10 '13 at 15:30
Like I said, that and nothing else proposed works as expected. If you could at least try the library on JSFiddle or something in order to understand what I saying... – Daniel Ribeiro May 10 '13 at 16:12
1

Well, most of the conversation has been trying to tease out your requirement. Usually, also, the person trying to do something sets up an initial Fiddle, but it really does work as I said, if I finally understand your requirements: http://jsfiddle.net/CrossEye/CNxDE/ . Note that the introJs object is created, but not started until the Start button is pushed. – Scott Sauyet May 10 '13 at 18:59
Yes, that is exactly what I needed. Thanks a lot. P.S.: How come I never thought of this before? ROFL – Daniel Ribeiro May 10 '13 at 19:37

How can I create a constructor for a static library

4 Answers4