0
\$\begingroup\$

Problem

Method getQuoteHTML generates an HTML string using an array returned from getQuoteParams method. They are methods of a large class, UpdateStocks.

Would you be so kind and help me to replace them with faster, easier or more efficient methods, if possible?

getQuoteHTML:

    /**
     * 
     * @return a large HTML string of current quote section
     */
    public static function getQuoteHTML($a){
      $i=UpdateStocks::getQuoteParams();
      $bt='<a href="#" class="s18 ro tx-1 b119 r100 t-21 p-2 br-5 mv-3" onclick="J.s({d:this});return false;" title="'.$a["symbol"].' latest quote">💹 Quote: '.date('l, d F Y \⏱ H:i T',microtime(true)).'</a>';
      $hs='';
      foreach($i as $k=>$p){
        $h='';
        if(isset($p["id"])&&!empty($a[$p["ky"]])){
          if(preg_match('/(^s-*)/i',$p["id"])==1){
            $r=rand(20,99);
            $h=$h.'<p id="'.$p["id"].'">';
              $h=$h.'<b class="di-1 t-21 m-1 br-3 p-2 b119 r1'.$r.'">'.$p["lb"].'</b>: ';
              $h=$h.'<b class="di-1 t-21 m-1 br-3 p-2 b119 r1'.$r.'">'.$a[$p["ky"]].'</b>';
            $h=$h.'</p>';
            $hs=$hs.$h;
          }elseif(preg_match('/(^d-*)/i',$p["id"])==1){
            $r=rand(20,99);
            $h=$h.'<p id="'.$p["id"].'">';
              $h=$h.'<b class="di-1 t-21 m-1 br-3 p-2 b119 r1'.$r.'">'.$p["lb"].'</b>: ';
              $h=$h.'<b class="di-1 t-21 m-1 br-3 p-2 b119 r1'.$r.'">'.money_format('%=9.4n',(double)$a[$p["ky"]]).'</b>';
            $h=$h.'</p>';
            $hs=$hs.$h;
          }elseif(preg_match('/(^v-*)/i',$p["id"])==1){
            $r=rand(20,99);
            $h=$h.'<p id="'.$p["id"].'">';
              $h=$h.'<b class="di-1 t-21 m-1 br-3 p-2 b119 r1'.$r.'">'.$p["lb"].'</b>: ';
              $h=$h.'<b class="di-1 t-21 m-1 br-3 p-2 b119 r1'.$r.'">'.money_format('%=*!#4.0n',(double)$a[$p["ky"]]).'</b>';
            $h=$h.'</p>';
            $hs=$hs.$h;
          }elseif(preg_match('/(^t-*)/i',$p["id"])==1){
            $r=rand(20,99);
            $h=$h.'<p id="'.$p["id"].'">';
              $h=$h.'<b class="di-1 t-21 m-1 br-3 p-2 b119 r1'.$r.'">'.$p["lb"].'</b>: ';
              $h=$h.'<b class="di-1 t-21 m-1 br-3 p-2 b119 r1'.$r.'">'.date('l, d F Y \⏱ H:i T \(P \U\T\C\)',(double)$a[$p["ky"]]/1000).'</b>';
            $h=$h.'</p>';
            $hs=$hs.$h;
          }elseif(preg_match('/(^p-*)/i',$p["id"])==1){
            $r=rand(20,99);
            $h=$h.'<p id="'.$p["id"].'">';
              $h=$h.'<b class="di-1 t-21 m-1 br-3 p-2 b119 r1'.$r.'">'.$p["lb"].'</b>: ';
              $h=$h.'<b class="di-1 t-21 m-1 br-3 p-2 b119 r1'.$r.'">'.money_format('%=*!#4.4n',(double)$a[$p["ky"]]).'%</b>';
            $h=$h.'</p>';
            $hs=$hs.$h;
          }else{
            $r=rand(20,99);
            $h=$h.'<p id="'.$p["id"].'">';
              $h=$h.'<b class="di-1 t-21 m-1 br-3 p-2 b119 r1'.$r.'">'.$p["lb"].'</b>: ';
              $h=$h.'<b class="di-1 t-21 m-1 br-3 p-2 b119 r1'.$r.'">'.$a[$p["ky"]].'%</b>';
            $h=$h.'</p>';
            $hs=$hs.$h;
          }
        } // isset
        $h='';
      }

      return '<div class="ro">'.$bt.'<div class="di-0"><div class="p-3">'.$hs.'</div></div></div>';
    }

getQuoteParams:

Except for ky, $params array can be changed and additional key/value can be added into:

  /**
   * 
   * @return an array of parameters for stock quote from version 1 API at iextrading
   */
  public static function getQuoteParams(){
    $params=array(
        array(
          "id"=>"s-sy",
          "ky"=>"symbol",
          "lb"=>"Symbol",
        ),
        array(
          "id"=>"s-cn",
          "ky"=>"companyName",
          "lb"=>"Company",
        ),
        array(
          "id"=>"s-mk",
          "ky"=>"primaryExchange",
          "lb"=>"Primary Exchange Market",
        ),
        array(
          "id"=>"s-st",
          "ky"=>"sector",
          "lb"=>"Market Sector",
        ),
        array(
          "id"=>"d-op",
          "ky"=>"open",
          "lb"=>"Open Share Price [$]",
        ),
        array(
          "id"=>"t-ot",
          "ky"=>"openTime",
          "lb"=>"Open Time",
        ),
        array(
          "id"=>"d-cl",
          "ky"=>"close",
          "lb"=>"Close Share Price [$]",
        ),
        array(
          "id"=>"t-ct",
          "ky"=>"closeTime",
          "lb"=>"Close Time",
        ),
        array(
          "id"=>"d-hi",
          "ky"=>"high",
          "lb"=>"Current High Share Price [$]",
        ),
        array(
          "id"=>"d-lo",
          "ky"=>"low",
          "lb"=>"Current Low Share Price [$]",
        ),
        array(
          "id"=>"d-lp",
          "ky"=>"latestPrice",
          "lb"=>"Current Latest Share Price [$]",
        ),
        array(
          "id"=>"s-ls",
          "ky"=>"latestSource",
          "lb"=>"Data Source",
        ),
        array(
          "id"=>"t-lu",
          "ky"=>"latestUpdate",
          "lb"=>"Current Latest Update",
        ),
        array(
          "id"=>"v-lv",
          "ky"=>"latestVolume",
          "lb"=>"Current Latest Volume [V]",
        ),
        array(
          "id"=>"d-rp",
          "ky"=>"iexRealtimePrice",
          "lb"=>"Source Near-Real-Time Share Price [$]",
        ),
        array(
          "id"=>"v-rs",
          "ky"=>"iexRealtimeSize",
          "lb"=>"Source Near-Real-Time Size [V]",
        ),
        array(
          "id"=>"t-iu",
          "ky"=>"iexLastUpdated",
          "lb"=>"Source Latest Update",
        ),
        array(
          "id"=>"d-dp",
          "ky"=>"delayedPrice",
          "lb"=>"Delayed Share Price [$]",
        ),
        array(
          "id"=>"t-dt",
          "ky"=>"delayedPriceTime",
          "lb"=>"Delayed Share Price Time",
        ),
        array(
          "id"=>"d-ep",
          "ky"=>"extendedPrice",
          "lb"=>"Extended Share Price [$]",
        ),
        array(
          "id"=>"d-ec",
          "ky"=>"extendedChange",
          "lb"=>"Extended Dollar Change [$]",
        ),
        array(
          "id"=>"p-cp",
          "ky"=>"extendedChangePercent",
          "lb"=>"Extended Percent Change [%]",
        ),
        array(
          "id"=>"t-et",
          "ky"=>"extendedPriceTime",
          "lb"=>"Extended Share Price Time",
        ),
        array(
          "id"=>"d-pc",
          "ky"=>"previousClose",
          "lb"=>"Close Share Price in Previous Session [$]",
        ),
        array(
          "id"=>"d-ch",
          "ky"=>"change",
          "lb"=>"Share Price Change [$]",
        ),
        array(
          "id"=>"p-pr",
          "ky"=>"changePercent",
          "lb"=>"Share Price Change [%]",
        ),
        array(
          "id"=>"p-mp",
          "ky"=>"iexMarketPercent",
          "lb"=>"Source Market Share [%]",
        ),
        array(
          "id"=>"v-vl",
          "ky"=>"iexVolume",
          "lb"=>"Source Volume [V]",
        ),
        array(
          "id"=>"v-av",
          "ky"=>"avgTotalVolume",
          "lb"=>"Average Total Volume [V]",
        ),
        array(
          "id"=>"d-bp",
          "ky"=>"iexBidPrice",
          "lb"=>"Source Bid Price [$]",
        ),
        array(
          "id"=>"v-bs",
          "ky"=>"iexBidSize",
          "lb"=>"Source Bid Size [V]",
        ),
        array(
          "id"=>"d-ap",
          "ky"=>"iexAskPrice",
          "lb"=>"Source Ask Price [$]",
        ),
        array(
          "id"=>"v-as",
          "ky"=>"iexAskSize",
          "lb"=>"Source Ask Size [V]",
        ),
        array(
          "id"=>"d-cc",
          "ky"=>"marketCap",
          "lb"=>"Company Market Cap [$]",
        ),
        array(
          "id"=>"s-pe",
          "ky"=>"peRatio",
          "lb"=>"PE Ratio",
        ),
        array(
          "id"=>"d-wh",
          "ky"=>"week52High",
          "lb"=>"52-Week High [$]",
        ),
        array(
          "id"=>"d-wl",
          "ky"=>"week52Low",
          "lb"=>"52-Week Low [$]",
        ),
        array(
          "id"=>"p-yt",
          "ky"=>"ytdChange",
          "lb"=>"YTD Change",
        ),
   );
    return $params;
  }

HTML Output:

<div class="ro">
    <a href="#" class="s18 ro tx-1 b119 r100 t-21 p-2 br-5 mv-3" onclick="J.s({d:this});return false;" title="AAPL latest quote">💹 Quote: Tuesday, 12 March 2019 ⏱ 12:08 EDT</a>
    <div class="di-0">
        <div class="p-3">
            <p id="s-sy"><b class="di-1 t-21 m-1 br-3 p-2 b119 r179">Symbol</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r179">AAPL</b></p>
            <p id="s-cn"><b class="di-1 t-21 m-1 br-3 p-2 b119 r151">Company</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r151">Apple Inc.</b></p>
            <p id="s-mk"><b class="di-1 t-21 m-1 br-3 p-2 b119 r157">Primary Exchange Market</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r157">Nasdaq Global Select</b></p>
            <p id="s-st"><b class="di-1 t-21 m-1 br-3 p-2 b119 r136">Market Sector</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r136">Technology</b></p>
            <p id="d-op"><b class="di-1 t-21 m-1 br-3 p-2 b119 r127">Open Share Price [$]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r127">$180.0000</b></p>
            <p id="t-ot"><b class="di-1 t-21 m-1 br-3 p-2 b119 r136">Open Time</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r136">Tuesday, 12 March 2019 ⏱ 09:30 EDT (-04:00 UTC)</b></p>
            <p id="d-cl"><b class="di-1 t-21 m-1 br-3 p-2 b119 r190">Close Share Price [$]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r190">$178.9000</b></p>
            <p id="t-ct"><b class="di-1 t-21 m-1 br-3 p-2 b119 r163">Close Time</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r163">Monday, 11 March 2019 ⏱ 16:00 EDT (-04:00 UTC)</b></p>
            <p id="d-hi"><b class="di-1 t-21 m-1 br-3 p-2 b119 r158">Current High Share Price [$]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r158">$182.6700</b></p>
            <p id="d-lo"><b class="di-1 t-21 m-1 br-3 p-2 b119 r177">Current Low Share Price [$]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r177">$179.3700</b></p>
            <p id="d-lp"><b class="di-1 t-21 m-1 br-3 p-2 b119 r143">Current Latest Share Price [$]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r143">$181.4100</b></p>
            <p id="s-ls"><b class="di-1 t-21 m-1 br-3 p-2 b119 r185">Data Source</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r185">IEX real time price</b></p>
            <p id="t-lu"><b class="di-1 t-21 m-1 br-3 p-2 b119 r148">Current Latest Update</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r148">Tuesday, 12 March 2019 ⏱ 12:06 EDT (-04:00 UTC)</b></p>
            <p id="v-lv"><b class="di-1 t-21 m-1 br-3 p-2 b119 r195">Current Latest Volume [V]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r195"> 17,157,291</b></p>
            <p id="d-rp"><b class="di-1 t-21 m-1 br-3 p-2 b119 r168">Source Near-Real-Time Share Price [$]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r168">$181.4100</b></p>
            <p id="v-rs"><b class="di-1 t-21 m-1 br-3 p-2 b119 r150">Source Near-Real-Time Size [V]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r150"> **100</b></p>
            <p id="t-iu"><b class="di-1 t-21 m-1 br-3 p-2 b119 r173">Source Latest Update</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r173">Tuesday, 12 March 2019 ⏱ 12:06 EDT (-04:00 UTC)</b></p>
            <p id="d-dp"><b class="di-1 t-21 m-1 br-3 p-2 b119 r121">Delayed Share Price [$]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r121">$181.7210</b></p>
            <p id="t-dt"><b class="di-1 t-21 m-1 br-3 p-2 b119 r171">Delayed Share Price Time</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r171">Tuesday, 12 March 2019 ⏱ 11:51 EDT (-04:00 UTC)</b></p>
            <p id="d-ep"><b class="di-1 t-21 m-1 br-3 p-2 b119 r197">Extended Share Price [$]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r197">$181.4100</b></p>
            <p id="t-et"><b class="di-1 t-21 m-1 br-3 p-2 b119 r137">Extended Share Price Time</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r137">Tuesday, 12 March 2019 ⏱ 12:06 EDT (-04:00 UTC)</b></p>
            <p id="d-pc"><b class="di-1 t-21 m-1 br-3 p-2 b119 r144">Close Share Price in Previous Session [$]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r144">$178.9000</b></p>
            <p id="d-ch"><b class="di-1 t-21 m-1 br-3 p-2 b119 r179">Share Price Change [$]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r179">$2.5100</b></p>
            <p id="p-pr"><b class="di-1 t-21 m-1 br-3 p-2 b119 r155">Share Price Change [%]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r155"> ****0.0140%</b></p>
            <p id="p-mp"><b class="di-1 t-21 m-1 br-3 p-2 b119 r154">Source Market Share [%]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r154"> ****0.0222%</b></p>
            <p id="v-vl"><b class="di-1 t-21 m-1 br-3 p-2 b119 r168">Source Volume [V]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r168"> 381,235</b></p>
            <p id="v-av"><b class="di-1 t-21 m-1 br-3 p-2 b119 r124">Average Total Volume [V]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r124"> 27,155,838</b></p>
            <p id="d-bp"><b class="di-1 t-21 m-1 br-3 p-2 b119 r165">Source Bid Price [$]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r165">$180.0000</b></p>
            <p id="v-bs"><b class="di-1 t-21 m-1 br-3 p-2 b119 r166">Source Bid Size [V]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r166"> **100</b></p>
            <p id="d-ap"><b class="di-1 t-21 m-1 br-3 p-2 b119 r125">Source Ask Price [$]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r125">$185.0000</b></p>
            <p id="v-as"><b class="di-1 t-21 m-1 br-3 p-2 b119 r175">Source Ask Size [V]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r175"> **500</b></p>
            <p id="d-cc"><b class="di-1 t-21 m-1 br-3 p-2 b119 r133">Company Market Cap [$]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r133">$855,398,944,800.0000</b></p>
            <p id="s-pe"><b class="di-1 t-21 m-1 br-3 p-2 b119 r166">PE Ratio</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r166">15.28</b></p>
            <p id="d-wh"><b class="di-1 t-21 m-1 br-3 p-2 b119 r150">52-Week High [$]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r150">$233.4700</b></p>
            <p id="d-wl"><b class="di-1 t-21 m-1 br-3 p-2 b119 r177">52-Week Low [$]</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r177">$142.0000</b></p>
            <p id="p-yt"><b class="di-1 t-21 m-1 br-3 p-2 b119 r159">YTD Change</b>: <b class="di-1 t-21 m-1 br-3 p-2 b119 r159"> ****0.1517%</b></p>
        </div>
    </div>
</div>

JavaScript Switch

/*switch display*/
s:function(z){
    var x,a;
    x=/(di-0)/i;
    if(x.test(z.d.nextElementSibling.attributes.getNamedItem('class').nodeValue)){a=1}else{a=0}
    switch (a){
        case 1:
            z.d.nextElementSibling.attributes.getNamedItem('class').nodeValue='di-2';
            break;
        case 0:
            z.d.nextElementSibling.attributes.getNamedItem('class').nodeValue='di-0';
            break;
        }
}

Switch Display CSS

.di-0{display:none!important}.di-1{display:inline-block}.di-2{display:block}.di-3{display:grid}

Color Map CSS

.r100,
r100 a {
    color: #FFFFFF
}

.b100,
.b100 a {
    background-color: #FFFFFF
}

.r101,
r101 a {
    color: #F8F8FF
}

.b101,
.b101 a {
    background-color: #F8F8FF
}

.r102,
r102 a {
    color: #F7F7F7
}

.b102,
.b102 a {
    background-color: #F7F7F7
}

.r103,
r103 a {
    color: #F0F0F0
}

.b103,
.b103 a {
    background-color: #F0F0F0
}

.r104,
r104 a {
    color: #F2F2F2
}

.b104,
.b104 a {
    background-color: #F2F2F2
}

.r105,
r105 a {
    color: #EDEDED
}

.b105,
.b105 a {
    background-color: #EDEDED
}

.r106,
r106 a {
    color: #EBEBEB
}

.b106,
.b106 a {
    background-color: #EBEBEB
}

.r107,
r107 a {
    color: #E5E5E5
}

.b107,
.b107 a {
    background-color: #E5E5E5
}

.r108,
r108 a {
    color: #E3E3E3
}

.b108,
.b108 a {
    background-color: #E3E3E3
}

.r109,
r109 a {
    color: #E0E0E0
}

.b109,
.b109 a {
    background-color: #E0E0E0
}

.r110,
r110 a {
    color: #858585
}

.b110,
.b110 a {
    background-color: #858585
}

.r111,
r111 a {
    color: #666666
}

.b111,
.b111 a {
    background-color: #666666
}

.r112,
r112 a {
    color: #545454
}

.b112,
.b112 a {
    background-color: #545454
}

.r113,
r113 a {
    color: #4D4D4D
}

.b113,
.b113 a {
    background-color: #4D4D4D
}

.r114,
r114 a {
    color: #474747
}

.b114,
.b114 a {
    background-color: #474747
}

.r115,
r115 a {
    color: #363636
}

.b115,
.b115 a {
    background-color: #363636
}

.r116,
r116 a {
    color: #333333
}

.b116,
.b116 a {
    background-color: #333333
}

.r117,
r117 a {
    color: #222222
}

.b117,
.b117 a {
    background-color: #222222
}

.r118,
r118 a {
    color: #1C1C1C
}

.b118,
.b118 a {
    background-color: #1C1C1C
}

.r119,
r119 a {
    color: #050505
}

.b119,
.b119 a {
    background-color: #050505
}

.r120,
r120 a {
    color: #EEEE00
}

.b120,
.b120 a {
    background-color: #EEEE00
}

.r121,
r121 a {
    color: #FFD700
}

.b121,
.b121 a {
    background-color: #FFD700
}

.r122,
r122 a {
    color: #EEC900
}

.b122,
.b122 a {
    background-color: #EEC900
}

.r123,
r123 a {
    color: #EAC80D
}

.b123,
.b123 a {
    background-color: #EAC80D
}

.r124,
r124 a {
    color: #FFC125
}

.b124,
.b124 a {
    background-color: #FFC125
}

.r125,
r125 a {
    color: #FFB90F
}

.b125,
.b125 a {
    background-color: #FFB90F
}

.r126,
r126 a {
    color: #EEAD0E
}

.b126,
.b126 a {
    background-color: #EEAD0E
}

.r127,
r127 a {
    color: #DAA520
}

.b127,
.b127 a {
    background-color: #DAA520
}

.r128,
r128 a {
    color: #BFA30C
}

.b128,
.b128 a {
    background-color: #BFA30C
}

.r129,
r129 a {
    color: #B78A00
}

.b129,
.b129 a {
    background-color: #B78A00
}

.r130,
r130 a {
    color: #FFA500
}

.b130,
.b130 a {
    background-color: #FFA500
}

.r131,
r131 a {
    color: #FF9912
}

.b131,
.b131 a {
    background-color: #FF9912
}

.r132,
r132 a {
    color: #ED9121
}

.b132,
.b132 a {
    background-color: #ED9121
}

.r133,
r133 a {
    color: #FF7F00
}

.b133,
.b133 a {
    background-color: #FF7F00
}

.r134,
r134 a {
    color: #FF8000
}

.b134,
.b134 a {
    background-color: #FF8000
}

.r135,
r135 a {
    color: #EE7600
}

.b135,
.b135 a {
    background-color: #EE7600
}

.r136,
r136 a {
    color: #EE6A50
}

.b136,
.b136 a {
    background-color: #EE6A50
}

.r137,
r137 a {
    color: #EE5C42
}

.b137,
.b137 a {
    background-color: #EE5C42
}

.r138,
r138 a {
    color: #FF6347
}

.b138,
.b138 a {
    background-color: #FF6347
}

.r139,
r139 a {
    color: #FF6103
}

.b139,
.b139 a {
    background-color: #FF6103
}

.r140,
r140 a {
    color: #32CD32
}

.b140,
.b140 a {
    background-color: #32CD32
}

.r141,
r141 a {
    color: #00C957
}

.b141,
.b141 a {
    background-color: #00C957
}

.r142,
r142 a {
    color: #43CD80
}

.b142,
.b142 a {
    background-color: #43CD80
}

.r143,
r143 a {
    color: #00C78C
}

.b143,
.b143 a {
    background-color: #00C78C
}

.r144,
r144 a {
    color: #1ABC9C
}

.b144,
.b144 a {
    background-color: #1ABC9C
}

.r145,
r145 a {
    color: #20B2AA
}

.b145,
.b145 a {
    background-color: #20B2AA
}

.r146,
r146 a {
    color: #03A89E
}

.b146,
.b146 a {
    background-color: #03A89E
}

.r147,
r147 a {
    color: #00C5CD
}

.b147,
.b147 a {
    background-color: #00C5CD
}

.r148,
r148 a {
    color: #00CED1
}

.b148,
.b148 a {
    background-color: #00CED1
}

.r149,
r149 a {
    color: #48D1CC
}

.b149,
.b149 a {
    background-color: #48D1CC
}

.r150,
r150 a {
    color: #63B8FF
}

.b150,
.b150 a {
    background-color: #63B8FF
}

.r151,
r151 a {
    color: #00B2EE
}

.b151,
.b151 a {
    background-color: #00B2EE
}

.r152,
r152 a {
    color: #1E90FF
}

.b152,
.b152 a {
    background-color: #1E90FF
}

.r153,
r153 a {
    color: #1C86EE
}

.b153,
.b153 a {
    background-color: #1C86EE
}

.r154,
r154 a {
    color: #1C86EE
}

.b154,
.b154 a {
    background-color: #1C86EE
}

.r155,
r155 a {
    color: #1874CD
}

.b155,
.b155 a {
    background-color: #1874CD
}

.r156,
r156 a {
    color: #436EEE
}

.b156,
.b156 a {
    background-color: #436EEE
}

.r157,
r157 a {
    color: #4169E1
}

.b157,
.b157 a {
    background-color: #4169E1
}

.r158,
r158 a {
    color: #3A5FCD
}

.b158,
.b158 a {
    background-color: #3A5FCD
}

.r159,
r159 a {
    color: #014B96
}

.b159,
.b159 a {
    background-color: #014B96
}

.r160,
r160 a {
    color: #EE7AE9
}

.b160,
.b160 a {
    background-color: #EE7AE9
}

.r161,
r161 a {
    color: #DA70D6
}

.b161,
.b161 a {
    background-color: #DA70D6
}

.r162,
r162 a {
    color: #BA55D3
}

.b162,
.b162 a {
    background-color: #BA55D3
}

.r163,
r163 a {
    color: #BF3EFF
}

.b163,
.b163 a {
    background-color: #BF3EFF
}

.r164,
r164 a {
    color: #B23AEE
}

.b164,
.b164 a {
    background-color: #B23AEE
}

.r165,
r165 a {
    color: #9B30FF
}

.b165,
.b165 a {
    background-color: #9B30FF
}

.r166,
r166 a {
    color: #836FFF
}

.b166,
.b166 a {
    background-color: #836FFF
}

.r167,
r167 a {
    color: #7A67EE
}

.b167,
.b167 a {
    background-color: #7A67EE
}

.r168,
r168 a {
    color: #9F79EE
}

.b168,
.b168 a {
    background-color: #9F79EE
}

.r169,
r169 a {
    color: #8968CD
}

.b169,
.b169 a {
    background-color: #8968CD
}

.r170,
r170 a {
    color: #FF6EB4
}

.b170,
.b170 a {
    background-color: #FF6EB4
}

.r171,
r171 a {
    color: #FF69B4
}

.b171,
.b171 a {
    background-color: #FF69B4
}

.r172,
r172 a {
    color: #EE3A8C
}

.b172,
.b172 a {
    background-color: #EE3A8C
}

.r173,
r173 a {
    color: #FF34B3
}

.b173,
.b173 a {
    background-color: #FF34B3
}

.r174,
r174 a {
    color: #FF1493
}

.b174,
.b174 a {
    background-color: #FF1493
}

.r175,
r175 a {
    color: #EE1289
}

.b175,
.b175 a {
    background-color: #EE1289
}

.r176,
r176 a {
    color: #CD2990
}

.b176,
.b176 a {
    background-color: #CD2990
}

.r177,
r177 a {
    color: #D02090
}

.b177,
.b177 a {
    background-color: #D02090
}

.r178,
r178 a {
    color: #C71585
}

.b178,
.b178 a {
    background-color: #C71585
}

.r179,
r179 a {
    color: #CD1076
}

.b179,
.b179 a {
    background-color: #CD1076
}

.r180,
r180 a {
    color: #FF4500
}

.b180,
.b180 a {
    background-color: #FF4500
}

.r181,
r181 a {
    color: #EE4000
}

.b181,
.b181 a {
    background-color: #EE4000
}

.r182,
r182 a {
    color: #FF4040
}

.b182,
.b182 a {
    background-color: #FF4040
}

.r183,
r183 a {
    color: #EE3B3B
}

.b183,
.b183 a {
    background-color: #EE3B3B
}

.r184,
r184 a {
    color: #EE2C2C
}

.b184,
.b184 a {
    background-color: #EE2C2C
}

.r185,
r185 a {
    color: #FF0000
}

.b185,
.b185 a {
    background-color: #FF0000
}

.r186,
r186 a {
    color: #DC143C
}

.b186,
.b186 a {
    background-color: #DC143C
}

.r187,
r187 a {
    color: #CD0000
}

.b187,
.b187 a {
    background-color: #CD0000
}

.r188,
r188 a {
    color: #B0171F
}

.b188,
.b188 a {
    background-color: #B0171F
}

.r189,
r189 a {
    color: #8B2323
}

.b189,
.b189 a {
    background-color: #8B2323
}

.r190,
r190 a {
    color: #FF6A6A
}

.b190,
.b190 a {
    background-color: #FF6A6A
}

.r191,
r191 a {
    color: #CD7054
}

.b191,
.b191 a {
    background-color: #CD7054
}

.r192,
r192 a {
    color: #CD6839
}

.b192,
.b192 a {
    background-color: #CD6839
}

.r193,
r193 a {
    color: #CD661D
}

.b193,
.b193 a {
    background-color: #CD661D
}

.r194,
r194 a {
    color: #C76114
}

.b194,
.b194 a {
    background-color: #C76114
}

.r195,
r195 a {
    color: #CD5B45
}

.b195,
.b195 a {
    background-color: #CD5B45
}

.r196,
r196 a {
    color: #CD4F39
}

.b196,
.b196 a {
    background-color: #CD4F39
}

.r197,
r197 a {
    color: #CD3333
}

.b197,
.b197 a {
    background-color: #CD3333
}

.r198,
r198 a {
    color: #CD2626
}

.b198,
.b198 a {
    background-color: #CD2626
}

.r199,
r199 a {
    color: #CD3700
}

.b199,
.b199 a {
    background-color: #CD3700
}

HTML Random Color View

Random Color HTML

\$\endgroup\$
2
\$\begingroup\$

There is a lot going on here but I will focus on 3 specific problems that I find most glaring in your example, readability, DRY and redundancy.

Readability:

Code should be as easy to read as possible, complexity should be avoided as much as one can. Code that is hard to read is hard to change and we always need to change the code sooner or later.

Naming variables is important, using single character variable names is just confusing.

DRY

Don't repeat yourself. Repetitive coding practises that crams in a lot of duplicate code in multiple places.

Redundancy

Code that is unnecessary

Changes:

  • Rename $a variable to something more appropriate, $data for instance (Readability)
  • Move UpdateStocks::getQuoteParams() into the foreach, remove the $i variable (Redundancy)
  • Remove the $k variable inside the foreach (Redundancy)
  • Inverse the isset/empty condition so you don't need to wrap the whole code segment into it (Readability)
  • Rename the $p variable to $parameters (Readability)
  • Simplify array parameter, use $id in place of $parameter["id"] (Readability)
  • While preg_match is usable, since you only use the first 2 characters in this particular case you can use substr instead, it is easier on the eyes (Readability)
  • Rename $hs variable to something more suitable like $html (Readability)
  • Move up/down code that is repeated in each if/else (DRY)
  • Use $lb instead of $parameter["lb"] (Readability)
  • Remove the $h variable altogether, not necessary (Redundancy)
  • Replace if/elseif/elseif.../else with a switch statement (Readability)
  • Define variables close to where they are used, move $bt to the bottom (Readability)

I made a gif just showing you en example refactoring of your code, it's about 10 minutes.

NOTE: Don't copy the code straight up, it has not been tested, has made up mock data and a few changes to it so I could run it(changed date for example). It is just an example, you have been warned. :-)

https://gifyu.com/image/3nZB

\$\endgroup\$
  • 1
    \$\begingroup\$ No problems, I made a couple of errors in the gif, I didn't properly invert the if (isset..., you need to invert the !empty to empty as well. \$\endgroup\$ – Oli Mar 17 at 20:43
  • 1
    \$\begingroup\$ Glad to help! Just be careful, as I said I have not tested this. \$\endgroup\$ – Oli Mar 17 at 20:58
1
\$\begingroup\$

General pieces of advice that I will apply to your posted code:

  1. Avoid generating single-use variables.
  2. Try to avoid excessively long lines of code.
  3. Avoid repeatedly writing static text in your code
  4. Some brevity in variable naming is okay, but not to the detriment of readability.
  5. Avoid excessive nesting of control structures (e.g. if, foreach, etc) because they increase horizontal scrolling when reading your code.
  6. I have a distaste for switch blocks, but in this case, it is a sensible choice. Abstracting that process into a new method, afford the use of return instead of the usual break so the syntax is slightly more compact.
  7. Try to separate processing from printing (as much as possible).

It seems you don't need to validate the defining character(s) of the $p["id"], you aren't even using the hyphen. For this reason, you don't need to call any functions to extract the first (single-byte) character -- you can use square brace syntax to access a character by its offset (0 in this case).

I'm going to try to maintain some semblance of tabbing within the html elements without making line width suffer too badly. This can be accomplished in a number of ways. I won't be offended if you or anyone else choose to declare the concatenation of $html differently.

I can imagine that $a means array, but it would be better to give it a more descriptive name. Variables like $string, $array, $data, $number are often good candidates for renaming. Scripts often have multiple arrays within them.

If your project actually demands a bit more validation on the leading substring of $p["id"], then try using non-regex tools like substr() before resorting to preg_ functions.

Untested Code:

public static function formatQuoteValue($id, $a_ky) {
    switch ($id[0]) {
        case "s": return $a_ky;
        case "d": return money_format('%=9.4n', (double)$a_ky);
        case "v": return money_format('%=*!#4.0n', (double)$a_ky);
        case "t": return date('l, d F Y \⏱ H:i T \(P \U\T\C\)', (double)$a_ky/1000);
        case "p": return money_format('%=*!#4.4n', (double)$a_ky) . '%';
        default:  return $a_ky . '%';
    }
}

public static function getQuoteHTML($a) {
    $html = '<div class="ro">' .
              '<a href="#"' .
                ' class="s18 ro tx-1 b119 r100 t-21 p-2 br-5 mv-3"' .
                ' onclick="J.s({d:this}); return false;"' .
                ' title="' . $a["symbol"] . ' latest quote">' .
                ' 💹 Quote: ' . date('l, d F Y \⏱ H:i T', microtime(true)) .
              '</a>' .
              '<div class="di-0">' .
                '<div class="p-3">';

    foreach (UpdateStocks::getQuoteParams() as $param) {
        if (!isset($param["id"]) || empty($a[$param["ky"]])) {
            continue;
        }
        $class = 'di-1 t-21 m-1 br-3 p-2 b119 r1' . rand(20,99);
        $html .= '<p id="' . $param["id"] . '">';
        $html .=   '<b class="' . $class . '">' . $param["lb"] . '</b>: ';
        $html .=   '<b class="' . $class . '">' . UpdateStocks::formatQuoteValue($param["id"], $a[$param["ky"]]) . '</b>';
        $html .= '</p>';
    }

    $html .=     '</div>' .
               '</div>' .
             '</div>';

    return $html;
}
\$\endgroup\$

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.