Compare commits
11 commits
fc5fff5703
...
d5c3b25447
| Author | SHA1 | Date | |
|---|---|---|---|
| d5c3b25447 | |||
| 75de95acc3 | |||
| e966aa492a | |||
| 2d5be8a0ff | |||
| 811a169168 | |||
| 412317d186 | |||
| 3423a8f57c | |||
| db37319c90 | |||
| d07a2622cc | |||
| 31d08f15d8 | |||
| a7d1b6225e |
4 changed files with 588 additions and 54 deletions
|
|
@ -191,6 +191,14 @@ $=jQuery;
|
|||
|
||||
});
|
||||
|
||||
if(options.hasOwnProperty("after_list")) {
|
||||
|
||||
after_list=options.after_list;
|
||||
|
||||
after_list();
|
||||
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
error: function (data) {
|
||||
|
|
|
|||
96
css/popup.css
Normal file
96
css/popup.css
Normal file
|
|
@ -0,0 +1,96 @@
|
|||
#layer_popup {
|
||||
|
||||
z-index:50000;
|
||||
/*background-color:rgba(0,0,0,0.4);*/
|
||||
/*opacity:0.5;*/
|
||||
position:absolute;
|
||||
width:100%;
|
||||
height:100%;
|
||||
overflow:auto;
|
||||
|
||||
|
||||
}
|
||||
|
||||
#container_popup {
|
||||
|
||||
z-index:50001;
|
||||
overflow:auto;
|
||||
/* border: solid #fbfbfb 4px;*/
|
||||
position:absolute;
|
||||
overflow:visible;
|
||||
width:100%;
|
||||
height:100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
}
|
||||
|
||||
.content_popup {
|
||||
|
||||
/*position:absolute;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
transform: translate(-50%, 0%);*/
|
||||
position: absolute;
|
||||
/*top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);*/
|
||||
z-index:50005;
|
||||
margin-top:0px;
|
||||
box-sizing: border-box;
|
||||
-webkit-box-sizing:border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
opacity:1;
|
||||
/*-webkit-box-shadow: 0px 0px 160px 0px rgba(80,80,80,1);
|
||||
-moz-box-shadow: 0px 0px 160px 0px rgba(80,80,80,1);
|
||||
box-shadow: 0px 0px 160px 0px rgba(80,80,80,1);*/
|
||||
box-shadow: 0px 0px 5px 5px rgba(0,0,0,0.33);
|
||||
-webkit-box-shadow: 0px 0px 5px 5px rgba(0,0,0,0.33);
|
||||
-moz-box-shadow: 0px 0px 5px 5px rgba(0,0,0,0.33);
|
||||
position:absolute;
|
||||
}
|
||||
|
||||
/* Css for animation loading */
|
||||
/* Use this html tag */
|
||||
/* Get from https://loading.io/css/ */
|
||||
/*<div class="lds-facebook"><div></div><div></div><div></div></div>*/
|
||||
|
||||
.lds-facebook {
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
left:50%;
|
||||
top:50%;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
.lds-facebook div {
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
left: 8px;
|
||||
width: 16px;
|
||||
background: #000;
|
||||
animation: lds-facebook 1.2s cubic-bezier(0, 0.5, 0.5, 1) infinite;
|
||||
}
|
||||
.lds-facebook div:nth-child(1) {
|
||||
left: 8px;
|
||||
animation-delay: -0.24s;
|
||||
}
|
||||
.lds-facebook div:nth-child(2) {
|
||||
left: 32px;
|
||||
animation-delay: -0.12s;
|
||||
}
|
||||
.lds-facebook div:nth-child(3) {
|
||||
left: 56px;
|
||||
animation-delay: 0;
|
||||
}
|
||||
@keyframes lds-facebook {
|
||||
0% {
|
||||
top: 8px;
|
||||
height: 64px;
|
||||
}
|
||||
50%, 100% {
|
||||
top: 24px;
|
||||
height: 32px;
|
||||
}
|
||||
}
|
||||
422
popup.js
Normal file
422
popup.js
Normal file
|
|
@ -0,0 +1,422 @@
|
|||
$=jQuery;
|
||||
|
||||
(function( $ ){
|
||||
|
||||
$.fn.popUp = function (popup, width, pre_callback, post_callback, options) {
|
||||
|
||||
var popup_container='body';
|
||||
|
||||
var after_show=false;
|
||||
|
||||
var after_click=false;
|
||||
|
||||
if(options!=undefined)
|
||||
{
|
||||
|
||||
if(options.hasOwnProperty("popup_container"))
|
||||
{
|
||||
|
||||
popup_container=options.popup_container;
|
||||
|
||||
}
|
||||
|
||||
if(options.hasOwnProperty("after_show"))
|
||||
{
|
||||
|
||||
after_show=options.after_show;
|
||||
|
||||
}
|
||||
|
||||
if(options.hasOwnProperty("after_click"))
|
||||
{
|
||||
|
||||
after_click=options.after_click;
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
//If scroll put in center scroll, if not scroll, put in simple center
|
||||
|
||||
$(popup).hide();
|
||||
|
||||
$(this).on('click', function (e) {
|
||||
|
||||
|
||||
body_height=$("body").height();
|
||||
|
||||
$('#layer_popup').height(body_height);
|
||||
|
||||
$('body').prepend('<div id="layer_popup"></div>');
|
||||
|
||||
$('body').css('overflow', 'hidden');
|
||||
|
||||
content_popup=$(popup_container).prepend('<div class="content_popup"><div class="lds-facebook"><div></div><div></div><div></div></div></div>');
|
||||
|
||||
$('.lds-facebook').show();
|
||||
|
||||
$(popup).appendTo('.content_popup');
|
||||
|
||||
if(width==undefined)
|
||||
{
|
||||
|
||||
$('.content_popup').width('80%');
|
||||
|
||||
}
|
||||
else
|
||||
{
|
||||
|
||||
$('.content_popup').width(width);
|
||||
|
||||
}
|
||||
|
||||
popup_height=parseInt($(popup).height())+40;
|
||||
|
||||
window_height=$(window).height();
|
||||
|
||||
$('.content_popup').wrap('<div id="container_popup"></div>');
|
||||
|
||||
$('#container_popup').css('height', window_height);
|
||||
|
||||
$('#container_popup').addClass('click_popup');
|
||||
$('#layer_popup').addClass('click_popup');
|
||||
|
||||
pos_scroll=$(document).scrollTop();
|
||||
|
||||
new_top=Math.round((window_height-popup_height)/2)+pos_scroll;
|
||||
|
||||
$('#container_popup').css('top', pos_scroll);
|
||||
|
||||
if (popup_height>window_height)
|
||||
{
|
||||
|
||||
$('.content_popup').css('margin-top', 0);
|
||||
|
||||
}
|
||||
|
||||
$('#error_insert_name').html('')
|
||||
|
||||
$('.close_popup').click(function () {
|
||||
|
||||
$('#container_popup').click();
|
||||
|
||||
if(after_click)
|
||||
{
|
||||
|
||||
after_click();
|
||||
|
||||
}
|
||||
|
||||
return false;
|
||||
|
||||
});
|
||||
|
||||
$('.click_popup').click(function (data) {
|
||||
|
||||
if (data.target == this) {
|
||||
|
||||
$(popup).hide();
|
||||
|
||||
$(popup).appendTo('body');
|
||||
|
||||
$('#layer_popup').remove();
|
||||
|
||||
$('#container_popup').remove();
|
||||
|
||||
//$("body > #height-helper").contents().unwrap();
|
||||
|
||||
$('#height-helper').remove();
|
||||
|
||||
$('body').css('height', '100%');
|
||||
|
||||
$('body').css('overflow', 'auto');
|
||||
|
||||
if(post_callback!=undefined)
|
||||
{
|
||||
|
||||
post_callback();
|
||||
|
||||
}
|
||||
|
||||
$('.close_popup').unbind('click');
|
||||
|
||||
if(after_click)
|
||||
{
|
||||
|
||||
after_click();
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
else {
|
||||
|
||||
return true;
|
||||
|
||||
}
|
||||
|
||||
return false;
|
||||
|
||||
});
|
||||
|
||||
if(pre_callback!=undefined)
|
||||
{
|
||||
|
||||
r=pre_callback(popup, this);
|
||||
|
||||
if(r!=undefined)
|
||||
{
|
||||
|
||||
if(r===false)
|
||||
{
|
||||
|
||||
return false;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
if(!after_show)
|
||||
{
|
||||
|
||||
$(popup).fadeIn();
|
||||
|
||||
}
|
||||
else
|
||||
{
|
||||
|
||||
$(popup).fadeIn({'done': after_show(popup)});
|
||||
|
||||
}
|
||||
|
||||
$('.lds-facebook').hide();
|
||||
|
||||
|
||||
return false;
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
})( jQuery );
|
||||
|
||||
$=jQuery;
|
||||
|
||||
(function( $ ){
|
||||
|
||||
$.fn.simplePopUp=function (popup, width, pre_callback, post_callback, options) {
|
||||
|
||||
var after_show=false;
|
||||
|
||||
var after_click=false;
|
||||
|
||||
if(options!=undefined)
|
||||
{
|
||||
|
||||
if(options.hasOwnProperty("popup_container"))
|
||||
{
|
||||
|
||||
popup_container=options.popup_container;
|
||||
|
||||
}
|
||||
|
||||
if(options.hasOwnProperty("after_show"))
|
||||
{
|
||||
|
||||
after_show=options.after_show;
|
||||
|
||||
}
|
||||
|
||||
if(options.hasOwnProperty("after_click"))
|
||||
{
|
||||
|
||||
after_click=options.after_click;
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
$(this).on('click', function (e) {
|
||||
|
||||
//Show layer_popup
|
||||
|
||||
body_height=$("body").height();
|
||||
|
||||
$('#layer_popup').height(body_height);
|
||||
|
||||
$('body').prepend('<div id="layer_popup"></div>');
|
||||
|
||||
//$('body').css('overflow', 'hidden');
|
||||
|
||||
//Show popup
|
||||
|
||||
$(popup).css('position', 'absolute');
|
||||
|
||||
$(popup).css('width', width);
|
||||
|
||||
$(popup).addClass('content_popup');
|
||||
|
||||
/*var position=$(popup).offset();
|
||||
|
||||
var left=position.left;
|
||||
var top=position.top;
|
||||
|
||||
console.log($(popup).css('left'));*/
|
||||
|
||||
scr_width=$(window).width();
|
||||
|
||||
scr_height=$(window).height();
|
||||
|
||||
center_left=parseInt(scr_width/2)-parseInt(width/2);
|
||||
|
||||
center_top=parseInt(scr_height/2)-parseInt($(popup).height()/2);
|
||||
|
||||
$(popup).css('left', center_left);
|
||||
$(popup).css('top', center_top);
|
||||
|
||||
if(!after_show)
|
||||
{
|
||||
|
||||
$(popup).fadeIn();
|
||||
|
||||
}
|
||||
else
|
||||
{
|
||||
|
||||
$(popup).fadeIn({'done': after_show(popup)});
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
$('.close_popup').click(function () {
|
||||
|
||||
if(after_click)
|
||||
{
|
||||
|
||||
after_click();
|
||||
|
||||
}
|
||||
|
||||
$('#layer_popup').remove();
|
||||
|
||||
$(popup).hide();
|
||||
|
||||
return false;
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
})( jQuery );
|
||||
|
||||
//From https://www.w3schools.com/howto/howto_js_draggable.asp
|
||||
|
||||
function dragElement(draggable, header) {
|
||||
|
||||
elmnt=document.getElementById(draggable);
|
||||
|
||||
var pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0;
|
||||
if (document.getElementById(header)) {
|
||||
// if present, the header is where you move the DIV from:
|
||||
document.getElementById(header).onmousedown = dragMouseDown;
|
||||
} else {
|
||||
// otherwise, move the DIV from anywhere inside the DIV:
|
||||
elmnt.onmousedown = dragMouseDown;
|
||||
}
|
||||
|
||||
function dragMouseDown(e) {
|
||||
e = e || window.event;
|
||||
e.preventDefault();
|
||||
// get the mouse cursor position at startup:
|
||||
pos3 = e.clientX;
|
||||
pos4 = e.clientY;
|
||||
document.onmouseup = closeDragElement;
|
||||
// call a function whenever the cursor moves:
|
||||
document.onmousemove = elementDrag;
|
||||
}
|
||||
|
||||
function elementDrag(e) {
|
||||
e = e || window.event;
|
||||
e.preventDefault();
|
||||
// calculate the new cursor position:
|
||||
pos1 = pos3 - e.clientX;
|
||||
pos2 = pos4 - e.clientY;
|
||||
pos3 = e.clientX;
|
||||
pos4 = e.clientY;
|
||||
// set the element's new position:
|
||||
elmnt.style.top = (elmnt.offsetTop - pos2) + "px";
|
||||
elmnt.style.left = (elmnt.offsetLeft - pos1) + "px";
|
||||
}
|
||||
|
||||
function closeDragElement() {
|
||||
// stop moving when mouse button is released:
|
||||
document.onmouseup = null;
|
||||
document.onmousemove = null;
|
||||
}
|
||||
}
|
||||
|
||||
(function( $ ){
|
||||
|
||||
$.fn.draggable = function (header) {
|
||||
|
||||
var pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0;
|
||||
|
||||
var popup=this;
|
||||
|
||||
$(header).on('mousedown', function (e) {
|
||||
|
||||
e = e || window.event;
|
||||
|
||||
e.preventDefault();
|
||||
// get the mouse cursor position at startup:
|
||||
pos3 = e.clientX;
|
||||
pos4 = e.clientY;
|
||||
|
||||
document.onmouseup = closeDragElement;
|
||||
|
||||
// call a function whenever the cursor moves:
|
||||
document.onmousemove = elementDrag;
|
||||
|
||||
console.log('Moving...');
|
||||
|
||||
});
|
||||
|
||||
function elementDrag(e) {
|
||||
|
||||
console.log('Moving windows...');
|
||||
|
||||
e = e || window.event;
|
||||
e.preventDefault();
|
||||
// calculate the new cursor position:
|
||||
pos1 = pos3 - e.clientX;
|
||||
pos2 = pos4 - e.clientY;
|
||||
pos3 = e.clientX;
|
||||
pos4 = e.clientY;
|
||||
// set the element's new position:
|
||||
/*elmnt.style.top = (elmnt.offsetTop - pos2) + "px";
|
||||
elmnt.style.left = (elmnt.offsetLeft - pos1) + "px";*/
|
||||
|
||||
offset=$(popup).offset();
|
||||
|
||||
offset_top=parseInt(offset.top);
|
||||
offset_left=parseInt(offset.left);
|
||||
|
||||
$(popup).css('top', (offset_top - pos2) + "px");
|
||||
$(popup).css('left', (offset_left - pos1) + "px");
|
||||
|
||||
}
|
||||
|
||||
function closeDragElement() {
|
||||
// stop moving when mouse button is released:
|
||||
document.onmouseup = null;
|
||||
document.onmousemove = null;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
})( jQuery );
|
||||
108
posting2.js
108
posting2.js
|
|
@ -4,7 +4,7 @@
|
|||
|
||||
/* Add csrf token */
|
||||
|
||||
/* options: url: url to post, loading: dom id, success: func, pre_callback, separated_data:boolean */
|
||||
/* options: url: url to post, loading: dom id, success: func, error_data: func, pre_callback, separated_data:boolean, upload: {progressbar: '#progressbar', 'total_loader': '#total_loader', 'status': '#status'} */
|
||||
|
||||
$.fn.sendPost = function (options)
|
||||
{
|
||||
|
|
@ -23,6 +23,40 @@
|
|||
|
||||
}
|
||||
|
||||
var xhr=false;
|
||||
|
||||
if(options.hasOwnProperty("upload")) {
|
||||
|
||||
xhr=function() {
|
||||
var myXhr = $.ajaxSettings.xhr();
|
||||
if(myXhr.upload){
|
||||
|
||||
var progressbar=options.upload.progressbar;
|
||||
var total_loader=options.upload.total_loader;
|
||||
var status=options.upload.status;
|
||||
|
||||
$(total_loader).html('');
|
||||
$(progressbar).attr('value', 0);
|
||||
$(status).html('');
|
||||
|
||||
myXhr.upload.addEventListener('progress',function (event) {
|
||||
|
||||
$(total_loader).html("Uploaded "+event.loaded+" bytes of "+event.total);
|
||||
var percent = (event.loaded / event.total) * 100;
|
||||
$(progressbar).attr('value', (Math.round(percent)));
|
||||
$(status).html(Math.round(percent)+"% uploaded... please wait");
|
||||
|
||||
}, false);
|
||||
|
||||
myXhr.addEventListener("load", function(event) {
|
||||
|
||||
$(status).html("File loaded successfully!!");
|
||||
|
||||
}, false);
|
||||
}
|
||||
return myXhr;
|
||||
}
|
||||
}
|
||||
|
||||
$(this).on('submit', function (e) {
|
||||
|
||||
|
|
@ -30,50 +64,20 @@
|
|||
|
||||
form=this;
|
||||
|
||||
/*if($(this).attr('enctype'))
|
||||
{*/
|
||||
if(options.separated_data)
|
||||
{
|
||||
|
||||
data[options.separated_data]=new FormData($(this)[0]);
|
||||
|
||||
}
|
||||
else
|
||||
{
|
||||
|
||||
data=new FormData($(this)[0]);
|
||||
|
||||
}
|
||||
|
||||
|
||||
xhrFields={
|
||||
withCredentials: true
|
||||
};
|
||||
|
||||
/*}
|
||||
if(options.separated_data)
|
||||
{
|
||||
data[options.separated_data]=new FormData($(this)[0]);
|
||||
}
|
||||
else
|
||||
{
|
||||
data=new FormData($(this)[0]);
|
||||
}
|
||||
|
||||
if(options.separated_data)
|
||||
{
|
||||
|
||||
data[options.separated_data]=$(this).serializeArray();
|
||||
xhrFields={
|
||||
withCredentials: true
|
||||
};
|
||||
|
||||
}
|
||||
else
|
||||
{
|
||||
|
||||
data=$(this).serializeArray().reduce(function(obj, item) {
|
||||
obj[item.name] = item.value;
|
||||
return obj;
|
||||
}, {});
|
||||
|
||||
}
|
||||
|
||||
xhrFields={
|
||||
};
|
||||
|
||||
}*/
|
||||
|
||||
if(!data.hasOwnProperty("csrf_token")) {
|
||||
|
||||
|
|
@ -84,11 +88,8 @@
|
|||
//Hide form and show the time icon
|
||||
|
||||
$(this).find('.error').hide();
|
||||
//$(this).hide();
|
||||
$(options.loading).show();
|
||||
|
||||
/*$(this).find('input').prop("disabled", true);
|
||||
$(this).find('select').prop("disabled", true);*/
|
||||
$(options.loading).show();
|
||||
|
||||
if(options.hasOwnProperty("pre_callback")) {
|
||||
|
||||
|
|
@ -98,20 +99,19 @@
|
|||
|
||||
//Ajax
|
||||
|
||||
$.ajax({
|
||||
ajax_post={
|
||||
type: "POST",
|
||||
url: options.url,
|
||||
data: data,
|
||||
encoding: "UTF-8",
|
||||
xhrFields: xhrFields,
|
||||
cache:false,
|
||||
contentType: false,
|
||||
contentType:false,
|
||||
processData: false,
|
||||
success: function (data) {
|
||||
|
||||
$(options.loading).hide();
|
||||
|
||||
|
||||
if(data.error) {
|
||||
|
||||
if(!data.hasOwnProperty("error_csrf"))
|
||||
|
|
@ -169,8 +169,6 @@
|
|||
else
|
||||
{
|
||||
|
||||
|
||||
|
||||
// If ok then post successful task.
|
||||
|
||||
if(options.hasOwnProperty("success")) {
|
||||
|
|
@ -197,7 +195,17 @@
|
|||
|
||||
},
|
||||
dataType: 'json'
|
||||
});
|
||||
};
|
||||
|
||||
//console.log(xhr);
|
||||
|
||||
if(xhr!=false) {
|
||||
|
||||
ajax_post.xhr=xhr;
|
||||
|
||||
}
|
||||
|
||||
$.ajax(ajax_post);
|
||||
|
||||
return false;
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue