Register a SA Forums Account here!
JOINING THE SA FORUMS WILL REMOVE THIS BIG AD, THE ANNOYING UNDERLINED ADS, AND STUPID INTERSTITIAL ADS!!!

You can: log in, read the tech support FAQ, or request your lost password. This dumb message (and those ads) will appear on every screen until you register! Get rid of this crap by registering your own SA Forums Account and joining roughly 150,000 Goons, for the one-time price of $9.95! We charge money because it costs us money per month for bills, and since we don't believe in showing ads to our users, we try to make the money back through forum registrations.
 
  • Post
  • Reply
Wheany
Mar 17, 2006

Spinyahahahahahahahahahahahaha!

Doctor Rope
Hmm, Ember seems like it's superficially well documented, like the store's find function:
http://emberjs.com/api/data/classes/DS.Store.html#method_find

The documentation says that the function returns a promise. Fine. That means I can call then() on it. What arguments does then() get called with in the different scenarios?

DS.RecordArray when you call find without an id, a single model when you call find with an id

Adbot
ADBOT LOVES YOU

Dr. Poz
Sep 8, 2003

Dr. Poz just diagnosed you with a serious case of being a pussy. Now get back out there and hit them till you can't remember your kid's name.

Pillbug
Working on an app that is long in the tooth and want to introduce a client side framework to make life easier and the team has settled on Angular. This is an existing business app so making huge changes is going to be near impossible so I'm trying to ease the transition. Is it possible to get URL parameter values without driving the entire apps ability to route through Angular routing? Currently MVC is returning the page & data with a route like "foo/manage/1" and I wan't Angular to be able to read the "1" from the URL parameters so it can make a Ajax request for a resource. If I sound like I'm going about this backwards or wrong, please correct me.

Maluco Marinero
Jan 18, 2001

Damn that's a
fine elephant.

Dr. Poz posted:

Working on an app that is long in the tooth and want to introduce a client side framework to make life easier and the team has settled on Angular. This is an existing business app so making huge changes is going to be near impossible so I'm trying to ease the transition. Is it possible to get URL parameter values without driving the entire apps ability to route through Angular routing? Currently MVC is returning the page & daata with a route like "foo/manage/1" and I wan't Angular to be able to read the "1" from the URL parameters so it can make a Ajax request for a resource. If I sound like I'm going about this backwards or wrong, please correct me.

Just use standard JavaScript to parse the location (window.location) if you intend on a controller doing it's thing without using Angulars routing. Saying this under the assumption that the way you're using Angular is not as a single page app, but rather as a part of a server delivered page that has a section you want to be Angular driven.

edit: or you can use the $location service from Angular if you want to be proper about it, that should give you access to window.location too.

Maluco Marinero fucked around with this message at 00:27 on Jul 18, 2014

fuf
Sep 12, 2004

haha
I'm finding it hard to find a good balance between easing load on the server and sending unnecessary data to the client.

My app lets users search a list of ~1000 book titles. I don't know whether it would be more efficient to:
a) send the entire list to each client when the page loads and let the front end (Angular in this case) handle all searching and filtering.
b) perform the search on the server and only send the results to the client.

I'm inclining towards option a) because although it means a slower initial page load it should make "live" searching a lot smoother. But something in me balks at the idea of sending all that data to the client (especially if the db starts getting bigger...).

Any thoughts? How do other people make these kinds of decisions?

Subjunctive
Sep 12, 2006

✨sparkle and shine✨

1000 book titles is going to be like 30K of data before compression, and it can be loaded in parallel with the rest of the page to not block long. You could keep it prepared and compressed so it's a static load and basically zero server impact.

Are multiple searches common per-load? If so you could do the first search on the server and hand back the results plus the full list for subsequent searches. You'd minimize latency, and let follow-up searches be client-side fast. Have to keep server and client search code in sync, though.

I generally make the decision by measuring. If the first thing I try is fast enough, on to the next thing.

fuf
Sep 12, 2004

haha

Subjunctive posted:

1000 book titles is going to be like 30K of data before compression, and it can be loaded in parallel with the rest of the page to not block long. You could keep it prepared and compressed so it's a static load and basically zero server impact.

OK when you put it like that the answer seems obvious! Makes life a lot easier as well if I only need one call to the back end. Also I guess in the big scheme of things bandwidth is cheaper than processing power?

Thanks for the input - just wanted some reassurance I wasn't missing something :)

v1nce
Sep 19, 2004

Plant your brassicas in may and cover them in mulch.
Sending all the data to the client so it can be searched client-side is only going to get hairy if:
- The dataset becomes overwhelmingly huge
- The data you want to display when a search is matched causes the initial payload to need to be huge.
- You want to do some kind of analytics. Even here you could async a request to the server for tracking only, where the response does not matter.

30k isn't to be sniffed at, but you can set a cache duration in the response so clients aren't hitting your server for data every time they hit refresh. That should cut down almost all the bandwidth problems.

Processing power doesn't really factor in, it's more about giving the user a smooth, instantaneous response to every input. Every time they see a spinner, or the app is unresponsive, it's annoying.

Subjunctive
Sep 12, 2006

✨sparkle and shine✨

HTTP caching semantics should give you what you want if you set the control headers correctly and take advantage of If-Modified-Since request headers.

fletcher
Jun 27, 2003

ken park is my favorite movie

Cybernetic Crumb

fuf posted:

I'm finding it hard to find a good balance between easing load on the server and sending unnecessary data to the client.

My app lets users search a list of ~1000 book titles. I don't know whether it would be more efficient to:
a) send the entire list to each client when the page loads and let the front end (Angular in this case) handle all searching and filtering.
b) perform the search on the server and only send the results to the client.

I'm inclining towards option a) because although it means a slower initial page load it should make "live" searching a lot smoother. But something in me balks at the idea of sending all that data to the client (especially if the db starts getting bigger...).

Any thoughts? How do other people make these kinds of decisions?

I think you already have the answer you want (it's a small amount of data, prefetch it) but you may also want to check out the typeahead.js library because it handles all the prefetching, caching, remote searching, etc for you with a nice API.

Wheany
Mar 17, 2006

Spinyahahahahahahahahahahahaha!

Doctor Rope
In Ember, I currently have a Google maps view (i.e. it extends Ember.View) that shows vehicles markers on the map. It currently doesn't do anything except add the markers on the map, but later I want it to update the vehicles' coordinates in real time every time the vehicle collection is updated, either from the browser or when data is refreshed from the server. I tried just changing the coordinates of the vehicles from the browser's console, but that didn't work, understandably.

Currently I access the vehicles like this, but it feels wrong: this.get('controller').get('store').find('vehicle').then(myCallback);

This is a component that is always visible in the app, so it's not associated with a particular route, so setting a model in the route object doesn't sound right either.

How should I provide the vehicles (and later other collections) to the view and then get notified for changes in any of them? Can I .observe() the store? Should I?

Wheany
Mar 17, 2006

Spinyahahahahahahahahahahahaha!

Doctor Rope
Also, when using DS.RESTAdapter, your API endpoint has to be at the root of the host, or on some fixed path?

AFAIK there is no way of using a relative path except by configuring the adapter with "namespace: window.location.pathname.substring(1)", which also smells wrong to me.

Dr. Poz
Sep 8, 2003

Dr. Poz just diagnosed you with a serious case of being a pussy. Now get back out there and hit them till you can't remember your kid's name.

Pillbug

Maluco Marinero posted:

Just use standard JavaScript to parse the location (window.location) if you intend on a controller doing it's thing without using Angulars routing. Saying this under the assumption that the way you're using Angular is not as a single page app, but rather as a part of a server delivered page that has a section you want to be Angular driven.

edit: or you can use the $location service from Angular if you want to be proper about it, that should give you access to window.location too.

Hey, thanks for the reply. I ended up not using Angular for that particular page because other issues came up and there was the need to "just get it done".

Now, however I'm working on a page and have the time to develop it with angular from the start. This has led to a question of how to approach loading data for a Master/Detail grid. We're using the Angular UI ng-grid and my team mate and I have had a small difference of opinion in how to load the detail portions with data.

Approach One
Pull all master/detail data simultaneously.

Approach Two
Load all master records on page load/filter. When a user clicks a given row, execute an HTTP request to get the detail data, then display that in the detail panel.

Background: This page can potentially display a fairly hefty amount of data. Up to a max of 100 rows with potentially between 5-20 rows of detail records.

Given the background and the scenarios laid out, which seems more appropriate?

Edit: Wow, I wish I had read the posts made since my last one since the topics are so closely related.

Dr. Poz fucked around with this message at 17:20 on Jul 29, 2014

Wheany
Mar 17, 2006

Spinyahahahahahahahahahahahaha!

Doctor Rope

Wheany posted:

In Ember, I currently have a Google maps view (i.e. it extends Ember.View) that shows vehicles markers on the map. It currently doesn't do anything except add the markers on the map, but later I want it to update the vehicles' coordinates in real time every time the vehicle collection is updated, either from the browser or when data is refreshed from the server. I tried just changing the coordinates of the vehicles from the browser's console, but that didn't work, understandably.

Currently I access the vehicles like this, but it feels wrong: this.get('controller').get('store').find('vehicle').then(myCallback);

This is a component that is always visible in the app, so it's not associated with a particular route, so setting a model in the route object doesn't sound right either.

How should I provide the vehicles (and later other collections) to the view and then get notified for changes in any of them? Can I .observe() the store? Should I?

Well, I haven't gotten so far as to get this thing actually working as it should, but I'm going to use a MapController that has a visibleVehicles property that will change. I can observe that at least.

Now, on to my current problem: is there a way to set the default selection in a {{select multiple}}? I have this:
code:
{{view Ember.Select multiple=true
	content=vehicles
	optionValuePath="content.id"
	optionLabelPath="content.name"
	selection=selectedVehicles
	size=7
}}
It works in that I can get a list of selected vehicles from the selectedVehicles property. But how should I set the property so that selectedVehicles contains the vehicle with id 0 ("all vehicles") when the user enters the route. I'm fine with just doing a vehiclesController.set('selectedVehicles', [get vehicle id 0 from the model or even the store]), but there are so many asynchronous bits and bobs involved that I'm not sure how and when I'm supposed to do that.

Wheany
Mar 17, 2006

Spinyahahahahahahahahahahahaha!

Doctor Rope

Wheany posted:

I'm fine with just doing a vehiclesController.set('selectedVehicles', [get vehicle id 0 from the model or even the store]), but there are so many asynchronous bits and bobs involved that I'm not sure how and when I'm supposed to do that.

Okay, turns out this is what I needed to do:
In the route's setupController:
JavaScript code:
setupController: function (controller, model) {
	this._super(controller, model);

	// model.vehicles is a DS.PromiseArray
	model.vehicles.then(function () {
		controller.set('selectedVehicles', [model.vehicles.findBy('id', '0')]);
	});
}

Jimlit
Jun 30, 2005



Anyone tried YUI?

Just from looking over the website it seems to have a huge amount of features. Just like to get some opinions of it in practice if anyone has experience with it.

The Merkinman
Apr 22, 2007
Probation
Can't post for 3 hours!
So I'm starting a new project from scratch using Foundation and SASS. Should my entire site be in app.css? That seems a bit bulky to have CSS for elements on one page loaded on all pages. Is a suggestion way to have app.css really just be for elements like .columns, <p>, <h1>, and not .myWidgetContainer, #thingOnOnlyOnePage etc?

fuf
Sep 12, 2004

haha

The Merkinman posted:

So I'm starting a new project from scratch using Foundation and SASS. Should my entire site be in app.css? That seems a bit bulky to have CSS for elements on one page loaded on all pages. Is a suggestion way to have app.css really just be for elements like .columns, <p>, <h1>, and not .myWidgetContainer, #thingOnOnlyOnePage etc?

If you're already loading the whole of Foundation on every page then I don't think a few of your own css rules are going to make much difference.

You could also look into the frameworks mentioned in the OP of this thread that let you load content without refreshing the page - that way you only need to load your css once.

A good way to trim down your css is to check foundation.scss and comment out any components that you know for sure aren't being used. I have a single "main.scss" which imports just the Foundation components I need and then I add my own rules.

Chilled Milk
Jun 22, 2003

No one here is alone,
satellites in every home

fuf posted:

If you're already loading the whole of Foundation on every page then I don't think a few of your own css rules are going to make much difference.

You could also look into the frameworks mentioned in the OP of this thread that let you load content without refreshing the page - that way you only need to load your css once.

A good way to trim down your css is to check foundation.scss and comment out any components that you know for sure aren't being used. I have a single "main.scss" which imports just the Foundation components I need and then I add my own rules.

Not to mention the browser will cache that huge singular CSS file after the first load anyway

The Merkinman
Apr 22, 2007
Probation
Can't post for 3 hours!

The Milkman posted:

Not to mention the browser will cache that huge singular CSS file after the first load anyway
That's actually my fear, we create/update pages a lot so I'd hate for either:
A) the older app.css file to be cached and the page be broken or
B) The user needs to redownload the large app.css every time we make/update a page (that they may not even visit).

fletcher
Jun 27, 2003

ken park is my favorite movie

Cybernetic Crumb

The Merkinman posted:

That's actually my fear, we create/update pages a lot so I'd hate for either:
A) the older app.css file to be cached and the page be broken or
B) The user needs to redownload the large app.css every time we make/update a page (that they may not even visit).

For point A you can just append a random string in the filename on deployment, like app.dked93ks393.css.

For point B, I wouldn't worry about it until it becomes a problem, because it probably won't be.

ErikTheRed
Mar 12, 2007

My name is Deckard Cain and I've come on out to greet ya, so sit your ass and listen or I'm gonna have to beat ya.

fletcher posted:

For point A you can just append a random string in the filename on deployment, like app.dked93ks393.css.

Isn't it better/easier to use a query string like: app.css?12345

fletcher
Jun 27, 2003

ken park is my favorite movie

Cybernetic Crumb

ErikTheRed posted:

Isn't it better/easier to use a query string like: app.css?12345

I use the filename method since I've heard it is more compatible with other proxy/caching services that might be in the chain. Although personally, I've haven't run into an issue yet. django-pipeline does it for me and sticks the unique string in the filename.

http://www.stevesouders.com/blog/2008/08/23/revving-filenames-dont-use-querystring/

wwb
Aug 17, 2004

If the query string gets eaten by the proxy pipeline you'll have more problems than just serving fresh CSS. Either way works, filenames if infrastructure supports it, query strings if not.

fletcher
Jun 27, 2003

ken park is my favorite movie

Cybernetic Crumb

wwb posted:

If the query string gets eaten by the proxy pipeline you'll have more problems than just serving fresh CSS. Either way works, filenames if infrastructure supports it, query strings if not.

It's not that the proxy pipeline eats the query string, it's just that it would be a cache miss for anything that contains a query string.

wwb
Aug 17, 2004

Ok, we are talking server-side here. Just about every server-side caching / proxy solution I know of handles query strings just fine if properly configured. Now that is a big if . . .

Stoph
Mar 19, 2006

Give a hug - save a life.

The Merkinman posted:

So I'm starting a new project from scratch using Foundation and SASS. Should my entire site be in app.css?

Yeah, your entire stylesheet for the site should be in a single file when served to the browser. However, there is a limit on selectors in IE, so if you run a huge site with a lot of stylesheet rules, then you add a tool like Bless to split the stylesheet into two different files:

http://blesscss.com/

Newf
Feb 14, 2006
I appreciate hacky sack on a much deeper level than you.
I'm playing with the tutorial for reactjs.net, and I've been pulling my hair out trying to find some misplaced comma, or other such error, in my jsx file which is causing it to fail to be converted and delivered to the client as javascript. There has to be some tooling that will help me with this, but I can't find it.

Help?

Thermopyle
Jul 1, 2003

...the stupid are cocksure while the intelligent are full of doubt. —Bertrand Russell

Newf posted:

I'm playing with the tutorial for reactjs.net, and I've been pulling my hair out trying to find some misplaced comma, or other such error, in my jsx file which is causing it to fail to be converted and delivered to the client as javascript. There has to be some tooling that will help me with this, but I can't find it.

Help?

My guess is there's not a lot of people here using that, but there are a few of us using React outside of .NET. Thus, you may be better off just posting your JSX and getting us to look at it.

In my experience there's not a whole lot of JSX tooling yet.

Newf
Feb 14, 2006
I appreciate hacky sack on a much deeper level than you.

Thermopyle posted:

My guess is there's not a lot of people here using that, but there are a few of us using React outside of .NET. Thus, you may be better off just posting your JSX and getting us to look at it.

In my experience there's not a whole lot of JSX tooling yet.

There was a pair of ()s that should have been {}s, but the specific instance is hardly the point. I'm still really lovely with JS in general, but it seems to me that the only recourse for a page flat out not displaying is to revert a step or two and go again - beats the hell out of 'there might be a missing comma in this 7000 line file'.

Thermopyle
Jul 1, 2003

...the stupid are cocksure while the intelligent are full of doubt. —Bertrand Russell

Newf posted:

There was a pair of ()s that should have been {}s, but the specific instance is hardly the point. I'm still really lovely with JS in general, but it seems to me that the only recourse for a page flat out not displaying is to revert a step or two and go again - beats the hell out of 'there might be a missing comma in this 7000 line file'.

Well, if you check the console there's often enough information in the logging to figure out what you've messed up.

nexus6
Sep 2, 2011

If only you could see what I've seen with your eyes

Jimlit posted:

Anyone tried YUI?

Just from looking over the website it seems to have a huge amount of features. Just like to get some opinions of it in practice if anyone has experience with it.

Yep, hate it. It manages to do in 30 lines what jQuery can do in 2, especially AJAX calls.

Analytic Engine
May 18, 2009

not the analytical engine
Edit: Thanks for finding the dead links Misogynist

Analytic Engine fucked around with this message at 03:29 on Aug 14, 2014

Vulture Culture
Jul 14, 2003

I was never enjoying it. I only eat it for the nutrients.

Analytic Engine posted:

Can someone please brutally rip apart my resume? I'm shooting for internships or entry-level work in web dev and data visualization in NYC.

My background is in science and only tangentially related to coding, and Goons have been super helpful so far.

https://www.dropbox.com/s/362h1sbf2...8_12_newest.pdf
https://www.dropbox.com/s/r5e2jws93..._12_newest.docx
404 on both URLs

Analytic Engine
May 18, 2009

not the analytical engine
Can someone please brutally rip apart my resume? I'm shooting for internships or entry-level work in web dev and data visualization in NYC.

My background is in science and only tangentially related to coding, and Goons have been super helpful so far.

https://www.dropbox.com/s/362h1sbf2tz32q6/ae_resume_8_12_newest.pdf
https://www.dropbox.com/s/r5e2jws93sswrg0/ae_resume_8_12_newest.docx

Analytic Engine fucked around with this message at 03:30 on Aug 14, 2014

Pollyanna
Mar 5, 2005

Milk's on them.


So in Ember, why is it that we define things like:

code:
App.ThingRoute = Ember.Route.extend({
    model: function() {
        return thing;
    }
});
instead of like:

code:
App.ThingRoute = Ember.Route.extend({
    model: thing
});
where thing is assumed to just be a generic object? What's the point of passing in a function instead of just a reference to that object?

Lumpy
Apr 26, 2002

La! La! La! Laaaa!



College Slice

Pollyanna posted:

So in Ember, why is it that we define things like:

code:
App.ThingRoute = Ember.Route.extend({
    model: function() {
        return thing;
    }
});
instead of like:

code:
App.ThingRoute = Ember.Route.extend({
    model: thing
});
where thing is assumed to just be a generic object? What's the point of passing in a function instead of just a reference to that object?

Because it is called so you can put logic in it.

Sedro
Dec 31, 2008
A route isn't associated with a single model instance. The route is a singleton which loads one model at a time (for example, by using JQuery to call a REST API).

When the user navigates to /#/thing/123, the router calls the model hook with the thing ID, ThingRoute.model({ id: 123 }). The model hook returns the corresponding model, which can be a plain JS object, an Ember.Object, or a promise which resolves to either of those. The router sets the model property on ThingController, which is a singleton acting as a proxy to the model.

Ochowie
Nov 9, 2007

In Angular, how do you catch the event when a tab is closed or the whole page is refreshed. I am working with Angular and SignalR and it seems that since Angular co-opts the window unloaded event that the SignalR connection isn't terminated (the OnDisconnect doesn't fire on the server). I tried using
code:
$rootScope.$on('$stateChangeStart')
but that seems to work only for transitions between multiple view templates and not a complete exit of the page.

SuicideSnowman
Jul 26, 2003
Not sure of the Angular way, but with straight JS you can use window.onbeforeunload and that should handle both refreshes and tab closes..

edit: looks like you may have tried this already? Perhaps $locationChangeStart instead of $stateChangeStart

SuicideSnowman fucked around with this message at 03:58 on Aug 20, 2014

Adbot
ADBOT LOVES YOU

Ochowie
Nov 9, 2007

SuicideSnowman posted:

Not sure of the Angular way, but with straight JS you can use window.onbeforeunload and that should handle both refreshes and tab closes..

edit: looks like you may have tried this already? Perhaps $locationChangeStart instead of $stateChangeStart

$locationChangeStart seems to trigger when I load a page rather than when I destroy the app. I hit the breakpoint when I reload the page but I don't hit my server breakpoint when I destroy the page by closing the tab.

  • 1
  • 2
  • 3
  • 4
  • 5
  • Post
  • Reply