How to use bassview - 10 common examples

* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/**
 * Console View
 * 
 * Main control area for the tupleviewer widget
*/

var _ = require('underscore');
var BigInteger = require('jsbn');
var kt = require('knights-templar');
var PortsView = require('./PortsView');
var BaseView = require('bassview');
var ConsoleView = BaseView.extend({
    
    initialize: function() {
        this.subview('ports', new PortsView({ collection: this.model.ports }));
        // this.listenTo(this.model, 'change:currentWindowId change:currentTupleIndex', this.render);
        this.listenTo(this.model, 'update_console', this.render);
        this.listenTo(this.model.tuples, 'update', this.render);
        // this.listenTo(this.model, 'change:currentWindowId change:currentTupleIndex', function() {
        //     console.log('1');
        //     this.render();
        // });
        // this.listenTo(this.model.tuples, 'update', function() {
        //     console.log('2');
        //     this.render();
        // });
    },

*/
/**
 * Base Page
 * 
 * This is the base class for all pages. If this.useDashMgr
 * is true, it will generate a sidebar UI for managing
 * widgets and dashboards.
*/
var _ = require('underscore'), Backbone = require('backbone');
var Notifier = require('./Notifier');
var WidgetClassCollection = require('./WidgetClassCollection');
var DashCollection = require('./DashCollection');
var DashMgr = require('./DashMgrView');
var DashTabs = require('./DashMgrView/DashTabs');
var BaseView = require('bassview');
var BasePageView = BaseView.extend({
    
    // This is appended to the localStorage key that 
    // stores state of the page's dashboard configuration.
    // This is to allow for a page module to define itself
    // on initialization. See `./AppInstancePageView.js:initialize()`
    dashExt: '',
    
    initialize: function(options) {
        // scroll to top, TODO save/restore scroll position (so that it is not lost on back button)
        $(document).scrollTop(0);

        // Grab app and dataSource
        this.app = options.app;
        this.dataSource = this.app.dataSource;
        
        // Set up localStorage prefix key

* limitations under the License.
*/
/**
 * Base Widget View
 * 
*/

var _ = require('underscore');
var kt = require('knights-templar');
var BaseView = require('bassview');

// subview
var HeaderView = require('./WidgetHeaderView');

// class definition
var WidgetView = BaseView.extend({
    
    initialize: function(options) {
        // Store the widget definition model
        this.widgetDef = options.widget;
        this.dashDef = options.dashboard;

        // Look for removal handler
        this.onRemove = options.onRemove;

        // Extend events if necessary
        if (this.events !== WidgetView.prototype.events) {
            this.events = _.extend({},WidgetView.prototype.events,this.events);
        }
        
        // Create the subview for the title bar
        this.subview('MAIN_WIDGET_HEADER', new HeaderView({

* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/**
 * TemplateSelectView
 * 
 * View for the dropdown menu that holds
 * the alert template options to choose from.
*/

var _ = require('underscore');
var kt = require('knights-templar');
var Bbind = DT.lib.Bbindings;
var bassview = require('bassview');
var TemplateSelectView = bassview.extend({
    
    initialize:function() {
        
        // set the select subview
        this.subview('select', new Bbind.select({
            model: this.model,
            attr: 'templateName',
            classElement: function($el) {
                return $el.parent();
            },
            errorClass: 'error',
            setAnyway: true
        }));
        
        // listen to collection reset for render
        this.listenTo(this.collection, 'reset', this.render);

var _ = require('underscore');
var Notifier = DT.lib.Notifier;
var kt = require('knights-templar');
var BaseView = require('bassview');

var LicenseFileCollection = require('../../widgets/ConfigWelcomeWidget/LicenseFileCollection');
var UploadLicenseView = require('../../widgets/ConfigWelcomeWidget/UploadLicenseView');

var LicensePageView = BaseView.extend({

    initialize: function(options) {

        // Set a collection for the jar(s) to be uploaded
        this.filesToUpload = new LicenseFileCollection([], {
        });

        this.subview('file-upload', new UploadLicenseView({
            collection: this.filesToUpload
        }));

        this.listenTo(this.filesToUpload, 'upload_success', _.bind(function() {
            // notify user
            Notifier.success({
                title: 'License File Successfully Uploaded',
                text: 'The information on the license page should be updated. If it does not, wait a few moments for the license agent to restart, then refresh the page.'

* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/**
 * List Widget Palette
 * 
 * The base class for palettes 
 * used in list widgets.
*/
var kt = require('knights-templar');
var _ = require('underscore');
var BaseView = require('bassview');
var ListPalette = BaseView.extend({
    
    initialize: function(options) {
        
        if (!this.collection) {
            throw new TypeError('ListPalette requires a collection');
        }
        
        // look for things to attach directly to this instance
        _.each(['dataSource', 'nav', 'appId'], function(prop) {
            if (options[prop]) {
                this[prop] = options[prop];
            }
        }, this);
        
        this.listenTo(this.collection, 'change_selected remove', this.render);

* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/**
 * PageLoader View
 * 
 * Loads in pages based on url
*/
var _ = require('underscore');
var kt = require('knights-templar');
var BaseView = require('bassview');
var Breadcrumbs = require('../Breadcrumbs').collection;
var breadcrumbsView = require('../Breadcrumbs').colview;
var Notifier = require('../Notifier');
var PageLoaderView = BaseView.extend({
    
    initialize: function(options) {
        
        // Stores view of current page
        this.loaded_page = false;
        
        // Hash lookup of all page modules
        this.pages = options.pages;
        
        // Breadcrumbs for current page
        this.breadcrumbs = new Breadcrumbs([], {
            nav: this.model,
            loader: this
        });
        this.breadcrumbsView = new breadcrumbsView({
            collection: this.breadcrumbs,

* See the License for the specific language governing permissions and
* limitations under the License.
*/
/**
 * Overview for OpChart
 * 
 * This component allows the user to
 * navigate a recording at full length.
*/
var _ = require('underscore');
var util = require('./util');
var Backbone = require('backbone');
var kt = require('knights-templar');
var Chart = DT.lib.LiveChart;
var BaseView = require('bassview');
var Overview = BaseView.extend({
    
    initialize: function(options) {
        
        // Get the viewport chart object
        this.vChart = options.vpChart;
        
        this.listenTo(this.model, 'change:scroller_width', this.render);
        this.listenTo(this.model, 'change:offset change:limit', this.setViewport);
        this.listenTo(this.vChart.model, 'yaxes_rendered', this.adjustLeftMargin)
    },
    
    render: function() {
        var marginLeft = this.vChart.view.$('.chart-yaxes').width();
        var scroller_width = this.vChart.model.get('vp_width');
        var json = this.model.serialize();
        var markup = this.template(json);

* See the License for the specific language governing permissions and
* limitations under the License.
*/
/**
 * OpChart Control View
 * 
 * This is the controls view for opchart widget.
*/
var Notifier = DT.lib.Notifier;
var BaseView = require('bassview');
var _ = require('underscore');
var kt = require('knights-templar');
var bbindings = DT.lib.Bbindings;
var OffsetCtrl = require('./OffsetCtrl');
// var OffsetCtrl = require('./')
var Control = BaseView.extend({
    
    initialize: function(options) {
        
        this.recording = options.recording;
        
        this.subview('toggle_tail', new bbindings.checkbox({
            attr: 'tail',
            model: this.recording
        }));
        
        this.subview('rec_offset', new OffsetCtrl({
            attr: 'offset',
            model: this.recording
        }));
        
        this.subview('rec_limit', new bbindings.textint({

* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/**
 * Control interface for the performance metrics chart
 * 
*/
var _ = require('underscore');
var kt = require('knights-templar');
var Notifier = DT.lib.Notifier;
var BaseView = require('bassview');
var bbindings = DT.lib.Bbindings;
var Ctrl = BaseView.extend({
    
    initialize: function(options) {
        this.state = options.state;
        this.widgetModel = options.widgetModel;

        var defaultOptions = {
            multi_y: true,
            render_points: true
        };

        var options = this.widgetModel.pick('multi_y', 'render_points');
        _.defaults(options, defaultOptions);

        this.model.set(options, { silent: true });
        
        // Bind controls to the