Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

116 dependent #176

Merged
merged 20 commits into from
May 18, 2016
Merged

116 dependent #176

merged 20 commits into from
May 18, 2016

Conversation

joshmutus
Copy link
Contributor

Adds the ability to select which plots will be shown

Click the button on the middle right, below the reset zoom (home button)
image
Select which traces you want to see:
image
Press OK:
image
Will implement ALL or NONE for asssiting in selecting on large datasets. For now buttons are disabled

@DanielSank @jwenner @maffoo

@jwenner
Copy link
Contributor

jwenner commented May 9, 2016

While I'd like to be able to test this, all the computers I have access to are Windows computers. Could you please do a setup on a Linux computer? (Either that or I can't test this). Note I'd like to see how the selection menu handles long lists of dependent variables (see any of the DAC ScanPhases datasets for instance - example either at ['','Test','GHzFPGA','Ivan DAC 59','151030','0_0',3] or see Austin for a dataset at Google). I'd also like to see what you do in the case of a 2D dataset, where the menu icon is already used for "draw with vargrid"

But overall, I like the idea as seen in the photos you provided. Don't know enough to comment on the code, though.

@joshmutus
Copy link
Contributor Author

Thanks for taking a look Jim. I don't know how to deploy this branch on Matrix-reloaded for testing so I'll wait until this gets through review. If you have any suggestions from what you can see of the GUI in the screenshots, let me know

@jwenner
Copy link
Contributor

jwenner commented May 9, 2016

@joshmutus, could you please post screenshots of the following:

  1. What happens to the menu when there's a lot of dependent variables. See the GHzDAC ScanPhases I mentioned above for examples.
  2. What happens to the buttons in the case of a 2D dataset? Example: ['','Jim','AliceBobRes','Cooldown160406','160503','7-T1 Stability'].
  3. What is the text which appears when you hover the mouse over the button?
  4. What happens when the label of the traces does not match that of the first trace? For the example you showed, what happens to the y-axis label if you selected traces 1 and 3 (i.e., the two phases)?

@joshmutus
Copy link
Contributor Author

joshmutus commented May 9, 2016

  1. What happens to the menu when there's a lot of dependent variables. See the GHzDAC ScanPhases >I mentioned above for examples.

I hadn't thought of this. I'll make a it a scrollable dialog so they'll all show up.

  1. What happens to the buttons in the case of a 2D dataset? Example:
    ['','Jim','AliceBobRes','Cooldown160406','160503','7-T1 Stability'].

Nothing. Not implemented yet. What do we want the behavior to be? I forget can we have multiple deps for 2 indeps? It's been a LONG time since I've taken data :/

  1. What is the text which appears when you hover the mouse over the button?

"select trace"

  1. What happens when the label of the traces does not match that of the first trace? For the example you > showed, what happens to the y-axis label if you selected traces 1 and 3 (i.e., the two phases)?

Good catch. Not the correct thing. I'll fix that.

@joshmutus
Copy link
Contributor Author

joshmutus commented May 9, 2016

@jwenner So I've changed the behavior for the axis label for selecting traces.

If you have multiple traces with multiple labels and units, the axis label will take on the value of the lowest order of the selected trace.

For example if I have
1 - magnitude
2 - phase
3 - magnitude
4 - phase

and I select traces 2 and 4, the label will show phase (with the legend and units fields filled in)
If I select traces 1 and 3 it will label magnitude.
If I select traces 3 and 4 it will label magnitude
If I select traces 2 and 3 it will label phase

I worry displaying lots of axis labels will get cluttered, so I'm just displaying one right now. Is that behavior good for now?

Screenshot for posterity (Yes I know plot isn't re-scaling, I'm following the breadcrumbs on that now) :
image

@jwenner
Copy link
Contributor

jwenner commented May 9, 2016

Seems reasonable to me. I think this is akin to what the old Delphi grapher does (but I don't know the particular ordering that it uses). But you should definitely leave a comment in the code to this effect.

Long term, I don't know what a good solution is. One conceivable idea is to only plot traces with the same label as the first selected trace? Or to show all labels but color-coded? Or something else? Maybe @DanielSank or @maffoo has an idea.

But as for now, I think that what you propose for the axis label should work.

@joshmutus
Copy link
Contributor Author

Also, just fixed the dialog so it will be scrollable for lots of dependents. I don't have a dataset locally with very many dependents, so I can't post a nice screenshot, but it works if I scrunch the screen up to be super duper small :)

@jwenner
Copy link
Contributor

jwenner commented May 9, 2016

Since at least Austin has done the DAC ScanPhases script at Google, you all probably have a dataset with lots of dependents there. Typical location is something like ['','Test','GHzDAC', boardName,...].

@joshmutus
Copy link
Contributor Author

I actually have no idea how to deploy on that machine either :(

@joshmutus
Copy link
Contributor Author

Plot limits now change with selected traces:

All Traces
image
Phase:
image

Mag:
image

@joshmutus
Copy link
Contributor Author

Thanks for the UI feedback @jwenner ! Very handy peer review even without knowing the code.

@jwenner
Copy link
Contributor

jwenner commented May 9, 2016

From what you've said and the screenshots you've posted, a provisional LGTM (provisional based on not having tried it myself and not knowing the code). Although, we should either not close #116 or raise a new issue until this is made available in the 2D scan case as well.

@jwenner
Copy link
Contributor

jwenner commented May 9, 2016

Thinking about it, one additional idea. On the "Select Traces" menu, would it be good to show both the label and legend (so "Magnitude S11" instead of "Magnitude")? That would at least provide a way to distinguish between two magnitudes, probabilities, etc.

Also, do the traces show up in the same order between the "Select Traces" menu and the list of dependent variables on the page which shows datasets/dependents/parameters?

@joshmutus
Copy link
Contributor Author

Sure that's easy to add

@joshmutus joshmutus closed this May 9, 2016
@joshmutus joshmutus reopened this May 9, 2016
@joshmutus
Copy link
Contributor Author

added the thing.

I don't really feel comfortable merging before someone takes a look at the code. Also, even if it gets merged I don't know how to deploy to matrix-reloaded.

@DanielSank @ejeffrey do you know how to build and deploy on matrix reloaded?

@@ -70,8 +71,8 @@
</div>
<div id="selectButtons">
<!-- TODO implement these -->
<paper-button disabled>ALL</paper-button>
<paper-button disabled>NONE</paper-button>
<paper-button on-click="selectAll">ALL</paper-button>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What do these buttons do? Do they plot all traces or just select all traces in the menu? If the latter, then they should be "Select ALL" and "Select NONE".

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sure, I guess it's more clear that way.

@joshmutus
Copy link
Contributor Author

@maffoo can you take a look when you get a chance. I just fixed the way the checkboxes are read. It should log what traces are selected and which are added to this.displayTraces let me know if it works now.

@maffoo
Copy link
Contributor

maffoo commented May 16, 2016

@joshmutus, works, though I get a typescript compiler error on lines 611 and 612. I think you need to cast to the appropriate element type:

if ((<HTMLInputElement>checkbox).checked) {
  selected.push((<HTMLInputElement>checkbox).dataIndex);
}

@maffoo
Copy link
Contributor

maffoo commented May 16, 2016

BTW, I wish there were a better way to do that...

@joshmutus
Copy link
Contributor Author

Cool. I noticed the errors, just wanted to make sure it's functional.

On Mon, May 16, 2016, 11:25 AM Matthew Neeley notifications@github.com
wrote:

BTW, I wish there were a better way to do that...


You are receiving this because you were mentioned.
Reply to this email directly or view it on GitHub
#176 (comment)

@joshmutus
Copy link
Contributor Author

Pushed to the branch addressing most of the comments. I'm having trouble casting the radio button types:

app/elements/labrad-plot.ts(617,56): error TS2339: Property 'dataIndex' does not exist on type 'HTMLElement'.
app/elements/labrad-plot.ts(623,58): error TS2339: Property 'selected' does not exist on type 'HTMLElement'.

AFAICT there are no HTMLElements with the properties selected or dataIndex, those come from IronSelectableBehavior, which isn't included in the polymer-ts typings. Should I just make that typing manually? Where do I put it?

@joshmutus
Copy link
Contributor Author

So I just renamed tab-index because it exists on <HTMLInputElement> and is of the correct type. Is that reasonable?

@maffoo
Copy link
Contributor

maffoo commented May 17, 2016

I don't think you want to use tab-index to just store some data, since that is meant for controlling tabbing in the UI. It worked fine for me to use dataIndex and checked with a cast to <HTMLInputElement> as in the snippet I posted earlier.

@joshmutus
Copy link
Contributor Author

@maffoo
Data Index doesn't work for me on ```

app/elements/labrad-plot.ts(617,56): error TS2339: Property 'dataIndex' does not exist on type 'HTMLInputElement'.

@joshmutus
Copy link
Contributor Author

So, this quiets the compiler and allows me to create my own custom properties:

I made a new class:

class CustomSelector extends HTMLElement {
  //Is this a hack?
  selected: string;
  dataIndex: number;
}

And I call
(<CustomSelector>radio).selected and (<CustomSelector>checkbox).dataIndex

Is that a total hack?

@maffoo
Copy link
Contributor

maffoo commented May 17, 2016

Technically, DOM attributes that start with data- are supposed to be accessed in javascript through the dataset field, so this should be

selected.push((<HTMLInputElement>checkbox).dataset.index);

Does that work for you? I tried that and while the typescript compiler accepted it, it didn't work at run time. I'm just curious if that works for you. I'm guessing polymer is doing something non-standard with data attributes. Also, it would appear that you and I have different typescript and/or other library versions and maybe that is the source of the different behavior we're seeing here.

Rather than create a class just to cast to it, I would suggest just casting to <any> and adding a comment with a TODO to come back and investigate this further.

@joshmutus
Copy link
Contributor Author

That neither works for me at runtime or compiles cleanly:

app/elements/labrad-plot.ts(617,64): error TS2339: Property 'index' does not exist on type 'DOMStringMap'

@maffoo
Copy link
Contributor

maffoo commented May 17, 2016

Ok, I figured out how to make this work with data- attributes.

First, you have to use "explicit attribute binding" in labrad-plot.html, as described here:

<paper-checkbox checked name="traces" data-index$="{{index}}">{{index}}</paper-checkbox>

Then, you need to use square-bracket indexing to get at items inside the dataset object in labrad-plot.ts (the type definiton for DOMStringMap is here):

selected.push(Number(checkbox.dataset['index']));

All that being said, I'm not sure using a data- attribute like this is really worth it given that polymer already has mechanisms to pass things through the DOM to javascript.

How about this: use a new attribute name, say, trace-index and then just cast to <any> to make typescript happy:

in labrad-plot.html:

<paper-checkbox checked name="traces" trace-index="{{index}}">{{index}}</paper-checkbox>

in labrad-plot.ts

selected.push((<any>checkbox).traceIndex);

Sorry for all the back and forth on this. I figure if we work out a reasonable pattern here we can just use it in the future. Does this latter proposal seem reasonable to you?

@joshmutus
Copy link
Contributor Author

Thanks for figuring this out. Totally cool with the back and forth, I'm glad we can find a way to do this properly as I think we'll be having to expand on this feature in the near future for dataset specific plotting. I'll add all this as soon as I can.

One question, that DOMStringMap typing... should that already be in typescript? Do I have to upgrade it or do I have to add this typing manually?

@maffoo
Copy link
Contributor

maffoo commented May 17, 2016

That DOMStringMap definition is in lib.d.ts which is bundled with typescript. Basically, it provides typescript definitions for all of the built-in browser APIs. You can find it inside node_modules if you're curious, but there's nothing you need to do to use these definitions.

@joshmutus
Copy link
Contributor Author

Alright. I think I made all the changes you commented on. Please take a quick look when you get the chance.

Thanks for the input!

@maffoo
Copy link
Contributor

maffoo commented May 18, 2016

Choosing a trace on a 2D plot does not work for me. If I choose trace 0, the console log shows [NaN] for selected traces and the plotting does not work. If I choose trace 1, the console log shows [1] and it does seem to plot the new trace, although the coloring is wrong; it seems the z data limits need to be recomputed in that case.

@joshmutus
Copy link
Contributor Author

Hm.

You're on the latest commit of the branch? One of the earlier commits broke
2D trace selection.

At least the color scale should recompute each time...

On Tue, May 17, 2016, 5:26 PM Matthew Neeley notifications@github.com
wrote:

Choosing a trace on a 2D plot does not work for me. If I choose trace 0,
the console log shows [NaN] for selected traces and the plotting does not
work. If I choose trace 1, the console log shows [1] and it does seem to
plot the new trace, although the coloring is wrong; it seems the z data
limits need to be recomputed in that case.


You are receiving this because you were mentioned.
Reply to this email directly or view it on GitHub
#176 (comment)

@maffoo
Copy link
Contributor

maffoo commented May 18, 2016

Yeah, I'm on the latest commit. The radio buttons display strange behavior as well; when the dialog opens neither is selected, and I can select both or neither options, which I wouldn't expect with a radio button.

@joshmutus
Copy link
Contributor Author

I've seen all those problems in the past, but I'm not seeing them on my end. You sure you're on 68c0177??

Maybe polymer components are out of date? Do a bower install?

@maffoo
Copy link
Contributor

maffoo commented May 18, 2016

After fiddling with bower packages, it works. LGTM

@joshmutus
Copy link
Contributor Author

Cool, thanks for figuring that out. It's a bit troubling this is fragile in regards to the bower packages...

How do we feel about squashing and merging through the web interface on this repo?

@maffoo
Copy link
Contributor

maffoo commented May 18, 2016

Merging through the web interface is fine by me. I just changed the repo settings to only allow squash merges.

@joshmutus joshmutus merged commit 7b4f8a6 into master May 18, 2016
@joshmutus
Copy link
Contributor Author

Shoot, forgot to say this fixes 116

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants