Skip to content

Instantly share code, notes, and snippets.

@EugeneN
Last active February 11, 2019 08:30
Show Gist options
  • Select an option

  • Save EugeneN/9a374a884cf2a06d0f45 to your computer and use it in GitHub Desktop.

Select an option

Save EugeneN/9a374a884cf2a06d0f45 to your computer and use it in GitHub Desktop.
ActivitiesView.js

Very small part of G4 as an example of OOP-style web application. Not so bad :-)

```javascript

/ requires generic_view */ (function () { YAHOO.G4.ActivitiesView = function (cont, opts) { YAHOO.G4.ActivitiesView.superclass.constructor.call (this, cont, opts); };

var Dom = YAHOO.util.Dom, Config = YAHOO.util.Config, ActivitiesView = YAHOO.G4.ActivitiesView, Lang = YAHOO.lang, GenericView = YAHOO.G4.GenericView;

ActivitiesView.API_DO_URL = ‘/api/activity/do/’;

ActivitiesView.label_formatter = function (elCell, oRecord, oColumn, oData) { var color = oRecord.getData(‘color’), title = oRecord.getData(‘title’);

elCell.innerHTML = '<span class=\"t-label-dt\">'+title+'</span>';

}

ActivitiesView.icon_formatter = function (elCell, oRecord, oColumn, oData) { var icon_url = oRecord.getData (‘icon_url’); if (icon_url) elCell.innerHTML = ‘’; else elCell.innerHTML = gettext(‘-’); }

var DEFAULT_CONFIG = { ‘TITLE’: { key: ‘title’, value: gettext (‘Activities’) },

  'COLUMN_DEFS': {
    key: 'column_defs',
    value: [
      { key: 'id', hidden: true },
  { key: &#39;icon&#39;, label: gettext(&#39;Icon&#39;), className: &#39;activity-icon-button&#39;, formatter: ActivitiesView.icon_formatter },
  
  { key: &#39;title&#39;, label: gettext(&#39;Title&#39;), sortable: true, resizeable: false, formatter: ActivitiesView.label_formatter, editor: GenericView.textbox_cell_editor_factory__get_editor (ActivitiesView.API_DO_URL) },
  { key: &#39;description&#39;, label: gettext(&#39;Description&#39;), sortable: false, resizeable: false, editor: GenericView.textbox_cell_editor_factory__get_editor (ActivitiesView.API_DO_URL) },
  { key: &#39;items&#39;, label: gettext(&#39;Items&#39;), sortable: true, resizeable: false },
  
  { key: &#39;owner&#39;, label: gettext(&#39;Owner&#39;), sortable: true, formatter: GenericView.user_formatter }</code></pre>

] },
  'DT_ACTIVE_COLUMNS': {
    key: 'dt_active_columns',
    value: {
      icon: function (target, column) {
        var record = this.getRecord(target),
            self = this,
      cb = function (o) { self.reload() };
      
    YAHOO.G4.util.load_dialog_new (&#39;/api/activity/edit/&#39; + record.getData (&#39;id&#39;) + &#39;/&#39;, gettext(&#39;Edit Activity&#39;), {
      upload_handler: cb,
      submit_success: cb
    });
  }
}

},
'DATAURL': {
key: 'dataurl',
value: '/api/activity/~/owned/?'
},
'DATASOURCE': {
key: 'datasource',
value: {
responseType: YAHOO.util.DataSource.TYPE_JSON,
responseSchema: {
resultsList: &quot;rows&quot;,
fields: ['id', 'title', 'description', 'items', 'owner', 'icon_url'],
metaFields: { totalRecords: 'total_records', totalPages: 'total_pages', currentPage: 'current_page' }
}
}
},
'DT_DEFAULT_BUTTONS': {
key: 'dt_default_buttons',
value: [
{
type: 'button',
label: '<div class=&quot;refresh_btn&quot;>&nbsp;</div>',
title: gettext('Reload'),
onclick: { fn: function () { this.data_table.reload (); } }
},
{
type: 'button',
label: '<div id=&quot;columnHideShowBtn&quot;>&nbsp;</div>',
title: gettext('Choose columns to view'),
onclick: { fn: function () { this.data_table.choose_columns () } }
},
{
type: 'button',
label: '<div class=&quot;select_all_btn&quot;>&nbsp;</div>',
title: gettext('Select all'),
onclick: { fn: function (e) {
var rs = this.data_table.getRecordSet ();
var records = rs.getRecords ();
for (var i=0; i<records.length; i++) {
this.data_table.selectRow (records[i]);
}
}}
},
{
type: 'button',
label: '<div class=&quot;select_none_btn&quot;>&nbsp;</div>',
title: gettext('Unselect all'),
onclick: { fn: function (e) { this.data_table.unselectAllRows (); }}
}
] },
  'DT_BUTTONS': {
    key: 'dt_buttons',
    value: [
      {
        type: 'button',
        title: gettext('Add new item'),
        label: '<div class=\"add-item-btn\">&nbsp;</div>',
        onclick: { fn: function (e) {
          var self = this,
              label_str = prompt (gettext('Enter activity title'));
      if (!label_str) {
        alert (gettext(&#39;You must specify activity title&#39;));
        return false;
      }
      YAHOO.G4.util.xhr_post (&#39;/api/activity/add/&#39;, &#39;title=&#39;+label_str, {
        success: function (o) {
          YAHOO.G4.global_events.update_activities.fire();
        }
      });
    }}
  },
  {
    type: &#39;button&#39;,
    title: gettext(&#39;Apply selected to tracks in tray&#39;),
    label: &#39;&lt;div class=\&quot;select-apply\&quot;&gt;&amp;nbsp;&lt;/div&gt;&#39;,
    onclick: { fn: function (e) {
      var ids = this.data_table.get_selected_row_record_ids (),
          self = this,
          l = ids.length;

      if (l == 1) {
        var activity_id = ids[0],
            tray_tracks_ids = [],
            tray_tracks = g4_tray.get_tracks (),
            i;
          
        for (i in tray_tracks) tray_tracks_ids.push (i)
        
        if (!tray_tracks_ids.length) {
          alert (gettext(&#39;Put some tracks to tray first&#39;));
          return false;
        }          

        YAHOO.G4.util.xhr_post (&#39;/api/activity/do/&#39;, &#39;oper=apply&amp;activity=&#39; + activity_id + &#39;&amp;tracks=&#39;+tray_tracks_ids.join(&#39;,&#39;), {
          &#39;success&#39;: function (o) {
            if (o.responseText == &#39;OK&#39;) { 
              YAHOO.G4.global_events.activities_applyed.fire (tray_tracks_ids);
            } else { alert (o.responseText); }
          }
        });
      } else alert (gettext(&#39;Select exactly one activity&#39;));
    }}
  },
  {
    type: &#39;button&#39;,
    title: gettext(&#39;Drop selected&#39;),
    label: &#39;&lt;div class=\&quot;select_drop\&quot;&gt;&amp;nbsp;&lt;/div&gt;&#39;,
    onclick: { fn: function (e) {
      if (confirm(gettext(&#39;Are you sure?&#39;))) {
        var ids = this.data_table.get_selected_row_record_ids (),
            self = this,
            l = ids.length;
        
        if (l) {
          YAHOO.G4.util.xhr_post (&#39;/api/activity/do/&#39;, &#39;oper=del&amp;id=&#39; + ids.join(&#39;,&#39;), {
              &#39;success&#39;: function (o) {
                if (o.responseText == &#39;OK&#39;) { self.data_table.reload () }
                else { alert (o.responseText); }
              }
          })
        } else {
          alert (gettext(&#39;Select some rows first&#39;));
        }
      }
    }}
  },
  {
    type: &#39;button&#39;,
    label: &#39;&lt;div class=\&quot;chmod-btn\&quot;&gt;&amp;nbsp;&lt;/div&gt;&#39;,
    title: gettext(&#39;Sharing settings&#39;),
    onclick: { fn: function (e) {
      var ids = this.data_table.get_selected_row_record_ids (),
          l = ids.length;

      if (l) {
        YAHOO.G4.util.load_acl_dialod (&#39;activity&#39;, ids);
      } else {
        alert (gettext(&#39;Select some rows first&#39;));
      }
    }}
  }</code></pre>

] } };
YAHOO.extend (ActivitiesView, YAHOO.G4.GenericView, { initDefaultConfig: function() { ActivitiesView.superclass.initDefaultConfig.call(this);
  var k;
  for (k in DEFAULT_CONFIG) {
    this.cfg.setProperty (DEFAULT_CONFIG[k].key, DEFAULT_CONFIG[k].value);
  }
},
init: function (el, userConfig) {
ActivitiesView.superclass.init.call(this, el);
if (userConfig) {
this.cfg.applyConfig (userConfig, true);
}
},
render: function () {
var self = this;
ActivitiesView.superclass.render.call(this);
this.data_table.subscribe('postRenderEvent', function () {
if (self.total_records) self.container.count_el.innerHTML =  ' ('+self.total_records+')';
});
YAHOO.G4.global_events.update_activities.subscribe (function() {
self.data_table.reload ()
})
}
}); }());
YAHOO.register("g4activities", YAHOO.G4.ActivitiesView, {version: "0.1", build: "1"});
```"
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment