mirror of
				https://github.com/RicterZ/nhentai.git
				synced 2025-11-04 02:50:55 +01:00 
			
		
		
		
	Merge pull request #226 from nanaih/minimal_viewer
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