How to Populate koGrid Groups Array - grouping

I have a koGrid configured as follows:
var myItemsGrid = {
data: myItems,
columnDefs: [
{ field: 'item.title', displayName: 'Title', cellTemplate: $("#cdfUrlCellTemplate").html() },
{ field: 'item.dueTimeUtc', displayName: 'Due', cellFormatter: formatDate, sortFn: sortDates },
{ field: 'id', displayName: 'Edit', cellTemplate: $("#editCellTemplate").html() }
],
showGroupPanel: true,
groups: ['item.title'],
showFilter: false,
canSelectRows: false
};
My problem is that the groups array, which I have tried to populate using the field name of one of the fields in my grid, causes the following error:
TypeError: Cannot read property 'isAggCol' of undefined
How should I be populating the groups array so that I can set up initial grouping for my grid?

I had the same problem and took a different approach by sending an event to the grid control to group by the first heading. Something like this:
jQuery("#symbolPickerView").find(".kgGroupIcon").first().click();
This works until there is some sort of patch generally available.

I ended up having to patch the koGrid script to get the initial grouping of columns to work.
If anyone else has the problem I'm happy to provide the patched script. I will look at making a pull request to get the fix into the koGrid repository after putting it through its paces a bit more.

Related

SpreadJS FromJson Chart load

I'm using SpreadJS v12 as a reporting tool. User will enter the page get the wanted data, create charts and save it for later use.
When user saves the report I get Json data (GC.Spread.Sheets.Workbook.toJSon) and save this Json to database and whenever someone tries to reach the same report, I get the Json from database and give it to the page (GC.Spread.Sheets.Workbook.fromJSon). Everything works fine except if there is a chart on page the data source for chart series (xValues and yValues) change. When I check Json format it looks like this: Sheet2!$B$2:$B$25 but in chart it's: Sheet2!$A$1:$A$24 . Am I doing something wrong?
By the way my serialize options: { ignoreFormula: false, ignoreStyle: false, rowHeadersAsFrozenColumns: true, columnHeadersAsFrozenRows: true, doNotRecalculateAfterLoad: false }
this.state.spread = new GC.Spread.Sheets.Workbook(document.getElementById("spreadSheetContent"), { sheetCount: 1 });
This is my save method:
var pageJson = this.state.spread.toJSON(this.serializationOption);
let self = this;
let model = {
Id: "",
Name: reportName,
Query: query,
PageJson: JSON.stringify(pageJson)
}
this.post( { model }, "Query/SaveReportTemplate")
.done(function(reply){
self.createSpreadSheet(reply);
}).fail(function(reply){
self.PopUp(reply, 4 );
});
And this is my load method:
var jsonOptions = {
ignoreFormula: false,
ignoreStyle: false,
frozenColumnsAsRowHeaders: true,
frozenRowsAsColumnHeaders: true,
doNotRecalculateAfterLoad: false
}
this.state.spread.fromJSON(JSON.parse(template.PageJson),jsonOptions);
this.state.spread.repaint();
Well after a long day, I think I've found what's causing the problem and started working around that.
Let's say we have two sheets. Sheet1's index is 0 and Sheet2's index is 1.
Because of the json serialization options like frozenColumnsAsRowHeaders and frozenRowsAsColumnHeaders until Sheet2 is painted row numbers and column number are different in the json.
If there is a formula or a chart in Sheet1 that's referencing Sheet2, their references will point to a different cell from what you set first. So always referencing the sheets that will be painted before is the way to solve this problem.

Creating a specific Sublime Text's snippet, using Regular Expressions

Context
I have a process that envolves creating similar file/filename structures that have inside of it the name of itself, and things like that, i do this every day, and i see that is repetitive and have a pattern, then i got the idea of creating a Sublime Text's Snippet to generate the code for me, adding a significant improvement on my performance.
Example
There is a example of a complete "model" using the structure that i said:
Ext.define('App.model.geral.layouts.Layouts', {
extend: 'App.ux.model.base',
fields: [
{ name: 'Foo', type: 'string', fieldLabel: 'Foo' },
{ name: 'Bar', type: 'int', fieldLabel: 'Bar' },
{ name: 'FooTwo', type: 'boolean', fieldLabel: 'FooTwo' },
{ name: 'Date', type: 'date', fieldLabel: 'Date' },
],
proxy: Use.util.Model.getProxy({
controller: 'Layouts'
})
});
This is a simple and small sample of a file using mine structure. So that file, following the patterns will be placed at C:/Dev/Com/app/model/geral/layouts/Layouts.js, because models, are inside the folder model and geral is the module that the entity layouts belong to.
What i've tried
I tried various things and the most far i did go was that snippet file:
<snippet>
<content><![CDATA[
Ext.define('App.model.${TM_FILEPATH/.+(?:model\/)(.+)\.\w+/\l$1/}', {
extend: '',
fields: [ ],
proxy: ''
});
]]></content>
<tabTrigger>mitem</tabTrigger>
</snippet>
When i trigger that snippet on a empty file named and located in: C:/Dev/Com/app/model/geral/layouts/Layouts.js (as the pattern), it results:
Ext.define('App.model.geral/layouts/Layouts', {
extend: '',
fields: [ ],
proxy: ''
});
As you can see, i got 'App.model.geral/layouts/Layouts' instead of 'App.model.geral.layouts.Layouts' that is what i want. I am close to the final result that i want, as you can see on the complete model example, by the way i cannot go far than that, i dont have any knowledge of RegExp what i did was only researching and trying different things.
If helpful, there is a more complete info about Sublime Snippets that i found is:
$PARAM1 .. $PARAMn Arguments passed to the insert_snippet command. (Not covered here.)
$SELECTION The text that was selected when the snippet was triggered.
$TM_CURRENT_LINE Content of the cursor’s line when the snippet was triggered.
$TM_CURRENT_WORD Word under the cursor when the snippet was triggered.
$TM_FILENAME Name of the file being edited, including extension.
$TM_FILEPATH Path to the file being edited.
$TM_FULLNAME User’s user name.
$TM_LINE_INDEX Column where the snippet is being inserted, 0 based.
$TM_LINE_NUMBER Row where the snippet is being inserted, 1 based.
$TM_SELECTED_TEXT An alias for $SELECTION.
$TM_SOFT_TABS YES if translate_tabs_to_spaces is true, otherwise NO.
$TM_TAB_SIZE Spaces per-tab (controlled by the tab_size option).
I used that info to get the filepath, i tried using another variables like filename but did not get that far.
That will be very useful if someone can help me to get to the final result.
You can achieve what you want with the following:
<snippet>
<content><![CDATA[
Ext.define('App.model.${TM_FILEPATH/(^.+\/model\/)|(\w+)|(\.\w+$)|(\/)/(?2$2)(?4.)/g}', {
extend: '',
fields: [ ],
proxy: ''
});
]]></content>
<tabTrigger>mitem</tabTrigger>
</snippet>
Btw, I highly recommend installing the PackageDev package if you haven't already, to get some syntax highlighting on the snippet and regular expression/replacement.
How it works:
Match:
(^.+\/model\/) match from the beginning of the file path up to and including /model/, and store in capture group 1
| or
(\w+) match any sequence of word characters and store in capture group 2
| or
(\.\w+$) match the file extension and store in capture group 3
| or
(\/) match a / and store in capture group 4
Replacement:
(?2$2) if capture group 2 participated in the match, replace it with itself - i.e. keep it
(?4.) if capture group 4 participated in the match, replace it with a dot
Flags:
g global modifier to match as many times as possible
Arguably you don't need the capture groups 1 and 3, but I included them to make it easier to tell what is being matched.

Ember Data Nested Resources Tree Structure

I have a slightly peculiar problem with loading my tree structure into Ember.
My models are:
book.js
- parts: DS.hasMany('part', {inverse: 'book', async: true})
part.js
- subparts: DS.hasMany('part', {inverse: 'parent_part', async: true}),
With the following API responses:
GET /api/books:
{
books: [
{id: 1, links: {parts: "/api/books/1/parts"}},
...
]
}
GET /api/books/1/parts:
{
parts: [
{
id: 1,
subparts: [10, 11]
},
{
id: 2,
subparts: []
}
]
}
The problem is in the tree nature of the parts: The book only has direct descendants id 1 and 2, but these have sub-parts on their own.
The structure as it is works but results in multiple sub-queries for each part that was not included in the /books/1/parts result. I want to avoid these queries, not only because of performance reasons but also because I will need additional query parameters which would get lost at this step... I know about coalesceFindRequests but it introduces new problems.
To rephrase the problem, Ember Data thinks that every part that is included in the /books/1/parts response should be added directly to the book:parts property. How can I still load all records of the parts tree at the same time?
I tried renaming the fields, but Ember Data assigns the records based on the model name, not the field name.
I fear that some creative adapter overriding will be necessary here. Any idea appreciated. The backend is completely under my control, so I could change things on that end, too.
You need to use a process called sideloading, which should work as you expect (I've had issues in the past with sideloading data). As mentioned in this issue, you want to split your parts into two separate arrays.
{
// These are the direct children
"parts": [{...}, {...}],
// These are the extra records
"_parts": [{...}, {...}]
}

Create / Update multiple objects from one API response

all new jsfiddle: http://jsfiddle.net/vJxvc/2/
Currently, i query an api that will return JSON like this. The API cannot be changed for now, which is why I need to work around that.
[
{"timestamp":1406111961, "values":[1236.181, 1157.695, 698.231]},
{"timestamp":1406111970, "values":[1273.455, 1153.577, 693.591]}
]
(could be a lot more lines, of course)
As you can see, each line has a timestamp and then an array of values. My problem is, that i would actually like to transpose that. Looking at the first line alone:
{"timestamp":1406111961, "values":[1236.181, 1157.695, 698.231]}
It contains a few measurements taken at the same time. This would need to become this in my ember project:
{
"sensor_id": 1, // can be derived from the array index
"timestamp": 1406111961,
"value": 1236.181
},
{
"sensor_id": 2,
"timestamp": 1406111961,
"value": 1157.695
},
{
"sensor_id": 3,
"timestamp": 1406111961,
"value": 698.231
}
And those values would have to be pushed into the respective sensor models.
The transformation itself is trivial, but i have no idea where i would put it in ember and how i could alter many ember models at the same time.
you could make your model an array and override the normalize method on your adapter. The normalize method is where you do the transformation, and since your json is an array, an Ember.Array as a model would work.
I am not a ember pro but looking at the manual I would think of something like this:
a = [
{"timestamp":1406111961, "values":[1236.181, 1157.695, 698.231]},
{"timestamp":1406111970, "values":[1273.455, 1153.577, 693.591]}
];
b = [];
a.forEach(function(item) {
item.values.forEach(function(value, sensor_id) {
b.push({
sensor_id: sensor_id,
timestamp: item.timestamp,
value: value
});
});
});
console.log(b);
Example http://jsfiddle.net/kRUV4/
Update
Just saw your jsfiddle... You can geht the store like this: How to get Ember Data's "store" from anywhere in the application so that I can do store.find()?

How to load RubyMotion table view cell data from file

I'm getting started with RubyMotion and ProMotion. I'm building a table view and I would like to move the data out into an external file to make it easier to manage. Here's what I have so far:
class MasterScreen < PM::TableScreen
title 'States'
def table_data
[{
title: "Northwest States",
cells: [
{ title: "Oregon", action: :view_details, arguments: { state: #oregon }},
{ title: "Washington", action: :view_details, arguments: { state: #washington }}
]
}]
end
def view_details
open DetailScreen.new(nav_bar: true)
end
end
I'd like to move the names of the states (basically the cell titles) into something like a YAML or JSON file that I can load and iterate over. How can I achieve something like this?
Update: I managed to figure out how to load text from a file.
First I added bubble-wrap to my Gemfile and ran bundle install. BubbleWrap provides the helper method App.resources_path.
In my_app/resources/states.txt I have a list of states, separated by new lines:
Oregon
Washington
Foobar
In my Table View Controller, I read the file and split the file into an array of lines.
class MasterScreen < PM::TableScreen
title 'States'
def on_load
data = File.read("#{App.resources_path}/states.txt")
#states = data.lines
end
def table_data
[{
title: "Northwest States",
cells: #states.map do |state|
{
title: state,
action: :view_details,
arguments: { state: state }
}
end
}]
end
def view_details(arguments)
open DetailScreen.new(nav_bar: true, title: arguments[:state])
end
end
This works, but it's only part of what I was trying to do. I would still like to use a structure like YAML to represent titles and subtitles. What would be the RubyMotion way to do this sort of thing?
Figured out how to do it. I came across a RubyMotion gem called motion-yaml. Simply add it to your Gemfile, add your YAML file to your resources directory, and use it like you would YAML in Ruby.
data = YAML.load(File.read("#{App.resources_path}/my_yaml_file.yml"))
Note: You will need to add bubble-wrap to your Gemfile in order to have the App.resources_path. I'm not sure if there is an easy way to do it without bubble-wrap.