Lesson 14

Connecting GUI and IO

A purpose of today's lesson is to create your own application to program websites.

Browser's engine

Program which changes site's code to components/graphical elements.

It is an independent part of a browser.

Purpose

WebKit (independent engine) is used by Google Chrome, Chromium, Safari etc.

Hints:
  • In order to support old applications written for not supporting browsers, we can pack them into JavaFX.
  • Many interfaces are created and will be created in Web technology, so it is worth it to have something in common with that area.
  • One can write its own browser.

I. Work on browser's engine


Task 0

Import source code, next go to Controller class.

Modify a code for goToPJATK() method so the engine loads homepage of Academy's website.

Download source code
Task 1

Fill dectectBrowser() method body up according to the hint.

Interpret information about the engine.

Task 2

Fill renderMyCode() method body up.

It takes content from a text area on the left and put it in browser's engine on the right.

Personal IDE to write websites with a preview.

II. Input / Output handling


It is not optimal but effective way to read small files:


import java.io.IOException;
import java.nio.charset.StandardCharsets;
import java.nio.file.Files;
import java.nio.file.Paths;
import java.nio.file.StandardOpenOption;

class IOHelper {

    /**
      * Reads file's content
      * @param filePath File's name / path
      * @return File content
      * @throws IOException If a file cannot be reached
      */
    public static String readFromFile(String filePath) throws IOException {
        return new String(Files.readAllBytes(Paths.get(filePath)), StandardCharsets.UTF_8);
    }

    /**
      * Saves to a file
      * @param filePath File's name / path
      * @param content Content to save
      * @throws IOException If a file cannot be saved
      */
    public static void writeToFile(String filePath, String content) throws IOException  {
        Files.write(Paths.get(filePath), content.getBytes(), StandardOpenOption.CREATE);
    }

}
Task 3

Fill saveToFile() method body up.

Save a content of a text area in a "website.html" file.

Task 4

Fill loadFromFile() method body up.

Opposite procedure to the one in task 3.

Example html to play with


<!DOCTYPE HTML>
<html>

<head>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.1/css/bulma.css">
</head>

<body class="container content">

    <h1>My header</h1>

    <ul>
        <li>list's element 0</li>
        <li>list's element 1</li>
        <li>list's element 2</li>
        <li>list's element 3</li>
    

    <a href="https://pja.edu.pl">Link to PJATK website/>

</body>
</html>