Construct function addPage cuts everything after first letter in foreach

StackOverflow https://stackoverflow.com/questions/19597089

Question

I am working on a new UI class and i have stumbled upon a wierd issue where the script cuts off everything after the first letter. Let me show you my code.

class UI {


    // legger CSS-fil til <head>
    public function addCSS($css_file) {
        $this->css[] = array($css_file);
    }

    // legger javaScript-fil til <head>
    public function addJS($js_file) {
        $this->js[] = $js_file;
    }

    // legger sider til <body>
    public function addPage($php_file) {
        $this->php[] = $php_file;
    }

    // Funksjon for add
    public function __construct() {
        // CSS
        $this->addCSS('bootstrap.css');
        $this->addCSS('style.css');

        // JS
        $this->addJS('jquery.js');
        $this->addJS('bootstrap.js');
        $this->addJS('functions.js');

        // Sider
        $this->addPage('home.php');
        $this->addPage('about.php');
    }


    // Struktur for header
    public function getHeader() {
        $html = '<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta keywords="">
    <meta name="author" content="">';

        // Legger inn CSS
        foreach ($this->css as $css) {
            $html .= '
    <link rel="stylesheet" type="text/css" href="css/' . $css[0] . '" />';
        }
    $html .= '
    <title>www.Dan-Levi.no</title>
    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="js/html5shiv.js"></script>
      <script src="js/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>';
  return $html;
    }


    // Struktur for navigasjonen festet til bunn av siden
    public function getNav() {
        $html = '

    <div class="navbar navbar-inverse navbar-fixed-bottom">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
            </div>
            <div class="navbar-collapse collapse">
                <ul class="nav navbar-nav">
                    <li class="active"><a href="#">Home</a></li>
                    <li><a href="#about">About</a></li>
                    <li><a href="#contact">Contact</a></li>
                    <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Other stuff <b class="caret"></b></a>
                    <ul class="dropdown-menu">
                        <li><a href="#">Lorem</a></li>
                        <li><a href="#">Ipsum</a></li>
                        <li><a href="#">Dolor</a></li>
                        <li class="divider"></li>
                        <li class="dropdown-header">Social</li>
                        <li><a href="#">Lorem</a></li>
                        <li><a href="#">Ipsum</a></li>
                        <li><a href="#">Dolor</a></li>
                    </ul>
                    </li>
                </ul>
                <span class="navbar-brand pull-right"><small>&copy; '; $html .= date('Y') ; $html .= ' '. htmlentities('Tømta') .' Data Service</small></span>
            </div><!--/.navbar-collapse -->
        </div>
    </div><!--/.navbar -->';
        return $html;
    }


    // Struktur for siden
    public function getContent() {

        // Legger inn Sider
        foreach ($this->php as $php) {
            include 'pages/'.$php;
        }

    }


    // Struktur for footer
    public function getFooter() {

        // Legger inn javaScript
        foreach ($this->js as $js) {
            $html = '
    <script type="text/javascript" src="js/' . $js[0] . '" ></script>';
        }

        $html .= '

  </body>
</html>';
    return $html;
    }


    // Printer ut sideheader
    public function printHeader() {
        print $this->getHeader();
    }

    // printer ut navigasjonen
    public function printNav() {
        print $this->getNav();
    }

    // printer ut sideinnhold
    public function printContent() {
        print $this->getContent();
    }

    // printer ut sidefooter
    public function printFooter() {
        print $this->getFooter();
    }

}

The addCSS and addPage functions works as intended, but the addJS cuts of everything and only returns the first letter of this: $this->addJS('functions.js');

The end of the page source looks like this:

    <div class="jumbotron">
        <div class="container">
            <h1>Test!</h1>
            <p>Tootsie roll chocolate liquorice jelly. Chocolate cake liquorice cake pie dragée caramels liquorice wafer topping. Lemon drops cotton candy bear claw pudding icing. Chupa chups oat cake candy.</p>
            <p><a class="btn btn-primary btn-lg">Sweet muffin cookie &raquo;</a></p>
        </div>
    </div>



    <script type="text/javascript" src="js/f" ></script>



  </body>
</html>

Any ideas why this is happening? I have tried some trial and error and read some, can't get my head around this one.

Any help is much appreciated.

Was it helpful?

Solution

I rewrote the code and it works now as intended:

// Adds javaScript to <head>
    public function addJavaScript($javascript_file) {
        $this->javascript[] = $javascript_file;
    }

    // Construct
    public function __construct() {
        // JS
        $this->addJavaScript('jquery.js');
        $this->addJavaScript('bootstrap.js');
        $this->addJavaScript('functions.js');

    }

// Adds javaScript (Put this in head)
        foreach ($this->javascript as $js_file) {
            $html .= '
    <script src="js/' . $js_file . '"></script>';
        }
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top