Added 2 new devices for emulation

[jeffersonsouza]

Added the iPhone 4 and Moto X for emulation and renamed the default device for iPhone 5

[nickgartmann]

Thanks for the PR @jeffersonsouza!

I think adding support for multiple types of emulators is a great idea. Probably the most maintainable way to go about this is to add a dictionary of emulation screen size / name pairs.

Something like:

devices: {
  "iphone-5": {
    width: 320,
    height: 568
  },
  "iphone-4": {
    width: 320,
    height: 480
  },
  "moto-x": {
    width: 360,
    height: 640
  }
}

module.exports = 
  activate: ->
    me = $(@)
    for device, dimensions in devices
      atom.workspaceView.command "ionic:preview-#{device}", =>
        me.dimensions = dimensions
        atom.workspace.open "ionic://localhost:8100", split: "right"
  # .. snip ..
  preview = new WebBrowserPreviewView(url: uri.format(), dimensions: me.dimensions)

Then in the WebBrowserPreviewView:

@content: (params) ->
  @iframe outlet: "frame", height: params.dimensions.height, width: params.dimensions.width, src: params.url, sandbox: "none"

thoughts?

[jeffersonsouza]

Hum, interesting :)

Can I made these changes and re submit the pull request?

And, I can contribute with new devices sizes, is ok for you?

[nickgartmann]

Sounds awesome :)

[mfdeveloper]

Hello @jeffersonsouza, Do you made this changes suggested by @nickgartmann ? I want so much use this feature. Additionally, my suggest is add a background-url into each css classes with a image of yours smartphones, what do you think?

[jeremiahholder]

Did anyone get this working? I'd love a dropdown within the Previewer to select the device/emulator/screensize desired. If it's as simple as the commentary above, I might try to hack it myself....but why re-invent the wheel if others have already done so?