Skip to content

Version 2 of the jek-mobile-tmb. A user friendly interface for the university of Dar es salaam weekly timetable. Powered by an API of all academic events taking place weekly in the university.

Notifications You must be signed in to change notification settings

jackkweyunga/jek-mobile-timetable-v2

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

jek-mobile-timetable-v2

#############

How it works

It is easy to configure and use. Currently targeted for developers who want to include udsm time table in their web based projects.

in your htm file eg. index.html

Add the following styles to the header tag

<!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS v5.0.2 -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css"
      integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">

    <!-- bootstrap icons  -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.6.1/font/bootstrap-icons.css">

Add include this script

  <script src="https://cdn.jsdelivr.net/gh/jackkweyunga/jek-mobile-timetable-v2/dist/jek-mobile-tmb.js"></script>

In the section/page where you want to add this timetable, add this

    <div id="tmb"></div>

For the simplest use, your htm file will look like this.

<!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS v5.0.2 -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css"
      integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">

    <!-- bootstrap icons  -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.6.1/font/bootstrap-icons.css">
    
  </head>
  <body>

    <!--use the timetable id (tmb) to direct where the timetable appears -->
    <div id="tmb"></div>
      
    <!-- jek-mobile-timetable JavaScript Library -->
    <script src="https://cdn.jsdelivr.net/gh/jackkweyunga/jek-mobile-timetable-v2/dist/jek-mobile-tmb.js"></script>
  </body>
</html>

Something like this will be visible

image

...

Fun Fact

This project is an evolution from jek-mobile-timetable-v1 https://github.com/jackkweyunga/jek-mobile-timetable-v1

Contribute

Any new ideas plz reach out.

  • Fork and add some features.
  • If you want to be added as a developer in this project, reach out too.

email jackkweyunga@gmail.com

portfolio https://jackkweyunga.works

visit https://udsmtt.tk to find out more about the timetable

Liscence

MIT

About

Version 2 of the jek-mobile-tmb. A user friendly interface for the university of Dar es salaam weekly timetable. Powered by an API of all academic events taking place weekly in the university.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published