Search the Community
Showing results for tags 'JS framework'.
-
У меня есть идея сделать bootstrap на JS, который будет кроссмутабельно принимать с backend части приложения и инъекции параметров, без перезагрузки обновляя параметры приложения. Из особенностей закрытый доступ к внутренним методам приложения через строку, минимальное использование Prototype и возможность мутировать в связи с ситуацией согласно командам пользователя и настройке backend. Сжимается в мясо без потери работоспособности сразу 3мя способами. Front-end не призванивается снаружи обычными способами. Базовое приложение очень компактное, остальное инжектируется с backend( методы, функции параметры, контент ... ) через AJAX или Sockets; Работает с любым jQuery и Мутулз ... Пример: (function() { /* base application definition */ var appBase = function( appId ) { // create application index appId = appId || Math.floor( Math.random() * ( 1000 - 1 ) + 1 ); // define self examples properties this.stack = { /* application stack */ methods: [ ], extends: { }, /* init application */ init: function( cfg ) { this.creator( cfg ); this.bootstrap(); }, /* bootstrap */ bootstrap: function() { // unset initialization this.methods.init = null; // new application parameters var param = new Object(); param.app = this.methods, param.opt = this.setup; param.__proto__ = null; // run all init methods for( var i in this.setup.inits ) { this.methods[ this.setup.inits[i] ].apply( param ); }; }, /* methods injector */ creator: function( cfg ) { for( var mtd in cfg ) { var flag = cfg[ mtd ].options[ 1 ] || null, name = cfg[ mtd ].options[ 0 ] + "", func = cfg[ mtd ].func; // push simple methods in stack this.methods[ name ] = func; this.methods[ name ].name = name; // push methods whis timer flags if( flag ) { flag = flag.split('|'); if( flag[0] ) { switch( flag[0] ) { case 'init': this.setup.inits.push( name ); break; case 'defer': this.setup.defer.push( name ); this.setupTimer( [ flag[ 1 ], name, flag[ 2 ] - 0 ] ); break; }; }; }; }; }, /* setup timeout :: [ name, timer|timeout, time ]*/ setupTimer: function( opt ) { var tf = this.setup.timer[ opt[1] ], tt = this.methods[ opt[1] ], tm = opt[ 2 ] || 500; switch( opt[0] ) { case 'interval': tf = setInterval( tt, tm ); break; case 'timeout': tf = setTimeout( tt, tm ); break; }; }, /* flushTimer :: [ id ] */ flushTimer: function( id ) { clearInterval( this.setup.defer[ id ] ); console.log( 'Interval '+ id +' Stoped!'); }, /* base configuration */ setup: { // aplication identificator and parameters appId: 'ZenApp_' + appId, param: [ ], // base application parameters inits: [ ], defer: [ ], timer: [ ], // base application flags flags: { } } }; // clear prototype constructor to // prevent root-places extend this.stack.__proto__ = null; this.__proto__ = null; }; /* new application from pattern */ var application = new appBase(); var app = application.stack; /* * configure base methods * * func: function body * options: [ string, init|defer, time ] * */ var cfg = [ { func: function() { console.log( 'RUN [mtd_1] AT [init stage] => force [mtd_3]' ); this.app['mtd_3'].apply(this); }, options: [ 'mtd_1' , 'init' ] }, { func: function() { console.log( 'RUN [mtd_2] AT [init stage]' ); }, options: [ 'mtd_2' , 'init' ] }, { func: function() { console.log( 'RUN [mtd_3] BY [mtd_1] FROM [init stage]' ); }, options: [ 'mtd_3' ] }, { func: function() { console.log( 'run defered method #1 in timeout' ); }, options: [ 'deferedMethod_1', 'defer|timeout|8500' ] }, { func: function( ) { console.log( 'run defered method #2 in interval' ); }, options: [ 'deferedMethod_2', 'defer|interval|500' ] }, ]; // base methods configuration // first run ? true or null app.init( cfg, true ); })(); Ваши идеи?