CODEWITHSUNDEEP
ember.js
user4533873
user4533873

Reputation:

Where to put simple functions in an Ember project

So... while I'm learning all of this Ember CLI world - things are going well. However, I can't seem to understand where all the normal ol javascript/jQuery utility stuff I use on a normal project goes... for example --- this sticky footer thing... where do I put this? It's blowing my mind... 


// dynamic weighted footer
var watchFooter = function() {

  // define the height variable
  var footerHeight;

    // get the height of the footer and store it in 'footerHeight'
    footerHeight = $('.container.footer').outerHeight();

  // Share that info with the dependent elements
  $('.footer-buffer').css('height', footerHeight);
  $('.container.master').css('margin-bottom', -(footerHeight));

};

// run on window resize - and on load
$(window).resize(watchFooter).trigger('resize');

Upvotes: 2

Views: 866

Answers (1)

rog
rog

Reputation: 5361

ember-cli has a blueprint for creating utilities. You can generate one using this command:

ember g util my-util

It will create the file app/util/my-util.js:

export default function myUtil() {
  console.log('TESTING!');  // I've added this to confirm it is working
  return true;
}

Then, in order to use your new utility you can import it when it is needed like so:

import MyUtil from '../utils/my-util';

And then use it like this:

MyUtil();  // this will print TESTING! to the console

You could also create a view and use the didInsertElement event hook. You can read more about it here: http://emberjs.com/api/classes/Ember.View.html#event_didInsertElement

You would generate a view using this command:

ember g view my-view

Edit the resulting file app/views/my-view.js to use the didInsertElement event hook:

export default Ember.View.extend({
    didInsertElement: function() {
        // do stuff
    }
});

Upvotes: 4

Related Questions