knockout.js video tutorial

knockout.js
main site: http://knockoutjs.com
tutoril: http://learn.knockjs.com
blog: http://knockmeout.net

knockout.js video tutorial

jQuery, combine different functions together

For example I have input button
<input type='button' class='previewButton' value='preview' />
I have general function for input method
    $resultTable.find('input').change(function() {
}
But change is not applied to button, as button reacts to click. To call change function for button:
   $resultTable.find('input.previewButton').click(function(event) {
              $(this).change();
}

Special characters pronunciation link

 Special characters pronunciation:
http://catb.org/jargon/html/A/ASCII.html

MySQL, left join only first row

MySQL, left join only first row:
                LEFT JOIN     fmcontract_rate_table AS rt
                    ON rt.ApptCategory =(SELECT ApptCategory  FROM fmcontract_rate_table WHERE
                    ApptCategory=hasRanks.Rank AND offered.Term >=StartTerm 
                   AND offered.Term  <EndTerm
                    ORDER BY rt.StartTerm LIMIT 1
                    )

JavaScript: test an empty string

To test an empty string  a in JS:

if (a == null || a=='')

Better way:

if (!a)

Because in javascript, an empty string, and null, both evaluate to false in a boolean context.

jQuery, selct and click radio button

For radio buttons in HTML

     <input type="radio" name="test" id="test1" />test1<br/>
     <input type="radio" name="test" id="test2" />test2<br/>
     <input type="radio" name="test" id="test3" />test3</br>

To get selected value:

$('input:radio[name=test]:checked').val();

To perform an action when click the radio button

$(function(){

$('input:radio[name=test]').change(
    function(){
        alert('changed');   
    }
);          

});

To set the first button checked:

$('input:radio[name=test]:nth(0)').attr('checked',true);
or
$('input:radio[name=test]')[0].checked = true;

JavaScript, convert object to number, replace part of string, trim

In JavaScript, Number function is used to  convert different object values to their numbers:

For example
var x4 = "9";
var x5= "9";
alert(x4+x5);
alert(Number(x4)+Number(x5);

 alert(x4+x5) produces 99, while alert(Number(x4)+Number(x5) produce 18.

In JS, to replace part of string
var str = "Visit Vancouver!";
var res = str.replace("Vancouver", "Seattle");

This just replace first occurrence of  Vancouver, to replace all Vancouver to Seattle
var res = str.replace(/Vancouver/g, "Seattle");


JS function trim will remove whitespace from both sides of a string:
Example:
var str = "       Hello World!        ";
alert(str.trim());

HTML choose br, br/, br / or /br in line break?

HTML choose <br>, <br/>, <br /> or </br> in line break?
In HTML (up to HTML 4): use <br>
In HTML 5: <br> is preferred, but <br/> and <br /> is also acceptable
In XHTML: <br /> is preferred. Can also use <br/> or <br></br>
Notes:

• <br></br> is not valid in HTML 5, it will be thought of as two line breaks.
• XHTML is case sensitive, HTML is not case sensitive.
• For backward compatibility, some old browsers would parse XHTML as HTML and fail on <br/> but not <br />

Diffferece between span and label in HTML

What is difference between label and spna in HTML? for example:

<span id="myid"></span>

or
<label id="myid"></label>

The <span> tag is used to group inline-elements in a document.  such as

<p>This car is  <span style="color:blue">blue</span> </p>

 

 A label is used in combination with a form input element. In some browsers the label can be clicked to activate the input element.

 

Span

The <span> tag is used to group inline-elements in a document.
The <span> tag provides no visual change by itself.
The <span> tag provides a way to add a hook to a part of a text or a part of a document.

Label

The <label> tag defines a label for an element.
The <label> element does not render as anything special for the user. However, it provides a usability improvement for mouse users, because if the user clicks on the text within the <label> element, it toggles the control.
The for attribute of the <label> tag should be equal to the id attribute of the related element to bind them together.

 

MySQL date created and date modified

In MySQL table, we often have date created, date modified, creator and modifier.
We can set  both date created and date modified type as TIMESTAMP.
For date created, we can set the default CURRENT_TIMESTAMP.  As a result, when you insert a row into the table, the current date and time are automatically inserted into the column.

For Date modified , we can (in PHP)
 SET  DateModified = NOW(),

For Creator and modifier, we can use SESSIOn from PHP such as
  Creator      = {$this->sanitizeInput($_SESSION['sms_userName'])}, 

MYSQL: merge update and insert using replace

MySQL REPLACE works exactly like INSERT, except that if an old row in the table has the same value as a new row for a PRIMARY KEY or a UNIQUE index, the old row is deleted before the new row is inserted.

So REPLACE know when to insert a row or update a row
EXAMPLE: id is primary key. semester. stakeholder_id and courses_id are composite key.
         $c = new Connection();
  $sql = "REPLACE  contract_si_ta_percourse
                  SET semester = {$this->sanitizeInput($arr['term'])},
                               ContactHour = {$this->sanitizeInput($arr['contacthour'])},
                                       courses_id = {$this->sanitizeInput($arr['course_id'])},
                       stakeholder_id  = {$this->sanitizeInput($arr['stakeholder_id'])}
                           ";  
       $result = $c->query($sql);

If we do not use replace, and use insert and update, the code will become very complicate.

          $c = new Connection();
  $sql = "SELECT id FROM  contract_si_ta_percourse
                  WHERE semester = {$this->sanitizeInput($arr['term'])} AND
                                       courses_id = {$this->sanitizeInput($arr['course_id'])} AND
                       stakeholder_id  = {$this->sanitizeInput($arr['stakeholder_id'])}
                           ";  
       $result = $c->query($sql);
if($c->getNumRows($result) <= 0){
         $sql = "INSERT  contract_si_ta_percourse
                  SET semester = {$this->sanitizeInput($arr['term'])},
                               ContactHour = {$this->sanitizeInput($arr['contacthour'])},
                                       courses_id = {$this->sanitizeInput($arr['course_id'])},
                       stakeholder_id  = {$this->sanitizeInput($arr['stakeholder_id'])}
                   ";  
}else {
               $sql = "UPDATE  contract_si_ta_percourse
                              SET ContactHour = {$this->sanitizeInput($arr['contacthour'])}
                           WHERE
                          semester = {$this->sanitizeInput($arr['term'])} AND
                               courses_id = {$this->sanitizeInput($arr['course_id'])} AND
                                       stakeholder_id  = {$this->sanitizeInput($arr['stakeholder_id'])};
}
    $result = $c->query($sql);

Run codes online using ideone.com

 Ideone is an online compiler and debugging tool which allows you to compile source code and execute it online in more than 60 programming languages (Java, C++, Pyhon, PHP, JavaScript  and more)
http://ideone.com/

fixed iphone 5s can not slide to power off

My iphone 5s screen was frozen. I hold the power button for a few seconds  and screen
showed "slide to power off". But I can not slide!!
There is another solution without slide to power off:
Reboot (holding the power and home button simultaneously)

Advanced CSS example

1. css inherited: Set the text-color for <span> elements to blue, except those inside elements with class="extra":
span {
    color: blue;
    border: 1px solid black;
}
.extra span {
    color: inherit;
}

2. CSS group selector,  each h1, h2 and p are independent
h1, h2, p {
    text-align: center;
    color: red;
}

3. CSS class

p.test1{ color: blue; } p.test2{ color:red; }

html
<p class="test1">test1 CSS code!</p> 
<p class="test2"> p.test2 CSS code!</p>

4. space between selector
.test div{
 color: blue;
}
Select any div element that is a child of any element with a class name of "test"
<p class="test">
<div></div>
</p>

5. ">" greater sign selector - direct descendant/child

<div>
  <p><b>John 1</b></p>
  <p><b>John 2</b></p>
  <b>John 3</b>
</div>

And in CSS

div b { color: red; } /* every John is red */
div>b { color: red; } /* Only John 3 is red */

Javascript - get unique number from time

To get unique number from time
   var d = new Date();
    var n = d.valueOf();
which will return
1416718344714
in MySQL, we need to set the data type as  BIGINT( 20 ).

In jQuery ajax post,  we can get the last insert number from autoincrement from retrun message.
But it is sometimes diffcult to syncronize this number to the div I want to update.
In some application, we had better  create a   unique number from time and force
the last insert number as this unique number in ajax post.

jQuery - sum over columns in a table or over input box

I have a table, there  is an input box in a column, beside there is default value near input box.
There are also default values inside input box. I want to add a summary row to show total.
When the input value is changed, the total row also needs to reflect the change.
below is the code:
$(document).ready(function() {
        var $resultTable = $("<table class='list'></table>");
        var $header = $("<tr><th>#</th><th>Saving</th>");
         $resultTable.html($header);
         for(var i = 0; i< 10; i++){
             var $row = $("<tr><td >"+(i+1)+"</td><td> <input type='text' class='inputch' name='saving' size ='6' value='"+i+"'>(<label class='inputch0'>"+i+"</label>)</td> </tr>");
          $resultTable.append($row);
       }
 var $row1 = $("<tr><td>Total</td><td><td class='totalch'> 0</td></tr>");
         var total = 0;total0=0;
   
        $resultTable.find('input.inputch').each(function() {
            total += Number($(this).val());
          });
        $resultTable.find('label.inputch0').each(function() {
              total0 += Number($(this).html());

          });
          $resultTable.find('td.totalch').html(total+' ('+total0+')'); 
         $resultTable.find('input.inputch').change(function() {
           var total = 0;total0=0;
          $resultTable.find('input.inputch').each(function() {
             total += Number($(this).val());
           });
           $resultTable.find('label.inputch0').each(function() {
               total0 += Number($(this).html());
           });
             $resultTable.find('td.totalch').html(total+' ('+total0+')');
        });
});
We use change in input box, the total will be changed only after input box lose focus.
If we want to see the immediate change, we can use keyup, i.e.
         $resultTable.find('input.inputch').keyup(function() {
OR
          $resultTable.find('input.inputch').on('input', function() {

Userul resources and free online books for PHP, MySql, jQuery, JavaScript

Most useful resource  for PHP, MySql, jQuery, JavaScript:
http://www.w3schools.com/

PHP programming:
 http://en.wikibooks.org/wiki/PHP_Programming

Eloquent JavaScript
http://eloquentjavascript.net/

JavaScript Guide:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide

Speaking JavaScript:
http://speakingjs.com/es5/

DOM
http://domenlightenment.com/

jQuery fundamental:
http://jqfundamentals.com/

Learn jQuery:
http://learn.jquery.com/

Pro Git:
http://git-scm.com/book/en/v2

Learn Git:
https://www.git-tower.com/learn/ebook

Essential SQL:
http://www.essentialsql.com/getting-started/

SQL at StandFord:
https://class.stanford.edu/courses/DB/SQL/SelfPaced/courseware/ch-sql/seq-vid-introduction_to_sql/

SQL for Web nerds:
http://philip.greenspun.com/sql/

SQL Zoo:
http://sqlzoo.net/wiki/Main_Page

HTML and CSS:
http://learn.shayhowe.com/html-css/

PHP, separate string by any space or comma, lowercaser and timestamp in PHP and MySQl

PHP, separate string by any space or comma using regular expression
    // split the phrase by any number of commas or space characters,
       // which include " ", \r, \t, \n and \f
        $course_pieces = preg_split("/[\s,]+/", trim($course));
If you use explode, you can only separate by one space:
$course_pieces = explode(" ", trim($course));

In PHP, to convert to lower case:
        $course_subject = strtolower($course_pieces[0]);
        $course_number = $course_pieces[1];

While in MySQL, we use LOWER
for example
 $oplCondition = " AND  LOWER(FirstName) LIKE  LOWER('%".$firstname))."%')";

MySQL TIMESTAMP date type, corresponding to PHP function
date("Y-m-d  H:i:s")

jQuery deal with post data

To deal with .post in jQuery
var tutorialID = 1;
            $.post('data_process.php',
                {funct:'updateSITA',
                tutorialID:tutorialID,
                course_id:course_id,
                courses_offered_id:courses_offered_id,
                section:section,
                ta:ta,
                type:type,
                 status:status}, function(data){
                formatJson(data, "div#notice", null);
            });

In  data_process.php, we can hand data from post, i.e. $_POST
for example $_POST['funct']
if($_POST['funct'] == "updateSITA") {

jQuery, get value from cell

jQuery, get value from cell
1. Case 1
html:
 <td class='type'>car</td>
jQuery
var row = $(this).parent().parent();
var type = row.find('td.type').html();

2. Case 2
html
<td class='button1'> <input class='courses_offered_id'/></td>
jQuery
row.find('td input.courses_offered_id').val();

3. Case 3
html
 <td class='Ta'><select id="mySelect"><option value=" ">=No TA Assigned=</option></select></td>
jQuery
row.find('td.Ta select').val();

Linux, list directory size and sort

 Linux, command to list directory size and sort:, for example for directory /
 sudo du -mhc  / |sort -h 
For only total size
 sudo du -mhcs  / |sort -h 
Total disk available in G
 df -H
Return:
Filesystem            Size  Used Avail Use% Mounted on
/dev/mapper/vg_sys-lv_root
                      279G   12G  253G   5% /
tmpfs                 2.1G     0  2.1G   0% /dev/shm
/dev/sda1             500M   86M  388M  19% /boot
 

jQuery, duplicate a row in a table and modify after click a button

For example in HTML
<div class='ajax_list'>
        <table class='template list'>
                <tr class='template worksheet-row' >
                    <td class='index' id='index'></td>
                    <td class='Term'></td>
                    <td class='Course'></td>
                    <td class='TutSection'><div type='text' name='TutorialSection' style='width:60px'/></td>
                    <td class='TaList'>list of TA</td>
               
                    <td class='EnrolMax'></td>
                    <td class='Status'></td>
                    <td class='type'></td>
                    <td class='button1'><input type='button' class='duplication' name='duplicate' value="duplicate"/>
                        <input type='button' class='SaveButton1' name='update' value="Save1"/>
                        <input type='hidden' class='tutorialID'/>
                        <input type='hidden' class='course_id'/>
                        <input type='hidden' class='courses_offered_id'/>
                    </td>
                </tr>
            </table>
</div>
To duplicate a row in a table and modify in jQuery via click duplicate button
    $('div.ajax_list input.duplication').live('click', function(){
           var $tr    = $(this).closest('.worksheet-row');
           var $clone = $tr.clone();
//Remove duplicate button in new row
           $clone.find('.duplication').remove();
//empty original content
            $clone.find('.TaList').empty();
//Now append a dropdown menu
 $clone.find('td.TaList').append('<select><option value=" ">=No Assigned</option></select>');
 $clone.find('td.TaList select').append('<option value="1">1</option>');
 $clone.find('td.TaList select').append('<option value="2">2</option>');
//Update button to Update
           $clone.find(':button').val('Update');
//Change cell value to marker
           $clone.find('.type').html('Marker');
//Set new row background color light green
           $clone.css('background-color','lightgreen');
//add new row in table
           $tr.after($clone);
      });     
  For passing the data to function,
$(selector).live(event,data,function)
Example
     $('div.ajax_list input.duplication').live('click',data, function(){

jQuery, clone a row via click add button in the same row

HTML table with add button
<table width="100%" border="0" cellspacing="0" cellpadding="0" id="table-data">
    <tr>
        <td>Name</td>
        <td>Location</td>
        <td>From</td>
        <td>To</td>
        <td>Add</td>
    </tr>
    <tr class="tr_clone">
        <td><input type="text" autofocus placeholder="who" name="who" ></td>
        <td><input type="text" autofocus placeholder="location" name="location" ></td>
        <td><input type="text" placeholder="Start Date" name="datepicker_start" class="datepicker"></td>
        <td><input type="text" placeholder="End Date" name="datepicker_end" class="datepicker"></td>
        <td><input type="button" name="add" value="Add" class="tr_clone_add"></td>
    </tr>
</table><!-- /table#table-data -->

jQuery:
$("input.tr_clone_add").live('click', function() {
    var $tr    = $(this).closest('.tr_clone');
    var $clone = $tr.clone();
    $clone.find(':text').val('');
    $tr.after($clone);
});

Using ajax in filter or search

Assume we have a form:
     <form id="filterForm">
            <input type="button" id='FilterButton' value="Filter" />
      </form>
We we click the Filter button
$(document).ready(function(){
    $('#FilterButton').click(function(){
            submitFilter();
    });

}
 submiteFilter function using ajax
function submitFilter(){
    $.post('handlesubmit.php', $("form#filterForm").serialize(), function(data) {
                formatJson(data, 'div.ajax_list', setDefaultContent);
         });
}

function setDefaultContent is used to handle the data from ajax post.
function setDefaultContent(formattedJson){

}

Add content in dropdown menu dynamically and set its default value in jQuery

 To add content in dropdown menu and set its default value in jQuery,
1) first we have a empty selection dropdown
 <select id="mySelect"><option value=" ">=No TA Assigned=</option></select>
2) Then we have JS function  myFunction() to deal with onclick to add items to dropdown, this is very useful as we can change dropdown menu dynamically.
3) We need to prevent duplication of items  dropdown, also we can set the default value
   row.find('td.Ta select').val('2');
Complete Code:
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
</head>
<style>
table {
    border-collapse: collapse;
}
table, th, td {
    border: 1px solid black;
}
</style>
<script>
function myFunction() {
   var taList = {};
   taList={
     '1': {id:1, name:'Andy'},
     '2':{id:2,name:'Jiansen'},
     '3': {id:3, name:'Tommy'} };
   var row = $('table.template tr.template');
//add other options
    for (var id0 in taList){
        var x = document.getElementById("mySelect");
        var i, add='y';
        //prevent duplication           
        for (i = 0; i < x.length; i++) {
        if(taList[id0].id ==i) add='n'
        }   
           if(add=='y')     row.find('td.Ta select').append('<option value="'+taList[id0].id+'">'+taList[id0].name+'</option>');          
      }
//Set default value, for example Andy
    row.find('td.Ta select').val('2');
}
</script>
<body>
<h1>Add content in dropdown menu and set its default value in jQuery</h1>
 <table class='template' style="border:1" >
<tr>
   <th>Courses</th><th>Pick TA</th>
<tr>
<tr class='template'>
 <td>Physics</td>   <td class='Ta'><select id="mySelect"><option value=" ">=No TA Assigned=</option></select></td>
</tr>
</table>
<button onclick="myFunction()">Click me to add TAs TA dropdown list</button>
<p id="demo"></p>
</body>
</html>

Java, can not load main class Mineshafter-launcher.jar

Install Java (Java(TM) Platform SE binary) from
 http://java.com/en/
Run
 java Mineshafter-launcher.jar
Return error
"can not load main class Mineshafter-launcher.jar"

run
 java -jar  Mineshafter-launcher.jar
fix the problem

For convinence, write  a window bat script such as Minecraft.bat
java -jar  Mineshafter-launcher.jar
pause

i.e open Notepad, copy above script and save as 
Minecraft.bat
Note  Minecraft.bat should be in the same location (directory) with Mineshafter-launcher.jar
click 
Minecraft.bat

MySql, find email address

Find email address end of @sfu.ca (table mail, column email_add)
trim(mail.email_addr)  like '%@sfu.ca'
Without containing . in id part:
trim(mail.email_addr)  not like '%\.%@sfu.ca'
Extract id part of email address, ie. the string before @sfu.ca
LEFT(mail.EMAIL_ADDR, LOCATE('@', mail.EMAIL_ADDR) - 1)

MySQL, find those values not in another table

In MySQl, Find those emplid in courses_offered_has_stakeholders table, but not in stakeholders table
      SELECT DISTINCT table1.emplid
      FROM courses_offered_has_stakeholders as table1 LEFT JOIN stakeholders as table2 ON          
      table2.emplid=table1.emplid
      WHERE table2.emplid IS NULL;"

Linux bash, change command prompt

To change command prompt in Linux bash:
modify .bashrc in home directory.
Original .bashrc:
 # .bashrc
# Source global definitions
if [ -f /etc/bashrc ]; then
        . /etc/bashrc
fi
# User specific aliases and functions
After modifying .bashrc, run
bash

MySQL, check duplication and delete all duplication and keep one.

For example, we have names MySQl table:

SELECT * FROM names;

+----+--------+
| id | name   |
+----+--------+
| 1  | nissan |
| 2  | nissan |
| 3  |  GM    |
| 4  |  EM    |
| 5  |  GM    |
| 6  |  EM    |
+----+--------+

First we want to check duplication:
SELECT distinct name, count(name) FROM `names` group by name having count(name)>1;

Delete duplication and keep the row with the lowest id value:

DELETE n1 FROM names n1, names n2 WHERE n1.id > n2.id AND n1.name = n2.name

 

Loading external sql files in PHP

I have a large sql file. I preferred  to separate it from PHP code.
I created a SQL directory to put these sql files. Using PHP function file_get_contents to laod
external sql files.
    $db2 = new ConnectionDB2();
    $sql = file_get_contents(SITE_SERVER_ROOT."/_models/SQL/CSRPTcourses_lut.sql");
    $result = $db2->query($sql);
    $data = array();
    while ($row = $db2->getArray($result)) {
            $data[] = $row;
        }
     $db2->close();

Unix Utils and wget in Windows

Unix Utils download in Windows: (sh.exe):
http://sourceforge.net/projects/unxutils/
wget in Windows:
http://users.ugent.be/~bpuype/wget/

Windows 7 - connect to a projector

Windows 7 - connect to a projector
 press the Windows logo key +P).

Choose

• Duplicate (This shows your desktop on both your computer screen and a projector.)

Vi: show line number

To display line number in v:
 :set number
To unset line number
 :set number!
Undo
u
Redo
ctrl r

Design date and signature box in Latex

To design date and signature box in Latex:

\begin{tabular}{ | b{2.6cm} | b{0.5cm}  | b{4.7cm}  | b{0.5cm}  | b{3cm}  | b{0.5cm} | b{4.7cm} |}
        \multicolumn{4}{l}{\ftext{Department Approval}} &
        \multicolumn{3}{l}{\ftext{Accepted by Appointee}} \\
        \cline{1-1} \cline{3-3} \cline{5-5} \cline{7-7}

        \multicolumn{1}{|c|}{\multirow{2}{*}} & \ & \ & \ & \ & \ & \\
        \ & \ & \ & \ & \ & \ & \\
        \cline{1-1} \cline{3-3} \cline{5-5} \cline{7-7}

        \multicolumn{1}{l}{\ftext{Date}} & \multicolumn{1}{l}{\null}   &
        \multicolumn{1}{l}{\ftext{Signature}}  & \multicolumn{1}{l}{\null}   &
        \multicolumn{1}{l}{\ftext{Date}}  & \multicolumn{1}{l}{\null}   &
        \multicolumn{1}{l}{\ftext{Signature}}
\end{tabular} \\

\begin{tabular}{| b{2.6cm} | b{0.5cm}  | b{4.7cm}  |    }
        \multicolumn{2}{l}{\ftext{Faculty Approval}} &  \multicolumn{1}{l}{\ftext{}}  \\
        \cline{1-1} \cline{3-3}

        \multicolumn{1}{|c|}{\multirow{2}{*}} & \ & \\
        \ & \ &   \\
        \cline{1-1} \cline{3-3}

        \multicolumn{1}{l}{\ftext{Date}} & \multicolumn{1}{l}{\null}   &
        \multicolumn{1}{l}{\ftext{Signature}}

\end{tabular} \\
 
result:

Windows Live Movie Maker in Windows 8

Windows Live Movie  Maker is not  with Windows 8, you need to download
Windows essential 2012 from
http://windows.microsoft.com/en-ca/windows-live/movie-maker
which includes Windows Live Movie  Maker.

To upload video from  Windows Live Movie  Makerto youtube, you may get an error message. This is due to the security setting in your google account.

Go to Google setting,  click security:
https://www.google.com/settings/security/lesssecureapps?hl=en-GB
Change "Access to less secure apps" from disable to enable.

Linux, change all file ownership in a directory and all sub-directories recursively

For example, I want to change the ownership of all files in the directory "html" and its sub-directories recursively to jiansen in Linux:
sudo chown -R jiansen html

Convert MySQl date format to PHP, convert date to term

In MySQl, the date format is yyyy-m-d.
To change to date format in PH, $dateMySQL below is MySQl date format  yyyy-m-d.
      $date = strtotime($dateMySQL);
        $year = date("Y", $date );
        $month = date("n", $date);
        $day = date("j", $date );

$year, $month, $day is to extract year, month and day. strtotime is to convert format time to to unix time.
Below is an example to convert MySQL date format to SFU term. and return the style of box shadow
in red.
    function style_for_initialcredit($termkey, $datecredit) {
        $date = strtotime($datecredit);
        $year = date("Y", $date );
        $month = date("n", $date);
        $day = date("j", $date );
        if($month>=1 && $month<=4) {$term  = ($year-1900)*10+1;}
        elseif($month>=5 && $month<=8) {$term  = ($year-1900)*10+4;}
        elseif($month>=9 && $month<=12) {$term  = ($year-1900)*10+7;}
        else  $term = 0;       

        $style = "";
        if($term==$termkey)
            $style .=" box-shadow: inset -10px 0 5px -5px hsla(0,100%,50%,0.5); ";
        return trim($style);
  
    }