glenux-contrib/metamaps--metamaps
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

factor out two more small view modules

Browse source
This commit is contained in:
Devin Howard 2016-04-14 13:54:19 +08:00
parent 7bb7f345f1
commit 13d6ab56e5
4 changed files with 143 additions and 139 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
app/assets/javascripts/application.js
View file

@ -25,6 +25,8 @@
//= require ./src/views/room
//= require ./src/JIT
//= require ./src/Metamaps
//= require ./src/Metamaps.Account
//= require ./src/Metamaps.Mapper
//= require ./src/Metamaps.Admin
//= require ./src/Metamaps.Import
//= require ./src/Metamaps.JIT

121
app/assets/javascripts/src/Metamaps.Account.js.erb Normal file
View file

@ -0,0 +1,121 @@
/* global Metamaps, $ */
/*
* Metamaps.Account.js.erb
*
* Dependencies: none!
*/
Metamaps.Account = {
listenersInitialized: false,
init: function () {
var self = Metamaps.Account
},
initListeners: function () {
var self = Metamaps.Account
$('#user_image').change(self.showImagePreview)
self.listenersInitialized = true
},
toggleChangePicture: function () {
var self = Metamaps.Account
$('.userImageMenu').toggle()
if (!self.listenersInitialized) self.initListeners()
},
openChangePicture: function () {
var self = Metamaps.Account
$('.userImageMenu').show()
if (!self.listenersInitialized) self.initListeners()
},
closeChangePicture: function () {
var self = Metamaps.Account
$('.userImageMenu').hide()
},
showLoading: function () {
var self = Metamaps.Account
var loader = new CanvasLoader('accountPageLoading')
loader.setColor('#4FC059'); // default is '#000000'
loader.setDiameter(28) // default is 40
loader.setDensity(41) // default is 40
loader.setRange(0.9); // default is 1.3
loader.show() // Hidden by default
$('#accountPageLoading').show()
},
showImagePreview: function () {
var self = Metamaps.Account
var file = $('#user_image')[0].files[0]
var reader = new FileReader()
reader.onload = function (e) {
var $canvas = $('<canvas>').attr({
width: 84,
height: 84
})
var context = $canvas[0].getContext('2d')
var imageObj = new Image()
imageObj.onload = function () {
$('.userImageDiv canvas').remove()
$('.userImageDiv img').hide()
var imgWidth = imageObj.width
var imgHeight = imageObj.height
var dimensionToMatch = imgWidth > imgHeight ? imgHeight : imgWidth
// draw cropped image
var nonZero = Math.abs(imgHeight - imgWidth) / 2
var sourceX = dimensionToMatch === imgWidth ? 0 : nonZero
var sourceY = dimensionToMatch === imgHeight ? 0 : nonZero
var sourceWidth = dimensionToMatch
var sourceHeight = dimensionToMatch
var destX = 0
var destY = 0
var destWidth = 84
var destHeight = 84
context.drawImage(imageObj, sourceX, sourceY, sourceWidth, sourceHeight, destX, destY, destWidth, destHeight)
$('.userImageDiv').prepend($canvas)
}
imageObj.src = reader.result
}
if (file) {
reader.readAsDataURL(file)
$('.userImageMenu').hide()
$('#remove_image').val('0')
}
},
removePicture: function () {
var self = Metamaps.Account
$('.userImageDiv canvas').remove()
$('.userImageDiv img').attr('src', '<%= asset_path('user.png') %>').show()
$('.userImageMenu').hide()
var input = $('#user_image')
input.replaceWith(input.val('').clone(true))
$('#remove_image').val('1')
},
changeName: function () {
$('.accountName').hide()
$('.changeName').show()
},
showPass: function () {
$('.toHide').show()
$('.changePass').hide()
},
hidePass: function () {
$('.toHide').hide()
$('.changePass').show()
$('#current_password').val('')
$('#user_password').val('')
$('#user_password_confirmation').val('')
}
}

20
app/assets/javascripts/src/Metamaps.Mapper.js.erb Normal file
View file

@ -0,0 +1,20 @@
/* global Metamaps, $ */
/*
* Metamaps.Mapper.js.erb
*
* Dependencies: none!
*/
Metamaps.Mapper = {
// this function is to retrieve a mapper JSON object from the database
// @param id = the id of the mapper to retrieve
get: function (id, callback) {
return $.ajax({
url: '/users/' + id + '.json',
success: function (data) {
callback(new Metamaps.Backbone.Mapper(data))
}
})
}
}; // end Metamaps.Mapper

139
app/assets/javascripts/src/Metamaps.js.erb
View file

@ -5378,142 +5378,3 @@ Metamaps.Map.InfoBox = {
}
}
}; // end Metamaps.Map.InfoBox
/*
*
* Account Settings
*
*/
Metamaps.Account = {
listenersInitialized: false,
init: function () {
var self = Metamaps.Account;
},
initListeners: function(){
var self = Metamaps.Account;
$('#user_image').change(self.showImagePreview);
self.listenersInitialized = true;
},
toggleChangePicture: function(){
var self = Metamaps.Account;
$('.userImageMenu').toggle();
if (!self.listenersInitialized) self.initListeners();
},
openChangePicture: function(){
var self = Metamaps.Account;
$('.userImageMenu').show();
if (!self.listenersInitialized) self.initListeners();
},
closeChangePicture: function(){
var self = Metamaps.Account;
$('.userImageMenu').hide();
},
showLoading: function(){
var self = Metamaps.Account;
var loader = new CanvasLoader('accountPageLoading');
loader.setColor('#4FC059'); // default is '#000000'
loader.setDiameter(28); // default is 40
loader.setDensity(41); // default is 40
loader.setRange(0.9); // default is 1.3
loader.show(); // Hidden by default
$('#accountPageLoading').show();
},
showImagePreview: function(){
var self = Metamaps.Account;
var file = $('#user_image')[0].files[0];
var reader = new FileReader();
reader.onload = function(e) {
var $canvas = $('<canvas>').attr({
width: 84,
height: 84
});
var context = $canvas[0].getContext('2d');
var imageObj = new Image();
imageObj.onload = function() {
$('.userImageDiv canvas').remove();
$('.userImageDiv img').hide();
var imgWidth = imageObj.width;
var imgHeight = imageObj.height;
var dimensionToMatch = imgWidth > imgHeight ? imgHeight : imgWidth;
// draw cropped image
var nonZero = Math.abs(imgHeight - imgWidth) / 2;
var sourceX = dimensionToMatch === imgWidth ? 0 : nonZero;
var sourceY = dimensionToMatch === imgHeight ? 0 : nonZero;
var sourceWidth = dimensionToMatch;
var sourceHeight = dimensionToMatch;
var destX = 0;
var destY = 0;
var destWidth = 84;
var destHeight = 84;
context.drawImage(imageObj, sourceX, sourceY, sourceWidth, sourceHeight, destX, destY, destWidth, destHeight);
$('.userImageDiv').prepend($canvas);
};
imageObj.src = reader.result;
};
if (file) {
reader.readAsDataURL(file);
$('.userImageMenu').hide();
$('#remove_image').val('0');
}
},
removePicture: function(){
var self = Metamaps.Account;
$('.userImageDiv canvas').remove();
$('.userImageDiv img').attr('src', '<%= asset_path('user.png') %>').show();
$('.userImageMenu').hide();
var input = $('#user_image');
input.replaceWith(input.val('').clone(true));
$('#remove_image').val('1');
},
changeName: function(){
$('.accountName').hide();
$('.changeName').show();
},
showPass: function(){
$(".toHide").show();
$(".changePass").hide();
},
hidePass: function(){
$(".toHide").hide();
$(".changePass").show();
$('#current_password').val('');
$('#user_password').val('');
$('#user_password_confirmation').val('');
}
};
/*
*
* MAPPER
*
*/
Metamaps.Mapper = {
// this function is to retrieve a mapper JSON object from the database
// @param id = the id of the mapper to retrieve
get: function (id, callback) {
return $.ajax({
url: "/users/" + id + ".json",
success: function (data) {
callback(new Metamaps.Backbone.Mapper(data));
}
});
}
}; // end Metamaps.Mapper