diff options
author | nachoparker <nacho@ownyourbits.com> | 2018-04-05 03:08:39 +0300 |
---|---|---|
committer | nachoparker <nacho@ownyourbits.com> | 2018-04-05 03:11:30 +0300 |
commit | eece4d08c921f074c97102af6f8e0907e1f866c0 (patch) | |
tree | 86c61571c5f862edc9ab49906cffc1006625a8c5 /ncp-web | |
parent | 60314405d854fb7e9ab09b0ea4d25045e1d8dea8 (diff) |
ncp-web: collapse sidebar menu when clicking in new sectionsv0.53.22
Diffstat (limited to 'ncp-web')
-rw-r--r-- | ncp-web/index.php | 2 | ||||
-rw-r--r-- | ncp-web/ncp.css | 6 | ||||
-rw-r--r-- | ncp-web/ncp.js | 81 | ||||
-rw-r--r-- | ncp-web/wizard/CSS/wizard.css | 1 |
4 files changed, 52 insertions, 38 deletions
diff --git a/ncp-web/index.php b/ncp-web/index.php index 575c5a3c..814420c6 100644 --- a/ncp-web/index.php +++ b/ncp-web/index.php @@ -84,7 +84,7 @@ echo <<<HTML <div id="first-run-wizard"> <div class='dialog'> - <br> + <br><br> <h2 id="config-box-title">NextCloudPi First Run</h2> <p>Click to start the configuration wizard</p> <br> diff --git a/ncp-web/ncp.css b/ncp-web/ncp.css index 2db2bb97..de91fc9c 100644 --- a/ncp-web/ncp.css +++ b/ncp-web/ncp.css @@ -1193,11 +1193,17 @@ a#versionlink:hover { cursor:pointer; } +#first-run-wizard img { + width: 70%; + max-width: 210px; +} + .dialog { display:block; background: white; position:relative; width:50%; + max-width: 400px; top:25%; margin:0px auto; } diff --git a/ncp-web/ncp.js b/ncp-web/ncp.js index 2d82c91f..cac619b4 100644 --- a/ncp-web/ncp.js +++ b/ncp-web/ncp.js @@ -10,7 +10,7 @@ var MINI = require('minified'); var $ = MINI.$, $$ = MINI.$$, EE = MINI.EE; var selectedID = null; -var confLock = false; +var lock = false; function errorMsg() { @@ -27,8 +27,12 @@ function switch_to_section( name ) selectedID = null; } +// slide menu +var slide_menu_enabled = false; + function open_menu() { + if ( !slide_menu_enabled ) return; if ( $('#app-navigation').get('$width') != '250px' ) { $('#overlay').show(); @@ -39,6 +43,7 @@ function open_menu() function close_menu() { + if ( !slide_menu_enabled ) return; if ( $('#app-navigation').get('$width') == '250px' ) { $('#app-navigation').animate( {$width: '0px'}, 150 ); @@ -47,6 +52,32 @@ function close_menu() } } +function hide_overlay(e) { $('#overlay').hide() } + +function close_menu_on_click_out(e) { close_menu(); } + +function enable_slide_menu() +{ + if ( slide_menu_enabled ) return; + $( '#app-navigation' ).set( { $width: '0px' } ); + $( '#app-navigation' ).set( { $position: 'absolute' } ); + $( '#app-navigation-toggle' ).on('click', open_menu ); + $( '#app-content' ).on('|click', close_menu_on_click_out ); + slide_menu_enabled = true; +} + +function disable_slide_menu() +{ + if ( !slide_menu_enabled ) return; + $.off( open_menu ); + $.off( close_menu ); + $.off( close_menu_on_click_out ); + $( '#app-navigation' ).set( { $width: '250px' } ); + $( '#app-navigation' ).set( { $position: 'unset' } ); + $('#overlay').hide(); + slide_menu_enabled = false; +} + function set_sidebar_click_handlers() { // Show selected option configuration box @@ -55,8 +86,8 @@ function set_sidebar_click_handlers() if ( selectedID == this.get( '.id' ) ) // already selected return; - if ( confLock ) return; - confLock = true; + if ( lock ) return; + lock = true; if ( window.innerWidth <= 768 ) close_menu(); @@ -69,7 +100,7 @@ function set_sidebar_click_handlers() function success( result ) { cfgreqReceive( result, that ); - confLock = false; + lock = false; }).error( errorMsg ); }); } @@ -138,7 +169,7 @@ $(function() // Launch selected script $( '#config-button' ).on('click', function(e) { - confLock = true; + lock = true; $('#details-box').hide( '' ); $('#config-button').set('@disabled',true); $('#loading-gif').set( { $display: 'inline' } ); @@ -201,15 +232,15 @@ $(function() $( 'input' , '#config-box-wrapper' ).set('@disabled', null); $('#config-button').set('@disabled',null); $('#loading-gif').hide(); - confLock = false; + lock = false; }).error( errorMsg ); }); // Update notification $( '#notification' ).on('click', function(e) { - if ( confLock ) return; - confLock = true; + if ( lock ) return; + lock = true; $( '#' + selectedID ).set('-active'); @@ -220,7 +251,7 @@ $(function() function success( result ) { cfgreqReceive( result, $( '#nc-update' ) ); - confLock = false; + lock = false; } ).error( errorMsg ); @@ -229,34 +260,6 @@ $(function() } ); // slide menu - var slide_menu_enabled = false; - - function hide_overlay(e) { $('#overlay').hide() } - - function close_menu_on_click_out(e) { close_menu(); } - - function enable_slide_menu() - { - if ( slide_menu_enabled ) return; - $( '#app-navigation' ).set( { $width: '0px' } ); - $( '#app-navigation' ).set( { $position: 'absolute' } ); - $( '#app-navigation-toggle' ).on('click', open_menu ); - $( '#app-content' ).on('|click', close_menu_on_click_out ); - slide_menu_enabled = true; - } - - function disable_slide_menu() - { - if ( !slide_menu_enabled ) return; - $.off( open_menu ); - $.off( close_menu ); - $.off( close_menu_on_click_out ); - $( '#app-navigation' ).set( { $width: '250px' } ); - $( '#app-navigation' ).set( { $position: 'unset' } ); - $('#overlay').hide(); - slide_menu_enabled = false; - } - if ( window.innerWidth <= 768 ) enable_slide_menu(); @@ -350,12 +353,16 @@ $(function() // dashboard button $( '#dashboard-btn' ).on('click', function(e) { + if ( lock ) return; + close_menu(); switch_to_section( 'dashboard' ); } ); // config button $( '#config-btn' ).on('click', function(e) { + if ( lock ) return; + close_menu(); switch_to_section( 'nc-config' ); } ); } ); diff --git a/ncp-web/wizard/CSS/wizard.css b/ncp-web/wizard/CSS/wizard.css index dbef15a7..9e1a36b1 100644 --- a/ncp-web/wizard/CSS/wizard.css +++ b/ncp-web/wizard/CSS/wizard.css @@ -23,6 +23,7 @@ a:hover, a:active, a:link { .ncp-tab-pane { display: table; margin: 0 auto; + text-align: center; } .ncp-tab-pane p { text-align: center; |