autoroute.js - npm Package Compare versions

Comparing version 1.0.22 to 1.0.23

autoroute.js

@@ -16,3 +16,3 @@ import Touch from 'hammerjs'
   e.className = 'route hide'
-  e.anim = false
+  e.slide = false
   e.q = {}
@@ -29,3 +29,3 @@
     e.render()
-    e.anim ? e.style.zIndex = '2' : e.style.zIndex = '1'
+    e.slide ? e.style.zIndex = '2' : e.style.zIndex = '1'
   }
@@ -52,2 +52,9 @@
 
+function start (path) {
+  window.location.hash = '/'
+  if (!path) path = ''
+  setTimeout(() => hash('/' + path), 0)
+  stylify()
+}
+
 function linkify () {
@@ -80,8 +87,2 @@
 
-function start (path) {
-  window.location.hash = '/'
-  if (!path) path = ''
-  setTimeout(() => hash('/' + path), 0)
-}
-
 function submit (fn) {
@@ -109,3 +110,2 @@ this.addEventListener('submit', ev => {
 
-
 function set (obj) {
@@ -143,3 +143,3 @@
 
-      if (route.routes[newH[0]].anim) {
+      if (route.routes[newH[0]].slide) {
 
@@ -152,3 +152,3 @@ route.routes[newH[0]].classList.remove('hide')
 
-      } else if (route.routes[oldH[0]] && route.routes[oldH[0]].anim) {
+      } else if (route.routes[oldH[0]] && route.routes[oldH[0]].slide) {
 
@@ -170,127 +170,92 @@ route.routes[newH[0]].classList.remove('hide')
 
-export default route
+function stylify () {
 
-var r = window.innerHeight - 20
-el('header', e => r -= e.offsetHeight)
-el('footer', e => r -= e.offsetHeight)
+  let r = document.getElementById('router').style.height
+  var css = document.createElement('autorouthings')
+  css.innerHTML =
+  `
+  <style>
+  * {
+    padding: 0;
+    margin: 0;
+    -webkit-tap-highlight-color: rgba(255, 255, 255, 0) !important;
+    -webkit-focus-ring-color: rgba(255, 255, 255, 0) !important;
+    outline: none !important;
+    font-family: sans-serif;
+    font-weight: 300
+  }
 
-var css = document.createElement('autorouthings')
-css.innerHTML =
-`
-<svg back xmlns="http://www.w3.org/2000/svg" width="13" height="22" class="hide">
-  <path fill="#fff" fill-rule="evenodd" d="M.5 11L11 .5l2 2L4.5 11l8.5 8.5-2 2L.5 11z"/>
-</svg>
-<style>
-* {
-  padding: 0;
-  margin: 0;
-  -webkit-tap-highlight-color: rgba(255, 255, 255, 0) !important;
-  -webkit-focus-ring-color: rgba(255, 255, 255, 0) !important;
-  outline: none !important;
-  font-family: sans-serif;
-  font-weight: 300
-}
+  *:not(input) {
+    -webkit-user-select: none
+  }
 
-*:not(input) {
-  -webkit-user-select: none
-}
+  ::-webkit-scrollbar {
+    display:none
+  }
 
-::-webkit-scrollbar {
-  display:none
-}
+  body, #router {
+    display: block;
+    position: absolute;
+    width: 100%;
+    background-color: #fafafa;
+    overflow: hidden;
+    min-height: ${ r }
+  }
 
-input {
-  border: 1px solid #ccc;
-  border-radius: 3px;
-  padding: 7px;
-  margin: 5px;
-  -webkit-appearance: none;
-  font-size: 16px
-}
+  .route {
+    display: block;
+    position: absolute;
+    width: 100%;
+    height: ${ r };
+    overflow-y: scroll;
+    -webkit-overflow-scrolling: touch;
+    background-color: #fafafa;
+    animation-duration: 0.3s;
+    animation-delay: 0s;
+    animation-fill-mode: both
+  }
 
-[type=submit] {
-  padding: 7px 12px
-}
+  .hide {
+    display : none
+  }
 
-form {
-  padding : 20px
-}
+  @-webkit-keyframes slideInRight {
+    from {
+      -webkit-transform: translate3d(100%, 0, 0);
+      transform: translate3d(100%, 0, 0);
+      visibility: visible
+    }
 
-body, #router {
-  display: block;
-  position: absolute;
-  width: 100%;
-  background-color: #fafafa;
-  overflow: hidden
-}
-
-#router {
-  top : 44px;
-  height: ${ r }px
-}
-
-a {
-  text-decoration: none;
-  color: black
-}
-
-.route {
-  display: block;
-  position: absolute;
-  width: 100%;
-  height: ${ r }px;
-  overflow-y: scroll;
-  -webkit-overflow-scrolling: touch;
-  background-color: #fafafa;
-  animation-duration: 0.3s;
-  animation-delay: 0s;
-  animation-fill-mode: both
-}
-
-.hide {
-  display : none
-}
-
-@-webkit-keyframes slideInRight {
-  from {
-    -webkit-transform: translate3d(100%, 0, 0);
-    transform: translate3d(100%, 0, 0);
-    visibility: visible
+    to {
+      -webkit-transform: translate3d(0, 0, 0);
+      transform: translate3d(0, 0, 0)
+    }
   }
 
-  to {
-    -webkit-transform: translate3d(0, 0, 0);
-    transform: translate3d(0, 0, 0)
+  .in {
+    -webkit-animation-name: slideInRight
   }
-}
 
-.in {
-  -webkit-animation-name: slideInRight
-}
+  @-webkit-keyframes slideOutRight {
+    from {
+      -webkit-transform: translate3d(0, 0, 0);
+      transform: translate3d(0, 0, 0)
+    }
 
-@-webkit-keyframes slideOutRight {
-  from {
-    -webkit-transform: translate3d(0, 0, 0);
-    transform: translate3d(0, 0, 0)
+    to {
+      visibility: hidden;
+      -webkit-transform: translate3d(100%, 0, 0);
+      transform: translate3d(100%, 0, 0)
+    }
   }
 
-  to {
-    visibility: hidden;
-    -webkit-transform: translate3d(100%, 0, 0);
-    transform: translate3d(100%, 0, 0)
+  .out {
+    -webkit-animation-name: slideOutRight;
+    animation-name: slideOutRight
   }
+  </style>
+  `
+  document.body.appendChild(css)
 }
 
-.out {
-  -webkit-animation-name: slideOutRight;
-  animation-name: slideOutRight
-}
-
-[back]{
-  position: fixed;
-  z-index: 10;
-  padding: 10px
-}
-</style>
-`
-document.body.appendChild(css)
+export default route

package.json

 {
   "name": "autoroute.js",
-  "version": "1.0.22",
+  "version": "1.0.23",
   "description": "Another lightweight javascript routing framework ",
@@ -5,0 +5,0 @@ "main": "autoroute.js",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

6599

decreased by-5.44%

Lines of code

200

decreased by-12.28%

No dependency changes