3

I have a javascript file that contains the following objects and functions........

;( function( window ) {

    'use strict';

    function extend( a, b ) {
        for( var key in b ) { 
            if( b.hasOwnProperty( key ) ) {
                a[key] = b[key];
            }
        }
        return a;
    }

    // taken from https://github.com/inuyaksa/jquery.nicescroll/blob/master/jquery.nicescroll.js
    function hasParent( e, id ) {
        if (!e) return false;
        var el = e.target||e.srcElement||e||false;
        while (el && el.id != id) {
            el = el.parentNode||false;
        }
        return (el!==false);
    }

    // returns the depth of the element "e" relative to element with id=id
    // for this calculation only parents with classname = waypoint are considered
    function getLevelDepth( e, id, waypoint, cnt ) {
        cnt = cnt || 0;
        if ( e.id.indexOf( id ) >= 0 ) return cnt;
        if( classie.has( e, waypoint ) ) {
            ++cnt;
        }
        return e.parentNode && getLevelDepth( e.parentNode, id, waypoint, cnt );
    }


    // returns the closest element to 'e' that has class "classname"
    function closest( e, classname ) {
        if( classie.has( e, classname ) ) {
            return e;
        }
        return e.parentNode && closest( e.parentNode, classname );
    }

function mlPushMenu( el, trigger, options ) {   
        this.el = el;
        this.trigger = trigger;
        this.options = extend( this.defaults, options );
        // support 3d transforms
        this.support = Modernizr.csstransforms3d;
        if( this.support ) {
            this._init();
        }
    }

    mlPushMenu.prototype = {
        defaults : {
            // overlap: there will be a gap between open levels
            // cover: the open levels will be on top of any previous open level
            type : 'overlap', // overlap || cover
            // space between each overlaped level
            levelSpacing : 40,
            // classname for the element (if any) that when clicked closes the current level
            backClass : 'mp-back'
        },
        _init : function() {
            // if menu is open or not
            this.open = false;
            // level depth
            this.level = 0;
            // the moving wrapper
            this.wrapper = document.getElementById( 'mp-pusher' );
            // the mp-level elements
            this.levels = Array.prototype.slice.call( this.el.querySelectorAll( 'div.mp-level' ) );
            // save the depth of each of these mp-level elements
            var self = this;
            this.levels.forEach( function( el, i ) { el.setAttribute( 'data-level', getLevelDepth( el, self.el.id, 'mp-level' ) ); } );
            // the menu items
            this.menuItems = Array.prototype.slice.call( this.el.querySelectorAll( 'li' ) );
            // if type == "cover" these will serve as hooks to move back to the previous level
            this.levelBack = Array.prototype.slice.call( this.el.querySelectorAll( '.' + this.options.backClass ) );
            // event type (if mobile use touch events)
            this.eventtype = mobilecheck() ? 'touchstart' : 'click';
            // add the class mp-overlap or mp-cover to the main element depending on options.type
            classie.add( this.el, 'mp-' + this.options.type );
            // initialize / bind the necessary events
            this._initEvents();
        },

        // close the menu
        _resetMenu : function() {
            this._setTransform('translate3d(0,0,0)');
            this.level = 0;
            // remove class mp-pushed from main wrapper
            classie.remove( this.wrapper, 'mp-pushed' );
            this._toggleLevels();
            this.open = false;
        },



// add to global namespace
    window.mlPushMenu = mlPushMenu;

} )( window );

The question I have is how do I call the object _resetMenu in another script. to my poor knowledge it should be ......

window.mlPushMenu._resetMenu(); 

that should execute that object in my mind but it isn't working so clealy I am wrong ... Any help here would be much appreciated..

this is the example of the button I have created thus far.....

$('.iconM-referrals').on('click', function () {
      window.mlPushMenu._resetMenu();
      $("#colorscreen").remove();
     $("body").append('<div id="colorscreen" class="animated"></div>');
     $("#colorscreen").addClass("fadeInUpBig");
      $('.fadeInUpBig').css('background-color', 'rgba(13,135,22,0.3)');
havingagoatit
  • 593
  • 4
  • 19
  • well `mlPushMenu` is local to the script, it's not part of `window`. You could define it as a function in `window` so instead of `function ml....` do `window.mlPushMenu = function(el, trigger, ....` – ZekeDroid May 20 '15 at 18:35
  • I ommited some code because i wanted to get to the point (stupid me).... this is also at the bottom of the file ... // add to global namespace window.mlPushMenu = mlPushMenu; – havingagoatit May 20 '15 at 18:37
  • is this script included before you're external script? – Himanshu Tanwar May 20 '15 at 18:38
  • it is called from index.html .... the script i want to call it from is embedded in the index.html file also , (it refers to a button in the index.html) – havingagoatit May 20 '15 at 18:40

1 Answers1

1

The way you have mlPushMenu set up is as a Constructor, not as a stand-alone module. (See: Any tutorial on Object-Oriented programming) You'd need to construct an instance variable to call the function. For instance:

myInstanceOfPushMenu = new mlPushMenu();
myInstanceOfPushMenu._resetMenu();

This, however, is assuming that the script inclusion and declaration, and anything left out of your question, is all set up properly.

Katana314
  • 8,429
  • 2
  • 28
  • 36
  • ok i think that makes sense to me , we are assuming here that the index.html page will know what mlPushMenu is because it is included in the header – havingagoatit May 20 '15 at 18:42
  • It should; you've properly added it to `window`, which is the global scope; unless there's something to do with frames going on here that I don't know about. – Katana314 May 20 '15 at 18:44
  • it's valid, i'm using this exact menu in my own app. – Daemedeor May 20 '15 at 18:46
  • great thanks for the response , can i not just add what you wrote in your first response into the other function . It is a button so i have an on click with the function doing a few things with css , i was hoping to add a 1liner that called the object but doing what you are saying it is only two lines, (not lazy just learning) – havingagoatit May 20 '15 at 18:47
  • Well, it seems based on Daemedeor's response this is part of some library I don't actually know about. (I had assumed it was your own code) I think to use it properly, you'd have to consult its documentation; it's possible there is in fact some way to do it as a one-liner. – Katana314 May 20 '15 at 18:51
  • fair point , ,i have looked at pretty much everything but for what i want to do not sure there is anything .... yet ironically the objects defined in the code itself do exactly what i want it to do , just in a button i have created by myself .... it's a real bummer with such limited knowledge and time to aquire that knowledge – havingagoatit May 20 '15 at 18:53
  • interestingly the link does cover some of what you said in your initial response.. http://tympanus.net/codrops/2013/08/13/multi-level-push-menu/ i wonder if that is the answer – havingagoatit May 20 '15 at 18:58
  • If most of it is already working, then it must be getting constructed somewhere already...? Maybe you could use F12 Developer Tools, place a breakpoint on the first mlPushMenu function (the constructor) and see where it gets initialized and where it gets stored. If there's a global reference existing somewhere, you can use that in another script. – Katana314 May 20 '15 at 19:01
  • well , there is a html button with an id called "trigger" that is ref'd in the js file i posted ... i was hoping to use something from there but there isn't enough ... maybe i should go to the site i got it from , upload a jsfiddle of it and ask more or less how one might do it from there ? what do you think ? – havingagoatit May 20 '15 at 19:04
  • is it worth me mentioning here that all of the functions and objects mentioned are loaded into the file that I am creating the button with this function in it ? apologies if i haven't been clear on this one – havingagoatit May 20 '15 at 19:06
  • OMG I THINK THIS IS WHAT YOU WERE TALKING ABOUT http://stackoverflow.com/questions/18627806/duplicate-javascript-for-codrops-multi-level-push-menu – havingagoatit May 20 '15 at 19:12