Updating js plugins

2023-01-24 20:31:23 +00:00
parent b1eb0a7a56
commit 2b6ddf9569
602 changed files with 109412 additions and 18 deletions
@@ -0,0 +1,2 @@
+# sliderTelepatic
+
@@ -0,0 +1,19 @@
+{
+  "name": "sliderTelepatic",
+  "authors": [
+    "ahwelp <ahwelp@test.com>"
+  ],
+  "description": "jQuery plugin to link a labels and sliders",
+  "main": "dist/sliderTelepatic.js",
+  "license": "MIT",
+  "homepage": "",
+  "private": true,
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "bower_components"
+  ],
+  "dependencies": {
+    "jquery": "^3.5.1"
+  }
+}
@@ -0,0 +1 @@
+(function($){ $.fn.sliderTelepatic = function(target = false){ if(!target){ target = $(this).parent().find('label').find('span'); } $(this).on('change', function(item, i){ $(target).html( item.currentTarget.value + "%" ); }); } })(jQuery);
@@ -0,0 +1,13 @@
+(function($){
+    $.fn.sliderTelepatic = function(target = false){
+        
+        //Pick the element to change
+        if(!target){ target = $(this).parent().find('label').find('span'); }
+        
+        //Monitoring the change
+        $(this).on('change', function(item, i){
+            $(target).html( item.currentTarget.value + "%" );
+        });
+        
+    }
+})(jQuery);
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <title>TODO supply a title</title>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <script src="../bower_components/jquery/dist/jquery.min.js"></script>
+        <script src="../src/sliderTelepatic.js"></script>
+    </head>
+    <body>
+        <div>
+            <div class="form-group col-12">
+                <label>Porcento <span class="range-monitor"> </span> </label> 
+                <input class="" type="range" name="percent" value="0" min="0" max="100" step="10" />
+            </div>
+        </div>
+        
+        <script>
+            $('input[type="range"]').each(function(i, el){
+                $(this).sliderTelepatic();
+            });
+        </script>
+        
+    </body>
+</html>
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <title>TODO supply a title</title>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <script src="../bower_components/jquery/dist/jquery.min.js"></script>
+        <script src="../src/sliderTelepatic.js"></script>
+    </head>
+    <body>
+        <div>
+            <div class="form-group col-12">
+                <label>Porcento <span class="range-monitor"> </span> </label> 
+                <input class="" type="range" name="percent" value="0" min="0" max="100" step="10" />
+            </div>
+        </div>
+        
+        <script>
+            $('input[type="range"]').each(function(i, el){
+                $(this).sliderTelepatic();
+            });
+        </script>
+        
+    </body>
+</html>
				`@@ -0,0 +1 @@`
				`(function($){ $.fn.sliderTelepatic = function(target = false){ if(!target){ target = $(this).parent().find('label').find('span'); } $(this).on('change', function(item, i){ $(target).html( item.currentTarget.value + "%" ); }); } })(jQuery);`