g1 issueshttps://code.gramener.com/cto/g1/-/issues2018-05-24T16:16:25Zhttps://code.gramener.com/cto/g1/-/issues/20FormHandler cell click can link to an external page / event2018-05-24T16:16:25ZS AnandFormHandler cell click can link to an external page / eventTejeshTejeshhttps://code.gramener.com/cto/g1/-/issues/19Find and add a loading indicator component2019-02-04T10:05:08ZS AnandFind and add a loading indicator componenthttps://code.gramener.com/cto/g1/-/issues/18Integrate Mapviewer component2018-08-15T14:22:58ZTejeshIntegrate Mapviewer componentMapviewer to have features:
* [x] Drilldown and reset of map view
* [x] Tooltip and hover
* [ ] Summary count
* [ ] filters and sliders
* [ ] overlay metrics - multiple (TBD)
* [x] custom markers and svg shapes for geo points
* [ ]...Mapviewer to have features:
* [x] Drilldown and reset of map view
* [x] Tooltip and hover
* [ ] Summary count
* [ ] filters and sliders
* [ ] overlay metrics - multiple (TBD)
* [x] custom markers and svg shapes for geo points
* [ ] cluster markers (TBD)
* [ ] legend on mapTejeshTejeshhttps://code.gramener.com/cto/g1/-/issues/16Implement a FormHandler matrix - Spec Creation2019-03-05T10:35:21ZS AnandImplement a FormHandler matrix - Spec CreationFor scenarios like:
- https://learn.gramener.com/codogram/#contribution/
- https://learn.gramener.com/groups#matrix
Accept a sparse node-link structure.For scenarios like:
- https://learn.gramener.com/codogram/#contribution/
- https://learn.gramener.com/groups#matrix
Accept a sparse node-link structure.https://code.gramener.com/cto/g1/-/issues/15Add test cases to $().highlight()2018-04-16T09:25:21ZS AnandAdd test cases to $().highlight()https://code.gramener.com/cto/g1/-/issues/13Implement a FormHandler network chart2018-07-16T11:28:56ZS AnandImplement a FormHandler network charthttps://code.gramener.com/cto/g1/-/issues/12Implement a FormHandler Sankey2018-07-16T11:29:06ZS AnandImplement a FormHandler Sankeyhttps://code.gramener.com/cto/g1/-/issues/11Implement a FormHandler sunburst2018-07-16T11:29:11ZS AnandImplement a FormHandler sunbursthttps://code.gramener.com/cto/g1/-/issues/10Implement a formhandler treemap2018-07-16T11:29:40ZS AnandImplement a formhandler treemaphttps://code.gramener.com/cto/g1/-/issues/9$().formhandler enhancements2018-03-26T05:51:03ZS Anand$().formhandler enhancementsFeatures for Gramex v1.28 (31 Jan):
- [x] Add test cases for all README.md conditions
- [x] Add test cases for errors: invalid JSON, missing URL, HTTP 500, ...
- [x] Add loading indicator
- [x] Allow updating column info only for specif...Features for Gramex v1.28 (31 Jan):
- [x] Add test cases for all README.md conditions
- [x] Add test cases for errors: invalid JSON, missing URL, HTTP 500, ...
- [x] Add loading indicator
- [x] Allow updating column info only for specific columns
- [ ] Detect type of value for column highlighting -- use metadata from server
Additional features
- [ ] formhandler namespaces with multiple formhandlers
- [ ] Implement URL targets other than hash (e.g. pushState)
TejeshTejeshhttps://code.gramener.com/cto/g1/-/issues/8Implement $().highlight()2018-02-03T16:25:40ZS AnandImplement $().highlight()See README.md on 8fc265d for specsSee README.md on 8fc265d for specshttps://code.gramener.com/cto/g1/-/issues/6$().formhandler column formatting2018-03-06T07:11:43ZS Anand$().formhandler column formatting```html
<div src="formhandler" class="formhanlder">
<script>
$('.formhandler').formhandler({
// - `columns`: comma-separated column names to display, or a list of objects with these keys:
// - `name`: column name
// - `title`: d...```html
<div src="formhandler" class="formhanlder">
<script>
$('.formhandler').formhandler({
// - `columns`: comma-separated column names to display, or a list of objects with these keys:
// - `name`: column name
// - `title`: display name of the column. Defaults to the same value as `name`
// - `type`: `text` (default) / `number` / 'date'. Determines filters to be used
// - `format`: string / function. Functions are applied to the value and the return value is used. Strings are treated as:
// - a numeral.js format for number (numeral.js must be loaded by the developer)
// - a moment.js format for date (moment.js must be loaded by the developer)
// - `sort`: `true` / `false` / operators dict with:
// - `{'': 'Sort ascending', '-': 'Sort descending'}` (default)
// - `filters`: `true` (default) / `false` / operators dict with:
// - `{'', 'Equals...', '!', 'Does not equal...', ...}`.
// The default list of operators is based on the auto-detected type of the column.
// - `unique`: TODO: {dict of query parameter and display value} or [list of values] or function?
// - `hideable`: `true` (default) / `false`
columns: [
{name: 'ID', title: '#', type: 'text', sort: true, filters: true, hideable: true},
{name: 'c1', title: 'Red', type: 'number', sort: true, filters: true, hideable: true},
{
name: 'Name',
title: 'Name',
format: 'text',
sort: {
'': 'Sort alphabetically', // Only allow sort ascending
},
filters: {
'': 'Equals...',
'!': 'Does not equal...',
'~': 'Contains...',
'!~': 'Does not contain...'
},
hideable: false // Cannot hide this column from the UI
}
],
{
name: 'Symbols',
type: 'text',
format: function(val) { return val === null ? '' : val } // Disallow NaN
},
{
name: 'c8',
type: 'number',
format: '0,0.0' // Interpreted as a numeraljs format
}
})
```
Note: When the operators are clicked, a dialog box should pop up like at https://learn.gramener.com/guide/formhandler/flags?_format=table
Use a template for this - just like the other components.TejeshTejeshhttps://code.gramener.com/cto/g1/-/issues/5Update FormHandler Table2018-01-23T04:39:13ZS AnandUpdate FormHandler TableSetup:
- Clone the repo: https://code.gramener.com/s.anand/g1 - formhandler branch
- Run the repo: run Gramex on root and visit `/test/test-formhandler.html`
- The output we want to create is at https://learn.gramener.com/guide/formhand...Setup:
- Clone the repo: https://code.gramener.com/s.anand/g1 - formhandler branch
- Run the repo: run Gramex on root and visit `/test/test-formhandler.html`
- The output we want to create is at https://learn.gramener.com/guide/formhandler/flags?_format=table
- The code for this output is at https://code.gramener.com/s.anand/gramex/blob/dev/gramex/apps/formhandler/formhandler.table.html
- Change `src/formhandler.js` and `src/formhandler.template.html` to deliver the output's functionality
- When changing the source, run `npm run build` to create the output
- [x] When a filter is applied by clicking on the table, display the applied filters on the top right. Use the same CSS style as [formhandler table](https://learn.gramener.com/guide/formhandler/flags?_format=table&_limit=10&_offset=9&Continent=Asia)
- Clicking on the applied filter should clear that filter and only that filter
- Clicking on the little red cross at the end should clear all column filters (not `_format` or others)
- [x] Clicking on a column name should show a dropdown with:
- Sort ascending: `href="?_sort=<col-name>"`
- Sort descending: `href="?_sort=-<col-name>"`
- Test filters: TBD
- Format: TBD
- Hide: `href="?c=-<col-name>" data-mode="add"` -- remove the column fully and show it in the applied filters section on the top right
- [x] Column formattingTejeshTejeshhttps://code.gramener.com/cto/g1/-/issues/4$.template() can render multiple languages2018-02-05T04:32:12ZS Anand$.template() can render multiple languagesScripts with different types have different meanings
- `type="text/html"` renders as HTML in-place
- `type="text/plain"` renders as text, i.e. set the innerText, not innerHTML
- `type="text/markdown"` - Markdown
- `type="text/vega"` - [...Scripts with different types have different meanings
- `type="text/html"` renders as HTML in-place
- `type="text/plain"` renders as text, i.e. set the innerText, not innerHTML
- `type="text/markdown"` - Markdown
- `type="text/vega"` - [Vega](https://vega.github.io/vega/)
- `type="text/vega-lite"` - [Vega-lite](https://vega.github.io/vega-lite/)
- `type="text/plotly"` - [Plotly](https://ecomfe.github.io/)
- `type="text/echarts"` - [echarts](https://github.com/ecomfe/echarts)
- `type="text/mermaid"`- [mermaid graph](https://mermaidjs.github.io/)
- `type="text/flowchart"` - [flowchart](http://flowchart.js.org/)
- `type="text/js-sequence"` - [js-sequence](https://bramp.github.io/js-sequence-diagrams/)
- etc.
Implementation:
- Each works as a plugin that can be registered independently, and can be extended. text/html will use `_.template` for example.
- To allow use of `</script>` tags for code examples, the container can be `<template>` instead of `<script>`https://code.gramener.com/cto/g1/-/issues/2$('body').template() should work2017-12-25T18:48:37ZS Anand$('body').template() should work- Set the default selector as `script[type="text/html"], .template`. So `$('body').template()` will apply templates on all nodes matching the selector -- including the root element, i.e. 'body'.
- Setting `data-selector=` on the parent c...- Set the default selector as `script[type="text/html"], .template`. So `$('body').template()` will apply templates on all nodes matching the selector -- including the root element, i.e. 'body'.
- Setting `data-selector=` on the parent class (e.g. 'body' in the above example) should change the default selectorS AnandS Anandhttps://code.gramener.com/cto/g1/-/issues/1$.template() should allow src attribute to specify a template to load.2017-12-25T13:40:56ZS Anand$.template() should allow src attribute to specify a template to load.`<script type="template/html" src="template.html"></script>` should load `template.html` in place.`<script type="template/html" src="template.html"></script>` should load `template.html` in place.S AnandS Anand