- Регистрация
- 18 Фев 2015
- Сообщения
- 542
- Лучшие ответы
- 0
- Репутация
- 106
Привет, сегодня я покажу вам как выводить HTML страничку по нажатию на "TAB". (CSS, JavaScript также может использоваться).
CSS/JS Будут рассмотрены в следующих уроках.
Давайте начнем.
Создайте папку «ui» в каталоге «packages / keker» (она будет содержать файлы клиента) и файл «web.js» и объявите ее в «packages / keker / index.js», добавив строку:
Сначала откройте файл index.js (По пути: server \ packages \ keker) и добавьте следующую строку:
PHP:
require ('./web');
Создайте файл "web.js" в корневой папке, где находится файл "index.js"
Пропишите эти строки в файле "web.js":
PHP:
const http = require('http');
const fs = require('fs');
const path = require('path');
const url = require('url');
const OpenType = { // Типы поддерживаемых файлов
'.ico': 'image/x-icon',
'.html': 'text/html',
'.js': 'text/javascript',
'.json': 'application/json',
'.css': 'text/css',
'.png': 'image/png',
'.jpg': 'image/jpeg',
'.wav': 'audio/wav',
'.mp3': 'audio/mpeg',
'.svg': 'image/svg+xml',
'.pdf': 'application/pdf',
'.doc': 'application/msword',
'.eot': 'appliaction/vnd.ms-fontobject',
'.ttf': 'aplication/font-sfnt'
};
http.createServer(function (req, res) {
res.setHeader('Access-Control-Allow-Origin', '*'); // Разрешение на междоменные запросы.
let parsedUrl = url.parse(req.url); // чистим URL от мусора (парсим)
let filePath = __dirname+'/ui' + parsedUrl.pathname;
let ext = path.extname(filePath); // Получаем расширение файлов со страницы
fs.readFile(filePath, function(error, content) {
if (error) {
if(error.code == 'ENOENT'){ // Если нет файла то
res.writeHead(404, { 'Content-Type': 'text/plain' }); // Выводим ошибку
res.end('404 Not Found');
}
else { // Если не 404 то выводим соответствующий ошибке кодовый номер
res.writeHead(500);
res.end('Error: '+error.code+' ..\n');
}
}
else {
res.writeHead(200, { 'Content-Type': OpenType[ext] || 'text/plain' });
res.end(content, 'utf-8');
}
});
}).listen(8080); // Вешаем страничку на свободный порт "8080"
Создаем простую страничку с именем "test.html" в папку "ui. (или ваше название)":
PHP:
<div style = "background: black;">TyT ProSTo PySTo!</div>
PHP:
const addr = "http://127.0.0.1:8080/"; // Здесь мы должны указать адрес вашего сервера и порт, на котором висит страничка (указывали выше.)
var pl_enable = false; // Мы собираемся использовать это, чтобы проверить, отображается ли наш HTML-код или нет.
/*
*** Используйте это, если вы хотите добавить CSS (замените main.css на ваш файл css) ***
var css_el = document.createElement("link");
css_el.rel = "stylesheet";
css_el.href = addr+"main.css";
$("head").append(css_el);
*/
$.get( addr+"test.html", function( data ) { // Загрузите HTML с помощью AJAX
$("body").append( data ); // помещаем элемент в тело странички
});
$("body").keydown(function( e ) { // В этом примере я буду скрывать / показывать страницу, когда пользователь нажимает TAB
if(e.which == 9){ // 9 - Номер клавиши "TAB" (В шапке раздела есть тема с обозначением клавишь)
if(pl_enable) {
pl_enable = false;
$(".myDiv").hide(); // Скрыть div, который мы создали в файле HTML
} else {
pl_enable = true;
$(".myDiv").show(); // Показать div, который мы создали в файле HTML.
}
// если вы хотите показать курсор, раскомментируйте эту строку:
// mp.invoke("focus", pl_enable);
}
});
PHP:
player.outputChatBox("<script src='http://127.0.0.1:8080/main.js'></script>");
Последнее редактирование: