How to manage init without jQuery function?

[toplisek]

I try to modify jQuery initi function without jQuery.

How to manage without jQuery function as there are pure Javascript functions.

The current code is the following:

jQuery(function()
 {
  // AnimationMessage1.init();
 }

);

AnimationMessage1 = {
init: function() {
  //var $ = jQuery;

 }
}

[Paul_Wilkins]

From what you have there, it looks like no scripting code at all is the solution.

[m_hutley]

joking aside, what you’re roughly describing is unfolding shorthand.

@toplisek

jQuery(function()
 {
  // AnimationMessage1.init();
 }

);

Which is shorthand for
JQuery(document).ready(function() {....});

back in vanilla, to trigger at about the same runtime, you’d do

document.addEventListener("DOMContentLoaded", function() { ... });

[toplisek]

I have many functions which should be placed inside one file.

So, this should work?

AnimationMessage.init();

AnimationMessage = {
init: function() {


 }
}

[Paul_Wilkins]

I find that the module pattern is very useful for that.

var myNamespace = (function () {

  // A private counter variable
  var myPrivateVar = 0;

  // A private function which logs any arguments
  var myPrivateMethod = function( foo ) {
      console.log( foo );
  };

  return {

    // A public variable
    myPublicVar: "foo",

    // A public function utilizing privates
    myPublicFunction: function( bar ) {

      // Increment our private counter
      myPrivateVar++;

      // Call our private method using bar
      myPrivateMethod( bar );

    }
  };

}());

The above example is taken from partway through the O’Reilly Module Pattern article.

[Paul_Wilkins]

So in your case, you can do the following module pattern:

var AnimationMessage1 = (function () {
    function init() {
        // ...
    }
    return {
        init
    };
}());

That gives your code room to grow, and you can init it with:

animationMessage1.init();

[toplisek]

Yes, this is a perfect solution. Thank you.

[toplisek]

I try to improve your init function using ID detection and not needed to place inside page.

animationMessage1.init();

It is just an example for jQuery.

  var animationMessage1 = jQuery("#myID");
  if (!myID.length > 0) {
   return false;
  }

How to manage in this case?

var AnimationMessage1 = (function () {
    function init() {
        // ...
    }
    return {
        init
    };
}());