S4WA/! Manga-Viewer.html

## ! Manga-Viewer.html
<!DOCTYPE html>
<html>
<head>
  <meta charset='utf-8'>
  <meta name='viewport' content='width=device-width, initial-scale=1'>
  <title></title>
  <style type='text/css'>
    body {
      margin: 2.5em 0;
      background-size: 100%;
      background-color: #000;
      text-align: center;
    }

    img {
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      height: auto;
      width: 50%;

      /* vertical
      height: 100%;
      width: auto; */
    }
  </style>
</head>
<body>
  <img id='a' src='' draggable='false'>
  <script>
    let k = 1, l = location.href.split('/');
    const p = '',
          z = 5,
          e = '.avif',
          o = document.querySelector('img'),
          y = function (k) {
            t = '';
            if (k <= 0) {
              k = 1;
            }

            for (let i = 0; i < z-String(k).length; i++) {
              t += '0';
            }
            return p + t + k + e;
          };

    /*

     * k = current page number.

     * p = prefix if there is.
     * z = digits of the file name.
     *     (for example: if your files in your manga folder consists with 5 digits, like 00001.jpeg, it'll be z = 5.)
     * e = extension of the file.

     * o = the image dom.
     * y = a func to get a file.
     * l = current path of its folder

     */

    l = l[l.length-2];

    // initialization:
    if (localStorage[l] != null) k = Number(localStorage[l]);
    o.src = y(k);

    // key down:
    document.addEventListener('keydown', function (event) {
      let n = event.keyCode;

      if (n == 39 || n == 37) {
        k = k + (n - 38);
      } else {
        return;
      }
      o.src = y(k);
    });

    // mouse click detection:
    o.addEventListener('click', function(event) {
      let isLeft = event.offsetX <= o.offsetWidth/2;
      k = k + (isLeft ? -1 : 1);

      o.src = y(k);
    });

    // onload -> save the last page & move to the top of the page
    o.addEventListener('load', function(event) {
      location.href = '#';
      localStorage[l] = k;
    });
  </script>
</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset='utf-8'>
	<meta name='viewport' content='width=device-width, initial-scale=1'>
	<title></title>
	<style type='text/css'>
	body {
	margin: 2.5em 0;
	background-size: 100%;
	background-color: #000;
	text-align: center;
	}

	img {
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	height: auto;
	width: 50%;

	/* vertical
	height: 100%;
	width: auto; */
	}
	</style>
	</head>
	<body>
	<img id='a' src='' draggable='false'>
	<script>
	let k = 1, l = location.href.split('/');
	const p = '',
	z = 5,
	e = '.avif',
	o = document.querySelector('img'),
	y = function (k) {
	t = '';
	if (k <= 0) {
	k = 1;
	}

	for (let i = 0; i < z-String(k).length; i++) {
	t += '0';
	}
	return p + t + k + e;
	};

	/*

	* k = current page number.

	* p = prefix if there is.
	* z = digits of the file name.
	* (for example: if your files in your manga folder consists with 5 digits, like 00001.jpeg, it'll be z = 5.)
	* e = extension of the file.

	* o = the image dom.
	* y = a func to get a file.
	* l = current path of its folder

	*/

	l = l[l.length-2];

	// initialization:
	if (localStorage[l] != null) k = Number(localStorage[l]);
	o.src = y(k);

	// key down:
	document.addEventListener('keydown', function (event) {
	let n = event.keyCode;

	if (n == 39 \|\| n == 37) {
	k = k + (n - 38);
	} else {
	return;
	}
	o.src = y(k);
	});

	// mouse click detection:
	o.addEventListener('click', function(event) {
	let isLeft = event.offsetX <= o.offsetWidth/2;
	k = k + (isLeft ? -1 : 1);

	o.src = y(k);
	});

	// onload -> save the last page & move to the top of the page
	o.addEventListener('load', function(event) {
	location.href = '#';
	localStorage[l] = k;
	});
	</script>
	</body>
	</html>