changed approach to map creation. reorganized code to suit that.

This commit is contained in:
Connor Turland 2014-07-29 23:18:43 -04:00
parent ae8c711d27
commit f817ce772c
33 changed files with 558 additions and 572 deletions

View file

@ -10,18 +10,11 @@
// WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD // WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD
// GO AFTER THE REQUIRES BELOW. // GO AFTER THE REQUIRES BELOW.
// //
// require autocomplete-rails-uncompressed
//
//= require jquery //= require jquery
//= require jquery-ui //= require jquery-ui
//= require jquery.purr
//= require jquery.lettering
//= require jquery.textillate
//= require jquery.roundabout.min
//= require bip
//= require jquery_ujs //= require jquery_ujs
//= require typeahead //= require ./orderedLibraries/underscore
//= require hogan-2.0.0 //= require ./orderedLibraries/backbone
//= require_directory ./scroll //= require_directory ./librariesForAllPages
//= require_directory ./typing //= require ./metamaps/Metamaps.GlobalUI
//= require ./metamaps/Metamaps.GlobalUI //= require ./metamaps/Metamaps.Backbone

View file

@ -10,10 +10,11 @@
// WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD // WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD
// GO AFTER THE REQUIRES BELOW. // GO AFTER THE REQUIRES BELOW.
// //
//= require socket.io //
//= require underscore // can't use require directory because underscore needs to come before backbone
//= require backbone //
//= require_directory ./carousel //= require ./librariesForMapPages/cloudcarousel
//= require ./librariesForMapPages/socket.io
//= require ./metamaps/JIT //= require ./metamaps/JIT
//= require ./metamaps/Metamaps //= require ./metamaps/Metamaps
//= require ./metamaps/Metamaps.JIT //= require ./metamaps/Metamaps.JIT

View file

Before

Width:  |  Height:  |  Size: 1.4 KiB

After

Width:  |  Height:  |  Size: 1.4 KiB

View file

@ -0,0 +1,34 @@
Metamaps.Backbone = {};
Metamaps.Backbone.Map = Backbone.Model.extend({
urlRoot: '/maps',
blacklist: ['created_at', 'updated_at'],
toJSON: function (options) {
return _.omit(this.attributes, this.blacklist);
},
authorizeToEdit: function (mapper) {
if (mapper && (this.get('permission') === "commons" || this.get('user_id') === mapper.get('id'))) return true;
else return false;
}
});
Metamaps.Backbone.MapsCollection = Backbone.Collection.extend({
model: Metamaps.Backbone.Map,
url: '/maps'
});
Metamaps.Backbone.Mapper = Backbone.Model.extend({
urlRoot: '/users',
blacklist: ['created_at', 'updated_at'],
toJSON: function (options) {
return _.omit(this.attributes, this.blacklist);
},
});
Metamaps.Backbone.MapperCollection = Backbone.Collection.extend({
model: Metamaps.Backbone.Mapper,
url: '/users'
});
Metamaps.Active.Mapper = new Metamaps.Backbone.Mapper({
id: userid,
name: username
});
Metamaps.Mappers = new Metamaps.Backbone.MapperCollection([Metamaps.Active.Mapper]);
Metamaps.Maps = new Metamaps.Backbone.MapsCollection();

View file

@ -2,22 +2,22 @@ var Metamaps = {}; // this variable declaration defines a Javascript object that
/* /*
* unless you are on a page with the Javascript InfoVis Toolkit (Topic or Map) the only section in the metamaps * unless you are on a page with the Javascript InfoVis Toolkit (Topic or Map) the only section in the metamaps
* object will be this one * object will be these
GlobalUI GlobalUI
Active
Maps
Mappers
Backbone
* all these get added when you are on a page with the Javascript Infovis Toolkit * all these get added when you are on a page with the Javascript Infovis Toolkit
Settings Settings
Touch Touch
Mouse Mouse
Active
Selected Selected
Maps
Mappers
Metacodes Metacodes
Topics Topics
Synapses Synapses
Mappings Mappings
Backbone
Create Create
TopicCard TopicCard
SynapseCard SynapseCard
@ -28,18 +28,25 @@ Control
Filter Filter
Listeners Listeners
Organize Organize
Topic
Synapse
Map Map
Mapper Mapper
Topic
Synapse
JIT JIT
*/ */
Metamaps.Active = {
Map: null,
Topic: null,
Mapper: null
};
Metamaps.Maps = {}; // will be initialized in Metamaps.Backbone.js as a MapCollection
Metamaps.Mappers = {}; // will be initialized in Metamaps.Backbone.js as a MapperCollection
$(document).ready(function () { $(document).ready(function () {
for (var prop in Metamaps) { for (var prop in Metamaps) {
// this runs the init function within each sub-object on the Metamaps one // this runs the init function within each sub-object on the Metamaps one
if (Metamaps.hasOwnProperty(prop) && if (Metamaps.hasOwnProperty(prop) &&
Metamaps[prop].hasOwnProperty('init') && Metamaps[prop].hasOwnProperty('init') &&
@ -49,13 +56,11 @@ $(document).ready(function () {
} }
} }
//Metamaps.Visualize.type = "ForceDirected3D";
// this line could maybe go at the end of the Metamaps.JIT init function
if (Metamaps.JIT) Metamaps.JIT.prepareVizData();
}); });
Metamaps.GlobalUI = { Metamaps.GlobalUI = {
notifyTimeout: null, notifyTimeout: null,
lightbox: null,
init: function () { init: function () {
var self = Metamaps.GlobalUI; var self = Metamaps.GlobalUI;
@ -76,8 +81,12 @@ Metamaps.GlobalUI = {
$('.alert.metamaps').delay(10000).fadeOut('fast'); $('.alert.metamaps').delay(10000).fadeOut('fast');
}, },
openLightbox: function (which) { openLightbox: function (which) {
var self = Metamaps.GlobalUI;
$('.lightboxContent').hide(); $('.lightboxContent').hide();
$('#' + which).show(); $('#' + which).show();
self.lightbox = which;
$('#lightbox_overlay').show(); $('#lightbox_overlay').show();
$('#lightbox_main').css('margin-top', '-' + ($('#lightbox_main').height() / 2) + 'px'); $('#lightbox_main').css('margin-top', '-' + ($('#lightbox_main').height() / 2) + 'px');
@ -97,16 +106,20 @@ Metamaps.GlobalUI = {
}, },
closeLightbox: function () { closeLightbox: function () {
var self = Metamaps.GlobalUI;
$('#lightbox_overlay').hide(); $('#lightbox_overlay').hide();
Metamaps.GlobalUI.CreateMap.reset('fork_map');
Metamaps.GlobalUI.CreateMap.reset('new_map'); if (self.lightbox === 'forkmap') Metamaps.GlobalUI.CreateMap.reset('fork_map');
if (self.lightbox === 'newmap') Metamaps.GlobalUI.CreateMap.reset('new_map');
if (Metamaps.Create && Metamaps.Create.isSwitchingSet) { if (Metamaps.Create && Metamaps.Create.isSwitchingSet) {
Metamaps.Create.cancelMetacodeSetSwitch(); Metamaps.Create.cancelMetacodeSetSwitch();
} }
self.lightbox = null;
}, },
notifyUser: function (message) { notifyUser: function (message) {
var self = Metamaps.GlobalUI; var self = Metamaps.GlobalUI;
if ($('.notice.metamaps').length == 0) { if ($('.notice.metamaps').length == 0) {
$('body').prepend('<div class="notice metamaps" />'); $('body').prepend('<div class="notice metamaps" />');
} }
@ -186,33 +199,102 @@ Metamaps.GlobalUI.MainMenu = {
Metamaps.GlobalUI.CreateMap = { Metamaps.GlobalUI.CreateMap = {
newMap: null,
emptyMapForm: "",
emptyForkMapForm: "",
topicsToMap: [],
synapsesToMap: [],
init: function () { init: function () {
var self = Metamaps.GlobalUI.CreateMap;
self.newMap = new Metamaps.Backbone.Map({ permission: 'commons' });
self.bindFormEvents();
self.emptyMapForm = $('#new_map').html();
},
bindFormEvents: function () {
var self = Metamaps.GlobalUI.CreateMap;
$('.new_map button.cancel').unbind().bind('click', function (event) {
event.preventDefault();
Metamaps.GlobalUI.closeLightbox();
});
$('.new_map button.submitMap').unbind().bind('click', self.submit);
// bind permission changer events on the createMap form // bind permission changer events on the createMap form
$('.permIcon').click(function () { $('.permIcon').unbind().bind('click', self.switchPermission);
$(this).siblings('#map_permission').val($(this).attr('data-permission'));
$(this).siblings('.permIcon').find('.mapPermIcon').removeClass('selected');
$(this).find('.mapPermIcon').addClass('selected');
});
}, },
reset: function (id) { generateSuccessMessage: function (id) {
var stringStart = "Success! Do you want to <br> <a href='/maps/";
stringStart += id;
stringStart += "'>Go to your new map?</a>";
stringStart += "<br>or<br><a href='#' onclick='Metamaps.GlobalUI.closeLightbox(); return false;'>Stay on this ";
var page = Metamaps.Active.Map ? 'map' : 'page';
var stringEnd = "?</a>";
return stringStart + page + stringEnd;
},
switchPermission: function () {
var self = Metamaps.GlobalUI.CreateMap;
self.newMap.set('permission', $(this).attr('data-permission'));
$(this).siblings('.permIcon').find('.mapPermIcon').removeClass('selected');
$(this).find('.mapPermIcon').addClass('selected');
},
submit: function (event) {
event.preventDefault();
var self = Metamaps.GlobalUI.CreateMap;
var form = $('#' + id); if (Metamaps.GlobalUI.lightbox === 'forkmap') {
self.newMap.set('topicsToMap', self.topicsToMap);
form.find('#map_name').val(''); self.newMap.set('synapsesToMap', self.synapsesToMap);
form.find('#map_desc').val('');
form.find('#map_permission').val('commons');
if (id == "fork_map") {
form.find('#map_topicsToMap').val('0');
form.find('#map_synapsesToMap').val('0');
} }
// remove a selected state from all three of them var formId = Metamaps.GlobalUI.lightbox === 'forkmap' ? '#fork_map' : '#new_map';
form.find('.mapPermIcon').removeClass('selected'); var form = $(formId);
// add a selected state back to commons permission, the default
form.find('.mapCommonsIcon').addClass('selected'); self.newMap.set('name', form.find('#map_name').val());
self.newMap.set('desc', form.find('#map_desc').val());
// TODO validate map attributes
self.newMap.save(null, {
success: self.success
// TODO add error message
});
if (Metamaps.GlobalUI.lightbox === 'forkmap') {
form.html('Working...');
}
},
success: function (model) {
var self = Metamaps.GlobalUI.CreateMap;
var formId = Metamaps.GlobalUI.lightbox === 'forkmap' ? '#fork_map' : '#new_map';
var form = $(formId);
form.html(self.generateSuccessMessage(model.id));
$('#lightbox_main').css('margin-top', '-' + ($('#lightbox_main').height() / 2) + 'px');
},
reset: function (id) {
var self = Metamaps.GlobalUI.CreateMap;
var form = $('#' + id);
if (id === "fork_map") {
self.topicsToMap = [];
self.synapsesToMap = [];
form.html(self.emptyForkMapForm);
}
else {
form.html(self.emptyMapForm);
}
self.bindFormEvents();
self.newMap = new Metamaps.Backbone.Map({ permission: 'commons' });
return false; return false;
}, },
@ -300,7 +382,7 @@ Metamaps.GlobalUI.Search = {
break; //console.log(e.which); break; //console.log(e.which);
} }
}); });
self.startTypeahead(); self.startTypeahead();
}, },
open: function () { open: function () {

View file

@ -7,7 +7,7 @@ Metamaps.JIT = {
init: function () { init: function () {
var self = Metamaps.JIT; var self = Metamaps.JIT;
self.prepareVizData();
}, },
/** /**
* convert our topic JSON into something JIT can use * convert our topic JSON into something JIT can use

View file

@ -59,19 +59,11 @@ Metamaps.Mouse = {
DOUBLE_CLICK_TOLERANCE: 300 DOUBLE_CLICK_TOLERANCE: 300
}; };
Metamaps.Active = {
Map: null,
Topic: null,
Mapper: null
};
Metamaps.Selected = { Metamaps.Selected = {
Nodes: [], Nodes: [],
Edges: [] Edges: []
}; };
Metamaps.Maps = {}; // will be initialized in Metamaps.Backbone.init as a MapCollection
Metamaps.Mappers = {}; // will be initialized in Metamaps.Backbone.init as a MapperCollection
Metamaps.Metacodes = {}; // will be initialized in Metamaps.Backbone.init as a MetacodeCollection Metamaps.Metacodes = {}; // will be initialized in Metamaps.Backbone.init as a MetacodeCollection
Metamaps.Topics = {}; // will be initialized in Metamaps.Backbone.init as a TopicCollection Metamaps.Topics = {}; // will be initialized in Metamaps.Backbone.init as a TopicCollection
Metamaps.Synapses = {}; // will be initialized in Metamaps.Backbone.init as a SynapseCollection Metamaps.Synapses = {}; // will be initialized in Metamaps.Backbone.init as a SynapseCollection
@ -79,270 +71,242 @@ Metamaps.Mappings = {}; // will be initialized in Metamaps.Backbone.init as a Ma
/* /*
* *
* BACKBONE * BACKBONE
* *
*/ */
Metamaps.Backbone = { Metamaps.Backbone.init = function () {
init: function () { var self = Metamaps.Backbone;
var self = Metamaps.Backbone;
self.Metacode = Backbone.Model.extend({}); self.Metacode = Backbone.Model.extend({});
self.MetacodeCollection = Backbone.Collection.extend({ self.MetacodeCollection = Backbone.Collection.extend({
model: this.Metacode, model: this.Metacode,
url: '/metacodes' url: '/metacodes'
}); });
self.Topic = Backbone.Model.extend({ self.Topic = Backbone.Model.extend({
urlRoot: '/topics', urlRoot: '/topics',
blacklist: ['node', 'created_at', 'updated_at'], blacklist: ['node', 'created_at', 'updated_at'],
toJSON: function (options) { toJSON: function (options) {
return _.omit(this.attributes, this.blacklist); return _.omit(this.attributes, this.blacklist);
}, },
initialize: function () { initialize: function () {
if (this.isNew()) { if (this.isNew()) {
this.set({ this.set({
"user_id": Metamaps.Active.Mapper.id, "user_id": Metamaps.Active.Mapper.id,
"desc": '', "desc": '',
"link": '', "link": '',
"permission": Metamaps.Active.Map ? Metamaps.Active.Map.get('permission') : 'commons' "permission": Metamaps.Active.Map ? Metamaps.Active.Map.get('permission') : 'commons'
});
}
},
authorizeToEdit: function (mapper) {
if (mapper && (this.get('permission') === "commons" || this.get('user_id') === mapper.get('id'))) return true;
else return false;
},
authorizePermissionChange: function (mapper) {
if (mapper && this.get('user_id') === mapper.get('id')) return true;
else return false;
},
getDate: function () {
},
getUser: function () {
return Metamaps.Mapper.get(this.get('user_id'));
},
getMetacode: function () {
return Metamaps.Metacodes.get(this.get('metacode_id'));
},
getMapping: function () {
return Metamaps.Mappings.findWhere({
map_id: Metamaps.Active.Map.id,
topic_id: this.isNew() ? this.cid : this.id
}); });
},
updateMapping: function () {
var mapping = this.getMapping();
if (mapping) {
mapping.set('topic_id', this.id);
}
},
createNode: function () {
var mapping = this.getMapping();
var node = {
adjacencies: [],
data: {
$mapping: null,
$mappingID: mapping ? mapping.id : null
},
id: this.isNew() ? this.cid : this.id,
name: this.get('name')
};
return node;
},
updateNode: function () {
var mapping = this.getMapping();
var node = this.get('node');
node.setData('topic', this);
node.setData('mapping', mapping);
node.id = this.isNew() ? this.cid : this.id;
return node;
},
});
self.TopicCollection = Backbone.Collection.extend({
model: self.Topic,
url: '/topics',
comparator: function (a, b) {
a = a.get('name').toLowerCase();
b = b.get('name').toLowerCase();
return a > b ? 1 : a < b ? -1 : 0;
} }
}); },
authorizeToEdit: function (mapper) {
if (mapper && (this.get('permission') === "commons" || this.get('user_id') === mapper.get('id'))) return true;
else return false;
},
authorizePermissionChange: function (mapper) {
if (mapper && this.get('user_id') === mapper.get('id')) return true;
else return false;
},
getDate: function () {
self.Synapse = Backbone.Model.extend({ },
urlRoot: '/synapses', getUser: function () {
blacklist: ['edge', 'created_at', 'updated_at'], return Metamaps.Mapper.get(this.get('user_id'));
toJSON: function (options) { },
return _.omit(this.attributes, this.blacklist); getMetacode: function () {
}, return Metamaps.Metacodes.get(this.get('metacode_id'));
initialize: function () { },
if (this.isNew()) { getMapping: function () {
this.set({ return Metamaps.Mappings.findWhere({
"user_id": Metamaps.Active.Mapper.id, map_id: Metamaps.Active.Map.id,
"permission": Metamaps.Active.Map.get('permission'), topic_id: this.isNew() ? this.cid : this.id
"category": "from-to" });
}); },
} updateMapping: function () {
}, var mapping = this.getMapping();
authorizeToEdit: function (mapper) {
if (mapper && (this.get('permission') === "commons" || this.get('user_id') === mapper.get('id'))) return true; if (mapping) {
else return false; mapping.set('topic_id', this.id);
}, }
authorizePermissionChange: function (mapper) { },
if (mapper && this.get('user_id') === mapper.get('id')) return true; createNode: function () {
else return false; var mapping = this.getMapping();
}, var node = {
getUser: function () { adjacencies: [],
return Metamaps.Mapper.get(this.get('user_id')); data: {
}, $mapping: null,
getTopic1: function () { $mappingID: mapping ? mapping.id : null
return Metamaps.Topic.get(this.get('node1_id')); },
}, id: this.isNew() ? this.cid : this.id,
getTopic2: function () { name: this.get('name')
return Metamaps.Topic.get(this.get('node2_id')); };
}, return node;
getDirection: function () { },
return [ updateNode: function () {
var mapping = this.getMapping();
var node = this.get('node');
node.setData('topic', this);
node.setData('mapping', mapping);
node.id = this.isNew() ? this.cid : this.id;
return node;
},
});
self.TopicCollection = Backbone.Collection.extend({
model: self.Topic,
url: '/topics',
comparator: function (a, b) {
a = a.get('name').toLowerCase();
b = b.get('name').toLowerCase();
return a > b ? 1 : a < b ? -1 : 0;
}
});
self.Synapse = Backbone.Model.extend({
urlRoot: '/synapses',
blacklist: ['edge', 'created_at', 'updated_at'],
toJSON: function (options) {
return _.omit(this.attributes, this.blacklist);
},
initialize: function () {
if (this.isNew()) {
this.set({
"user_id": Metamaps.Active.Mapper.id,
"permission": Metamaps.Active.Map.get('permission'),
"category": "from-to"
});
}
},
authorizeToEdit: function (mapper) {
if (mapper && (this.get('permission') === "commons" || this.get('user_id') === mapper.get('id'))) return true;
else return false;
},
authorizePermissionChange: function (mapper) {
if (mapper && this.get('user_id') === mapper.get('id')) return true;
else return false;
},
getUser: function () {
return Metamaps.Mapper.get(this.get('user_id'));
},
getTopic1: function () {
return Metamaps.Topic.get(this.get('node1_id'));
},
getTopic2: function () {
return Metamaps.Topic.get(this.get('node2_id'));
},
getDirection: function () {
return [
this.get('node1_id'), this.get('node1_id'),
this.get('node2_id') this.get('node2_id')
]; ];
}, },
getMapping: function () { getMapping: function () {
return Metamaps.Mappings.findWhere({ return Metamaps.Mappings.findWhere({
map_id: Metamaps.Active.Map.id, map_id: Metamaps.Active.Map.id,
synapse_id: this.isNew() ? this.cid : this.id synapse_id: this.isNew() ? this.cid : this.id
});
},
updateMapping: function () {
var mapping = this.getMapping();
if (mapping) {
mapping.set('synapse_id', this.id);
}
},
createEdge: function () {
var mapping = this.getMapping();
var mappingID = mapping.isNew() ? mapping.cid : mapping.id;
var synapseID = this.isNew() ? this.cid : this.id;
var edge = {
nodeFrom: this.get('node1_id'),
nodeTo: this.get('node2_id'),
data: {
$mappings: [],
$mappingIDs: [mappingID],
$synapses: [],
$synapseIDs: [synapseID],
}
};
return edge;
},
updateEdge: function () {
var mapping = this.getMapping();
var edge = this.get('edge');
edge.getData('mappings').push(mapping);
edge.getData('synapses').push(this);
return edge;
},
});
self.SynapseCollection = Backbone.Collection.extend({
model: self.Synapse,
url: '/synapses'
});
self.Mapping = Backbone.Model.extend({
urlRoot: '/mappings',
blacklist: ['created_at', 'updated_at'],
toJSON: function (options) {
return _.omit(this.attributes, this.blacklist);
},
initialize: function () {
if (this.isNew()) {
this.set({
"user_id": Metamaps.Active.Mapper.id,
"map_id": Metamaps.Active.Map ? Metamaps.Active.Map.id : null
}); });
},
updateMapping: function () {
var mapping = this.getMapping();
if (mapping) {
mapping.set('synapse_id', this.id);
}
},
createEdge: function () {
var mapping = this.getMapping();
var mappingID = mapping.isNew() ? mapping.cid : mapping.id;
var synapseID = this.isNew() ? this.cid : this.id;
var edge = {
nodeFrom: this.get('node1_id'),
nodeTo: this.get('node2_id'),
data: {
$mappings: [],
$mappingIDs: [mappingID],
$synapses: [],
$synapseIDs: [synapseID],
}
};
return edge;
},
updateEdge: function () {
var mapping = this.getMapping();
var edge = this.get('edge');
edge.getData('mappings').push(mapping);
edge.getData('synapses').push(this);
return edge;
},
});
self.SynapseCollection = Backbone.Collection.extend({
model: self.Synapse,
url: '/synapses'
});
self.Mapping = Backbone.Model.extend({
urlRoot: '/mappings',
blacklist: ['created_at', 'updated_at'],
toJSON: function (options) {
return _.omit(this.attributes, this.blacklist);
},
initialize: function () {
if (this.isNew()) {
this.set({
"user_id": Metamaps.Active.Mapper.id,
"map_id": Metamaps.Active.Map ? Metamaps.Active.Map.id : null
});
}
},
getUser: function () {
return Metamaps.Mapper.get(this.get('user_id'));
},
getMap: function () {
return Metamaps.Map.get(this.get('map_id'));
},
getTopic: function () {
if (this.get('category') === 'Topic') return Metamaps.Topic.get(this.get('topic_id'));
else return false;
},
getSynapse: function () {
if (this.get('category') === 'Synapse') return Metamaps.Synapse.get(this.get('synapse_id'));
else return false;
} }
}); },
getUser: function () {
return Metamaps.Mapper.get(this.get('user_id'));
},
getMap: function () {
return Metamaps.Map.get(this.get('map_id'));
},
getTopic: function () {
if (this.get('category') === 'Topic') return Metamaps.Topic.get(this.get('topic_id'));
else return false;
},
getSynapse: function () {
if (this.get('category') === 'Synapse') return Metamaps.Synapse.get(this.get('synapse_id'));
else return false;
}
});
self.MappingCollection = Backbone.Collection.extend({ self.MappingCollection = Backbone.Collection.extend({
model: self.Mapping, model: self.Mapping,
url: '/mappings' url: '/mappings'
}); });
self.Map = Backbone.Model.extend({ Metamaps.Metacodes = new self.MetacodeCollection(Metamaps.Metacodes);
urlRoot: '/maps',
blacklist: ['created_at', 'updated_at'],
toJSON: function (options) {
return _.omit(this.attributes, this.blacklist);
},
authorizeToEdit: function (mapper) {
if (mapper && (this.get('permission') === "commons" || this.get('user_id') === mapper.get('id'))) return true;
else return false;
}
});
self.MapsCollection = Backbone.Collection.extend({
model: self.Map,
url: '/maps'
});
self.Mapper = Backbone.Model.extend({ Metamaps.Topics = new self.TopicCollection(Metamaps.Topics);
urlRoot: '/users',
blacklist: ['created_at', 'updated_at'],
toJSON: function (options) {
return _.omit(this.attributes, this.blacklist);
},
});
self.MapperCollection = Backbone.Collection.extend({
model: self.Mapper,
url: '/users'
});
Metamaps.Metacodes = new self.MetacodeCollection(Metamaps.Metacodes); Metamaps.Synapses = new self.SynapseCollection(Metamaps.Synapses);
Metamaps.Active.Mapper = new self.Mapper({ Metamaps.Mappings = new self.MappingCollection(Metamaps.Mappings);
id: userid,
name: username
});
Metamaps.Mappers = new self.MapperCollection([Metamaps.Active.Mapper]);
Metamaps.Topics = new self.TopicCollection(Metamaps.Topics); Metamaps.Active.Map = new self.Map(Metamaps.Active.Map);
Metamaps.Maps.add(Metamaps.Active.Map);
Metamaps.Synapses = new self.SynapseCollection(Metamaps.Synapses); }; // end Metamaps.Backbone.init
Metamaps.Mappings = new self.MappingCollection(Metamaps.Mappings);
Metamaps.Active.Map = new self.Map(Metamaps.Active.Map);
Metamaps.Maps = new self.MapsCollection([Metamaps.Active.Map]);
}
}; // end Metamaps.Backbone
/* /*
* *
* CREATE * CREATE
* *
*/ */
Metamaps.Create = { Metamaps.Create = {
isSwitchingSet: false, // indicates whether the metacode set switch lightbox is open
metacodeScrollerInit: false, // indicates whether the scrollbar in the custom metacode set space has been init
selectedMetacodeSet: null,
selectedMetacodeSetIndex: null,
selectedMetacodeNames: [],
newSelectedMetacodeNames: [],
selectedMetacodes: [],
newSelectedMetacodes: [],
init: function () { init: function () {
var self = Metamaps.Create; var self = Metamaps.Create;
self.newTopic.init(); self.newTopic.init();
@ -356,28 +320,23 @@ Metamaps.Create = {
selected: self.selectedMetacodeSetIndex selected: self.selectedMetacodeSetIndex
}).addClass("ui-tabs-vertical ui-helper-clearfix"); }).addClass("ui-tabs-vertical ui-helper-clearfix");
$("#metacodeSwitchTabs .ui-tabs-nav li").removeClass("ui-corner-top").addClass("ui-corner-left"); $("#metacodeSwitchTabs .ui-tabs-nav li").removeClass("ui-corner-top").addClass("ui-corner-left");
$('.customMetacodeList li').click(function () { $('.customMetacodeList li').click(self.toggleMetacodeSelected); // within the custom metacode set tab
if ($(this).attr('class') != 'toggledOff') { },
$(this).addClass('toggledOff'); toggleMetacodeSelected: function () {
var value_to_remove = $(this).attr('id'); var self = Metamaps.Create;
var name_to_remove = $(this).attr('data-name');
self.newSelectedMetacodes.splice(self.newSelectedMetacodes.indexOf(value_to_remove), 1); if ($(this).attr('class') != 'toggledOff') {
self.newSelectedMetacodeNames.splice(self.newSelectedMetacodeNames.indexOf(name_to_remove), 1); $(this).addClass('toggledOff');
} else if ($(this).attr('class') == 'toggledOff') { var value_to_remove = $(this).attr('id');
$(this).removeClass('toggledOff'); var name_to_remove = $(this).attr('data-name');
self.newSelectedMetacodes.push($(this).attr('id')); self.newSelectedMetacodes.splice(self.newSelectedMetacodes.indexOf(value_to_remove), 1);
self.newSelectedMetacodeNames.push($(this).attr('data-name')); self.newSelectedMetacodeNames.splice(self.newSelectedMetacodeNames.indexOf(name_to_remove), 1);
} } else if ($(this).attr('class') == 'toggledOff') {
}); $(this).removeClass('toggledOff');
self.newSelectedMetacodes.push($(this).attr('id'));
self.newSelectedMetacodeNames.push($(this).attr('data-name'));
}
}, },
isSwitchingSet: false, // indicates whether the metacode set switch lightbox is open
metacodeScrollerInit: false, // indicates whether the scrollbar in the custom metacode set space has been init
selectedMetacodeSet: null,
selectedMetacodeSetIndex: null,
selectedMetacodeNames: [],
newSelectedMetacodeNames: [],
selectedMetacodes: [],
newSelectedMetacodes: [],
updateMetacodeSet: function (set, index, custom) { updateMetacodeSet: function (set, index, custom) {
if (custom && Metamaps.Create.newSelectedMetacodes.length == 0) { if (custom && Metamaps.Create.newSelectedMetacodes.length == 0) {
@ -606,10 +565,10 @@ Metamaps.Create = {
/* /*
* *
* TOPICCARD * TOPICCARD
* *
*/ */
Metamaps.TopicCard = { Metamaps.TopicCard = {
openTopicCard: null, //stores the JIT local ID of the topic with the topic card open openTopicCard: null, //stores the JIT local ID of the topic with the topic card open
init: function () { init: function () {
@ -864,10 +823,10 @@ Metamaps.TopicCard = {
/* /*
* *
* SYNAPSECARD * SYNAPSECARD
* *
*/ */
Metamaps.SynapseCard = { Metamaps.SynapseCard = {
openSynapseCard: null, openSynapseCard: null,
showCard: function (edge, e) { showCard: function (edge, e) {
@ -1080,10 +1039,10 @@ Metamaps.SynapseCard = {
/* /*
* *
* VISUALIZE * VISUALIZE
* *
*/ */
Metamaps.Visualize = { Metamaps.Visualize = {
mGraph: {}, // a reference to the graph object. mGraph: {}, // a reference to the graph object.
cameraPosition: null, // stores the camera position when using a 3D visualization cameraPosition: null, // stores the camera position when using a 3D visualization
@ -1219,10 +1178,10 @@ Metamaps.Visualize = {
/* /*
* *
* UTIL * UTIL
* *
*/ */
Metamaps.Util = { Metamaps.Util = {
// helper function to determine how many lines are needed // helper function to determine how many lines are needed
// Line Splitter Function // Line Splitter Function
@ -1271,10 +1230,10 @@ Metamaps.Util = {
/* /*
* *
* REALTIME * REALTIME
* *
*/ */
Metamaps.Realtime = { Metamaps.Realtime = {
// this is for the heroku staging environment // this is for the heroku staging environment
//Metamaps.Realtime.socket = io.connect('http://gentle-savannah-1303.herokuapp.com'); //Metamaps.Realtime.socket = io.connect('http://gentle-savannah-1303.herokuapp.com');
@ -1524,7 +1483,7 @@ Metamaps.Realtime = {
} }
}, },
addTopicToMap: function (topic) { addTopicToMap: function (topic) {
// TODO // TODO
var newPos, tempForT; var newPos, tempForT;
Metamaps.Visualize.mGraph.graph.addNode(topic); Metamaps.Visualize.mGraph.graph.addNode(topic);
@ -1540,7 +1499,7 @@ Metamaps.Realtime = {
Metamaps.Visualize.mGraph.fx.plotNode(tempForT, Metamaps.Visualize.mGraph.canvas); Metamaps.Visualize.mGraph.fx.plotNode(tempForT, Metamaps.Visualize.mGraph.canvas);
}, },
updateTopicOnMap: function (topic) { updateTopicOnMap: function (topic) {
// TODO // TODO
var newPos, tempForT; var newPos, tempForT;
tempForT = Metamaps.Visualize.mGraph.graph.getNode(topic.id); tempForT = Metamaps.Visualize.mGraph.graph.getNode(topic.id);
@ -1562,7 +1521,7 @@ Metamaps.Realtime = {
}); });
}, },
addSynapseToMap: function (synapse) { addSynapseToMap: function (synapse) {
// TODO // TODO
var Node1, Node2, tempForS; var Node1, Node2, tempForS;
Node1 = Metamaps.Visualize.mGraph.graph.getNode(synapse.data.$direction[0]); Node1 = Metamaps.Visualize.mGraph.graph.getNode(synapse.data.$direction[0]);
@ -1584,7 +1543,7 @@ Metamaps.Realtime = {
}); });
}, },
updateSynapseOnMap: function (synapse) { updateSynapseOnMap: function (synapse) {
// TODO // TODO
var k, tempForS, v, wasShowDesc, _ref; var k, tempForS, v, wasShowDesc, _ref;
tempForS = Metamaps.Visualize.mGraph.graph.getAdjacence(synapse.data.$direction[0], synapse.data.$direction[1]); tempForS = Metamaps.Visualize.mGraph.graph.getAdjacence(synapse.data.$direction[0], synapse.data.$direction[1]);
@ -1600,14 +1559,14 @@ Metamaps.Realtime = {
} }
return Metamaps.Visualize.mGraph.plot(); return Metamaps.Visualize.mGraph.plot();
} }
}; // end Metamaps.Realtime }; // end Metamaps.Realtime
/* /*
* *
* CONTROL * CONTROL
* *
*/ */
Metamaps.Control = { Metamaps.Control = {
init: function () { init: function () {
@ -1874,10 +1833,10 @@ Metamaps.Control = {
/* /*
* *
* FILTER * FILTER
* *
*/ */
Metamaps.Filter = { Metamaps.Filter = {
filters: { filters: {
name: "", name: "",
@ -2008,10 +1967,10 @@ Metamaps.Filter = {
/* /*
* *
* LISTENERS * LISTENERS
* *
*/ */
Metamaps.Listeners = { Metamaps.Listeners = {
init: function () { init: function () {
@ -2038,10 +1997,10 @@ Metamaps.Listeners = {
/* /*
* *
* ORGANIZE * ORGANIZE
* *
*/ */
Metamaps.Organize = { Metamaps.Organize = {
init: function () { init: function () {
@ -2167,10 +2126,10 @@ Metamaps.Organize = {
/* /*
* *
* TOPIC * TOPIC
* *
*/ */
Metamaps.Topic = { Metamaps.Topic = {
// this function is to retrieve a topic JSON object from the database // this function is to retrieve a topic JSON object from the database
// @param id = the id of the topic to retrieve // @param id = the id of the topic to retrieve
@ -2347,10 +2306,10 @@ Metamaps.Topic = {
/* /*
* *
* SYNAPSE * SYNAPSE
* *
*/ */
Metamaps.Synapse = { Metamaps.Synapse = {
// this function is to retrieve a synapse JSON object from the database // this function is to retrieve a synapse JSON object from the database
// @param id = the id of the synapse to retrieve // @param id = the id of the synapse to retrieve
@ -2486,10 +2445,10 @@ Metamaps.Synapse = {
/* /*
* *
* MAP * MAP
* *
*/ */
Metamaps.Map = { Metamaps.Map = {
init: function () { init: function () {
var self = Metamaps.Map; var self = Metamaps.Map;
@ -2503,6 +2462,8 @@ Metamaps.Map = {
self.fork(); self.fork();
}); });
Metamaps.GlobalUI.CreateMap.emptyForkMapForm = $('#fork_map').html();
self.InfoBox.init(); self.InfoBox.init();
self.CheatSheet.init(); self.CheatSheet.init();
}, },
@ -2570,17 +2531,17 @@ Metamaps.Map = {
synapses_data = synapses_array.join(); synapses_data = synapses_array.join();
nodes_data = nodes_data.slice(0, -1); nodes_data = nodes_data.slice(0, -1);
$('#map_topicsToMap').val(nodes_data); Metamaps.GlobalUI.CreateMap.topicsToMap = nodes_data;
$('#map_synapsesToMap').val(synapses_data); Metamaps.GlobalUI.CreateMap.synapsesToMap = synapses_data;
} }
}; };
/* /*
* *
* CHEATSHEET * CHEATSHEET
* *
*/ */
Metamaps.Map.CheatSheet = { Metamaps.Map.CheatSheet = {
init: function () { init: function () {
// tab the cheatsheet // tab the cheatsheet
@ -2591,10 +2552,10 @@ Metamaps.Map.CheatSheet = {
/* /*
* *
* INFOBOX * INFOBOX
* *
*/ */
Metamaps.Map.InfoBox = { Metamaps.Map.InfoBox = {
isOpen: false, isOpen: false,
timeOut: null, timeOut: null,
@ -2675,10 +2636,10 @@ Metamaps.Map.InfoBox = {
/* /*
* *
* MAPPER * MAPPER
* *
*/ */
Metamaps.Mapper = { Metamaps.Mapper = {
// this function is to retrieve a mapper JSON object from the database // this function is to retrieve a mapper JSON object from the database
// @param id = the id of the mapper to retrieve // @param id = the id of the mapper to retrieve
@ -2709,4 +2670,4 @@ Metamaps.Mapper = {
} }
} }
}, },
}; // end Metamaps.Mapper }; // end Metamaps.Mapper

View file

@ -2011,7 +2011,7 @@ div.mapInfoStat {
margin: 10px 0 0 131px; margin: 10px 0 0 131px;
width: 254px; width: 254px;
} }
.onConsole .new_map button { .onConsole .new_map button.cancel {
margin-right: 20px; margin-right: 20px;
} }
.onConsole .new_map button, .onConsole .new_map button,

View file

@ -98,18 +98,15 @@ class MapsController < ApplicationController
@user = current_user @user = current_user
@map = Map.new() @map = Map.new()
@map.name = params[:map][:name] @map.name = params[:name]
@map.desc = params[:map][:desc] @map.desc = params[:desc]
@map.permission = params[:map][:permission] @map.permission = params[:permission]
@map.user = @user @map.user = @user
@map.arranged = false @map.arranged = false
@map.save @map.save
#this variable specifies to the js file whether it's a brand new map or a forked one
@forked = false
if params[:map][:topicsToMap] if params[:topicsToMap]
@all = params[:map][:topicsToMap] @all = params[:topicsToMap]
@all = @all.split(',') @all = @all.split(',')
@all.each do |topic| @all.each do |topic|
topic = topic.split('/') topic = topic.split('/')
@ -123,8 +120,8 @@ class MapsController < ApplicationController
@mapping.save @mapping.save
end end
if params[:map][:synapsesToMap] if params[:synapsesToMap]
@synAll = params[:map][:synapsesToMap] @synAll = params[:synapsesToMap]
@synAll = @synAll.split(',') @synAll = @synAll.split(',')
@synAll.each do |synapse_id| @synAll.each do |synapse_id|
@mapping = Mapping.new() @mapping = Mapping.new()
@ -137,13 +134,11 @@ class MapsController < ApplicationController
end end
@map.arranged = true @map.arranged = true
@map.save @map.save
@forked = true
end end
respond_to do |format| respond_to do |format|
format.js { respond_with(@map, @forked) } format.json { render :json => @map }
end end
end end
@ -153,15 +148,15 @@ class MapsController < ApplicationController
@map = Map.find(params[:id]).authorize_to_edit(@current) @map = Map.find(params[:id]).authorize_to_edit(@current)
if @map if @map
if params[:map] @map.name = params[:name] if params[:name]
@map.name = params[:map][:name] if params[:map][:name] @map.desc = params[:desc] if params[:desc]
@map.desc = params[:map][:desc] if params[:map][:desc] @map.permission = params[:permission] if params[:permission]
@map.permission = params[:map][:permission] if params[:map][:permission]
end
@map.save @map.save
end end
respond_with @map respond_to do |format|
format.json { render :json => @map }
end
end end
# DELETE maps/:id # DELETE maps/:id

View file

@ -51,19 +51,15 @@
<h4>PRIVATE</h4> <h4>PRIVATE</h4>
</div> </div>
<%= form.hidden_field :permission, :value => "commons" %>
<div class="clearfloat"></div> <div class="clearfloat"></div>
</div> </div>
<p class="permText">*new topics and synapses take on the same permission as the map they are created on</p> <p class="permText">*new topics and synapses take on the same permission as the map they are created on</p>
<div class="buttonWrapper"> <div class="buttonWrapper">
<button class="button" onclick="Metamaps.GlobalUI.closeLightbox(); return false;">Cancel</button> <button class="button cancel">Cancel</button>
<%= form.submit "Create!", class: "add" %> <button class="button submitMap">Create!</button>
</div> </div>
<%= form.hidden_field :topicsToMap, :value => 0 %>
<%= form.hidden_field :synapsesToMap, :value => 0 %>
<div class="clearfloat"></div> <div class="clearfloat"></div>
<% end %> <% end %>
</div> </div>

View file

@ -46,15 +46,14 @@
<h4>PRIVATE</h4> <h4>PRIVATE</h4>
</div> </div>
<%= form.hidden_field :permission, :value => "commons" %>
<div class="clearfloat"></div> <div class="clearfloat"></div>
</div> </div>
<p class="permText">*new topics and synapses take on the same permission as the map they are created on</p> <p class="permText">*new topics and synapses take on the same permission as the map they are created on</p>
<div class="buttonWrapper"> <div class="buttonWrapper">
<button class="button" onclick="Metamaps.GlobalUI.closeLightbox(); return false;">Cancel</button> <button class="button cancel">Cancel</button>
<%= form.submit "Create!", class: "add" %> <button class="button submitMap">Create!</button>
</div> </div>
<div class="clearfloat"></div> <div class="clearfloat"></div>

View file

@ -1,41 +0,0 @@
/*
* @file
* Javascript run on creation of a new map
*/
$('#map_name').val('');
$('#map_desc').val('');
$('#map_permission').val('commons');
<% if @forked %>
$('#map_topicsToMap').val('0');
$('#map_synapsesToMap').val('0');
var form = $('#fork_map');
<% else %>
var form = $('#new_map');
<% end %>
form.find('.mapPermIcon').removeClass('selected');
form.find('.mapCommonsIcon').addClass('selected');
var tempForm = form.html();
if (mapid == null) {
form.html("Success! Do you want to <br> <a href='/maps/" + '<%= @map.id %>' + "'>Go to your new map?</a><br>or<br><a href='#' onclick='closeIt(); return false;'>Stay on this page?</a>");
}
else if (mapid != null) {
form.html("Success! Do you want to <br> <a href='/maps/" + '<%= @map.id %>' + "'>Go to your new map?</a><br>or<br><a href='#' onclick='closeIt(); return false;'>Stay on this map?</a>");
}
$('#lightbox_main').css('margin-top', '-' + ($('#lightbox_main').height() / 2) + 'px' );
function closeIt() {
$('#lightbox_overlay').hide();
form.html(tempForm);
// bind permission changer events
form.find('.permIcon').click(function() {
$(this).siblings('#map_permission').val( $(this).attr('data-permission') );
$(this).siblings('.permIcon').find('.mapPermIcon').removeClass('selected');
$(this).find('.mapPermIcon').addClass('selected');
});
}

View file

@ -1,5 +0,0 @@
/*
* @file
* Javascript run on destruction of a map. Fades it out from map index.
*/
$('#<%= dom_id(@map) %>').fadeOut('slow');

View file

@ -1,94 +0,0 @@
/*
* @file
* Javascript code for realtime callbacks
* TODO: Connor, could you explain this code sometime?
*/
var tempForT, tempForS, tempForM;
<% @topics.each do |topic| %>
var topic = <%= topic.selfonmap_as_json(@map.id).html_safe %>;
tempForT = Mconsole.graph.getNode(topic.id);
if (tempForT === undefined) {
Mconsole.graph.addNode(topic);
var tempForT = Mconsole.graph.getNode(topic.id);
tempForT.setData('dim', 1, 'start');
tempForT.setData('dim', 25, 'end');
var newPos = new $jit.Complex();
newPos.x = tempForT.data.$xloc;
newPos.y = tempForT.data.$yloc;
tempForT.setPos(newPos, 'start');
tempForT.setPos(newPos, 'current');
tempForT.setPos(newPos, 'end');
Mconsole.fx.plotNode(tempForT, Mconsole.canvas);
Mconsole.labels.plotLabel(Mconsole.canvas, tempForT, Mconsole.config);
}
else {
var label = Mconsole.labels.getLabel(topic.id);
tempForT.setData('dim', 25, 'start');
tempForT.setData('dim', 25, 'current');
tempForT.setData('dim', 25, 'end');
if (tempForT.name != topic.name) {
tempForT.name = topic.name;
$(label).find('.best_in_place_name').html(topic.name);
$(label).find('.label').html(topic.name);
}
if (tempForT.data.$metacode != topic.data.$metacode) {
$(label).find('.best_in_place_metacode').html(topic.data.$metacode);
$(label).find('img.icon').attr('alt', topic.data.$metacode);
$(label).find('img.icon').attr('src', imgArray[topic.data.$metacode].src);
}
if (tempForT.data.$desc != topic.data.$desc) {
$(label).find('.best_in_place_desc').html(topic.data.$desc);
}
if (tempForT.data.$link != topic.data.$link) {
$(label).find('.best_in_place_link').html(topic.data.$link);
$(label).find('.link').attr('href',topic.data.$link);
}
tempForT.data = topic.data;
}
<% end %>
<% @synapses.each do |synapse| %>
var Node1 = Mconsole.graph.getNode(<%= synapse.topic1.id %>);
var Node2 = Mconsole.graph.getNode(<%= synapse.topic2.id %>);
Mconsole.graph.addAdjacence(Node1, Node2, {});
tempForS = Mconsole.graph.getAdjacence(Node1.id, Node2.id);
tempForS.setDataset('start', {
lineWidth: 0.4
});
tempForS.setDataset('end', {
lineWidth: 2
});
var d = new Array(<%= synapse.node1_id.to_s() %>, <%= synapse.node2_id.to_s() %>);
tempForS.setDataset('current', {
desc: '<%= synapse.desc %>',
showDesc: false,
category: '<%= synapse.category %>',
id: '<%= synapse.id %>',
userid: '<%= synapse.user.id %>',
username: '<%= synapse.user.name %>'
});
tempForS.data.$direction = d;
Mconsole.fx.plotLine(tempForS, Mconsole.canvas);
<% end %>
<% @mappings.each do |mapping| %>
tempForM = Mconsole.graph.getNode(<%= mapping.topic_id %>);
tempForM.data.$xloc = <%= mapping.xloc %>;
tempForM.data.$yloc = <%= mapping.yloc %>;
var newPos = new $jit.Complex();
newPos.x = tempForM.data.$xloc;
newPos.y = tempForM.data.$yloc;
tempForM.setPos(newPos, 'start');
tempForM.setPos(newPos, 'current');
tempForM.setPos(newPos, 'end');
<% end %>
<% if @topics.length > 0 || @synapses.length > 0 || @mappings.length > 0 %>
$('#map_time').val(Math.round((new Date()).getTime() / 1000));
Mconsole.fx.animate({
modes: ['linear','node-property:dim','edge-property:lineWidth'],
transition: $jit.Trans.Quad.easeInOut,
duration: 500
});
<% end %>

View file

@ -1,6 +0,0 @@
/*
* @file
* Javascript executed when you save the layout of a map.
*/
$('.sidebarSave .tip').html('Saved!');
setTimeout(function(){ $('.sidebarSave .tip').html('Save Layout') },1500);

71
codeguide.txt Normal file
View file

@ -0,0 +1,71 @@
FILE /app/views/layouts/application.html.erb
<head>
...
<%= javascript_include_tag "application" %>
<% if (controller_name == "maps" || controller_name == "topics") && action_name == "show" %>
<%= javascript_include_tag "compileMapPages" %>
<% end %>
...
</head>
WHAT DOES IT MEAN?
____________________________________________________________________
FILE /app/assets/javascripts/application.js
...
//= require jquery
//= require jquery-ui
//= require jquery_ujs
//= require ./orderedLibraries/underscore
//= require ./orderedLibraries/backbone
//= require_directory ./librariesForAllPages
//= require ./metamaps/Metamaps.GlobalUI
//= require ./metamaps/Metamaps.Backbone
WHAT DOES IT MEAN?
____________________________________________________________________
FILE /app/assets/javascripts/compileMapPages.js
...
//= require ./librariesForMapPages/cloudcarousel
//= require ./librariesForMapPages/socket.io
//= require ./metamaps/JIT
//= require ./metamaps/Metamaps
//= require ./metamaps/Metamaps.JIT
WHAT DOES IT MEAN?
____________________________________________________________________
FILE /app/assets/javascripts/metamaps/Metamaps.GlobalUI.js
var Metamaps = {};
...
$(document).ready(function () {
for (var prop in Metamaps) {
// this runs the init function within each sub-object on the Metamaps one
if (Metamaps.hasOwnProperty(prop) &&
Metamaps[prop].hasOwnProperty('init') &&
typeof (Metamaps[prop].init) == 'function'
) {
Metamaps[prop].init();
}
}
});
Metamaps.GlobalUI = {
...
};
WHAT DOES IT MEAN?
____________________________________________________________________