Common unit for email invite modal for devices screens

revert-70aa11f8
Imesh Chandrasiri 8 years ago
parent 29bf6f25cf
commit f70be13bf2

@ -0,0 +1,74 @@
{{!
Copyright (c) 2016, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
WSO2 Inc. licenses this file to you under the Apache License,
Version 2.0 (the "License"); you may not use this file except
in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
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.
}}
{{#zone "content"}}
<div id="invite-by-email-modal" class="hidden">
<div class="modal-header">
<h4 class="pull-left modal-title">
<span class="fw-stack add-margin-right-1x">
<i class="fw fw-user fw-stack-2x"></i>
<span class="fw-stack fw-move-right fw-move-bottom">
<i class="fw fw-ring fw-stack-2x"></i>
<i class="fw fw-circle fw-stack-2x fw-stroke text-info"></i>
<i class="fw fw-add fw-stack-1x fw-inverse"></i>
</span>
</span>
Send Invites
</h4>
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fw fw-cancel"></i></button>
</div>
<hr>
<div class="modal-body add-margin-top-2x add-margin-bottom-2x">
<div class="panel-body col-centered text-center">
<h5>
</h5>
<br>
<div class="panel panel-default">
<div class="panel-body">
<div id="user-create-form" class="col-centered col-lg-8 wr-content">
<div class="text-left">
<div class="wr-input-control">
<select multiple="true" name="choose_usr_email[]" id="choose_usr_email" class="form-control">
</select>
</div>
</div>
</div>
<p>Please add one or more email addresses seperated by a <b>comma ( , )</b> to send an email invitation which includes</br>
instructions on how to download the respective device agent.</p>
</div>
</div>
</br>
</br>
</div>
</div>
<div class="modal-footer">
<div class="buttons">
<a href="javascript:sendInvites()" class="btn-operations btn-default">Send Invite(s)</a>
</div>
</div>
</div>
{{/zone}}
{{#zone "topCss"}}
{{css "css/invite-modal-styles.css"}}
{{/zone}}
{{#zone "bottomJs"}}
{{js "js/invite-modal.js"}}
{{/zone}}

@ -0,0 +1,52 @@
/**
* Created by imesh on 16/12/16.
*/
/**
* Opens a modal popup with input to enter multiple email addresses to send invites
*/
function toggleEmailInvite(){
$(".modal-content").html($("#invite-by-email-modal").html());
//$('.modal-content .select2-container').remove();
$('.modal-content #choose_usr_email').select2({
tags: true,
tokenSeparators: [",", " "],
createTag: function(term, data) {
var value = term.term;
if(validateEmail(value)) {
return {
id: value,
text: value
};
}
return null;
}
});
showPopup();
}
function validateEmail(email) {
var re = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return re.test(email);
}
/**
* Action to get email object from select2 element
* @returns {boolean}
*/
function sendInvites(){
var emailObj = $('.modal-content #choose_usr_email').select2('data'),
emailArr = [];
if(emailObj.length <= 0){
console.log('no values to print');
return false;
}
emailObj.forEach(function(el){
emailArr.push(el.text);
})
hidePopup();
console.log(emailArr);
}
Loading…
Cancel
Save