hippo-fw 0.9.1

data/client/hippo/models/query/array-result.js

@@ -0,0 +1,188 @@
+import {
+    isEmpty, isNil, extend, map, bindAll, omit, range, has,
+} from 'lodash';
+import { autorun, reaction, observe } from 'mobx';
+
+import Sync from '../sync';
+import Result from './result';
+import {
+    belongsTo, computed, identifiedBy, observable, action,
+} from '../base';
+
+@identifiedBy('hippo/query/array-result')
+export default class ArrayResult extends Result {
+
+    @belongsTo query;
+    @observable totalCount = 0;
+    @observable rows;
+    @observable isLoading;
+    @observable rowUpdateCount = 0;
+    @observable sortAscending;
+    @observable sortField;
+
+    constructor(attrs) {
+        super(attrs);
+        bindAll(this, 'onQuerySortChange');
+        this.rows = observable.shallowArray([]);
+        this.sortField = this.query.sortField;
+        this.sortAscending = this.query.sortAscending;
+
+        reaction(
+            () => [this.query.sortField, this.query.sortAscending],
+            this.onQuerySortChange,
+        );
+    }
+
+    @computed get updateKey() {
+        return [
+            this.rows.length,
+            (this.sortField ? this.sortField.id : 'none'),
+            this.sortAscending,
+            this.rowUpdateCount,
+        ].join('-');
+    }
+
+    insertRow() {
+        this.rows.unshift(Array(this.query.info.loadableFields.length));
+        this.totalCount += 1;
+    }
+
+    isIndexSaved(index) {
+        const row = this.rows[index];
+        return (row && row[this.query.info.identifierField.dataIndex]);
+    }
+
+    removeRow(index) {
+        this.rows.splice(index, 1);
+        this.totalCount -= 1;
+    }
+
+    rowAsObject(index) {
+        const row = this.rows[index];
+        const obj = {};
+        this.query.info.loadableFields.forEach(
+            f => (obj[f.id] = (row[f.dataIndex] || f.defaultValue)),
+        );
+        return obj;
+    }
+
+    modelForRow(index) {
+        const model = new this.query.src(this.rowAsObject(index)); // eslint-disable-line new-cap
+        observe(model, 'syncInProgress', ({ newValue, oldValue }) => {
+            if (newValue && !oldValue && newValue.isUpdate) {
+                newValue.whenComplete(() => {
+                    const row = this.rows[index];
+                    this.query.info.loadableFields.forEach((f) => {
+                        if (model[f.id]) { row[f.dataIndex] = model[f.id]; }
+                    });
+                    this.rowUpdateCount += 1;
+                }, 99);
+            }
+        });
+        return model;
+    }
+
+    fetchModelForRow(index, syncOptions = {}) {
+        const model = this.modelForRow(index);
+        return model.isNew ? Promise.resolve(model) :
+            model.fetch(extend({}, this.query.syncOptions, syncOptions));
+    }
+
+    onQuerySortChange() {
+        if ((this.sortAscending === this.query.sortAscending) &&
+            (this.sortField === this.query.sortField)) {
+            return;
+        }
+        this.sortField = this.query.sortField;
+        this.sortAscending = this.query.sortAscending;
+        if (isNil(this.sortField)) { return; }
+        if (this.fullyLoaded) {
+            this.sort();
+        } else {
+            this.reset().fetch();
+        }
+    }
+
+    @action
+    sort() {
+        const asc = this.sortAscending;
+        const index = this.sortField.dataIndex;
+        this.rows.replace(this.rows.sort((ar, br) => {
+            const [a, b] = [ar[index], br[index]];
+            if (a === b) { return 0; }
+            if (asc) {
+                return (a > b) ? 1 : -1;
+            }
+            return (a < b) ? 1 : -1;
+        }));
+        return this;
+    }
+
+    @computed get fullyLoaded() {
+        return this.totalCount === this.rows.length;
+    }
+
+    @action reset() {
+        this.totalCount = 0;
+        this.rows.clear();
+        return this;
+    }
+
+    searchFieldValues(field, value) {
+        const index = field.dataIndex;
+        for (let x = 0; x < this.rows.length; x += 1) {
+            if (this.rows[x][index] === value) {
+                return { row: this.rows[x], index: x };
+            }
+        }
+        return {};
+    }
+
+    isRowLoading(index) {
+        return !!(this.rows.length > index && this.rows[index].isLoading);
+    }
+
+    fetch({ start = this.rows.length, limit = this.query.pageSize } = {}) {
+        if (start + limit >= this.rows.length) {
+            range(this.rows.length, start + limit).forEach(() => this.rows.push([]));
+        }
+        range(start, start + limit).forEach(i => (this.rows[i].isLoading = true));
+
+        const query = {};
+        this.query.clauses.forEach((clause) => {
+            if (clause.isValid) {
+                extend(query, clause.toParam());
+            }
+        });
+
+        const options = extend({}, this.query.syncOptions, {
+            start,
+            limit,
+            total_count: 't',
+            format: 'array',
+            fields: map(this.query.info.loadableFields, 'id'),
+        });
+
+        if (!isEmpty(query)) {
+            options.query = query;
+        }
+
+        if (!isNil(this.sortField)) {
+            options.order = {
+                [`${this.sortField.id}`]: (this.sortAscending ? 'asc' : 'desc'),
+            };
+        }
+
+        extend(options, omit(this.query.info.syncOptions, 'include'));
+
+        this.syncInProgress = options;
+
+        return Sync.perform(this.query.info.syncUrl, options).then((resp) => {
+            const rows = resp.data || [];
+            this.rows.splice(start, Math.max(limit, rows.length), ...rows);
+            this.totalCount = resp.total;
+            delete this.syncInProgress;
+            return this;
+        });
+    }
+}

data/client/hippo/models/query/clause.js

@@ -0,0 +1,52 @@
+import { get, compact, first, filter, find, uniqueId } from 'lodash';
+import {
+    BaseModel, identifiedBy, autorun, belongsTo, computed, observable,
+} from '../base';
+
+@identifiedBy('hippo/query/clause')
+export default class Clause extends BaseModel {
+
+    @observable id = uniqueId('clause');
+
+    @observable value;
+    @belongsTo({ type: 'hippo/query' }) query;
+
+    @belongsTo({ type: 'hippo/query/field' }) field;
+    @belongsTo({ type: 'hippo/query/operator' }) operator;
+
+    @computed get description() {
+        return compact([get(this, 'field.title'), get(this, 'operator.id')]).join(' ');
+    }
+
+    constructor(attrs) {
+        super(attrs);
+        this.field = first(this.query.info.queryableFields);
+        autorun(this._updateOperatorOnFieldChange.bind(this));
+    }
+
+    @computed get validOperators() {
+        return filter(this.query.operators, o => o.isValidForField(this.field));
+    }
+
+    @computed get fingerprint() {
+        return [this.field.id, this.operator.id, this.value].join('-');
+    }
+
+    @computed get isValid() {
+        return !!(this.value && this.operator.isValidForField(this.field));
+    }
+
+    toParam() {
+        const param = {};
+        const op = this.operator.id;
+        let value = this.value;
+        if ('like' === op) { value += '%'; }
+        if ('n' === this.field.type) { value = parseFloat(value); }
+        param[this.field.id] = 'eq' === op ? value : { op, value };
+        return param;
+    }
+
+    _updateOperatorOnFieldChange() {
+        this.operator = find(this.query.operators, o => o.isValidForField(this.field));
+    }
+}

data/client/hippo/models/query/field.js

@@ -0,0 +1,63 @@
+import { get, includes } from 'lodash';
+import { titleize } from '../../lib/util';
+import {
+    BaseModel, identifiedBy, session, belongsTo, identifier, computed, observable,
+} from '../base';
+
+@identifiedBy('hippo/query/field')
+export default class Field extends BaseModel {
+
+    @identifier({ type: 'string' }) id;
+    @session title;
+    @session selected   = false;
+    @session editable   = true;
+    @session width      = 100;
+    @session flexGrow   = 1;
+    @session flexShrink = 1;
+    @session visible    = true;
+    @session loadable   = true;
+    @session queryable  = true;
+    @session sortable   = true;
+    @session textAlign  = 'left';
+
+    @session defaultValue;
+    @session fetchIndex;
+    @session sortBy;
+
+    @observable format;
+    @observable component;
+    @observable onColumnClick;
+
+    @belongsTo query;
+
+    @computed get isSortingBy() {
+        return this === this.query.sortField;
+    }
+
+    @computed get label() {
+        return this.title ? this.title : titleize(this.id);
+    }
+
+    @computed get queryType() {
+        return get(this.query.src.propertyOptions[this.id], 'type', 'string');
+    }
+
+    @computed get isNumeric() {
+        return includes(['number'], this.queryType);
+    }
+
+    @computed get dataIndex() {
+        if (!this.loadable) { return null; }
+
+        let index = 0;
+        for (let i = 0; i < this.query.fields.length; i += 1) {
+            if (this.query.fields[i].loadable) {
+                if (this.query.fields[i] === this) {
+                    return index;
+                }
+                index += 1;
+            }
+        }
+        return null;
+    }
+}

data/client/hippo/models/query/info.js

@@ -0,0 +1,43 @@
+import { filter, reduce, find } from 'lodash';
+import { computed } from 'mobx';
+
+export default class Info {
+
+    constructor(query) {
+        this.query = query;
+    }
+
+    @computed get syncUrl() {
+        return this.query.customSyncUrl || this.query.src.syncUrl;
+    }
+
+    @computed get minWidth() {
+        return reduce(this.visibleFields, (sum, f) => sum + f.width, 0);
+    }
+
+    // the index of fields marked as visible
+    @computed get visibleIndexes() {
+        const indexes = [];
+        this.query.fields.forEach((f, i) => { if (f.visible) { indexes.push(i); } });
+        return indexes;
+    }
+
+    @computed get visibleFields() {
+        return filter(this.query.fields, f => f.visible);
+    }
+
+    @computed get queryableFields() {
+        return filter(this.query.fields, f => f.queryable);
+    }
+
+    @computed get loadableFields() {
+        return filter(this.query.fields, f => f.loadable);
+    }
+
+    @computed get identifierField() {
+        const property = this.query.src.identifierFieldName;
+        return find(this.query.fields, { id: property });
+    }
+
+
+}

data/client/hippo/models/query/operator.js

@@ -0,0 +1,21 @@
+import {
+    BaseModel, identifiedBy, session, belongsTo, identifier,
+} from '../base';
+
+@identifiedBy('hippo/query/operators/operator')
+export default class Operator extends BaseModel {
+
+    @identifier({ type: 'string' }) id;
+    @session label;
+    @session selected;
+
+    @session({ type: 'array' }) types;
+    @belongsTo({ model: 'hippo/query/field' }) field;
+
+    isValidForField(field) {
+        if (!field) { return false; }
+        if (!this.types.length) { return true; }
+        return !!this.types.find(t => t === field.queryType);
+    }
+
+}

data/client/hippo/models/query/result.js

@@ -0,0 +1,21 @@
+import { isFunction } from 'lodash';
+
+import {
+    BaseModel,
+    belongsTo,
+    identifiedBy,
+} from '../base';
+
+@identifiedBy('hippo/query/result')
+export default class Result extends BaseModel {
+
+    @belongsTo({ type: 'hippo/query' }) query;
+
+    sortingFunction() {
+        const field = this.query.sortField;
+        if (!field) { return false; }
+        if (isFunction(field.sortBy)) { return field.sortBy; } return false;
+    }
+
+    loadFully() { return Promise.resolve(this); }
+}

data/client/hippo/models/query/types.js

@@ -0,0 +1,5 @@
+export default {
+    LIKE_QUERY_TYPES:         ['string', 'code', 'visible_id'],
+    LESS_THAN_QUERY_TYPES:    ['integer', 'bigdec', 'number'],
+    GREATER_THAN_QUERY_TYPES: ['integer', 'bigdec', 'number'],
+};

data/client/hippo/models/sync.js

@@ -0,0 +1,135 @@
+import qs from 'qs';
+import 'whatwg-fetch'; // fetch polyfill
+
+import { includes, isEmpty, merge, extend, sortBy } from 'lodash';
+import { action } from 'mobx';
+import Config     from '../config';
+import { logger } from '../lib/util';
+
+const methodMap = {
+    create:  'POST',
+    update:  'PUT',
+    patch:   'PATCH',
+    destroy: 'DELETE',
+    read:    'GET',
+};
+
+const paramsMap = {
+    fields:  'f',
+    with:    'w',
+    query:   'q',
+    include: 'i',
+    order:   'o',
+    limit:   'l',
+    start:   's',
+    format:  'df',
+};
+
+function isUpdate(method) {
+    return includes(['POST', 'PUT', 'PATCH'], method);
+}
+
+class SyncProgess {
+    constructor(options) {
+        extend(this, options);
+        this._whenComplete = [];
+    }
+    whenComplete(fn, precendence = 1) {
+        this._whenComplete.push({ fn, precendence });
+    }
+    get isFetch() { return 'GET' === this.method; }
+    get isCreate() { return 'POST' === this.method; }
+    get isUpdate() { return isUpdate(this.method); }
+}
+
+function invokeWhenComplete(json, progress) {
+    const calls = sortBy(progress._whenComplete, 'precendence');
+    return calls.reduce((p, { fn }) => p.then(() => {
+        const ret = fn(json);
+        return (ret && ret.then) ? ret : Promise.resolve();
+    }), Promise.resolve());
+}
+
+function perform(urlPrefix, defaultOptions = {}) {
+    const query   = {};
+    const options = {};
+
+    Object.keys(defaultOptions).forEach((key) => {
+        const value = defaultOptions[key];
+        if (paramsMap[key]) {
+            query[paramsMap[key]] = value;
+        } else {
+            options[key] = value;
+        }
+    });
+
+    let url = `${Config.api_host}${urlPrefix}.json`;
+    if (Config.access_token) {
+        query.jwt = Config.access_token;
+    }
+    if (!isEmpty(query)) {
+        url += `?${qs.stringify(query, { arrayFormat: 'brackets' })}`;
+    }
+    if (!options.headers) { options.headers = {}; }
+
+    options.headers['Content-Type'] = 'application/json';
+    return fetch(url, options)
+        .then(resp => resp.json())
+        .then((json) => {
+            if (json.token) { Config.access_token = json.token; }
+            return json;
+        });
+}
+
+const peformMobxyRequest = action('SyncforModel', (mobxObj, options = {}) => {
+    mobxObj.syncInProgress = new SyncProgess(options);  // eslint-disable-line no-param-reassign
+    return perform(options.url || mobxObj.syncUrl, options)
+        .then(action('syncSuccessHandler', (json) => {
+            extend(mobxObj, {
+                errors:            json.errors,
+                syncData:          json.data,
+                lastServerMessage: json.message,
+            });
+            // sometimes the polyfill (or fetch iteself) sets a `:success` property?
+            if (false === json[':success']) { merge(mobxObj, { errors: { fetch: json[':message'] } }); }
+            return json;
+        }))
+        .then(action('whenComplete', json => invokeWhenComplete(json, mobxObj.syncInProgress)))
+        .then(action('syncDoneHandler', () => {
+            extend(mobxObj, {
+                syncInProgress: undefined,
+            });
+            return mobxObj;
+        }))
+        .catch(action('syncErrorHandler', (e) => {
+            logger.warn(e);
+            extend(mobxObj, {
+                errors:            { network: e },
+                syncInProgress:     undefined,
+                lastServerMessage:  e.toString(),
+            });
+            return {};
+        }));
+});
+
+function forCollection(collection, options = {}) {
+    return peformMobxyRequest(collection, options);
+}
+
+const forModel = action('SyncforModel', (model, options = {}) => {
+    const httpAction = options.action || (model.isNew ? 'create' : 'update');
+    const requestOptions = merge({
+        method: methodMap[httpAction],
+    }, options);
+
+    if (isUpdate(requestOptions.method)) {
+        requestOptions.body = JSON.stringify(options.json || model.syncData);
+    }
+    return peformMobxyRequest(model, requestOptions);
+});
+
+export default {
+    forModel,
+    forCollection,
+    perform,
+};