gristlabs_grist-core/app/client/components/LayoutPreview.js
Paul Fitzpatrick 1654a2681f (core) move client code to core
Summary:
This moves all client code to core, and makes minimal fix-ups to
get grist and grist-core to compile correctly.  The client works
in core, but I'm leaving clean-up around the build and bundles to
follow-up.

Test Plan: existing tests pass; server-dev bundle looks sane

Reviewers: dsagal

Reviewed By: dsagal

Differential Revision: https://phab.getgrist.com/D2627
2020-10-02 13:24:21 -04:00

41 lines
1.3 KiB
JavaScript

var ko = require('knockout');
var dom = require('../lib/dom');
var dispose = require('../lib/dispose');
var Layout = require('./Layout');
/**
* LayoutPreview - Represents a preview for a single layout. Builds an icon that takes
* the size of its container showing a version of the layout made from solid blocks.
* An optional map between leafId and hex color strings may be used to color the blocks.
* The map may be an observable, but it is only consulted on changes to layoutSpecObj.
*/
function LayoutPreview(layoutSpecObj, optColorMap) {
var self = this;
this.layoutSpecObj = layoutSpecObj;
this.colorMap = optColorMap || {};
this.layout = this.autoDispose(
Layout.Layout.create(this.layoutSpecObj(),
function(leafId) {
var content = dom('div.layout_preview_leaf');
var colorMap = ko.unwrap(self.colorMap);
content.style.backgroundColor = colorMap[leafId] || "#000";
return content;
}, true)
);
// When the layoutSpec changes, rebuild.
this.autoDispose(this.layoutSpecObj.subscribe(function(spec) {
this.layout.buildLayout(this.layoutSpecObj(), true);
}, this));
}
dispose.makeDisposable(LayoutPreview);
LayoutPreview.prototype.buildDom = function() {
return this.layout.rootElem;
};
module.exports = LayoutPreview;