mirror of
https://github.com/xevidos/codiad.git
synced 2024-12-22 05:42:17 +01:00
Added initial mobile touchpunch, Added a loading gif for when saving settings, fixed issue where password dialog would not close when saving password, Removed settings no longer used, Fixed sidebar setting not being loaded, added a double click of sidebar to reset default position,
This commit is contained in:
parent
4991c0c76c
commit
3bae8c29fe
10 changed files with 211 additions and 170 deletions
|
@ -305,6 +305,7 @@ ALTER TABLE `user_options`
|
|||
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Create sessions path.
|
||||
*/
|
||||
|
@ -318,7 +319,7 @@ ALTER TABLE `user_options`
|
|||
// Create Active file
|
||||
//////////////////////////////////////////////////////////////////
|
||||
|
||||
saveJSON($active, array(''));
|
||||
saveJSON( $active, array( '' ) );
|
||||
|
||||
//////////////////////////////////////////////////////////////////
|
||||
// Create Config
|
||||
|
|
|
@ -20,7 +20,7 @@
|
|||
|
||||
switch($_GET['action']) {
|
||||
case "settings":
|
||||
?>
|
||||
?>
|
||||
<div class="settings-view">
|
||||
<div class="config-menu">
|
||||
<label><?php i18n("Settings"); ?></label>
|
||||
|
@ -74,6 +74,7 @@
|
|||
</div>
|
||||
<button class="btn-right" onclick="save(); return false;"><?php i18n("Save"); ?></button>
|
||||
<button class="btn-right" onclick="codiad.modal.unload(); return false;"><?php i18n("Close"); ?></button>
|
||||
<div class="loading"></div>
|
||||
<script>
|
||||
|
||||
var settings = {};
|
||||
|
@ -82,6 +83,7 @@
|
|||
});
|
||||
|
||||
function save() {
|
||||
codiad.modal.show_loading();
|
||||
$('.setting').each(function(){
|
||||
var setting = $(this).data('setting');
|
||||
var val = $(this).val();
|
||||
|
@ -152,14 +154,14 @@
|
|||
});
|
||||
/* Notify listeners */
|
||||
amplify.publish('settings.dialog.save',{});
|
||||
codiad.modal.unload();
|
||||
codiad.settings.save( settings );
|
||||
codiad.modal.unload();
|
||||
}
|
||||
</script>
|
||||
<?php
|
||||
<?php
|
||||
break;
|
||||
case "iframe":
|
||||
?>
|
||||
?>
|
||||
<script>
|
||||
/*
|
||||
* Storage Event:
|
||||
|
@ -174,7 +176,7 @@
|
|||
}
|
||||
}, false);
|
||||
</script>
|
||||
<?php
|
||||
<?php
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
|
|
|
@ -29,7 +29,7 @@
|
|||
$( 'body' ).append( '<iframe src="components/settings/dialog.php?action=iframe"></iframe>' );
|
||||
|
||||
//Load Settings
|
||||
//this.load();
|
||||
this.load();
|
||||
},
|
||||
|
||||
get_option: async function( option ) {
|
||||
|
@ -80,7 +80,7 @@
|
|||
|
||||
load: function() {
|
||||
|
||||
amplify.publish( 'settings.loaded', null );
|
||||
amplify.publish( 'settings.loaded', {} );
|
||||
codiad.editor.getSettings();
|
||||
},
|
||||
|
||||
|
|
|
@ -53,28 +53,4 @@
|
|||
</td>
|
||||
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
|
||||
<td><?php i18n("Sync system settings on all devices"); ?></td>
|
||||
<td>
|
||||
<select class="setting" data-setting="codiad.settings.system.sync">
|
||||
<option value="true"><?php i18n("Yes") ?></option>
|
||||
<option value="false" default><?php i18n("No") ?></option>
|
||||
</select>
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
|
||||
<td><?php i18n("Sync plugin settings on all devices"); ?></td>
|
||||
<td>
|
||||
<select class="setting" data-setting="codiad.settings.plugin.sync">
|
||||
<option value="true"><?php i18n("Yes") ?></option>
|
||||
<option value="false" default><?php i18n("No") ?></option>
|
||||
</select>
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
</table>
|
||||
|
|
|
@ -318,9 +318,10 @@ class User {
|
|||
|
||||
if( sql::check_sql_error( $return ) ) {
|
||||
|
||||
echo formatJSEND( "success", null );
|
||||
} else {
|
||||
|
||||
echo formatJSEND( "success", null );
|
||||
echo( $return );
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -101,6 +101,7 @@ if( defined( "SITE_NAME" ) && ! ( SITE_NAME === "" || SITE_NAME === null ) ) {
|
|||
<script src="js/jquery.css3.min.js"></script>
|
||||
<script src="js/jquery.easing.js"></script>
|
||||
<script src="js/jquery.toastmessage.js"></script>
|
||||
<script src="js/jquery.ui.touch-punch.min.js"></script>
|
||||
<script src="js/amplify.min.js"></script>
|
||||
<script src="js/localstorage.js"></script>
|
||||
<script src="js/jquery.hoverIntent.min.js"></script>
|
||||
|
|
11
js/jquery.ui.touch-punch.min.js
vendored
Executable file
11
js/jquery.ui.touch-punch.min.js
vendored
Executable file
|
@ -0,0 +1,11 @@
|
|||
/*!
|
||||
* jQuery UI Touch Punch 0.2.3
|
||||
*
|
||||
* Copyright 2011–2014, Dave Furfero
|
||||
* Dual licensed under the MIT or GPL Version 2 licenses.
|
||||
*
|
||||
* Depends:
|
||||
* jquery.ui.widget.js
|
||||
* jquery.ui.mouse.js
|
||||
*/
|
||||
!function(a){function f(a,b){if(!(a.originalEvent.touches.length>1)){a.preventDefault();var c=a.originalEvent.changedTouches[0],d=document.createEvent("MouseEvents");d.initMouseEvent(b,!0,!0,window,1,c.screenX,c.screenY,c.clientX,c.clientY,!1,!1,!1,!1,0,null),a.target.dispatchEvent(d)}}if(a.support.touch="ontouchend"in document,a.support.touch){var e,b=a.ui.mouse.prototype,c=b._mouseInit,d=b._mouseDestroy;b._touchStart=function(a){var b=this;!e&&b._mouseCapture(a.originalEvent.changedTouches[0])&&(e=!0,b._touchMoved=!1,f(a,"mouseover"),f(a,"mousemove"),f(a,"mousedown"))},b._touchMove=function(a){e&&(this._touchMoved=!0,f(a,"mousemove"))},b._touchEnd=function(a){e&&(f(a,"mouseup"),f(a,"mouseout"),this._touchMoved||f(a,"click"),e=!1)},b._mouseInit=function(){var b=this;b.element.bind({touchstart:a.proxy(b,"_touchStart"),touchmove:a.proxy(b,"_touchMove"),touchend:a.proxy(b,"_touchEnd")}),c.call(b)},b._mouseDestroy=function(){var b=this;b.element.unbind({touchstart:a.proxy(b,"_touchStart"),touchmove:a.proxy(b,"_touchMove"),touchend:a.proxy(b,"_touchEnd")}),d.call(b)}}}(jQuery);
|
265
js/modal.js
265
js/modal.js
|
@ -1,120 +1,149 @@
|
|||
(function(global, $){
|
||||
|
||||
var codiad = global.codiad;
|
||||
|
||||
//////////////////////////////////////////////////////////////////////
|
||||
// Modal
|
||||
//////////////////////////////////////////////////////////////////////
|
||||
|
||||
codiad.modal = {
|
||||
|
||||
load: function(width, url, data) {
|
||||
data = data || {};
|
||||
var bounds = this._getBounds(width);
|
||||
$('#modal')
|
||||
.css({
|
||||
'top': bounds.top,
|
||||
'left': bounds.left,
|
||||
'min-width': width + 'px',
|
||||
'margin-left': '-' + Math.ceil(width / 2) + 'px'
|
||||
})
|
||||
.draggable({
|
||||
handle: '#drag-handle'
|
||||
});
|
||||
$('#modal-content')
|
||||
.html('<div id="modal-loading"></div>');
|
||||
this.load_process = $.get(url, data, function(data) {
|
||||
$('#modal-content').html(data);
|
||||
// Fix for Firefox autofocus goofiness
|
||||
$('input[autofocus="autofocus"]')
|
||||
.focus();
|
||||
});
|
||||
var event = {animationPerformed: false};
|
||||
amplify.publish('modal.onLoad', event);
|
||||
// If no plugin has provided a custom load animation
|
||||
if(!event.animationPerformed) {
|
||||
$('#modal, #modal-overlay')
|
||||
.fadeIn(200);
|
||||
}
|
||||
codiad.sidebars.modalLock = true;
|
||||
},
|
||||
|
||||
hideOverlay: function() {
|
||||
$('#modal-overlay')
|
||||
.hide();
|
||||
},
|
||||
|
||||
unload: function() {
|
||||
this._setBounds();
|
||||
$('#modal-content form')
|
||||
.die('submit'); // Prevent form bubbling
|
||||
var event = { animationPerformed : false };
|
||||
amplify.publish('modal.onUnload', event);
|
||||
// If no plugin has provided a custom unload animation
|
||||
if(!event.animationPerformed) {
|
||||
$('#modal, #modal-overlay')
|
||||
.fadeOut(200);
|
||||
$('#modal-content')
|
||||
.html('');
|
||||
}
|
||||
codiad.sidebars.modalLock = false;
|
||||
if (!codiad.sidebars.leftLock) { // Slide sidebar back
|
||||
$('#sb-left')
|
||||
.animate({
|
||||
'left': '-290px'
|
||||
}, 300, 'easeOutQuart');
|
||||
$('#editor-region')
|
||||
.animate({
|
||||
'margin-left': '10px'
|
||||
}, 300, 'easeOutQuart');
|
||||
}
|
||||
codiad.editor.focus();
|
||||
},
|
||||
|
||||
_setBounds: function(bounds) {
|
||||
if (typeof(bounds) == 'undefined') {
|
||||
if ($('#modal').is(':visible')) {
|
||||
bounds = {};
|
||||
bounds.top = Math.floor($('#modal').offset().top);
|
||||
bounds.left = Math.floor($('#modal').offset().left);
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
//Save bounds
|
||||
localStorage.setItem("codiad.modal.top", bounds.top);
|
||||
localStorage.setItem("codiad.modal.left", bounds.left);
|
||||
},
|
||||
|
||||
_getBounds: function(width) {
|
||||
if (localStorage.getItem("codiad.modal.top") !== null && localStorage.getItem("codiad.modal.left") !== null && codiad.editor.settings.persistentModal) {
|
||||
var top = parseInt(localStorage.getItem('codiad.modal.top'), 10),
|
||||
left = parseInt(localStorage.getItem('codiad.modal.left'), 10);
|
||||
//Check if modal is out of window
|
||||
if ((top + 40) > $(window).height()) {
|
||||
top = "15%";
|
||||
} else {
|
||||
top += "px";
|
||||
}
|
||||
if ((left + width + 40) > $(window).width()) {
|
||||
left = "50%";
|
||||
} else {
|
||||
left += Math.ceil(width / 2);
|
||||
left += "px";
|
||||
}
|
||||
return {
|
||||
top: top,
|
||||
left: left
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
top: "15%",
|
||||
left: "50%"
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
})(this, jQuery);
|
||||
|
||||
var codiad = global.codiad;
|
||||
|
||||
//////////////////////////////////////////////////////////////////////
|
||||
// Modal
|
||||
//////////////////////////////////////////////////////////////////////
|
||||
|
||||
codiad.modal = {
|
||||
|
||||
hide_loading: function() {
|
||||
|
||||
let loading = document.getElementById( 'modal' ).getElementsByClassName( 'loading' )[0];
|
||||
loading.style.display = "none";
|
||||
},
|
||||
|
||||
hideOverlay: function() {
|
||||
|
||||
$('#modal-overlay')
|
||||
.hide();
|
||||
},
|
||||
|
||||
load: function( width, url, data ) {
|
||||
|
||||
data = data || {};
|
||||
var bounds = this._getBounds( width );
|
||||
$('#modal')
|
||||
.css({
|
||||
'top': bounds.top,
|
||||
'left': bounds.left,
|
||||
'min-width': width + 'px',
|
||||
'margin-left': '-' + Math.ceil( width / 2 ) + 'px'
|
||||
})
|
||||
.draggable({
|
||||
handle: '#drag-handle'
|
||||
});
|
||||
$('#modal-content')
|
||||
.html('<div id="modal-loading"></div>');
|
||||
this.load_process = $.get( url, data, function( data ) {
|
||||
$('#modal-content').html( data );
|
||||
// Fix for Firefox autofocus goofiness
|
||||
$('input[autofocus="autofocus"]')
|
||||
.focus();
|
||||
});
|
||||
var event = {animationPerformed: false};
|
||||
amplify.publish( 'modal.onLoad', event );
|
||||
// If no plugin has provided a custom load animation
|
||||
if( ! event.animationPerformed ) {
|
||||
|
||||
$('#modal, #modal-overlay')
|
||||
.fadeIn(200);
|
||||
}
|
||||
codiad.sidebars.modalLock = true;
|
||||
},
|
||||
|
||||
show_loading: function() {
|
||||
|
||||
let loading = document.getElementById( 'modal' ).getElementsByClassName( 'loading' )[0];
|
||||
loading.style.display = "inline-block";
|
||||
},
|
||||
|
||||
unload: function() {
|
||||
|
||||
this._setBounds();
|
||||
$('#modal-content form')
|
||||
.die('submit'); // Prevent form bubbling
|
||||
var event = { animationPerformed : false };
|
||||
amplify.publish( 'modal.onUnload', event );
|
||||
// If no plugin has provided a custom unload animation
|
||||
if( ! event.animationPerformed ) {
|
||||
|
||||
$('#modal, #modal-overlay')
|
||||
.fadeOut( 200 );
|
||||
$('#modal-content')
|
||||
.html( '' );
|
||||
}
|
||||
codiad.sidebars.modalLock = false;
|
||||
if ( ! codiad.sidebars.leftLock ) {
|
||||
|
||||
// Slide sidebar back
|
||||
$('#sb-left')
|
||||
.animate({
|
||||
|
||||
'left': '-290px'
|
||||
}, 300, 'easeOutQuart');
|
||||
$('#editor-region')
|
||||
.animate({
|
||||
|
||||
'margin-left': '10px'
|
||||
}, 300, 'easeOutQuart');
|
||||
}
|
||||
codiad.editor.focus();
|
||||
},
|
||||
|
||||
_setBounds: function( bounds ) {
|
||||
|
||||
if ( typeof( bounds ) == 'undefined' ) {
|
||||
|
||||
if ( $( '#modal' ).is( ':visible' ) ) {
|
||||
|
||||
bounds = {};
|
||||
bounds.top = Math.floor( $( '#modal' ).offset().top );
|
||||
bounds.left = Math.floor( $( '#modal' ).offset().left );
|
||||
} else {
|
||||
|
||||
return false;
|
||||
}
|
||||
}
|
||||
//Save bounds
|
||||
localStorage.setItem( "codiad.modal.top", bounds.top );
|
||||
localStorage.setItem( "codiad.modal.left", bounds.left );
|
||||
},
|
||||
|
||||
_getBounds: function( width ) {
|
||||
|
||||
if (localStorage.getItem( "codiad.modal.top" ) !== null && localStorage.getItem( "codiad.modal.left" ) !== null && codiad.editor.settings.persistentModal ) {
|
||||
var top = parseInt( localStorage.getItem( 'codiad.modal.top' ), 10 ),
|
||||
left = parseInt( localStorage.getItem( 'codiad.modal.left' ), 10 );
|
||||
//Check if modal is out of window
|
||||
if ( (top + 40) > $(window).height() ) {
|
||||
|
||||
top = "15%";
|
||||
} else {
|
||||
|
||||
top += "px";
|
||||
}
|
||||
if ( ( left + width + 40 ) > $(window).width() ) {
|
||||
|
||||
left = "50%";
|
||||
} else {
|
||||
|
||||
left += Math.ceil( width / 2 );
|
||||
left += "px";
|
||||
}
|
||||
return {
|
||||
|
||||
top: top,
|
||||
left: left
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
|
||||
top: "15%",
|
||||
left: "50%"
|
||||
};
|
||||
}
|
||||
}
|
||||
};
|
||||
})( this, jQuery );
|
||||
|
|
|
@ -15,15 +15,15 @@
|
|||
isLeftSidebarOpen: true,
|
||||
isRightSidebarOpen: false,
|
||||
|
||||
init: function() {
|
||||
init: async function() {
|
||||
|
||||
var _this = this;
|
||||
|
||||
amplify.subscribe('settings.loaded', async function( settings ) {
|
||||
var sbWidth = codiad.settings.get_option( 'codiad.sidebars.sb-left-width' );
|
||||
var lock_left = codiad.settings.get_option( 'codiad.sidebars.lock-left-sidebar' );
|
||||
var lock_right = codiad.settings.get_option( 'codiad.sidebars.lock-right-sidebar' );
|
||||
|
||||
var sbWidth = await codiad.settings.get_option( 'codiad.sidebars.sb-left-width' );
|
||||
var lock_left = await codiad.settings.get_option( 'codiad.sidebars.lock-left-sidebar' );
|
||||
var lock_right = await codiad.settings.get_option( 'codiad.sidebars.lock-right-sidebar' );
|
||||
console.log( "Sidebar width", sbWidth );
|
||||
if (sbWidth !== null) {
|
||||
$('#sb-left').width(sbWidth);
|
||||
$(window).resize();
|
||||
|
@ -111,20 +111,31 @@
|
|||
});
|
||||
|
||||
$("#sb-left .sidebar-handle")
|
||||
.draggable({
|
||||
axis: 'x',
|
||||
drag: function(event, ui) {
|
||||
newWidth = ui.position.left;
|
||||
$("#sb-left")
|
||||
.width(newWidth + 10);
|
||||
},
|
||||
stop: function() {
|
||||
$(window).resize();
|
||||
$('#editor-region')
|
||||
.trigger('h-resize-init');
|
||||
codiad.settings.update_option( 'codiad.sidebars.sb-left-width', $('#sb-left').width() );
|
||||
}
|
||||
});
|
||||
.draggable({
|
||||
axis: 'x',
|
||||
drag: function(event, ui) {
|
||||
newWidth = ui.position.left;
|
||||
$("#sb-left")
|
||||
.width(newWidth + 10);
|
||||
},
|
||||
stop: function() {
|
||||
$(window).resize();
|
||||
$('#editor-region')
|
||||
.trigger('h-resize-init');
|
||||
codiad.settings.update_option( 'codiad.sidebars.sb-left-width', $('#sb-left').width() );
|
||||
}
|
||||
});
|
||||
|
||||
$("#sb-left .sidebar-handle")
|
||||
.dblclick(function() {
|
||||
|
||||
let default_width = 300;
|
||||
$("#sb-left").width( default_width );
|
||||
$(window).resize();
|
||||
$('#editor-region').trigger('h-resize-init');
|
||||
$("#sb-left .sidebar-handle").css( "left", 288 );
|
||||
codiad.settings.update_option( 'codiad.sidebars.sb-left-width', default_width );
|
||||
});
|
||||
},
|
||||
|
||||
closeLeftSidebar: function() {
|
||||
|
|
|
@ -809,3 +809,12 @@ table [class^="icon-"], [class*=" icon-"] {
|
|||
#download {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.loading {
|
||||
|
||||
background: url(loading.gif) no-repeat center;
|
||||
display: none;
|
||||
height: 25px;
|
||||
vertical-align: middle;
|
||||
width: 25px;
|
||||
}
|
Loading…
Reference in a new issue