prehistoric-systems/mytinytodo
1
0
Fork 0
mirror of https://github.com/maxpozdeev/mytinytodo.git synced 2026-03-11 08:55:27 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

more fixes to RTL; add support in mttMenu

Browse source
This commit is contained in:
Max Pozdeev 2020-09-20 22:43:37 +03:00
parent 5143692b43
commit 951ebf4d07
5 changed files with 83 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/content/themes/default/index.php
View file

@ -16,7 +16,7 @@
<?php endif; ?>
</head>
<body>
<body <?php if (Lang::instance()->rtl()) echo 'dir="rtl"'; ?>>
<script type="text/javascript" src="<?php mttinfo('includes_url'); ?>jquery/jquery-3.5.1.min.js"></script>
<script type="text/javascript" src="<?php mttinfo('includes_url'); ?>jquery/jquery-ui-1.12.1.min.js"></script>

5
src/content/themes/default/mobile.css
View file

@ -31,6 +31,7 @@ h2 { margin:0; margin-bottom:2px; font-size:1rem; }
.task-date { display:none; }
.task-note-actions { display:block; padding-top:8px; }
.task-note-block { margin-left:0px; border-left:1px solid #777777; background:none; padding-left:4px; display:none; }
body[dir="rtl"] .task-note-block { border-left:none; border-right:1px solid #777777; padding-left:0; padding-right:4px; }
.task-note-area textarea { width:95%; }
#tasklist li .task-through { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
@ -53,7 +54,7 @@ h2 { margin:0; margin-bottom:2px; font-size:1rem; }
#loading { padding:0px; padding-top:1px; padding-right:1px; height:16px; overflow:hidden; }
#loading img { /*width:8px; height:8px;*/ }
#tagcloud { max-width:100%; }
#tagcloud { max-width:100%; margin:0px 5px 5px 5px; }
.mtt-settings-table .in350 { min-width:50px; }
.mtt-notes-showhide { display:none; }
@ -62,3 +63,5 @@ h2 { margin:0; margin-bottom:2px; font-size:1rem; }
.mtt-menu-container li { padding-top:0.3rem; padding-bottom:0.3rem; }
#slmenucontainer { max-width:100vw; }
#slmenucontainer a { overflow:hidden; text-overflow:ellipsis; }
#cmenulistscontainer { max-width:100vw; }
#cmenulistscontainer li { overflow:hidden; text-overflow:ellipsis; }

13
src/content/themes/default/style.css
View file

@ -280,9 +280,12 @@ a.mtt-back-button { font-size:0.8rem; }
#tagcloudload { display:none; height:24px; background:url(images/loading48.gif) center no-repeat; background-size:24px 24px; }
#tagcloud {
overflow: hidden; z-index:100; background-color:#fff; border:1px solid #cccccc; padding:5px;
width:100%; max-width:450px; margin:0px 7px 7px 7px; text-align:center;
width:100%; max-width:450px; text-align:center;
box-shadow:1px 2px 5px rgba(0,0,0,0.5);
}
}
#tagcloud.mtt-left-adjusted { margin-left:5px; }
#tagcloud.mtt-right-adjusted { margin-right:5px; }
#tagcloud.mtt-left-adjusted.mtt-right-adjusted { margin-bottom:5px; }
#tagcloud .tag { margin:1px 0px; padding:2px; line-height:140%; color:black; }
#tagcloud .tag:hover { background-color:#999988; color:white; }
#tagcloud .w0 { font-size:80%; }
@ -331,9 +334,11 @@ a.mtt-back-button { font-size:0.8rem; }
background-color:#f9f9f9; border:1px solid #cccccc; padding:2px 0px;
box-shadow:1px 2px 5px rgba(0,0,0,0.5);
border-radius:5px;
margin:0px 7px 7px 0px; /* for shadows */
user-select:none;
}
}
.mtt-menu-container.mtt-left-adjusted { margin-left:5px; }
.mtt-menu-container.mtt-right-adjusted { margin-right:5px; }
.mtt-menu-container.mtt-right-adjusted.mtt-left-adjusted { margin-bottom:5px; }
.mtt-menu-container ul { list-style: none; padding:0; margin:0; }
.mtt-menu-container li { margin:1px 0px; cursor:default; color:#000; white-space:nowrap; padding-top:0.20rem; padding-bottom:0.20rem; padding-left:28px; padding-right:28px; position:relative; }
.mtt-menu-container li:hover, .mtt-menu-container li.mtt-menu-item-active {

2
src/content/themes/default/style_rtl.css
View file

@ -25,11 +25,13 @@ h2 { padding-left:10px; padding-right:0px; }
.duedate:before { content:'\20\2190\20'; }
.task-date-completed { margin-left:0; margin-right:5px; }
#tagcloud { box-shadow:-1px 2px 5px rgba(0,0,0,0.5); }
#tagcloudcancel { float:left; }
#taskedit-date { float:left; }
#page_taskedit .form-row-short { float:right; margin-left:12px; margin-right:0; }
.alltags-cell { padding-left:0; padding-right:5px; }
.mtt-menu-container { box-shadow:-1px 2px 5px rgba(0,0,0,0.5); }
.mtt-menu-container .menu-icon { left:auto; right:6px; }
li.mtt-menu-indicator .submenu-icon { left:6px; right:auto; transform:rotate(180deg); }

79
src/includes/mytinytodo.js
View file

@ -143,7 +143,7 @@ var mytinytodo = window.mytinytodo = _mtt = {
_mtt.applySingletab(!_mtt.options.singletab);
return false;
}
if(!_mtt.menus.selectlist) _mtt.menus.selectlist = new mttMenu('slmenucontainer', {onclick:slmenuSelect});
if(!_mtt.menus.selectlist) _mtt.menus.selectlist = new mttMenu('slmenucontainer', {onclick:slmenuSelect, adjustWidth:true, alignRight:true});
_mtt.menus.selectlist.show(this);
});
@ -234,7 +234,7 @@ var mytinytodo = window.mytinytodo = _mtt = {
$('#tagcloudload').show();
loadTags(curList.id, function(){$('#tagcloudload').hide();});
}
}, adjustWidth:true
}, adjustWidth:true, alignRight:true
});
_mtt.menus.tagcloud.show(this);
});
@ -1704,6 +1704,16 @@ function mttMenu(container, options)
this.showTimer = null;
this.ts = (new Date).getTime();
this.container.mttmenu = this.ts;
if (!this.options.hasOwnProperty('isRTL')) {
this.options.isRTL = ($('body').css('direction') == 'rtl') ? true : false;
}
if (!this.options.hasOwnProperty('alignRight')) {
this.options.alignRight = false;
}
if (!this.options.hasOwnProperty('adjustWidth')) {
this.options.adjustWidth = true;
}
this.$container.find('li').click(function(){
var r = menu.onclick(this, menu);
@ -1810,17 +1820,33 @@ function mttMenu(container, options)
this.options.beforeShow();
// adjust width
if(this.options.adjustWidth && this.$container.outerWidth(true) > $(window).width())
this.$container.width($(window).width() - (this.$container.outerWidth(true) - this.$container.width()));
this.$container.removeClass('mtt-left-adjusted mtt-right-adjusted');
if ( this.options.adjustWidth && this.$container.outerWidth(true) > $(window).width() ) {
this.$container.addClass('mtt-left-adjusted mtt-right-adjusted');
this.$container.width( $(window).width() - (this.$container.outerWidth(true) - this.$container.width()) );
}
$caller.addClass('mtt-menu-button-active');
var offset = $caller.offset();
var x2 = $(window).width() + $(document).scrollLeft() - this.$container.outerWidth(true) - 1;
var x = offset.left < x2 ? offset.left : x2;
if(x<0) x=0;
var y = offset.top+caller.offsetHeight-1;
var containerWidth = this.$container.outerWidth(true);
var alignRight = this.options.isRTL ^ this.options.alignRight; //alignRight is not for submenu
var x2 = $(window).width() + $(document).scrollLeft() - containerWidth - 1; // TODO: rtl?
var x = alignRight ? offset.left + $caller.outerWidth() - containerWidth : offset.left;
if (x > x2) {
x = x2; //move left if container overflows right edge
this.$container.addClass('mtt-right-adjusted');
}
if (x < 0) {
x = 0; //do not cross left edge
this.$container.addClass('mtt-left-adjusted');
}
var y = offset.top + caller.offsetHeight - 1;
if(y + this.$container.outerHeight(true) > $(window).height() + $(document).scrollTop()) y = offset.top - this.$container.outerHeight();
if(y<0) y=0;
this.$container.css({ position: 'absolute', top: y, left: x, width:this.$container.width() /*, 'min-width': $caller.width()*/ }).show();
var menu = this;
$(document).bind('mousedown.mttmenuclose', function(e){ menu.close(e) });
@ -1829,14 +1855,42 @@ function mttMenu(container, options)
this.showSub = function()
{
// adjust width
this.$container.removeClass('mtt-left-adjusted mtt-right-adjusted');
if ( this.options.adjustWidth && this.$container.outerWidth(true) > $(window).width() ) {
this.$container.addClass('mtt-left-adjusted mtt-right-adjusted');
this.$container.width( $(window).width() - (this.$container.outerWidth(true) - this.$container.width()) );
}
this.$caller.addClass('mtt-menu-item-active');
var offset = this.$caller.offset();
var x = offset.left+this.$caller.outerWidth();
if(x + this.$container.outerWidth(true) > $(window).width() + $(document).scrollLeft()) x = offset.left - this.$container.outerWidth() - 1;
if(x<0) x=0;
var containerWidth = this.$container.outerWidth(true);
var x = 0;
if (this.options.isRTL) {
x = offset.left - containerWidth - 1;
if (x < 0) {
x = offset.left + this.$caller.outerWidth();
}
if ( x + containerWidth > $(window).width() + $(document).scrollLeft() ) {
x = $(window).width() + $(document).scrollLeft() - containerWidth; // TODO: rtl?
this.$container.addClass('mtt-right-adjusted');
}
}
else {
x = offset.left + this.$caller.outerWidth();
if ( x + containerWidth > $(window).width() + $(document).scrollLeft() ) { // TODO: rtl?
x = offset.left - containerWidth - 1;
}
if (x < 0) {
x = 0;
this.$container.addClass('mtt-left-adjusted');
}
}
var y = offset.top + this.parent.$container.offset().top-this.parent.$container.find('li:first').offset().top;
if(y + this.$container.outerHeight(true) > $(window).height() + $(document).scrollTop()) y = $(window).height() + $(document).scrollTop()- this.$container.outerHeight(true) - 1;
if(y<0) y=0;
this.$container.css({ position: 'absolute', top: y, left: x, width:this.$container.width() /*, 'min-width': this.$caller.outerWidth()*/ }).show();
this.menuOpen = true;
};
@ -1859,7 +1913,8 @@ function taskContextMenu(el, id)
beforeShow: function() {
$('#cmenupriocontainer li').removeClass('mtt-item-checked');
$('#cmenu_prio\\:'+ taskList[_mtt.menus.cmenu.tag].prio).addClass('mtt-item-checked');
}
},
alignRight: true
});
_mtt.menus.cmenu.tag = id;
_mtt.menus.cmenu.show(el);