This is a configuration generator app for the FANG cameras. This is an alternative to using some janky Chinese application.
A Pen by Riley Porter on CodePen.
Created
December 6, 2017 22:12
-
-
Save ril3y/65144fd49277ed7a0e1430d8d57da56f to your computer and use it in GitHub Desktop.
FANG Camera Config Generator
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <body> | |
| <div style="padding-top:5px;" class="container"> | |
| <div class="page-header"> | |
| <h1>WYZE / FANG* Config Generator</h1> | |
| <p class='lead'> | |
| This site is for those of you who do not want to use the configuration app's to get their Sonix based wireless cameras online. Note you will need to use the fang hacks after using the generated QR code to enable your web server. This utility only works | |
| to get your cameras connected to your wifi network. | |
| </p> | |
| </div> | |
| <h3>How does this work?</h3> | |
| <p>The generated QR code will get your camera connected to your Wifi Network. </br><strong> You will still need to use the Fang-Hacks method to complete the process.</strong> | |
| <br>Enter your SSID and Password as well as the camera model you wish to generate a QR config for. <br> <em><Strong>NOTE: Your SSID and PASSWORD do not leave your browser the generation alogrithm is executed in the context of your browser.</strong></em> </p> | |
| <div id="top_component" class="row"> | |
| <div class="col-md-6"> | |
| <div class="form-group"> | |
| <label for="ssid_input">SSID</label> | |
| <input value="YOUR SSID" name="ssid_input" type="text" class="form-control" id="ssid_input" placeholder="YOUR SSID"> | |
| </div> | |
| <div class="form-group"> | |
| <label for="password_input">Password</label> | |
| <input name="password_input" type="password" class="form-control" id="password_input" aria-describedby="ssid_help" placeholder="YOUR PASSWORD"> | |
| <small id="ssid_help" class="form-text text-muted">We do not store your password or ssid ever!</small> | |
| </div> | |
| <div class="form-group"> | |
| <label for="camera_model">Camera Selection</label> | |
| <select name="camera_model" class="form-control" id="camera_model"> | |
| <option>Fang</option> | |
| <option disabled>Wyze - In progress.</option> | |
| </select> | |
| </div> | |
| </div> | |
| <!-- END FIRST COL --> | |
| <div id="qr_cont" class="col-md-4"> | |
| <center> | |
| <br /> | |
| <div id="qrcode"></div> | |
| </div> | |
| </center> | |
| </div> | |
| <!-- END COL2 --> | |
| <div id="top_component" class="row"> | |
| <div class="col-md-10"> | |
| <div id="qr_cont" class="col-md-12"> | |
| <center> | |
| <iframe width="100%" height="515" src="https://www.youtube.com/embed/jUCWyDjU6XM" frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen></iframe> | |
| </center> | |
| </div> | |
| </div> | |
| </div> | |
| </div> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| var qrcode = new QRCode("qrcode"); | |
| var xor_strings = function(str, key) { | |
| c = ""; | |
| for (i = 0; i < str.length; i++) { | |
| c += String.fromCharCode( str.charCodeAt(i) ^ key.charCodeAt(i%str.length) ); // xoring with rolling key | |
| } | |
| return c; //This value needs to get btoa on it after this returns | |
| } | |
| function makeid() { | |
| //As far as I can tell this is just a random 16 byte value that needs to be send in the b= param | |
| var text = ""; | |
| var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789"; | |
| for (var i = 0; i < 16; i++) | |
| text += possible.charAt(Math.floor(Math.random() * possible.length)); | |
| return text; | |
| } | |
| function build_config_string_fang(timezone){ | |
| var key = "89JFSjo8HUbhou5776NJOMp9i90ghg7Y78G78t68899y79HY7g7y87y9ED45Ew30"; | |
| var ssid = document.getElementById("ssid_input").value; | |
| var pass = document.getElementById("password_input").value; | |
| var model = document.getElementById("camera_model").value; | |
| console.log(ssid+pass+model); | |
| var built_string = sprintf("b=%s&s=%s&p=%s&t=%s", makeid(), btoa(ssid), btoa(xor_strings(pass,key)), timezone); | |
| console.log(built_string); | |
| return(built_string); | |
| } | |
| function make_wyze(ssid, password, key){ | |
| var _camera_key = "Wfb86GZX82JbwzWkkPZBzkwgqtpswmlqqytjfrfxjzccjsyyaylbbdmzspxymdwz"; | |
| } | |
| function makeCode() { | |
| var elText = document.getElementById("ssid_input"); | |
| if (!elText.value) { | |
| //alert("Input a text"); | |
| elText.focus(); | |
| return; | |
| } | |
| data = build_config_string_fang("America/New York") | |
| qrcode.makeCode(data); | |
| } | |
| //Register Input Callback Handlers | |
| //Anytime a key is pressed in the SSID box or the PASSWORD box the qr is generated | |
| //based off of those values. | |
| $("#ssid_input"). | |
| on("blur", function () { | |
| makeCode(); | |
| }). | |
| on("keydown", function (e) { | |
| //if (e.keyCode == 13) { | |
| makeCode(); | |
| //} | |
| }); | |
| $("#password_input"). | |
| on("blur", function () { | |
| makeCode(); | |
| }). | |
| on("keydown", function (e) { | |
| //if (e.keyCode == 13) { | |
| makeCode(); | |
| //} | |
| }); | |
| //Generate A default QR Code just so it will show up. | |
| $(document).ready(function () { | |
| makeCode(); | |
| }); | |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> | |
| <script src="//cdn.rawgit.com/davidshimjs/qrcodejs/gh-pages/qrcode.min.js"></script> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/sprintf/1.1.1/sprintf.js"></script> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-beta.2/js/bootstrap.js"></script> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* #qrcode { | |
| float: none; | |
| margin: 0 auto; | |
| } */ | |
| /* grid system via getbootstrap.com/examples/grid/grid.css */ | |
| .container { | |
| padding-left: 15px; | |
| padding-right: 15px; | |
| } | |
| h4 { | |
| margin-top: 25px; | |
| } | |
| .row { | |
| margin-bottom: 20px; | |
| } | |
| .row .row { | |
| margin-top: 10px; | |
| margin-bottom: 0; | |
| } | |
| [class*="col-"] { | |
| padding-top: 15px; | |
| padding-bottom: 15px; | |
| background-color: #eee; | |
| border: 1px solid #ddd; | |
| background-color: rgba(86,61,124,.15); | |
| border: 1px solid rgba(86,61,124,.2); | |
| } | |
| hr { | |
| margin-top: 40px; | |
| margin-bottom: 40px; | |
| } | |
| #qr_cont { | |
| // background-color: red; | |
| } | |
| .center-block { | |
| float: none; | |
| margin: 0 auto; | |
| } | |
| .text-center { | |
| text-align:center | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-beta.2/css/bootstrap.css" rel="stylesheet" /> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment