Редактирование: FXML

Перейти к: навигация, поиск

Внимание! Вы не авторизовались на сайте. Ваш IP-адрес будет публично видимым, если вы будете вносить любые правки. Если вы войдёте или создадите учётную запись, правки вместо этого будут связаны с вашим именем пользователя, а также у вас появятся другие преимущества.

Правка может быть отменена. Пожалуйста, просмотрите сравнение версий, чтобы убедиться, что это именно те изменения, которые вас интересуют, и нажмите «Записать страницу», чтобы изменения вступили в силу.
Текущая версия Ваш текст
Строка 1: Строка 1:
=='''FXML''' (Fork eXtensible Markup Language) - что такое==
+
'''FXML''' (Fork eXtensible Markup Language) язык разметки документов во Всемирной паутине.  Для навигации по таким страницам не требуется мышь или сенсорный экран. Язык '''FXML''' интерпретируется такими приложениями как ForkPlayer, OTT Player, OTT-play. Полученный в результате интерпретации форматированный текст отображается на экране телевизора.  
Это язык разметки документов во Всемирной паутине.  Для навигации по таким страницам не требуется мышь или сенсорный экран. Язык '''FXML''' интерпретируется такими приложениями как ForkPlayer, OTT Player, OTT-play. Полученный в результате интерпретации форматированный текст отображается на экране телевизора.  
 
  
====Например, следующий код (должен быть валидным JSON):====
+
Например, следующий код (должен быть валидным JSON):
 
  {"title":"COOLTV - портал нового поколения","background-image":"<nowiki>http://cooltv.info/img/tvcool.jpg</nowiki>","typeList":"start","icon":"<nowiki>http://cooltv.info/img/tvcool23.jpg</nowiki>","channels":[{"title":"Вход","logo_30x30":"<nowiki>http://cooltv.info/img/profle22.jpg</nowiki>","playlist_url":"<nowiki>http://cooltv.info/auth</nowiki>"},{"title":"Новости ","logo_30x30":"<nowiki>http://cooltv.info/img/rss-96.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/news</nowiki>"},{"title":"Поиск ","logo_30x30":"<nowiki>http://cooltv.info/img/icons8-search-folder-96.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/media/search.php</nowiki>"},{"title":"Кинозал ","logo_30x30":"<nowiki>http://cooltv.info/img/1icons8-film-reel-96.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/media</nowiki>"},{"title":"AceStream ","logo_30x30":"<nowiki>http://cooltv.info/img/icons8-wave-arrows-96.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/vdt/12</nowiki>"},{"title":"Обменник ","logo_30x30":"<nowiki>http://cooltv.info/img/icons8-next-100.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/media/obmen/</nowiki>"},{"title":"Сервисы ","logo_30x30":"<nowiki>http://cooltv.info/img/icons8s3-96.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/vdt/9</nowiki>"},{"title":"IPTV ","logo_30x30":"<nowiki>http://cooltv.info/img/icons8-hdtv-96.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/vdt/8</nowiki>"},{"title":"Мультимедиа ","logo_30x30":"<nowiki>http://cooltv.info/img/icons8-documentary-96.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/vdt/7</nowiki>"},{"title":"Чат ","logo_30x30":"<nowiki>http://cooltv.info/img/icons8-chat-96.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/guest</nowiki>"},{"title":"FAQ ","logo_30x30":"<nowiki>http://cooltv.info/img/icons8-info-popup-96.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/faq/</nowiki>"},{"title":"Копилка","logo_30x30":"<nowiki>http://cooltv.info/img/icons8-bad-piggies-96.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/copilka</nowiki>"}]}
 
  {"title":"COOLTV - портал нового поколения","background-image":"<nowiki>http://cooltv.info/img/tvcool.jpg</nowiki>","typeList":"start","icon":"<nowiki>http://cooltv.info/img/tvcool23.jpg</nowiki>","channels":[{"title":"Вход","logo_30x30":"<nowiki>http://cooltv.info/img/profle22.jpg</nowiki>","playlist_url":"<nowiki>http://cooltv.info/auth</nowiki>"},{"title":"Новости ","logo_30x30":"<nowiki>http://cooltv.info/img/rss-96.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/news</nowiki>"},{"title":"Поиск ","logo_30x30":"<nowiki>http://cooltv.info/img/icons8-search-folder-96.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/media/search.php</nowiki>"},{"title":"Кинозал ","logo_30x30":"<nowiki>http://cooltv.info/img/1icons8-film-reel-96.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/media</nowiki>"},{"title":"AceStream ","logo_30x30":"<nowiki>http://cooltv.info/img/icons8-wave-arrows-96.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/vdt/12</nowiki>"},{"title":"Обменник ","logo_30x30":"<nowiki>http://cooltv.info/img/icons8-next-100.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/media/obmen/</nowiki>"},{"title":"Сервисы ","logo_30x30":"<nowiki>http://cooltv.info/img/icons8s3-96.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/vdt/9</nowiki>"},{"title":"IPTV ","logo_30x30":"<nowiki>http://cooltv.info/img/icons8-hdtv-96.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/vdt/8</nowiki>"},{"title":"Мультимедиа ","logo_30x30":"<nowiki>http://cooltv.info/img/icons8-documentary-96.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/vdt/7</nowiki>"},{"title":"Чат ","logo_30x30":"<nowiki>http://cooltv.info/img/icons8-chat-96.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/guest</nowiki>"},{"title":"FAQ ","logo_30x30":"<nowiki>http://cooltv.info/img/icons8-info-popup-96.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/faq/</nowiki>"},{"title":"Копилка","logo_30x30":"<nowiki>http://cooltv.info/img/icons8-bad-piggies-96.png</nowiki>","playlist_url":"<nowiki>http://cooltv.info/copilka</nowiki>"}]}
 
даст такой результат (в ForkPlayer):
 
даст такой результат (в ForkPlayer):
Строка 12: Строка 11:
 
https://github.com/vengo634/kino.pub_forkplayerPHP/blob/master/index.php
 
https://github.com/vengo634/kino.pub_forkplayerPHP/blob/master/index.php
  
====Смотреть Исходный код любой страницы можно непосредственно в ForkPlayer====
+
Смотреть Исходный код любой страницы можно непосредственно в ForkPlayer
 
[[Файл:VmGe53a9.png|мини|без]]
 
[[Файл:VmGe53a9.png|мини|без]]
  
Строка 36: Строка 35:
  
 
==Глобальные теги==
 
==Глобальные теги==
$_PL["css"]="start"; // Плиточный + другой(с использованием $_CH["position"] ) виды страницы
+
$_PL["typeList"]="start"; // Плиточный + другой(с использованием $_CH["position"] ) виды страницы
  
 
====Стили сайта по умолчанию====
 
====Стили сайта по умолчанию====
Строка 47: Строка 46:
 
<div class="mw-collapsible-content">
 
<div class="mw-collapsible-content">
  
::-webkit-scrollbar-button:single-button {
+
.start {
    background-color: #bbbbbb;
+
 
    display: block;
+
position: relative;
    border-style: solid;
+
 
    height: 10px;
+
border: 0px;
    width: 10px;
+
 
}
+
text-align: center;
 +
 
 +
display: inline-block;
 +
 
 +
overflow: hidden;
  
::-webkit-scrollbar-button:single-button:vertical:decrement {
+
text-align: center;
    border-width: 5px;
 
    border-color: transparent transparent #555555;
 
}
 
  
::-webkit-scrollbar-button:single-button:vertical:increment {
+
margin-left: 4px;
    border-width: 5px;
 
    border-color: #555555 transparent transparent transparent;
 
}
 
  
::-webkit-scrollbar {
+
margin-top: 1px;
    width: 10px;
 
}
 
  
::-webkit-scrollbar-track {
+
height: 101px;
    background: #ddd;
 
}
 
  
::-webkit-scrollbar-thumb {
+
width: 10%;
    background: #888;
 
}
 
  
::-webkit-scrollbar-thumb:hover {
 
    background: #777;
 
 
}
 
}
  
.start {
 
    position: relative;
 
    border: 0px;
 
    text-align: center;
 
    display: inline-block;
 
    ;
 
    overflow: hidden;
 
    text-align: center;
 
    margin-left: 4px;
 
    margin-top: 1px;
 
    height: 10px;
 
    width: 10%;
 
}
 
  
 
.start .rating {
 
.start .rating {
    position: absolute;
+
 
    display: none;
+
position: absolute;
    text-align: left;
+
 
    height: 23px;
+
display: none;
    width: 28px;
+
 
    padding-top: 5px;
+
text-align: left;
    padding-left: 5px;
+
 
    font-size: 11px;
+
height: 23px;
 +
 
 +
width: 28px;
 +
 
 +
padding-top: 5px;
 +
 
 +
padding-left: 5px;
 +
 
 +
font-size: 11px;
 +
 
 
}
 
}
 +
  
 
.start .icon {
 
.start .icon {
    padding: 2px 2px 0px 2px;
+
 
    height: 76%;
+
padding: 2px 2px 0px 2px;
 +
 
 +
height: 76%;
 +
 
 
}
 
}
 +
  
 
.start .name {
 
.start .name {
    font-size: 17px;
+
 
    line-height: 0.9;
+
font-size: 17px;
    position: absolute;
+
 
    bottom: 0px;
+
line-height: 0.9;
    width: 100%;
+
 
    max-height: 50%;
+
position: absolute;
 +
 
 +
bottom: 0px;
 +
 
 +
width: 100%;
 +
 
 +
max-height: 50%;
 +
 
 
}
 
}
 +
  
 
.start .title {
 
.start .title {
    background: rgba(0, 0, 0, 0.65);
+
 
    border-radius: 3px;
+
background: rgba(0, 0, 0, 0.65);
    width: auto;
+
 
    display: display: inline-block;
+
border-radius: 3px;
    margin: 2px;
+
 
    padding: 1px 4px 4px 4px;
+
width: auto;
 +
 
 +
display: inline-block;
 +
 
 +
margin: 2px;
 +
 
 +
padding: 1px 4px 4px 4px;
 +
 
 
}
 
}
 +
  
 
.start .side_icon {
 
.start .side_icon {
    position: relative;
+
 
    padding: 2px;
+
position: relative;
 +
 
 +
padding: 2px;
 +
 
 
}
 
}
 +
  
 
.list {
 
.list {
    text-align: left;
+
 
    border-radius: 4px 0px 0px 4px;
+
text-align: left;
    cursor: default;
+
 
    margin: 2px 0px;
+
border-radius: 4px 0px 0px 4px;
    width: 48.87708333333334%;
+
 
    height: 35px;
+
cursor: default;
 +
 
 +
margin: 2px 0px;
 +
 
 +
width: 47.965625%;
 +
 
 +
height: 35px;
 +
 
 
}
 
}
 +
  
 
.list .contmenu {
 
.list .contmenu {
    position: relative;
+
 
    float: right;
+
position: relative;
    display: none;
+
 
 +
float: right;
 +
 
 +
display: none;
 +
 
 
}
 
}
 +
  
 
.list .numb {
 
.list .numb {
    float: left;
 
    padding-top: 2px;
 
    font-size: 60%;
 
    min-width: 38px;
 
    text-align: center;
 
}
 
  
.list .icon {
+
float: left;
    margin: 0px 2px;
+
 
    padding-right: 2px;
+
padding-top: 2px;
    float: left;
+
 
}
+
font-size: 60%;
  
.list .title {
+
min-width: 38px;
    display: inline-block;
 
    float: left;
 
    position: relative;
 
    white-space: nowrap;
 
}
 
  
.listsearch {
+
text-align: center;
    background-color: #ddd;
 
    color: #333;
 
    overflow: hidden;
 
    border-radius: 4px;
 
    padding: 3px;
 
    margin-top: 2px;
 
    font-size: 85%;
 
    width: 90%;
 
    height: 68%;
 
}
 
  
.infolinktitle {
 
    height: 63%;
 
    font-size: 80%;
 
    overflow: hidden;
 
 
}
 
}
  
.infolink {
 
    padding-left: 3px;
 
    font-size: 11px;
 
}
 
  
 
.default .contmenu {
 
.default .contmenu {
    display: none;
+
 
 +
display: none;
 +
 
 
}
 
}
 +
  
 
.selected .contmenu {
 
.selected .contmenu {
    display: block;
+
 
 +
display: block;
 +
 
 
}
 
}
 +
  
 
.html {
 
.html {
    position: relative;
+
 
    display: inline-block;
+
position: relative;
    vertical-align: top;
+
 
 +
display: inline-block;
 +
 
 +
vertical-align: top;
 +
 
 
}
 
}
 +
  
 
.hlink {
 
.hlink {
    position: relative;
+
 
    border: 0px solid transparent;
+
position: relative;
    margin: 0px 4px;
+
 
    border-radius: 4px;
+
border: 0px solid transparent;
    display: inline-block;
+
 
    overflow: hidden;
+
margin: 0px 4px;
 +
 
 +
border-radius: 4px;
 +
 
 +
display: inline-block;
 +
 
 +
overflow: hidden;
 +
 
 
}
 
}
 +
  
 
.hlink .title {
 
.hlink .title {
    overflow: hidden;
+
 
    max-width: 310px;
+
overflow: hidden;
    font-size: 90%;
+
 
    padding: 0px 4px;
+
max-width: 310px;
    float: left;
+
 
    height: 28px;
+
font-size: 90%;
    text-decoration: underline;
+
 
 +
padding: 0px 4px;
 +
 
 +
float: left;
 +
 
 +
height: 28px;
 +
 
 +
text-decoration: underline;
 +
 
 
}
 
}
 +
  
 
.hlink .icon {
 
.hlink .icon {
    float: left;
+
 
    height: 22px;
+
float: left;
    padding-top: 5px;
+
 
 +
height: 22px;
 +
 
 +
padding-top: 5px;
 +
 
 
}
 
}
 +
  
 
.fulleditline {
 
.fulleditline {
    border: 1px solid transparent;
+
 
    width: 80%;
+
border: 1px solid transparent;
    margin: 1px 9%;
+
 
    border-radius: 4px;
+
width: 80%;
    display: inline-block;
+
 
    overflow: hidden;
+
margin: 1px 9%;
 +
 
 +
border-radius: 4px;
 +
 
 +
display: inline-block;
 +
 
 +
overflow: hidden;
 +
 
 
}
 
}
 +
  
 
.fulleditline .title {
 
.fulleditline .title {
    overflow: hidden;
+
 
    font-size: 24px;
+
overflow: hidden;
    height: 24px;
+
 
    margin: 3px;
+
font-size: 24px;
    color: #2b2525;
+
 
    background-color: #eee;
+
height: 24px;
    padding: 4px;
+
 
 +
margin: 3px;
 +
 
 +
color: #2b2525;
 +
 
 +
background-color: #eee;
 +
 
 +
padding: 4px;
 +
 
 
}
 
}
 +
  
 
.fulleditline .icon {
 
.fulleditline .icon {
    float: right;
+
 
    height: 22px;
+
float: right;
    padding-top: 2px;
+
 
 +
height: 22px;
 +
 
 +
padding-top: 2px;
 +
 
 
}
 
}
 +
  
 
.label {
 
.label {
    position: relative;
+
 
    text-align: left;
+
position: relative;
    border-radius: 4px;
+
 
    margin: -2px 4%;
+
text-align: left;
    font-size: 80%;
+
 
    width: 92%;
+
border-radius: 4px;
    display: inline-block;
+
 
    overflow: hidden;
+
margin: -2px 4%;
    height: 26px;
+
 
 +
font-size: 80%;
 +
 
 +
width: 92%;
 +
 
 +
display: inline-block;
 +
 
 +
overflow: hidden;
 +
 
 +
height: 26px;
 +
 
 
}
 
}
 +
  
 
.label .icon {
 
.label .icon {
    float: left;
+
 
    height: 20px;
+
float: left;
 +
 
 +
height: 20px;
 +
 
 
}
 
}
 +
  
 
.default {
 
.default {
    background: none;
+
 
 +
background: none;
 +
 
 
}
 
}
 +
  
 
.selected {
 
.selected {
    background: rgba(180, 180, 180, 0.7);
+
 
 +
background: rgba(180, 180, 180, 0.7);
 +
 
 
}
 
}
 +
  
 
.listselected {
 
.listselected {
    color: black;
+
 
 +
color: black;
 +
 
 
}
 
}
  
.site {
 
    height: 100%;
 
    width: 100%;
 
    overflow-y: auto;
 
    overflow-x: hidden;
 
    font-size: 27px;
 
}
 
  
body {
+
.rightHalf {
    color: rgb(238, 238, 238);
+
 
    margin: 0px;
+
position: absolute;
    padding: 0px;
+
 
    height: 100%;
+
height: 95%;
    width: 100%;
+
 
    overflow: hidden;
+
overflow-x: hidden;
    background-color: transparent;
+
 
}
+
overflow-y: auto;
 +
 
 +
display: none;
 +
 
 +
font-size: 28px;
 +
 
 +
left: 51%;
 +
 
 +
width: 47.5%;
 +
 
 +
word-break: break-word;
  
small {
+
top: 77px;
    font-size: 70%;
 
    color: gray;
 
}
 
  
.buttons {
 
    position: fixed;
 
    top: 80%;
 
    left: 50%;
 
    width: 47%;
 
    margin: 2px;
 
    display: none;
 
    padding: 0px 3px 0px 3px;
 
    color: #cccccc;
 
    font-size: 80%;
 
}
 
\#description {
 
    top: 0px;
 
    position: fixed;
 
    margin: 2px;
 
    overflow-x: hidden;
 
    overflow-y: auto;
 
    display: none;
 
    padding: 0px 3px 0px 3px;
 
    font-size: 28px;
 
    left: 51%;
 
    width: 47.2%;
 
    word-break: break-word;
 
 
}
 
}
  
Строка 342: Строка 391:
  
 
====#content - стиль страницы (без description)====
 
====#content - стиль страницы (без description)====
$_PL["css"]
+
$_PL["css"]="#content {font-size:25px;}"; // Установим размер шрифта
  
 
====#rightHalf- стиль description====
 
====#rightHalf- стиль description====
$_PL["css"]="#content {font-size:25px;}  #rightHalf{font-size:10 px;} "; // Установим размер шрифта сайта и описания
+
$_PL["css"]="#content {font-size:25px;}  #rightHalf{font-size:27 px;} "; // Установим размер шрифта сайта и описания
  
 
====.selected - стиль при выделении элемента====
 
====.selected - стиль при выделении элемента====
Строка 351: Строка 400:
  
 
====.default - стиль невыделенного элемента====
 
====.default - стиль невыделенного элемента====
$_PL["css"]=" .default{  color: gray; } ";
+
$_PL["css"]=" .default{  color: gray; } ";  
  
 
====.contmenu - визуальная кнопка контекстного меню====
 
====.contmenu - визуальная кнопка контекстного меню====
Строка 502: Строка 551:
 
Элементы будут выстраиваться в ряд и навигация по ним будет предполагать что они в одном ряду
 
Элементы будут выстраиваться в ряд и навигация по ним будет предполагать что они в одном ряду
  
=====$_CH["br"]=====
+
=====В месте где навигация должна перейти на новую строку задайте $_CH["br"]=1;=====
В месте где навигация должна перейти на новую строку задайте $_CH["br"]=1; При этом в before будет добавлено значение <nowiki><br clear=both></nowiki>
+
<br />
  
 
====$_CH["position"]="fulleditline"; //- Поле ввода текста шириной почти на всю страницу====
 
====$_CH["position"]="fulleditline"; //- Поле ввода текста шириной почти на всю страницу====
Строка 652: Строка 701:
 
Для правильной навигации по странице нужно знать когда у вас там новая строка. Для этого в элементе с которого нужно чтоб начиналась новая строка присваиваем  
 
Для правильной навигации по странице нужно знать когда у вас там новая строка. Для этого в элементе с которого нужно чтоб начиналась новая строка присваиваем  
 
  $_CH["br"]=1;// Этот элемент разместится уже на новой строке
 
  $_CH["br"]=1;// Этот элемент разместится уже на новой строке
 
==Горизонтальная прокрутка==
 
Задаем nowrap только для первого (обзначается br=1) элемента блока горизонтальной прокрутки
 
 
$_CH=["br"=>1,"nowrap"=1,"title"=>"Первый элемент горизонтального блока прокрутки"];
 
 
$_CH=["title"=>"Второй элемент горизонтального блока прокрутки"];
 
 
$_CH=["title"=>"Третий элемент горизонтального блока прокрутки"];
 
 
...
 
 
$_CH=["title"=>"Последний элемент горизонтального блока прокрутки"];
 
 
$_CH=["br"=>1,"title"=>"Новый элемент с новой строки"];
 
  
 
==Вывод результирующей страницы (на PHP)==
 
==Вывод результирующей страницы (на PHP)==

Обратите внимание, что все добавления и изменения текста статьи рассматриваются как выпущенные на условиях лицензии Creative Commons Zero (общественное достояние) (см. Браузер Fork - Wiki:Авторские права). Если вы не хотите, чтобы ваши тексты свободно распространялись и редактировались любым желающим, не помещайте их сюда.
Вы также подтверждаете, что являетесь автором вносимых дополнений или скопировали их из источника, допускающего свободное распространение и изменение своего содержимого.
НЕ РАЗМЕЩАЙТЕ БЕЗ РАЗРЕШЕНИЯ МАТЕРИАЛЫ, ОХРАНЯЕМЫЕ АВТОРСКИМ ПРАВОМ!

Источник — «http://forkplayer.tv/wiki/FXML»