Skip to content

Commit

Permalink
Merge pull request #8 from devkimson/0.1.2
Browse files Browse the repository at this point in the history 
0.1.3
  • Loading branch information
@devkimson
devkimson authored Oct 18, 2021
2 parents b0c7e7e + 1062980 commit ff4edb5
Show file tree
Hide file tree
Showing 6 changed files with 123 additions and 61 deletions.
13 changes: 7 additions & 6 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,15 +43,15 @@ If you want to use it as a cdn, you can copy and use the following.

```html
<!-- ... -->
<script src="https://cdn.jsdelivr.net/gh/devkimson/Uniton@0.1.2/assets/js/uniton.js" integrity="sha384-L+M/ngnqh/5GSv5qOsZ+Uvyr/EzuvygadQMH5cVE70uDq/2zgJu4BhsmbVCaxhOK" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/devkimson/Uniton@0.1.2/assets/js/uniton.js" integrity="sha384-L+M/ngnqh/5GSv5qOsZ+Uvyr/EzuvygadQMH5cVE70uDq/2zgJu4BhsmbVCaxhOK" crossorigin="anonymous"></script>
<script>
const uniton = Uniton.init({
// Into Custom Options...
apiDataPath: "apiData.json",
postpath: "_posts",
template: {
privateComponent: true,
}
unitonTemplate: true,
unitonAnchor: false,
unitonComponent: true,
});
</script>
<!-- ... -->
Expand Down Expand Up @@ -101,8 +101,9 @@ Currently available options are apiDataPath, postpath, and privateComponent of t
|---|---|---|---|
|1|apiDataPath|Contains information about the target being operated. If you are creating a blog, you just need to write the blog information.|json file path|
|2|postpath|It is the path of the folder from which the text is to be read. In our example, we entered a path called _posts. All files in the _posts folder are read. (can't read child folder)|posts path name|
|3|template|control templates|-|
| |privateComponent|The use of u-* tags, which are uniton components, is prohibited.|true \| false|
|3|unitonComponent|The use of u-* tags, which are uniton components, is prohibited.|true (default) \| false|
|4|unitonAnchor|Coordinates linking in a "Uniton" way.|true\| false (default)|
|5|unitonTemplate|Set whether to use templates.|true \| false (default)|

### Components Usage

Expand Down
13 changes: 13 additions & 0 deletions UPDATES.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,4 +25,17 @@

*devskimon 2021-10-18 16:07:10*

-----

## Fixed bugs

1. Uniton 앵커방식, 템플릿, 컴포넌트 사용여부 선택 옵션 추가
2. u-if태그 test속성 경고 추가
3. data속성 `uniton-type="body"` 가 없을 때 페이지가 안 뜨는 오류 수정
4. 사용여부 선택 시 오류 발생하는 버그 수정
5. 초기화 방식 변경
6. v0.1.3 릴리즈

*devkimson 2021-10-18 18:46:27*

-----
4 changes: 2 additions & 2 deletions _templates/layout.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,9 +16,9 @@
{#insert _includes/nav.html#}

<!-- Module Page -->
<div data-uniton-type="body">
<!-- <div data-uniton-type="body">
</div>
</div> -->
<!-- Module Page -->

{#insert _includes/footer.html#}
Expand Down
6 changes: 3 additions & 3 deletions assets/js/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ const uniton = Uniton.init({
// Into Custom Options...
apiDataPath: "apiData.json",
postpath: "_posts",
template: {
privateComponent: true,
}
unitonTemplate: true,
unitonAnchor: false,
unitonComponent: true,
});
140 changes: 93 additions & 47 deletions assets/js/uniton.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,11 +20,15 @@ const Uniton = (function () {
moduleOptions = options;
uiElem = ui;
window.addEventListener('load', (ev) => {
options.template.privateComponent ? this.requireComponent(ev) : null;
options.unitonComponent ? this.requireComponent(ev) : null;
this.requestTemplates(ev);
moduleTemplator.requestPageHandler();
if(moduleOptions.unitonAnchor){
moduleTemplator.requestPageHandler();
}
});
uiElem.body.addEventListener('click', this.requestPageHandler);
if(moduleOptions.unitonAnchor){
uiElem.body.addEventListener('click', this.requestPageHandler);
}
}

this.requireComponent = function (ev) {
Expand All @@ -35,7 +39,7 @@ const Uniton = (function () {
moduleTemplator.requestTemplates(ev);
}

this.requestPageHandler = function(ev){
this.requestPageHandler = function (ev) {
moduleTemplator.requestPageHandler(ev);
}
}
Expand All @@ -52,10 +56,10 @@ const Uniton = (function () {
this.requestApiContext(moduleOptions.apiDataPath, true);
}

this.scanLocalFolderPost = function(){
this.scanLocalFolderPost = function () {
const localFile = this.requestLocalFile(moduleOptions.postpath).body.querySelector('#files').children;
let [remove, ...postBundle] = [...localFile];
const postMapping = post=>{
const postMapping = post => {
return {
title: post.title,
href: post.href,
Expand All @@ -64,36 +68,49 @@ const Uniton = (function () {
date: post.date,
}
}
postBundle.forEach(post=>{
let {title, href} = post.children[0];
postBundle.forEach(post => {
let {
title,
href
} = post.children[0];
let [name, size, date] = [...post.children[0].children]
name = name.textContent;
size = size.textContent;
date = date.textContent;
PostList.push(postMapping({title, href, name, size, date}));
PostList.push(postMapping({
title,
href,
name,
size,
date
}));
});
}

this.requestPageHandler = function(ev){
if(!ev){
window.history.pushState({data:1}, '', location.pathname);
this.requestPageHandler = function (ev) {
if (!ev) {
window.history.pushState({
data: 1
}, '', location.pathname);
this.changeViewPage(location.pathname);
} else {
let target = ev.target;
ev.preventDefault();
if(target.tagName !== 'A' || !target.getAttribute("href")) return;
if (target.tagName !== 'A' || !target.getAttribute("href")) return;
let mappingPath = target.href.split(target.host)[1];
window.history.pushState({data:1},'',mappingPath);
window.history.pushState({
data: 1
}, '', mappingPath);
this.changeViewPage(mappingPath);
}
}

this.changeViewPage = function(url){
this.changeViewPage = function (url) {
const home = `${API.baseurl}/home`;
if(url == '/index') url = home;
if(url == '/home') url = home;
if(url == '/') url = home;
if(url == '') url = home;
if (url == '/index') url = home;
if (url == '/home') url = home;
if (url == '/') url = home;
if (url == '') url = home;
const rootpath = `${location.protocol}//${location.host}${API.baseurl}`;
let requestBody = this.requestLocalFile(`${rootpath}/_pages${url}.html`).body.innerHTML;
let parsedElement = this.unitonParser(requestBody);
Expand All @@ -114,7 +131,7 @@ const Uniton = (function () {
documents = dom.parseFromString(xhr.responseText, "text/html");
}
}
}
}
});
xhr.open('get', url, async);
xhr.send();
Expand All @@ -137,7 +154,11 @@ const Uniton = (function () {
}
}
});
xhr.open("get", "_templates/layout.html", false);
let target = "_templates/layout.html";
if(!moduleOptions.unitonTemplate){
target = location.pathname;
}
xhr.open("get", target, false);
xhr.send();
}

Expand All @@ -149,13 +170,13 @@ const Uniton = (function () {
this.drawHeadWithValidate = function (head) {
let parsingHtmlHead = this.parseElementsToString(head.innerHTML);
let parsingElement = this.convertHtmlStringToElements(parsingHtmlHead);
moduleException.drawHeadWithValidate([...parsingElement]);
moduleException.drawHeadWithValidate([...parsingElement], moduleOptions.unitonTemplate);
}

this.drawBodyWithValidate = function (body) {
let parsingHtmlBody = this.parseElementsToString(body.innerHTML);
let parsingElement = this.convertHtmlStringToElements(parsingHtmlBody);
moduleException.drawBodyWithValidate([...parsingElement]);
moduleException.drawBodyWithValidate([...parsingElement], moduleOptions.unitonTemplate);
}

this.parseElementsToString = function (element) {
Expand Down Expand Up @@ -202,7 +223,7 @@ const Uniton = (function () {
const tagNames = ["u-if", "u-for", "u-else", "u-elif"];

this.init = function (view) {

}

this.requireComponent = function (ev) {
Expand Down Expand Up @@ -233,19 +254,19 @@ const Uniton = (function () {
connectedCallback() {
if (this.isConnected) {
if (this.tagName == "U-IF") {
if(this.getAttribute("test").length==0){
console.error('[No Test Regex.')
if (this.getAttribute("test").length == 0) {
console.error('[NoTestDataException] Please enter a value for the "test" attribute.')
} else {
root.unitonIf(this);
}
} else if (this.tagName == "U-FOR") {
if(this.getAttribute("var") && this.getAttribute("target")){
if (this.getAttribute("var") && this.getAttribute("target")) {
root.unitonFor(this);
} else if(!this.getAttribute("var") && !this.getAttribute("target")){
} else if (!this.getAttribute("var") && !this.getAttribute("target")) {
console.error('[NoDataException] Set the variable and target.')
} else if(!this.getAttribute("var")){
} else if (!this.getAttribute("var")) {
console.error('[NoVarDataException] Set the variable.')
} else if(!this.getAttribute("target")){
} else if (!this.getAttribute("target")) {
console.error('[NoTargetDataException] Set the target.')
}
}
Expand Down Expand Up @@ -286,23 +307,28 @@ const Uniton = (function () {
this.type = exceptionType[type];
this.name = this.type.name;
this.message = this.type.message;
this.alertException = function(){
this.alertException = function () {
console.error(`[${this.name}] ${this.message} at ${info}`);
};
}
Exceptions = Exception;
}

this.drawUnitonBody = function(elements){
this.drawUnitonBody = function (elements) {
moduleView.drawUnitonBody(elements);
}

this.drawHeadWithValidate = function (heads) {
moduleView.drawFilteredElementsToHead(heads);
this.drawHeadWithValidate = function (heads, useTemplate) {
moduleView.drawFilteredElementsToHead(heads, useTemplate);
}

this.drawBodyWithValidate = function (elements) {
let filteredElements = elements.filter(elem => elem.nodeValue || elem.innerHTML.indexOf('CDATA') == -1).map(elem => {
this.drawBodyWithValidate = function (elements, useTemplate) {
let filteredElements = elements.filter(x=>{
if(!(x instanceof Text)){
return x;
}
});
filteredElements = filteredElements.filter(elem => elem.nodeValue || elem.innerHTML.indexOf('CDATA') == -1).map(elem => {
if (elem.tagName == 'SCRIPT') {
let s = document.createElement('script');
if (elem.innerHTML.trim() == '') {
Expand All @@ -317,10 +343,10 @@ const Uniton = (function () {
return elem;
}
});
filteredElements = filteredElements.filter(elem=> {
if(elem.nodeValue){
if(elem instanceof Comment){
if(elem.nodeValue.indexOf('live-server')==-1){
filteredElements = filteredElements.filter(elem => {
if (elem.nodeValue) {
if (elem instanceof Comment) {
if (elem.nodeValue.indexOf('live-server') == -1) {
return elem;
}
} else {
Expand All @@ -330,7 +356,7 @@ const Uniton = (function () {
return elem;
}
});
moduleView.drawFilteredElementsToBody(filteredElements);
moduleView.drawFilteredElementsToBody(filteredElements, useTemplate);
}
}

Expand All @@ -341,29 +367,49 @@ const Uniton = (function () {
uiElem = ui;
}

this.drawUnitonBody = function(elements){
uiElem.ubody.innerHTML = '';
uiElem.ubody.append(...elements);
this.drawUnitonBody = function (elements) {
if (uiElem.ubody) {
uiElem.ubody.innerHTML = '';
uiElem.ubody.append(...elements);
}
}

this.drawFilteredElementsToHead = function (elements) {
uiElem.head.prepend(...elements);
}
this.drawFilteredElementsToBody = function (elements) {
this.drawFilteredElementsToBody = function (elements, useTemplate) {
uiElem.body.innerHTML = '';
elements = elements.filter(elem=> {
if(elem.tagName=='SCRIPT'){
if(!elem.src.match(/index.js|uniton.js/gm)){
return elem;
}
} else {
return elem;
}
});
uiElem.body.prepend(...elements);
if(!useTemplate){
uiElem.body.innerHTML += '';
}

uiElem.ubody = document.querySelector('[data-uniton-type="body"]');
uiElem.html.style.display = 'block';
uiElem.html.removeAttribute("style");
}
}

return {
init: function (options) {
!options.hasOwnProperty('unitonTemplate')?options.unitonTemplate = false:null;
!options.hasOwnProperty('unitonComponent')?options.unitonComponent = true:null;
!options.hasOwnProperty('unitonAnchor')?options.unitonAnchor = false:null;

const html = document.querySelector('html');
html.style.display = 'none';
const head = document.head;
const body = document.body;
const ubody = document.querySelector('[data-uniton-type="body"]');

const ui = {
html,
head,
Expand Down
8 changes: 5 additions & 3 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,14 @@
<html lang="ko">

<head>

<meta>
</head>

<body>
<script src="https://cdn.jsdelivr.net/gh/devkimson/Uniton@0.1.2/assets/js/uniton.js" integrity="sha384-L+M/ngnqh/5GSv5qOsZ+Uvyr/EzuvygadQMH5cVE70uDq/2zgJu4BhsmbVCaxhOK" crossorigin="anonymous"></script>
<!-- <script src="assets/js/uniton.js"></script> -->
<u-if test="3>2">
{#API.apiVersion#}
</u-if>
<script src="assets/js/uniton.js"></script>
<script src="assets/js/index.js"></script>
</body>

Expand Down

0 comments on commit ff4edb5

Please sign in to comment.