diff --git a/masks/project.html b/masks/project.html
index 856a533..4e81d99 100644
--- a/masks/project.html
+++ b/masks/project.html
@@ -206,23 +206,41 @@ function initPage(asHash) {
//Add "Loading" Post
getPost({type: 'loading', headerless: true, formatted_time: '', relative_time: ''}).appendTo($('#loading'));
- //Mobile events
+ //Mobile Touchscreen Events
self.tmp('$Feed').onSwipe(
(oPos) => {
- self.tmp('$Feed').css('right', Math.min(oPos.xStart - oPos.xMove, 0)+'px');
+ this.$Panels = $('.leaflet-right').add(self.tmp('$Feed')).each(function() {
+ $(this).data('initial-offset', parseInt($(this).css('right')));
+ });
+ },
+ (oPos) => {
+ this.$Panels.each(function(){
+ $(this).css({'right': ($(this).data('initial-offset') + Math.min(oPos.xStart - oPos.xMove, 0))+'px', 'transition': 'none'});
+ });
},
(oPos) => {
if(oPos.xEnd - oPos.xStart > 100 && Math.abs(oPos.yEnd - oPos.yStart) < 100) toggleFeedPanel(false);
- self.tmp('$Feed').css('right', '');
+ this.$Panels.each(function(){
+ $(this).css({'right': '', 'transition': ''});
+ });
}
);
self.tmp('$Settings').onSwipe(
(oPos) => {
- self.tmp('$Settings').css('left', Math.min(oPos.xMove - oPos.xStart, 0)+'px');
+ this.$Panels = $('.leaflet-left').add(self.tmp('$Settings')).each(function() {
+ $(this).data('initial-offset', parseInt($(this).css('left')));
+ });
+ },
+ (oPos) => {
+ this.$Panels.each(function(){
+ $(this).css({'left': ($(this).data('initial-offset') + Math.min(oPos.xMove - oPos.xStart, 0))+'px', 'transition': 'none'});
+ });
},
(oPos) => {
if(oPos.xEnd - oPos.xStart < -100 && Math.abs(oPos.yEnd - oPos.yStart) < 100) toggleSettingsPanel(false);
- self.tmp('$Settings').css('left', '');
+ this.$Panels.each(function(){
+ $(this).css({'left': '', 'transition': ''});
+ });
}
);
diff --git a/script/spot.js b/script/spot.js
index 6e3fc6b..a9656b9 100755
--- a/script/spot.js
+++ b/script/spot.js
@@ -381,7 +381,7 @@ $.prototype.hoverSwap = function(sDefault, sHover)
.text(sDefault);
};
-$.prototype.onSwipe = function(fOnMove, fOnEnd){
+$.prototype.onSwipe = function(fOnStart, fOnMove, fOnEnd){
return $(this)
.on('dragstart', (e) => {
e.preventDefault();
@@ -394,6 +394,10 @@ $.prototype.onSwipe = function(fOnMove, fOnEnd){
$This.data('x-move', oPos.x);
$This.data('y-move', oPos.y);
$This.data('moving', true).addClass('moving');
+ fOnStart({
+ xStart: $This.data('x-start'),
+ yStart: $This.data('y-start')
+ });
})
.on('touchmove mousemove', (e) => {
var $This = $(this);