markusjs/lib/markus.js

The framework for creating declarative interfaces based on pixi.js

/*!
 * markusjs - v0.2.0
 * Compiled Sun, 18 Nov 2018 21:16:52 UTC
 *
 * Writed by Andrey Zhevlakov <azbangwtf@ya.ru>
 * markusjs is licensed under the MIT License.
 * http://www.opensource.org/licenses/mit-license
 */
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e(t.markus={})}(this,function(t){"use strict";var e=function(t){void 0===t&&(t="ajax"),this.loadType=t};function i(t){return void 0===t&&(t=function(){return function(){}}()),function(t){function e(e,i){t.call(this,i),this.mark=e.view,this.element=e.element,this.presets=e.presets,this.id=e.id,this.tags=e.tags.slice(0),this.parentElement=e.parent||e.view,this.childList=[],this.ticks=[],this.props=e.props,this._bindToParentNode()}return t&&(e.__proto__=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e,e.prototype._bindToParentNode=function(){this.parentElement.childList.push(this),this instanceof PIXI.DisplayObject&&(this.parentElement instanceof PIXI.DisplayObject?this.parentElement.addChild(this):this.parentElement.stage.addChild(this))},e.prototype.addTag=function(t){-1===this.tags.indexOf(t)&&this.tags.push(t)},e.prototype.removeTag=function(t){var e=this.tags.indexOf(t);-1!==e&&this.tags.splice(e,1)},e.prototype.setProps=function(t){var e=this,i=function(i){if("function"==typeof t[i])t[i].call(e);else if("on"===i&&"object"==typeof t[i]){var n=function(n){e.on(n,function(){e.setProps(t[i][n])})};for(var r in t[i])n(r)}else Array.isArray(e[i])?e[i]=e[i].concat(t[i]):"object"==typeof e[i]&&null!=e[i]&&e[i].set?"object"==typeof t[i]?(e[i].x=t[i].x,e[i].y=t[i].y):e[i].set(t[i]):"object"==typeof e[i]&&null!=e[i]&&"object"==typeof t[i]?Object.assign(e[i],t[i]):e[i]=t[i]};for(var n in t)i(n)},e.prototype.addTick=function(t){this.ticks.push(t)},e.prototype.tick=function(t){for(var e=0;e<this.ticks.length;e++)this.ticks[e](t)},e}(t)}e.prototype.parseMarkfile=function(t){var e=this;return new Promise(function(i){e.imports([t]).then(function(t){var n=t[0].data,r=e.getImports(n);e.imports(r).then(function(t){for(var r=0;r<t.length;r++){if(e.getImports(t[r].data).length)throw Error("Imports are possible only in the entry file.");n=n.replace("import "+t[r].path,t[r].data)}var o=e.parsePresets(n.split("\n"));i(e.generateTree(o))})})})},e.prototype.imports=function(t){for(var e=this,i=[],n=function(n){"ajax"===e.loadType&&i.push(fetch(t[n]).then(function(e){if(404===e.status)throw Error('Markus module "'+t[n]+'" is not found');return e.text()}).then(function(e){return{name:t[n].split("/").slice(-1)[0],path:t[n],data:e}}))},r=0;r<t.length;r++)n(r);return Promise.all(i)},e.prototype.generateTree=function(t){for(var e,i,n,r,o,s=[],h=t.length-1;h>=0;h--)if(0!==t[h].depth){for(var c=h-1;c>=0;c--)if(t[c].depth<t[h].depth){var p=t[c],a=t[h];if("valueNode"===a.type)if("elementNode"===p.type)p.value=a.value+(p.value?"\n"+p.value:"");else{if("propNode"!==p.type)throw Error("valueNode cannot be a child of a "+p.type);!0===p.value&&(p.value=""),p.value=a.value+(p.value?"\n"+p.value:"")}else if("propNode"===a.type)if("propNode"===p.type)"string"==typeof p.value?(p.directory=p.value,p.value=((i={})[p.value]=((e={})[a.name]=a.value,e),i)):p.directory?Object.assign(p.value[p.directory],((n={})[a.name]=a.value,n)):"object"==typeof p.value&&null!=p.value?Object.assign(p.value,((r={})[a.name]=a.value,r)):p.value=((o={value:p.value})[a.name]=a.value,o);else{if("elementNode"!==p.type)throw Error("propNode cannot be a child of a "+p.type);Array.isArray(p.props[a.name])?p.props[a.name].push(a.value):"object"==typeof p.props[a.name]?Object.assign(p.props[a.name],a.value):p.props[a.name]?p.props[a.name]=[p.props[a.name],a.value]:p.props[a.name]=a.value}else if("elementNode"===a.type){if("elementNode"!==p.type)throw Error("elementNode cannot be a child of a "+p.type);p.presets.unshift(a)}break}}else s.push(t[h]);return s},e.prototype.parsePresets=function(t){for(var e=[],i=0;i<t.length;i++){var n=this.parsePreset(t[i]);null!=n&&e.push(n)}return e},e.prototype.parsePreset=function(t){t=this.removeComment(t);var e="elementNode",i=this.getDepth(t),n=this.getAttr(t);if(n)return{type:"propNode",depth:i,name:n[1],value:n[2],typeAttr:n[0]};var r=this.getElement(t),o=this.getTags(t),s=this.getValue(t),h=this.getId(t),c=[];if(null==r)if(o.length||h)r="";else{if(!s)return;e="valueNode"}return"valueNode"!==e&&(c=this.getInlineAttrs(t)),{type:e,element:r,value:s,props:c,tags:o,id:h,depth:i,presets:[]}},e.prototype.parseValue=function(t){return"on"===t||"yes"===t||"true"===t||"off"!==t&&"no"!==t&&"false"!==t&&(/^[-\.\+]?[0-9]+\.?([0-9]+)?$/.test(t)?Number(t):t)},e.prototype.removeComment=function(t){return t.replace(/\/\/.+/,"")},e.prototype.getImports=function(t){return(t.match(/import .+/g)||[]).map(function(t){return t.split(" ")[1]})},e.prototype.getComment=function(t){return(t.match(/\/\/.+/)||[""])[0]},e.prototype.getDepth=function(t){return(t.match(/^[\t ]+/)||[""])[0].length/2},e.prototype.parseQuery=function(t){var e=(t.match(/\.\w+/g)||[]).map(function(t){return t.slice(1)}),i=(t.match(/\#\w+/)||[""])[0].slice(1);return{element:(t.match(/^\w+/)||[])[0],id:i,tags:e}},e.prototype.getElement=function(t){return(t.match(/^[\t ]*(\w+)/)||[])[1]},e.prototype.getTags=function(t){return(t.replace(/\(.+\)/,"").match(/\.\w+/g)||[]).map(function(t){return t.slice(1)})},e.prototype.getId=function(t){return(t.replace(/\(.+\)/,"").match(/#\w+/)||[""])[0].slice(1)},e.prototype.getValue=function(t){return(t.match(/\| *(.+)/)||[])[1]||""},e.prototype.getAttr=function(t){var e=this,i=t.match(/^[\t ]*\@(\w+)\((.+)?\)/);if(i){var n=null!=i[2]?i[2].split(/,\s+/).map(function(t){return e.parseValue(t)}):[];return["method",i[1],function(){this[i[1]].apply(this,n)}]}var r=t.match(/^[\t ]*\@(\w+)(\s(.+))?/);if(r)return["prop",r[1],null==r[3]||this.parseValue(r[3])]},e.prototype.getInlineAttrs=function(t){var e={},i=t.match(/\((.+)\)/g);if(null==i)return{};var n=i[0].split(/,\s+/);for(var r in n)for(var o=n[r].replace("(","").replace(")","").split("="),s=o[0].split("."),h=e,c=0;c<s.length;c++)s[c+1]?h=h[s[c]]={}:h[s[c]]=null==o[1]||this.parseValue(o[1]);return e};var n=function(t){function e(e){var i=this;t.call(this,e,{width:window.innerWidth,height:window.innerHeight,sharedTicker:!1,sharedLoader:!1}),this.resolution=null,this.width=1920,this.height=1080,document.body.appendChild(this.view),document.body.style="padding: 0; margin: 0; overflow: hidden; background: #000;",window.addEventListener("resize",function(){return i._resize(i)})}t&&(e.__proto__=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e;var i={color:{configurable:!0},smooth:{configurable:!0},width:{configurable:!0},height:{configurable:!0}};return i.color.set=function(t){this.renderer.backgroundColor=+t},i.color.get=function(){return this.renderer.backgroundColor},i.smooth.get=function(){return PIXI.settings.SCALE_MODE!==PIXI.SCALE_MODES.NEAREST},i.smooth.set=function(t){PIXI.settings.SCALE_MODE=t?PIXI.SCALE_MODES.LINEAR:PIXI.SCALE_MODES.NEAREST},i.width.set=function(t){this._width=t,this._resize()},i.width.get=function(){return this._width},i.height.set=function(t){this._height=t,this._resize()},i.height.get=function(){return this._height},e.prototype._resize=function(){this.resolution=window.innerWidth/this.width,this.renderer.resize(window.innerWidth,this.height*this.resolution),this.view.style.marginTop=window.innerHeight/2-this.height*this.resolution/2+"px",this.stage.scale.set(this.resolution)},e.prototype.init=function(){this.mark.add(this.presets,this)},Object.defineProperties(e.prototype,i),e}(i(PIXI.Application)),r=function(t){function e(e){for(var i in t.call(this,e),this.props)this.add(i,this.props[i]);this.props={}}return t&&(e.__proto__=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e,e}(i(PIXI.loaders.Loader)),o=function(t){function e(e){t.call(this,e),this.mixins=this.presets}return t&&(e.__proto__=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e,e.prototype.merge=function(t,e){void 0===e&&(e={});for(var i={},n=0;n<this.mixins.length;n++)if(this.mark.isSelectorOfElement(this.mixins[n],t))for(var r in this.mixins[n].props)Array.isArray(e[r])?i[r]=e[r].concat(this.mixins[n].props[r]):i[r]=this.mixins[n].props[r];return Object.assign({},e,i)},e.prototype.set=function(t,e){this.mixins[t]=e},e}(i()),s=function(t){function e(e){for(var i in t.call(this,e),this.props)this.set(i,this.props[i]);this.props={}}return t&&(e.__proto__=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e,e.prototype.set=function(t,e){localStorage.setItem(t,JSON.stringify(e))},e.prototype.get=function(t){return JSON.parse(localStorage.getItem(t))},e}(i()),h=function(t){function e(e){t.call(this,e),this.scenes=this.presets}t&&(e.__proto__=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e;var i={scene:{configurable:!0}};return i.scene.set=function(t){for(var e=0;e<this.scenes.length;e++)this.scenes[e].id===t&&(this._scene&&this.mark.remove(this._scene,this),this._scene=this.mark.add(this.scenes[e],this))},i.scene.get=function(){return this._scene},Object.defineProperties(e.prototype,i),e}(i(PIXI.Container));function c(t){return function(t){function e(e,i){var n=this;t.call(this,e,i),this.app=this.mark.get("app"),this.contentW=this.app.width,this.contentH=this.app.height,this.addTick(function(){return n._computedPosition()})}t&&(e.__proto__=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e;var i={angle:{configurable:!0},w:{configurable:!0},h:{configurable:!0},left:{configurable:!0},right:{configurable:!0},centerX:{configurable:!0},centerXY:{configurable:!0},top:{configurable:!0},bottom:{configurable:!0},centerY:{configurable:!0}};return i.angle.set=function(t){this.rotation=t*PIXI.DEG_TO_RAD},i.angle.get=function(){return this.rotation*PIXI.RAD_TO_DEG},i.w.set=function(t){this.width=t},i.h.set=function(t){this.height=t},i.left.set=function(t){this._right=null,this._centerX=null,this._left=!0===t?0:!1===t?null:t},i.left.get=function(){return this._left},i.right.set=function(t){this._left=null,this._centerX=null,this._right=!0===t?0:!1===t?null:t},i.right.get=function(){return this._right},i.centerX.set=function(t){this._left=null,this._right=null,this._centerX=!0===t?0:!1===t?null:t},i.centerX.get=function(){return this._centerX},i.centerXY.get=function(){return this._centerX===this._centerY?this._centerX:null},i.centerXY.set=function(t){this.centerX=t,this.centerY=t},i.top.set=function(t){this._bottom=null,this._centerY=null,this._top=!0===t?0:!1===t?null:t},i.top.get=function(){return this._top},i.bottom.set=function(t){this._top=null,this._centerY=null,this._bottom=!0===t?0:!1===t?null:t},i.bottom.get=function(){return this._bottom},i.centerY.set=function(t){this._top=null,this._bottom=null,this._centerY=!0===t?0:!1===t?null:t},i.centerY.get=function(){return this._centerY},e.prototype._computedPosition=function(){var t=this.parentElement.contentW||this.app.width,e=this.parentElement.contentH||this.app.height;null!=this.left?this.x=this.left:null!=this.centerX?this.x=t/2+this.centerX:null!=this.right&&(this.x=t-this.right),null!=this.top?this.y=this.top:null!=this.centerY?this.y=e/2+this.centerY:null!=this.bottom&&(this.y=e-this.bottom),this.parentElement.anchor&&(this.x=this.x-t*this.parentElement.anchor.x,this.y=this.y-e*this.parentElement.anchor.y)},Object.defineProperties(e.prototype,i),e}(i(t))}var p=function(t){function e(e){t.call(this,e,PIXI.Texture.WHITE),this.contentW=this.width,this.contentH=this.height,this.mark.add(this.presets,this)}t&&(e.__proto__=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e;var i={src:{configurable:!0}};return i.src.get=function(){return this._src},i.src.set=function(t){null!=t&&(this._src=t,this.texture=PIXI.Texture.fromImage(t))},Object.defineProperties(e.prototype,i),e}(c(PIXI.Sprite)),a={App:n,Resources:r,Mixins:o,Store:s,Scenes:h,Button:function(t){function e(e){var i=this;t.call(this,e),this.toScene=null,this.activeSrc=this.src,this.inactiveSrc=this.src,this.enable=!0,this.on("pointertap",function(){i.toScene&&(i.mark.get("scenes").scene=i.toScene)})}t&&(e.__proto__=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e;var i={enable:{configurable:!0}};return i.enable.set=function(t){this.interactive=t,this.buttonMode=t,this.src=(t?this.activeSrc:this.inactiveSrc)||this.src},i.enable.get=function(){return this.interactive},Object.defineProperties(e.prototype,i),e}(p),Block:function(t){function e(e){var i=this;t.call(this,e),this.inlineItems=!1,this.itemsMarginX=0,this.itemsMarginY=0,this.anchorX=0,this.anchorY=0,this.mark.add(this.presets,this),this.addTick(function(){return i._computedBlock()})}return t&&(e.__proto__=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e,e.prototype._computedBlock=function(){if(this.x=this.x-this.contentW*this.anchorX,this.y=this.y-this.contentH*this.anchorY,this.inlineItems)for(var t=0,e=0,i=0,n=0;n<this.children.length;n++){var r=this.children[n],o=r.anchor?r.anchor.x:r.anchorX,s=r.anchor?r.anchor.y:r.anchorY;r.x=t+r.width*o,t+=r.width+this.itemsMarginX,i=Math.max(i,r.height),t>this.contentW&&(r.x=r.width*o,t=r.width+this.itemsMarginX,e+=i+this.itemsMarginY),r.y=e+r.height*s}},e}(c(PIXI.Container)),Sprite:p,Text:function(t){function e(e){t.call(this,e,e.value)}t&&(e.__proto__=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e;var i={size:{configurable:!0},color:{configurable:!0},font:{configurable:!0}};return i.size.get=function(){return this.style.fontSize},i.size.set=function(t){this.style.fontSize=t},i.color.get=function(){return this.style.fill},i.color.set=function(t){this.style.fill=t},i.font.get=function(){return this.style.fontFamily},i.font.set=function(t){this.style.fontFamily=t},Object.defineProperties(e.prototype,i),e}(c(PIXI.Text))},u={Element:i,Display:c};var l={fullsize:function(t,e,i){"appW"===i[e]?i[e]=t.mark.get("app").width:"appH"===i[e]&&(i[e]=t.mark.get("app").height)},print:function(t,e,i){if("consolelog"===e)return window.console.log(i[e]),!0}};function f(t,e){for(var i=0;i<e.length;i++){for(var n=!1,r=0;r<t.length;r++)if(t[r]===e[i]){n=!0;break}if(!n)return!1}return!0}var d={isSubsetArray:f};var g=function(t,i){var n=this;this.childList=[],this.parser=new e("ajax"),t&&this.parser.parseMarkfile(t).then(function(t){n.add(t),i&&i(n)}),this.ticker=new PIXI.ticker.Ticker,this.ticker.add(function(t){return n.updateElements(t)}),this.ticker.start()};g.prototype.updateElements=function(t,e){void 0===e&&(e=this.childList);for(var i=0;i<e.length;i++)e[i].tick&&e[i].tick(t),this.updateElements(t,e[i].childList)},g.prototype.add=function(t,e){if(void 0===e&&(e=this),!Array.isArray(t))return this.addPreset(t,e);for(var i=[],n=0;n<t.length;n++){var r=t[n];"string"==typeof r&&(r=this.parser.parsePreset(r)),i.push(this.addPreset(r,e))}return i},g.prototype.addPreset=function(t,e){if(void 0===t&&(t={}),void 0===e&&(e=this),"elementNode"!==t.type)throw Error("Preset cannot be activate. His type is not elementNode");var i=t.element.slice(0,1).toUpperCase()+t.element.slice(1),n=a[i]||a[t.element];if(!n)throw Error('Element "'+t.element+'" is not defined');var r=t.props;this.get("mixins")&&(r=this.get("mixins").merge(t,t.props));var o=new n(Object.assign(t,{parent:e,view:this,props:r}));return o.setProps(o.props),o},g.prototype.remove=function(t,e){if(void 0===e&&(e=this),!Array.isArray(t))return this.removeElement(t,t.parentElement);for(var i=[],n=0;n<t.length;n++){var r=t[n];"string"==typeof r&&(r=this.get(r,e)),i.push(this.removeElement(r,r.parentElement))}return i},g.prototype.removeElement=function(t,e){void 0===e&&(e=this);var i=e.childList.indexOf(t);return-1!==i&&(t.onRemove&&t.onRemove(),e.childList.splice(i,1),t instanceof PIXI.DisplayObject&&(e instanceof PIXI.DisplayObject?e.removeChild(t):e.stage.removeChild(t))),t},g.prototype.get=function(t,e){void 0===e&&(e=this);var i=this.parser.parseQuery(t);return this.find(i,e.childList)},g.prototype.getAll=function(t,e){void 0===e&&(e=this);var i=this.parser.parseQuery(t);return this.find(i,e.childList,!0)},g.prototype.find=function(t,e,i){void 0===i&&(i=!1);for(var n=[],r=0;r<e.length;r++){if(this.isSelectorOfElement(t,e[r])){if(!i)return e[r];n.push(e[r])}if(e[r].childList.length){var o=this.find(t,e[r].childList,i);if(!i&&o)return o;n=n.concat(o)}}return i?n:null},g.prototype.isSelectorOfElement=function(t,e){var i=!t.element||t.element===e.element,n=!t.id||t.id===e.id,r=f(e.tags,t.tags);return i&&n&&r},t.Parser=e,t.View=g,t.elements=a,t.propPlugins=l,t.mixins=u,t.utils=d,t.registerElements=function(t){Object.assign(a,t)},t.registerPropPlugins=function(t){Object.assign(l,t)},Object.defineProperty(t,"__esModule",{value:!0})});
//# sourceMappingURL=markus.js.map