Skip to content
Martin 'Hasan' Bramwell edited this page Apr 25, 2015 · 4 revisions

About the command line scripts

In the root directory, you will find three non-standard scripts :

  1. utilsJson.sh
  2. devRun.sh
  3. productionPackager.sh

The purpose of the scripts is to "normalize" your project configuration settings into a single file: settings.json. When you run meteor on the command line, you must set up environment variables in your profile. This may not be convenient if you switch frequently from one project to another. Also, when you build for deployment to a pre-production server you may want different settings.

The latter two scripts use functions from the first one: utilsJson.sh, to obtain shell variables from your settings.json file

The second script, devRun.sh, executes meteor --settings=settings.json, but first it adjusts your execution environment according to any special criteria you have specified in settings.json, eg use Cucumber &/or Mocha testing with Velocity.

job record

pasting ID

We have an employee inserted successfully, albeit with the job title still represented by jobId, not the job title itself. Hence the next task ...

Now we can get our hands dirty with a bit of coding.

The page http://server:3000/employees/index provides clients (users) with a view into the Employees collection, so the corresponding source file can be found at the similarly named location client/views/employees/index.html. This will be familiar to application developers who have used Ruby on Rails, Python Django or PHP frameworks like Yii or Laravel.

Notice, of course, that this is not a complete HTML page. Rather it is a Meteor template named employeesIndex.

employee view index before

Examining this employeesIndex template, we see that the "Job" column refers to the jobId attribute of the Employee collection. Our next task is to change it to display "job.title" instead; the title attribute of the Job collection.

employee view index after

Having made that change, the employee index should now look like the next image, with the correctly displayed job title -- not just an id.

corrected table

It should be evident that all the hard, error-prone, donkey work of developing a CRUD page, is handled generically by Mugen. Compare that to the tedium of hand-coding jQuery widgets to create similar pages -- over and over again!

attribute definition

        Don't forget We still have a duty to make Our User don't manually insert the id when inserting Employees. So, open up your code again at clients/views/employees/_form.html. (_form.html here are used by insert and update action). The default code will look like this.

employee data form code

        To make it aligned correctly, just use Your favorite IDE. In this documentation I am using Netbeans IDE and just press alt+shift+f, then the code will be aligned correctly automatically. Then let's get our hand dirty again, change the highlighted code below which is still an input text to dropdown list.

the line to edit

        change the code to dropdown list like the code below.

drop-down code

        on the above code We can clearly see that we loop through "jobs" (#each jobs). So we need a helper to get the jobs collection. Open up "client/view/employees/_form.js" and add this code.

job finder code

                We already get all jobs, so don't forget to change the controller with subscribing the jobs collection. In this doc We'll just subscribe all Jobs. This is not a good idea though, You better using auto completer and subscribe the data only what You need. But it's ok for now. Open up "lib/controllers/EmployeesController.js" and add this code.

employee subscribes to jobs

Ok, now when We look at the form again it will look like this.

dropdown working

Clone this wiki locally