mirror of
https://github.com/pierre42100/ComunicWeb
synced 2024-11-26 13:59:23 +00:00
User select functionnal
This commit is contained in:
parent
c66b40a137
commit
da64011e58
10
assets/css/components/userSelect/userSelect.css
Normal file
10
assets/css/components/userSelect/userSelect.css
Normal file
@ -0,0 +1,10 @@
|
|||||||
|
/**
|
||||||
|
* Users select
|
||||||
|
*
|
||||||
|
* @author Pierre HUBERT
|
||||||
|
*/
|
||||||
|
|
||||||
|
.user-select-image {
|
||||||
|
border-radius: 50%;
|
||||||
|
width: 25px;
|
||||||
|
}
|
@ -502,6 +502,13 @@ var ComunicWeb = {
|
|||||||
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* User selector
|
||||||
|
*/
|
||||||
|
userSelect:{
|
||||||
|
//TODO : implement
|
||||||
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
78
assets/js/components/userSelect/userSelect.js
Normal file
78
assets/js/components/userSelect/userSelect.js
Normal file
@ -0,0 +1,78 @@
|
|||||||
|
/**
|
||||||
|
* User selector (using select2)
|
||||||
|
*
|
||||||
|
* @author Pierre HUBERT
|
||||||
|
*/
|
||||||
|
|
||||||
|
ComunicWeb.components.userSelect = {
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Initialize user selector for an element of the page
|
||||||
|
*
|
||||||
|
* @param {HTMLElement} inputSelect The target select input
|
||||||
|
* @return {Boolean} True for a success
|
||||||
|
*/
|
||||||
|
init: function(inputSelect){
|
||||||
|
|
||||||
|
//Log action
|
||||||
|
ComunicWeb.debug.logMessage("INFO : Initialize user selector");
|
||||||
|
|
||||||
|
$(inputSelect).select2({
|
||||||
|
ajax: {
|
||||||
|
transport: function(params, success, failure){
|
||||||
|
|
||||||
|
//Check if some data were passed or not
|
||||||
|
if(!params.data.term)
|
||||||
|
return false;
|
||||||
|
|
||||||
|
//Retrive users list
|
||||||
|
ComunicWeb.user.userInfos.search(params.data.term, function(usersInfos){
|
||||||
|
|
||||||
|
if(usersInfos.error)
|
||||||
|
return; // Doesn't do anything failure();
|
||||||
|
else{
|
||||||
|
//Prepare results processing
|
||||||
|
returnData = {
|
||||||
|
results: []
|
||||||
|
}
|
||||||
|
|
||||||
|
//Processing results
|
||||||
|
for(i in usersInfos){
|
||||||
|
returnData.results.push({
|
||||||
|
id: usersInfos[i].userID,
|
||||||
|
text: usersInfos[i].firstName + " " + usersInfos[i].lastName,
|
||||||
|
accountImage: usersInfos[i].accountImage,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
//Return result
|
||||||
|
success(returnData);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
},
|
||||||
|
delay: 250,
|
||||||
|
},
|
||||||
|
|
||||||
|
//Format result displaying
|
||||||
|
templateResult: ComunicWeb.components.userSelect.formatUser,
|
||||||
|
});
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Format the display of a user
|
||||||
|
*
|
||||||
|
* @param {Object} infos Informations about the user
|
||||||
|
* @return {String} The formated informations
|
||||||
|
*/
|
||||||
|
formatUser: function(infos){
|
||||||
|
console.log(infos);
|
||||||
|
|
||||||
|
if(!infos.id)
|
||||||
|
return infos.id;
|
||||||
|
|
||||||
|
return $("<img src='"+infos.accountImage+"' class='user-select-image' /> <span>" + infos.text + "</span>");
|
||||||
|
},
|
||||||
|
|
||||||
|
};
|
@ -27,6 +27,18 @@ ComunicWeb.pages.home.home = {
|
|||||||
});
|
});
|
||||||
loginButton.innerHTML="Logout";
|
loginButton.innerHTML="Logout";
|
||||||
targetElement.appendChild(loginButton);
|
targetElement.appendChild(loginButton);
|
||||||
|
|
||||||
|
//Create select user element
|
||||||
|
var formGroup = createElem("div", targetElement);
|
||||||
|
formGroup.className = "form-group";
|
||||||
|
var selectElement = createElem("select", formGroup);
|
||||||
|
selectElement.className = "form-control select2";
|
||||||
|
selectElement.setAttribute("multiple", "multiple");
|
||||||
|
selectElement.setAttribute("data-placeholder", "Select users");
|
||||||
|
|
||||||
|
//Initialize user selector
|
||||||
|
ComunicWeb.components.userSelect.init(selectElement);
|
||||||
|
|
||||||
}
|
}
|
||||||
else{
|
else{
|
||||||
//Display landing page
|
//Display landing page
|
||||||
|
@ -16,6 +16,7 @@ $config['CSSfiles'] = array(
|
|||||||
"%PATH_ASSETS%3rdparty/adminLTE/plugins/ionicons/css/ionicons.min.css",
|
"%PATH_ASSETS%3rdparty/adminLTE/plugins/ionicons/css/ionicons.min.css",
|
||||||
"%PATH_ASSETS%3rdparty/adminLTE/plugins/iCheck/square/blue.css",
|
"%PATH_ASSETS%3rdparty/adminLTE/plugins/iCheck/square/blue.css",
|
||||||
"%PATH_ASSETS%3rdparty/adminLTE/plugins/iCheck/flat/blue.css",
|
"%PATH_ASSETS%3rdparty/adminLTE/plugins/iCheck/flat/blue.css",
|
||||||
|
"%PATH_ASSETS%3rdparty/adminLTE/plugins/select2/select2.min.css",
|
||||||
"%PATH_ASSETS%3rdparty/adminLTE/dist/css/AdminLTE.min.css",
|
"%PATH_ASSETS%3rdparty/adminLTE/dist/css/AdminLTE.min.css",
|
||||||
"%PATH_ASSETS%3rdparty/adminLTE/dist/css/skins/_all-skins.min.css",
|
"%PATH_ASSETS%3rdparty/adminLTE/dist/css/skins/_all-skins.min.css",
|
||||||
|
|
||||||
@ -29,6 +30,7 @@ $config['CSSfiles'] = array(
|
|||||||
"%PATH_ASSETS%css/components/friends/friendsBar.css",
|
"%PATH_ASSETS%css/components/friends/friendsBar.css",
|
||||||
"%PATH_ASSETS%css/components/discussions/manager.css",
|
"%PATH_ASSETS%css/components/discussions/manager.css",
|
||||||
"%PATH_ASSETS%css/components/discussions/windows.css",
|
"%PATH_ASSETS%css/components/discussions/windows.css",
|
||||||
|
"%PATH_ASSETS%css/components/userSelect/userSelect.css",
|
||||||
);
|
);
|
||||||
|
|
||||||
//JS files to include (at the end of the page)
|
//JS files to include (at the end of the page)
|
||||||
@ -39,6 +41,7 @@ $config['JSfiles'] = array(
|
|||||||
"%PATH_ASSETS%3rdparty/adminLTE/plugins/jquery-ui/jquery-ui.min.js",
|
"%PATH_ASSETS%3rdparty/adminLTE/plugins/jquery-ui/jquery-ui.min.js",
|
||||||
"%PATH_ASSETS%3rdparty/adminLTE/plugins/iCheck/icheck.min.js",
|
"%PATH_ASSETS%3rdparty/adminLTE/plugins/iCheck/icheck.min.js",
|
||||||
"%PATH_ASSETS%3rdparty/adminLTE/plugins/slimScroll/jquery.slimscroll.min.js",
|
"%PATH_ASSETS%3rdparty/adminLTE/plugins/slimScroll/jquery.slimscroll.min.js",
|
||||||
|
"%PATH_ASSETS%3rdparty/adminLTE/plugins/select2/select2.js", //remove .min to debug
|
||||||
"%PATH_ASSETS%3rdparty/adminLTE/dist/js/app.min.js",
|
"%PATH_ASSETS%3rdparty/adminLTE/dist/js/app.min.js",
|
||||||
|
|
||||||
//Bootstrap notify
|
//Bootstrap notify
|
||||||
@ -78,6 +81,7 @@ $config['JSfiles'] = array(
|
|||||||
"%PATH_ASSETS%js/components/discussions/manager.js",
|
"%PATH_ASSETS%js/components/discussions/manager.js",
|
||||||
"%PATH_ASSETS%js/components/discussions/list.js",
|
"%PATH_ASSETS%js/components/discussions/list.js",
|
||||||
"%PATH_ASSETS%js/components/discussions/windows.js",
|
"%PATH_ASSETS%js/components/discussions/windows.js",
|
||||||
|
"%PATH_ASSETS%js/components/userSelect/userSelect.js",
|
||||||
|
|
||||||
//User scripts
|
//User scripts
|
||||||
"%PATH_ASSETS%js/user/loginTokens.js",
|
"%PATH_ASSETS%js/user/loginTokens.js",
|
||||||
|
Loading…
Reference in New Issue
Block a user