mirror of
				https://github.com/RicterZ/nhentai.git
				synced 2025-10-31 09:39:34 +01:00 
			
		
		
		
	add minimal viewer, fix not using config's template on --html only option
This commit is contained in:
		| @@ -2,3 +2,4 @@ include README.md | |||||||
| include requirements.txt | include requirements.txt | ||||||
| include nhentai/viewer/* | include nhentai/viewer/* | ||||||
| include nhentai/viewer/default/* | include nhentai/viewer/default/* | ||||||
|  | include nhentai/viewer/minimal/* | ||||||
| @@ -131,7 +131,7 @@ def cmd_parser(): | |||||||
|     args, _ = parser.parse_args(sys.argv[1:]) |     args, _ = parser.parse_args(sys.argv[1:]) | ||||||
|  |  | ||||||
|     if args.html_viewer: |     if args.html_viewer: | ||||||
|         generate_html() |         generate_html(template=constant.CONFIG['template']) | ||||||
|         exit(0) |         exit(0) | ||||||
|  |  | ||||||
|     if args.main_viewer and not args.id and not args.keyword and not args.favorites: |     if args.main_viewer and not args.id and not args.keyword and not args.favorites: | ||||||
|   | |||||||
							
								
								
									
										25
									
								
								nhentai/viewer/minimal/index.html
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										25
									
								
								nhentai/viewer/minimal/index.html
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,25 @@ | |||||||
|  | <!DOCTYPE html> | ||||||
|  | <html> | ||||||
|  | <head> | ||||||
|  |     <meta charset="UTF-8"> | ||||||
|  |     <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes, viewport-fit=cover" /> | ||||||
|  |     <title>{TITLE}</title> | ||||||
|  |     <style> | ||||||
|  | {STYLES} | ||||||
|  |     </style> | ||||||
|  | </head> | ||||||
|  | <body> | ||||||
|  |  | ||||||
|  | <nav id="list" hidden=true> | ||||||
|  | {IMAGES}</nav> | ||||||
|  |  | ||||||
|  | <div id="image-container"> | ||||||
|  |     <div id="dest"></div> | ||||||
|  |     <span id="page-num"></span> | ||||||
|  | </div> | ||||||
|  |  | ||||||
|  | <script> | ||||||
|  | {SCRIPTS} | ||||||
|  | </script> | ||||||
|  | </body> | ||||||
|  | </html> | ||||||
							
								
								
									
										79
									
								
								nhentai/viewer/minimal/scripts.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										79
									
								
								nhentai/viewer/minimal/scripts.js
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,79 @@ | |||||||
|  | const pages = Array.from(document.querySelectorAll('img.image-item')); | ||||||
|  | let currentPage = 0; | ||||||
|  |  | ||||||
|  | function changePage(pageNum) { | ||||||
|  |     const previous = pages[currentPage]; | ||||||
|  |     const current = pages[pageNum]; | ||||||
|  |  | ||||||
|  |     if (current == null) { | ||||||
|  |         return; | ||||||
|  |     } | ||||||
|  |      | ||||||
|  |     previous.classList.remove('current'); | ||||||
|  |     current.classList.add('current'); | ||||||
|  |  | ||||||
|  |     currentPage = pageNum; | ||||||
|  |  | ||||||
|  |     const display = document.getElementById('dest'); | ||||||
|  |     display.style.backgroundImage = `url("${current.src}")`; | ||||||
|  |  | ||||||
|  |     scroll(0,0) | ||||||
|  |  | ||||||
|  |     document.getElementById('page-num') | ||||||
|  |         .innerText = [ | ||||||
|  |                 (pageNum + 1).toLocaleString(), | ||||||
|  |                 pages.length.toLocaleString() | ||||||
|  |             ].join('\u200a/\u200a'); | ||||||
|  | } | ||||||
|  |  | ||||||
|  | changePage(0); | ||||||
|  |  | ||||||
|  | document.getElementById('image-container').onclick = event => { | ||||||
|  |     const width = document.getElementById('image-container').clientWidth; | ||||||
|  |     const clickPos = event.clientX / width; | ||||||
|  |  | ||||||
|  |     if (clickPos < 0.5) { | ||||||
|  |         changePage(currentPage - 1); | ||||||
|  |     } else { | ||||||
|  |         changePage(currentPage + 1); | ||||||
|  |     } | ||||||
|  | }; | ||||||
|  |  | ||||||
|  | document.onkeypress = event => { | ||||||
|  |     switch (event.key.toLowerCase()) { | ||||||
|  |         // Previous Image | ||||||
|  |         case 'w': | ||||||
|  | 	   scrollBy(0, -40); | ||||||
|  | 	   break; | ||||||
|  |         case 'a': | ||||||
|  |             changePage(currentPage - 1); | ||||||
|  |             break; | ||||||
|  |         // Return to previous page | ||||||
|  |         case 'q': | ||||||
|  |             window.history.go(-1); | ||||||
|  |             break; | ||||||
|  |         // Next Image | ||||||
|  |         case ' ': | ||||||
|  |         case 's': | ||||||
|  | 	    scrollBy(0, 40); | ||||||
|  |             break; | ||||||
|  |         case 'd': | ||||||
|  |             changePage(currentPage + 1); | ||||||
|  |             break; | ||||||
|  |     }// remove arrow cause it won't work | ||||||
|  | }; | ||||||
|  |  | ||||||
|  | document.onkeydown = event =>{ | ||||||
|  |     switch (event.keyCode) { | ||||||
|  |         case 37: //left | ||||||
|  |             changePage(currentPage - 1); | ||||||
|  |             break; | ||||||
|  |         case 38: //up | ||||||
|  |             break; | ||||||
|  |         case 39: //right | ||||||
|  |             changePage(currentPage + 1); | ||||||
|  |             break; | ||||||
|  |         case 40: //down | ||||||
|  |             break; | ||||||
|  |     } | ||||||
|  | }; | ||||||
							
								
								
									
										75
									
								
								nhentai/viewer/minimal/styles.css
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										75
									
								
								nhentai/viewer/minimal/styles.css
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,75 @@ | |||||||
|  |    | ||||||
|  | *, *::after, *::before { | ||||||
|  |     box-sizing: border-box; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | img { | ||||||
|  |     vertical-align: middle; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | html, body { | ||||||
|  |     display: flex; | ||||||
|  |     background-color: #e8e6e6; | ||||||
|  |     height: 100%; | ||||||
|  |     width: 100%; | ||||||
|  |     padding: 0; | ||||||
|  |     margin: 0; | ||||||
|  |     font-family: sans-serif; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | #list { | ||||||
|  |     height: 2000px; | ||||||
|  |     overflow: scroll; | ||||||
|  |     width: 260px; | ||||||
|  |     text-align: center; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | #list img { | ||||||
|  |     width: 200px; | ||||||
|  |     padding: 10px; | ||||||
|  |     border-radius: 10px; | ||||||
|  |     margin: 15px 0; | ||||||
|  |     cursor: pointer; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | #list img.current { | ||||||
|  |     background: #0003; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | #image-container { | ||||||
|  |     flex: auto; | ||||||
|  |     height: 100%; | ||||||
|  |     background: rgb(0, 0, 0); | ||||||
|  |     color: rgb(100, 100, 100); | ||||||
|  |     text-align: center; | ||||||
|  |     cursor: pointer; | ||||||
|  |     -webkit-user-select: none; | ||||||
|  |     user-select: none; | ||||||
|  |     position: relative; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | #image-container #dest { | ||||||
|  |     height: 2000px; | ||||||
|  |     width: 100%; | ||||||
|  |     background-size: contain; | ||||||
|  |     background-repeat: no-repeat; | ||||||
|  |     background-position: top; | ||||||
|  |     margin-left: auto; | ||||||
|  |     margin-right: auto; | ||||||
|  |     max-width: 100%; | ||||||
|  |     max-height: 100vh; | ||||||
|  |     margin: auto; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | #image-container #page-num { | ||||||
|  |     position: static; | ||||||
|  |     font-size: 9pt; | ||||||
|  |     left: 10px; | ||||||
|  |     bottom: 5px; | ||||||
|  |     font-weight: bold; | ||||||
|  |     opacity: 0.9; | ||||||
|  |     text-shadow: /* Duplicate the same shadow to make it very strong */ | ||||||
|  |         0 0 2px #222, | ||||||
|  |         0 0 2px #222, | ||||||
|  |         0 0 2px #222; | ||||||
|  | } | ||||||
		Reference in New Issue
	
	Block a user