JSFiddle - React, Tailwind, and code Playground

by sweety1112

JavaScript

/*WORKING CODE */

(function() {
    $(function() {
        // Set up a route that maps to the `detail/id` attribute
        can.route( ':route/:id' );
        // Delay routing until we initialized everything
        can.route.ready(false);
console.log('delayed');
        var Credentials = new can.Observe({username:'',password:''});
        var Secret = new can.Observe({username:'',password:''});

        // Initialize the app
        var patientStatus = new PatientStatus('#application', {'credentials':Credentials,'secret':Secret});
        var patientList = new PatientList('#application', {'credentials':Credentials,'secret':Secret});
        var detailMode = new Detail('#application', {'credentials':Credentials,'secret':Secret});
        var signinMode = new Signin('#application', {'credentials':Credentials, 'projectsMode':projectsMode,'secret':Secret});
console.log('running');
        // Now we can start routing
        can.route.ready(true);
    });

})();

/*NOT WORKING*/
(function() {
    var Router = can.Control({
    defaults: {}
  }, {
    init: function() {
      this.element.html(can.view('#index', {}));
    },
      
    ':routes patientStatus': function(route){
      console.log('patientStatus', route);
    },
      

    ':routes patientList': function(route){
      console.log('patientList', route);
    },

    'route': function(route){
      console.log('route', route);
    }
  });

  can.route( '', { routes: 'home' } );
  can.route.ready(false);
  new Router('#content');
  can.route.ready(true);
})();