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 👍 )

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: 👍] )

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
#524 (comment).

[cmdcolin]

Closing for now