vendredi 31 août 2018

Ember loading state blocks location.href history updating

When some.route is waiting for slow-model, you can have a some.route-loading loading state to show some kitties while waiting.

In this case it makes sense to have some.route-error too, so you can show a sad face when the payload breaks things.

However, when I click on a link-to to some/route, the location href in the address bar is not updated until the loading completes successfully.

I don't know if this is by design, but I would like to be able to navigate back with the browser history on error.

In other words: Can I have the location href in the address bar update before rather than after the loading state appears?




How to push data to ember's store of a model that have a JSONSerializer as it's Serializer insted of JSONAPISerializer or RESTSerializer in Ember js?

For a model which is using JSONAPISerializer as it's Serializer pushing a record for that model into the store is done by store.push(dataInJSONAPISerializerFormat) https://www.emberjs.com/api/ember-data/3.3/classes/DS.Store/methods/push?anchor=push method.But for the model which is using RESTSerializer as it's Serializer pushing a record for that model into the store is done by store.pushPayload("modelName",dataInRESTSerializerFormat) https://www.emberjs.com/api/ember-data/3.3/classes/DS.Store/methods/pushPayload?anchor=pushPayload method. But incase of JSONSerializer both of them are not working? Can anyone Help me?




jeudi 30 août 2018

how to clone an ember object

I am creating an object like:

let response = Ember.object.create({
               propertyOne: value1
              });

I am using it in the end, and set it as one of the property of model like this:

let userRecord = this.get('store').createRecord('user');
userRecord.set('prop', response.propertyOne);

Now when I do model.save then in my adapter, I am overriding createRecord method where I convert any camelcase property to snake case before sending it on wire. If it fails, then I will retry but the problem is next time I retry, the created object gets modified. I guess it is because i am passing the object and setting on the model as a reference. is there a way to duplicate the ember object so that this can be avoided?




Ember-cli addon dev, how to differentiate addon dev from application dev

When you create an ember-cli addon, you are supposed to be able to run a dummy app.

If a component need to access it's vendor folder you access "public/" in production. While developping the ember app that use the addon you access :

app.options.project.nodeModulesPath + "/"+ this.name+"/vendor/"

However, when you run the ember-cli addon server (the dummy app) you need only "vendor/".

this.getEnv() will return developpement while developping an addon, or an app using the addon.

How can I, in index.js, differentiate app dev from addon dev ?




Ember.js application to upload file and process it on the server and making available for download

I'm building an application that could upload file to server where it is processed and it is available for download. I've implemented the same using JSP, servlets, etc. Now I'm planning to develop this using ember.js. Is there a way that I could use those previous servlet codes in my ember application? and if its not a good practice, which technology should I use to perform file processing tasks in server with ember as client-side?




Ember Snapshot doesnt resolve belongsToRelationships

Im using ember 2.18 and i was trying to access nested api. when im trying to access that i override buildUrl in adapter. i have two models programme and course which has a one to many relationship of programme has many courses

issue im getting here is im trying to access belongsTo model's id which is programme id from course but it is not there.

programme model

export default DS.Model.extend( {

  name:            DS.attr( 'string' ),
  code:            DS.attr( 'string' ),
  welcome:         DS.attr( 'string' ),
  startDate:       DS.attr( 'date' ),
  endDate:         DS.attr( 'date' ),
  published:       DS.attr( 'boolean' ),

  core_group:      DS.attr(),

  courses: DS.hasMany( 'course',{async: true}) });

course model

export default DS.Model.extend( {

  uid: DS.attr( 'string' ),
  name: DS.attr( 'string' ),
  abbreviation: DS.attr( 'string' ),
  startDate: DS.attr( 'date' ),
  endDate: DS.attr( 'date' ),
  country: DS.attr( 'string' ),
  timezone: DS.attr( 'string' ),
  published: DS.attr( 'boolean' ),

  programme: DS.belongsTo( 'programme', { async: true} )
});

adapter/mixin

import Ember from 'ember';

export default Ember.Mixin.create( {
  findRecord: function( store, type, id, snapshot ) {

    return this.ajax( this.buildURL( type.modelName, null, snapshot, 'findRecord' ), 'GET' );
  },

  buildURL: function( modelName, id, snapshot, requestType, query ) {

    var local_snapshot = snapshot;
    var url          = this._super( modelName, id, snapshot, requestType, query ),
        ancestorType = this.get( 'ancestorType' ),
        namespace    = this.get( 'namespace' ),
        ancestor,
        ancestorComponent,
        position;

    console.log(local_snapshot)
    // make a big assumption here, that requests will only be for a given parent,
    // not disparate parents
    if ( local_snapshot instanceof Array ) ancestor = local_snapshot[ 0 ].get( `${ancestorType}.id` );
    else ancestor = local_snapshot.get( `${ancestorType}.id` );

    position          = url.indexOf( namespace + '/' ) + namespace.length;
    ancestorComponent = '/' + Ember.String.pluralize( ancestorType );

    if ( ancestor ) ancestorComponent = ancestorComponent + `/${ancestor}`;

    url = [ url.slice( 0, position ), ancestorComponent, url.slice( position ) ].join( '' );

    return url;
  }


});

adapter/course

import ApplicationAdapter from '../adapters/application';
import NestedMixin from '../adapters/mixins/nested';


export default ApplicationAdapter.extend(NestedMixin, {
  ancestorType: 'programme'
} );

error im getting is

local_snapshot.get is not a function

when i look into model belongsToRelationships are empty means that it is not loaded correctly




Ember Application controller to share data

In an Ember engine app, can an Application Controller be used to share data between

  1. Say parent app & child engine
  2. Between 2 child engines

So one of them would set the data/attribute on the Application Controller & other would access/get it from the Application Controller

Can that be done easily or is it better to use Services.