flynx/ImageGrid
1
1
Fork 0
mirror of https://github.com/flynx/ImageGrid.git synced 2025-10-28 18:00:09 +00:00
Code Issues Packages Projects Releases Wiki Activity

added side touch controls...

Browse Source 
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2016-11-15 23:05:46 +03:00
parent 7fe16dd1a9
commit 59f47b095e
3 changed files with 75 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
ui (gen4)/css/layout.less
View File

@ -379,8 +379,47 @@ button:hover {
}
/* side buttons... */
.side-buttons-left,
.side-buttons-right {
width: 80px;
height: 100%;
background: rgba(0, 0, 0, 0.3);
z-index: 900;
}
.side-buttons-left {
left: 0px;
}
.side-buttons-right {
right: 0px;
}
.side-buttons-left .button,
.side-buttons-right .button {
display: flex;
justify-content:center;
align-content:center;
flex-direction:column;
width: 80px;
height: 33.3%;
}
.side-buttons-left .button:nth-child(1),
.side-buttons-left .button:nth-child(2),
.side-buttons-right .button:nth-child(1),
.side-buttons-right .button:nth-child(2) {
height: 16.65%;
}
.side-buttons-left .button,
.side-buttons-right .button {
border-bottom: solid 1px rgba(255, 255, 255, 0.3);
}
.side-buttons-left .button:last-child,
.side-buttons-right .button:last-child {
border-bottom: none;
}
/********************************************************** Viewer ***/
@ -1389,6 +1428,8 @@ stretching in width... */
overflow: hidden;
cursor: pointer;
z-index: 9999;
}
.up-indicator:after,
.down-indicator:after {

2
ui (gen4)/features/app.js
View File

@ -260,7 +260,7 @@ var AppControllsActions = actions.Actions({
},
},
toggleAppButtons: ['Interface/',
toggleAppButtons: ['Interface/Toggle App control buttons',
widgets.makeButtonControlsToggler('app-buttons')],
})

40
ui (gen4)/features/ui-widgets.js
View File

@ -1100,7 +1100,7 @@ module.ContextActionMenu = core.ImageGridFeatures.Feature({
//---------------------------------------------------------------------
var ControlsActions = actions.Actions({
var ButtonsActions = actions.Actions({
config: {
'main-buttons-state': 'on',
'main-buttons': {
@ -1114,6 +1114,7 @@ var ControlsActions = actions.Actions({
'M': ['marks',
'browseActions: "Mark/" -- Mark menu...'],
//*/
//'<i>ImageGrid.Viewer</i>': ['title', ''],
},
// XXX not sure about these yet...
@ -1121,23 +1122,48 @@ var ControlsActions = actions.Actions({
'secondary-buttons': {
/*
'Z<sub/>': ['zoom',
'browseActions: "Zoom/" -- Zoom out'],
'browseActions: "Zoom/" -- Zoom menu...'],
*/
'+': ['zoom-in',
'zoomIn -- Zoom in'],
'-': ['zoom-out',
'zoomOut -- Zoom out'],
},
'side-buttons-left-state': 'off',
'side-buttons-left': {
'-': ['zoom-out', 'zoomOut -- Zoom out'],
'^': ['up', 'shiftImageUp -- Shift image up'],
'<': ['left', 'prevImage -- Focus previous image'],
'v': ['down', 'shiftImageDown -- Shift image down'],
},
'side-buttons-right-state': 'off',
'side-buttons-right': {
'+': ['zoom-in', 'zoomIn -- Zoom in'],
'^': ['up', 'shiftImageUp -- Shift image up'],
'>': ['right', 'nextImage -- Focus next image'],
'v': ['down', 'shiftImageDown -- Shift image down'],
},
},
toggleMainButtons: ['Interface/',
toggleMainButtons: ['Interface/Toggle main buttons',
makeButtonControlsToggler('main-buttons')],
toggleSecondaryButtons: ['Interface/',
toggleSecondaryButtons: ['Interface/Toggle secondary buttons',
makeButtonControlsToggler('secondary-buttons')],
// XXX make this a toggler...
toggleSideButtons: ['Interface/', (function(){
var left = makeButtonControlsToggler('side-buttons-left')
var right = makeButtonControlsToggler('side-buttons-right')
return function(){
left.apply(this, arguments)
return right.apply(this, arguments)
}
})()],
})
var Controls =
module.Controls = core.ImageGridFeatures.Feature({
var Buttons =
module.Buttons = core.ImageGridFeatures.Feature({
title: '',
doc: '',
@ -1150,7 +1176,7 @@ module.Controls = core.ImageGridFeatures.Feature({
'ui-status-bar',
],
actions: ControlsActions,
actions: ButtonsActions,
handlers: [
['start',