Add styling options to JBrowse/View/StandaloneDatasetList.js

[rdhayes]

The view here is pretty minimal. What changes are necessary to allow styling and basic edits to layout? Can the plugin system alter this?

[cmdcolin]

Certainly this view could be improved, but I found a little trick called "Monkey patching" to extend these functions using a plugin system (there might be better ways to do this, but it does work :+1: )

define([
           'dojo/_base/declare',
           'JBrowse/View/StandaloneDatasetList',
           'JBrowse/Plugin',
           'dojo/dom-construct',
           'dojo/dom',
           'dojo/_base/window',
       ],
       function( declare, StandaloneDatasetList,JBrowsePlugin,domConstruct,dom, win ) {
return declare( JBrowsePlugin,
{
    constructor: function( args ) {
        var buildRendering = StandaloneDatasetList.prototype.buildRendering;
        StandaloneDatasetList.prototype.buildRendering = function() {
            domConstruct.create("h1",{innerHTML:"Hello Monkey Patch World!"},dom.byId("GenomeBrowser"));
            buildRendering.call(this);
        }
    },
});
});

Result

[rdhayes]

Colin,

Thanks for spelling that out.

It'd be nice to be able to consolidate this with my menuBar changes into one "customstyle" plugin. I'll give that a try and report back.

Richard D. Hayes, Ph.D. Joint Genome Institute / Lawrence Berkeley National Lab http://phytozome.jgi.doe.gov

On Wed, Oct 22, 2014 at 1:11 PM, Colin Diesh notifications@github.com wrote:

Certainly this view could be improved, but I found a little trick called "Monkey patching" to extend it these functions using a plugin system (there might be better ways to do this but it does work [image: :+1:] )

define([ 'dojo/_base/declare', 'dojo/_base/lang', 'dojo/Deferred', 'JBrowse/View/StandaloneDatasetList', 'JBrowse/Plugin', 'dojo/dom-construct', 'dojo/dom', 'dojo/_base/window', ], function( declare, lang, Deferred, StandaloneDatasetList, JBrowsePlugin, domConstruct, dom, win ) { return declare( JBrowsePlugin, { constructor: function( args ) { this._searchTrackCount = 0;

    var thisB = this;
    console.log(StandaloneDatasetList.prototype.buildRendering);
    var buildRendering = StandaloneDatasetList.prototype.buildRendering;
    StandaloneDatasetList.prototype.buildRendering = function() {
        console.log('Monkey patch');
        domConstruct.create("h1",{innerHTML:"Hello Monkey Patch World!"},dom.byId("GenomeBrowser"));
        buildRendering.call(this);
    }
    console.log(StandaloneDatasetList.prototype.buildRendering);

},

}); });

Result

[image: screenshot-localhost 2014-10-22 15-09-17] https://cloud.githubusercontent.com/assets/6511937/4743395/654ca1b8-5a27-11e4-9763-aaab75699e4e.png

— Reply to this email directly or view it on GitHub https://github.com/GMOD/jbrowse/issues/524#issuecomment-60147124.

[cmdcolin]

Closing for now