Posted in php
472
5:02 am, October 8, 2021

timeline class and function

this is a class extend that generates a timeline based on structured data and order's the items by year decending.

this code will not work out of the box as it has other requirements, but it is a good example or starting point for a similar function to generate a timeline

also it had a requirement where the colours had to change per row so i added another array of the required colours and assigned each colour to the css that is generated as part of this function. 

PHP

// timeline.extend.php
class timeline extends core {

  public $class_extend = true; // this must be set to true! :)

  public $add_to_menu = false;
  public $add_section_button = false; // add this class to the section menu
  public $add_to_admin_menu = true; // add this class to the main admin menu

  public $nice_name = "timeline";
  public $nice_description = "timeline";
	public $db_table_name = "timeline";
  public $images_enabled = true;

  public $load_array = [
    "id",
    "uid",
    "insdate",
    "title",
    "additional",
    "category",
    "year",
    "month",
  ];


  public function show_timeline() {
    $db_table_name = $this->db->escapeString($this->db_table_name);
    $sql = "select * from $db_table_name order by year desc";
    $out = "";
    $css = "";
    $color_array = array(
      "#32567a",
      "#5e788f",
      "#c5a888",
      "#9f8167",
      "#ee7202",
      "#d05126",
      "#a4381b",
      "#514539",
    );

    $result = $this->db->query($sql);
    $line_num = 1;
    $col_array_num = 0;
    if($result) {
        while($row = $result->fetchArray()) {
            // $out .= $row['field_name'];
            foreach($this->load_array as $load_title) {
                //$template->set($load_title, $row[$load_title]);
                $this->$load_title = $row[$load_title];
            }

            $out .= "<div class='timeline-item timeline-item-$line_num'>
  <div class='grid-x'>
    <div class='large-1 cell'>
      <div class='timeline-year'>
        $this->year
      </div>
    </div>
    <div class='large-1 cell'>
      <div class='timeline-dot'>
      </div>
    </div>
    <div class='large-2 cell'>
      <div class='timeline-month'>
        $this->month
      </div>
    </div>
    <div class='large-7 cell'>
      <div class='timeline-title'>
        $this->title
      </div>
    </div>
  </div>
</div>";

            // add color css
            $line_color = $color_array[$col_array_num];
            $css .= ".timeline-item-$line_num { color:$line_color; } .timeline-item-$line_num .timeline-dot { background:$line_color; }";

            $col_array_num++;
            if($col_array_num == 7) {
              $col_array_num = 0;
            }

            $line_num++;

        }
        $out = "<style>$css</style>
        <div class='timeline-wrap'>
          $out
        </div>";
        return $out;
    } else {
        return false;
    }
  }


}

// view page timeline
// where $page_content is the page output
$page_content .= '
<style>
/* Timeline */
.timeline-item {
	font-family: "Poppins", sans-serif;
	font-size:18px;
	font-weight:bold;
	padding-bottom:15px;
}
.timeline-title {
	font-weight:normal;
}
.timeline-dot::before {
	content:"";
	width:5px;
	top:22px;
	height:60px;
	background:#CCC;
	position:absolute;
	left:7px;
	z-index:9;
}
.timeline-dot::after {
    content: "";
    width: 7px;
    top: 6px;
    left: 6px;
    border-radius: 30px;
    height: 7px;
    background: #FFF;
    position: absolute;
    z-index: 9;
}
.timeline-dot {
	z-index:10;
	position:relative;
	background:#000;
	border-radius: 50px;
	height:25px;
	width:25px;
	margin:0 auto;
	border:3px solid rgba(255,255,255,0.3);
}
.timeline-year {
	text-align: right;
}
/* Timeline */
</style>
';

$page_content .= '<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/foundation/6.7.3/css/foundation.min.css" integrity="sha512-2meDMHyoDRV8O0gr5Diq32ch+6QqI9Af9Km4eFwgxZg356CbUI4S30C3zuUetkNAN4Bn+17y9OgxoQ3HnQ648w==" crossorigin="anonymous" referrerpolicy="no-referrer" />';
$page_content .= $timeline->show_timeline();

View Statistics
This Week
92
This Month
472
This Year
472

No Items Found.

Add Comment
Type in a Nick Name here
 
Other Items in php
sqlite fetchArray into another array php return json header and content list_all_array an early stages of list all function that uses an array to pass in main variables replace singular variable assignment with an array loop and variable variables using the $_SERVER['HTTP_REFERER'] to check referring pages timeline class and function php html template class system views list function for checking what views have been made on the current week load array load all items from an array while in a sqlite load sql loop create a 200 character summary from a longer html string using strlen to check the length of a string and do something about it How to record your own page views with PHP, and make them into weekly monthly and yearly charts load from fields array php class function get the current week as a number with php creating embedded php code from a database field test php bundle write check if a file exists with php check if the file is a directory or check if the directory exists in php get the current working directory in php create directory with php create folder with php check if a product already exists by its md5 load random videos module using template PHP/SQLite - Load Random Item split a string into links using the comma extract youtube image from video url simple php ip blocker preg replace clean a string only allow a-zA-Z0-9 characters get last month as a number with php verify the google recapture server php rtrim strip white space or strings from the end of a string get the current month as a number show the difference between two dates in years, months, days, hours and seconds counting the occurrence of words in a multidimensional array write string contents to a file with php unable to access the $_FILES when submitting a form php check column exists in table sqlite show all methods or functions in a class (class function version) show all methods (functions) in a class adding an item to an array with php passing in arrays to your functions rather than using variables check server https or http value in php using $_SERVER Remove background image php with image magic get current url with php list a functions variables or arguments php list all the functions in a class php print an array nicely add a toast alert when logging in with half moon dont use md5 for password hashing using password_hash and password_verify php basic page router checking for spam comments function
Search Code
Search Code by entering your search text above.
Welcome

This is my test area for webdev. I keep a collection of code snippits here, mostly for my reference. Also if i find a good site, i usually add it here.

Join me on Substack if you want me to send you a collection of the things i have done or found or read for the week. Or follow me on twitter if you prefer, i dont post much but i probably should!

❤👩‍💻🕹

Random Quote
Don't look to be the next Facebook, try to solve a real problem instead.
Unknown