{"action":"opened","issue":{"url":"https://api.github.com/repos/esridc/ember-cli-mapillary/issues/9","repository_url":"https://api.github.com/repos/esridc/ember-cli-mapillary","labels_url":"https://api.github.com/repos/esridc/ember-cli-mapillary/issues/9/labels{/name}","comments_url":"https://api.github.com/repos/esridc/ember-cli-mapillary/issues/9/comments","events_url":"https://api.github.com/repos/esridc/ember-cli-mapillary/issues/9/events","html_url":"https://github.com/esridc/ember-cli-mapillary/issues/9","id":163056384,"number":9,"title":"Show how to use with the ArcGIS API for JavaScript","user":{"login":"tomwayson","id":662944,"avatar_url":"https://avatars.githubusercontent.com/u/662944?v=3","gravatar_id":"","url":"https://api.github.com/users/tomwayson","html_url":"https://github.com/tomwayson","followers_url":"https://api.github.com/users/tomwayson/followers","following_url":"https://api.github.com/users/tomwayson/following{/other_user}","gists_url":"https://api.github.com/users/tomwayson/gists{/gist_id}","starred_url":"https://api.github.com/users/tomwayson/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/tomwayson/subscriptions","organizations_url":"https://api.github.com/users/tomwayson/orgs","repos_url":"https://api.github.com/users/tomwayson/repos","events_url":"https://api.github.com/users/tomwayson/events{/privacy}","received_events_url":"https://api.github.com/users/tomwayson/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2016-06-30T00:23:44Z","updated_at":"2016-06-30T00:23:44Z","closed_at":null,"body":"I'd love to include an example of how to use this w/ the ArcGIS API for JavaScript. The challenge is that using the ArcGIS API for JavaScript in an ember app requires using ember-cli-amd to load the API's modules and the Dojo modules that it depends on. When I included (v4.x of) this addon in an app using ember-cli-amd, I got these console errors:\r\n\r\n```\r\nthree.min.js:730 THREE.WebGLShader: Shader couldn't compile.\r\nTHREE.WebGLShader: gl.getShaderInfoLog() fragment ERROR: 0:3: 'efineday' : invalid directive name \r\nERROR: 0:4: 'efineday' : invalid directive name \r\nERROR: 0:5: 'efineday' : invalid directive name \r\nERROR: 0:6: 'efineday' : invalid directive name \r\nERROR: 0:9: 'efineday' : invalid directive name \r\nERROR: 0:10: 'efineday' : invalid directive name \r\nERROR: 0:18: 'saturate' : no matching overloaded function found \r\nERROR: 0:18: 'return' : function return is not matching type: \r\nERROR: 0:20: 'efineday' : invalid directive name \r\n….\r\n```\r\n\r\nThis could in part be due to #4 - it's possible ember-cli-amd has trouble parsing the the pre-built mapillary JS files. @odoe came up with a solution to get it to work in the ember-cli-app by:\r\n1) Not including the built mapillary JS file in vendor.js (taken care of in #8) \r\n2) configuring a package telling the Dojo loader to get mapillary-js from the CDN\r\n```\r\n// dojo-config.js\r\nvar dojoConfig = {\r\n  async: true,\r\n  packages: [\r\n    {\r\n      name: 'Mapillary',\r\n      location: '//npmcdn.com/mapillary-js@1.4.1/dist'\r\n    }\r\n  ]\r\n};\r\n```\r\n3) configuring ember-cli-amd to include the Mapillary package when it loads AMD modules:\r\n``` \r\n// ember-cli-build.js\r\n...\r\n  var app = new EmberApp(defaults, {\r\n    amd: {\r\n      loader: 'http://js.arcgis.com/3.15/init.js',\r\n      packages: [\r\n        'esri', 'Mapillary'\r\n      ],\r\n      inline: true,\r\n      configPath: 'config/dojo-config.js',\r\n    },\r\n...\r\n```\r\n\r\nThis allows you to use a statement in the _app_ like :\r\n```\r\nimport Mapillary from 'Mapillary/mapillary-js.min';\r\n```\r\n\r\nHowever, the mapillary-viewer component in this _addon_ uses the `window.Mapillary` global, which is `undefined` if mapillary is loaded via AMD. So the final hack is to include the above line in any controller or component in the app that will be loaded before (i.e. a parent of) the `mapillary-viewer` component, and then do something like:\r\n\r\n```\r\n  window.Mapillary = Mapillary;\r\n```\r\n\r\nI'd like to figure out a cleaner way get these things working, and include a link to a working example.\r\n"}}
{"actor":{"display_login":"tomwayson"}}