Socket
Socket
Sign inDemoInstall

mvc-pack

Package Overview
Dependencies
0
Maintainers
1
Versions
11
Alerts
File Explorer

Advanced tools

npm Scripts
License

Install Socket

Detect and block malicious and high-risk dependencies

Install

Comparing version 1.0.0 to 2.0.0

268

dest/mvc-pack.amd.js
/**
* mvc-pack v1.0.0
* Copyright (c) 2016-2020 Valerii Zinchenko
* mvc-pack v2.0.0
* Copyright (c) 2016-2022 Valerii Zinchenko
* License: MIT https://gitlab.com/valerii-zinchenko/mvc-pack/-/blob/master/LICENSE.txt

@@ -9,6 +9,6 @@ * All source files are available at: https://gitlab.com/valerii-zinchenko/mvc-pack

(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('class-wrapper')) :
typeof define === 'function' && define.amd ? define(['class-wrapper'], factory) :
(global = global || self, global['mvc-pack'] = factory(global['class-wrapper']));
}(this, (function (classWrapper) { 'use strict';
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
typeof define === 'function' && define.amd ? define(['exports'], factory) :
(global = global || self, factory(global['mvc-pack'] = {}));
}(this, (function (exports) { 'use strict';

@@ -22,2 +22,3 @@ /*

const _register = new WeakMap();

@@ -28,3 +29,3 @@ /**

* @example <caption>Basic usage with standard views and controllers</caption>
* const pack = mvcPack(
* mvcPack(
* SomeModelClass,

@@ -37,3 +38,3 @@ * {

* const model = new SomeModelClass();
* console.log(pack.getView(model, 'tabe') instanceof TableView); // -> true
* console.log(getView(model, 'table') instanceof TableView); // -> true
*

@@ -50,26 +51,30 @@ * @example <caption>Creating an MVC pack with non-standard view constructor</caption>

*
* @see {@link vcPack}
* @see {@link vcPack} {@link getView}
*
* @param {class} Model - A model class.
* @param {Object} VCPacks - A key-value paire of View-Controller packs. They can be created with help of {@link vcPack} or a custom creator function can be provided.
* @return {getView} An automated function to create an MVC pack. All input arguments passed here are directly passed into a model constructor.
* @param {Object} VCPacks - A key-value pair of View-Controller packs. They can be created with help of {@link vcPack} or a custom creator function can be provided.
*/
function mvcPack(Model, VCPacks) {
/**
* Get a specific view.
*
* @throws {Error} The class of the provided model does not belogs to the package
*
* @param {Object} model - An instance of the model, for what a specific view is needed.
* @param {String} name - View name (a key in a provided VCPacks object).
* @return {Object | null} A new view or null if a key is not found.
*/
return function createView(model, name) {
if (!(model instanceof Model)) {
throw new Error('The class of the provided model does not belogs to the package');
}
_register.set(Model, VCPacks);
}
const pack = VCPacks[name];
return pack ? pack(model) : null;
};
/**
* Get a specific view for a model from a registered pack.
*
* The selection is based on the constructor of a model. This gets the registered {@link ViewBuilder} function and passes the needed arguments to it.
*
* @param {Object} model - An instance of the model, for what a specific view is needed.
* @param {String} name - View name (a key in a provided VCPacks object).
* @param {[*]} [viewArgs] - Arguments for a view constructor.
* @param {[*]} [controllerArgs] - Arguments for a controller constructor.
* @return {Object | null} A new view instance or null.
*/
function getView(model, name, viewArgs, controllerArgs) {
const packs = _register.get(model.constructor);
if (!packs) {
return null;
}
const pack = packs[name];
return pack ? pack(model, viewArgs, controllerArgs) : null;
}

@@ -90,13 +95,21 @@

* @param {StandardController} [Controller] - A controller class.
* @return {Function} A function that automatically creates an instance of a view with a controller.
* @return {ViewBuilder} A function that automatically creates an instance of a view with a controller.
*/
function vcPack(View, Controller) {
return model => new View(
model,
Controller ? new Controller(model) : undefined
);
return (model, viewArgs = [], controllerArgs = []) => {
return Controller
? new View(
model,
Controller ? new Controller(model, ...controllerArgs) : undefined,
...viewArgs
)
: new View(
model,
...viewArgs
);
};
}
/**
* This is an exmple of how a standard view class constructur should look like.
* This is an example of how a standard view class constructor should look like.
*

@@ -112,3 +125,3 @@ * @class StandardView

/**
* This is an exmple of how a standard controller class constructur should look like.
* This is an example of how a standard controller class constructor should look like.
*

@@ -122,185 +135,20 @@ * @class StandardController

/*
* mvc-pack
* Copyright (c) 2016-2020 Valerii Zinchenko
* Licensed under MIT (https://gitlab.com/valerii-zinchenko/mvc-pack/-/blob/master/LICENSE.txt)
* All source files are available at: https://gitlab.com/valerii-zinchenko/mvc-pack
*/
/**
* Base model.
* Function that builds a view.
*
* @class Model
* If a controller constructor was not packed, then the additional arguments for a view will be passer right from the second argument.
*
* @param {Object} data - Public model data.
* @function ViewBuilder
* @param {*} model - An instance of a model.
* @param {[*]} viewArgs - Additional arguments for a view contructor.
* @param {[*]} controllerArgs - Additional arguments for a controller contructor.
* @return {object} A new instance of a view.
*/
var Model = classWrapper.Class(function(data) {
this.setData(data);
}, /** @lends Model.prototype */{
__name: 'Model',
/**
* Public data.
* If it contains some other object, it means, that this model is working with exactly that reference, not the inner properties of that.
* @type {Object}
*/
data: {},
exports.getView = getView;
exports.mvcPack = mvcPack;
exports.vcPack = vcPack;
Object.defineProperty(exports, '__esModule', { value: true });
/**
* Model destructor.
*/
destruct() {
this.data = null;
},
/**
* Set/update public data.
*
* @param {Object} rawData - A delta of a model's public data.
* @returns {Object} An object with properties that are different. It is checking on the first level of the input object.
*/
setData(rawData) {
if (!(rawData instanceof Object)) {
return;
}
const data = this._getDiff(rawData);
if (Object.keys(data).length === 0) {
return data;
}
classWrapper.utils.deepCopy(this.data, data);
return data;
},
/**
* Clean up the input data object to leave only the properties that are new or different relative to the current public properties.
* It is checking only the first level of the input object.
*
* @protected
* @param {Object} data - Data object.
* @returns {Object} An object with properties that are different.
*/
_getDiff(data) {
const deltaData = {};
for (let key in data) {
const value = data[key];
if (this.data[key] !== value) {
deltaData[key] = value;
}
}
return deltaData;
}
});
/*
* mvc-pack
* Copyright (c) 2016-2020 Valerii Zinchenko
* Licensed under MIT (https://gitlab.com/valerii-zinchenko/mvc-pack/-/blob/master/LICENSE.txt)
* All source files are available at: https://gitlab.com/valerii-zinchenko/mvc-pack
*/
/**
* Base class for a view.
*
* @class View
*
* @throws {TypeError} Incorrect input arguments. Expected: Objcet model, [Object controller]
*
* @param {Object} model - An instance of a model.
* @param {Object} [controller = null] - An instance of a controller.
*/
var View = classWrapper.Class(function(model, controller = null) {
if (!(model instanceof Object) || (controller !== null && !(controller instanceof Object))) {
throw new TypeError('Incorrect input arguments. Expected: Objcet model, [Object controller]');
}
this.model = model;
this.controller = controller;
}, /** @lends View.prototype */{
__name: 'View',
/**
* Reference to the model.
* @type {Object}
*/
model: null,
/**
* Reference to the controller.
* @type {Object | null}
*/
controller: null,
/** Destructor. */
destruct() {
this.model = null;
this.controller = null;
}
});
/*
* mvc-pack
* Copyright (c) 2016-2020 Valerii Zinchenko
* Licensed under MIT (https://gitlab.com/valerii-zinchenko/mvc-pack/-/blob/master/LICENSE.txt)
* All source files are available at: https://gitlab.com/valerii-zinchenko/mvc-pack
*/
/**
* Base class for a controller.
*
* @class Controller
*
* @throws {TypeError} Incorrect input arguments. Expected: Objcet model
*
* @param {Object} model - An instance of a model.
*/
var Controller = classWrapper.Class(function(model) {
if (!(model instanceof Object)) {
throw new TypeError('Incorrect input arguments. Expected: Objcet model');
}
this.model = model;
}, /** @lends Controller.prototype */{
__name: 'Controller',
/**
* Reference to the model.
* @type {Object}
*/
model: null,
/** Destructor. */
destruct() {
this.model = null;
}
});
/*
* mvc-pack
* Copyright (c) 2016-2020 Valerii Zinchenko
* Licensed under MIT (https://gitlab.com/valerii-zinchenko/mvc-pack/-/blob/master/LICENSE.txt)
* All source files are available at: https://gitlab.com/valerii-zinchenko/mvc-pack
*/
var main = {
mvcPack,
vcPack,
Model,
View,
Controller
};
return main;
})));

6

dest/mvc-pack.amd.min.js
/**
* mvc-pack v1.0.0
* Copyright (c) 2016-2020 Valerii Zinchenko
* mvc-pack v2.0.0
* Copyright (c) 2016-2022 Valerii Zinchenko
* License: MIT https://gitlab.com/valerii-zinchenko/mvc-pack/-/blob/master/LICENSE.txt

@@ -8,2 +8,2 @@ * All source files are available at: https://gitlab.com/valerii-zinchenko/mvc-pack

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("class-wrapper")):"function"==typeof define&&define.amd?define(["class-wrapper"],t):(e=e||self)["mvc-pack"]=t(e["class-wrapper"])}(this,(function(e){"use strict";return{mvcPack:function(e,t){return function(n,o){if(!(n instanceof e))throw new Error("The class of the provided model does not belogs to the package");const r=t[o];return r?r(n):null}},vcPack:function(e,t){return n=>new e(n,t?new t(n):void 0)},Model:e.Class((function(e){this.setData(e)}),{__name:"Model",data:{},destruct(){this.data=null},setData(t){if(!(t instanceof Object))return;const n=this._getDiff(t);return 0===Object.keys(n).length||e.utils.deepCopy(this.data,n),n},_getDiff(e){const t={};for(let n in e){const o=e[n];this.data[n]!==o&&(t[n]=o)}return t}}),View:e.Class((function(e,t=null){if(!(e instanceof Object&&(null===t||t instanceof Object)))throw new TypeError("Incorrect input arguments. Expected: Objcet model, [Object controller]");this.model=e,this.controller=t}),{__name:"View",model:null,controller:null,destruct(){this.model=null,this.controller=null}}),Controller:e.Class((function(e){if(!(e instanceof Object))throw new TypeError("Incorrect input arguments. Expected: Objcet model");this.model=e}),{__name:"Controller",model:null,destruct(){this.model=null}})}}));
!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports):"function"==typeof define&&define.amd?define(["exports"],n):n((e=e||self)["mvc-pack"]={})}(this,(function(e){"use strict";const n=new WeakMap;e.getView=function(e,t,o,c){const u=n.get(e.constructor);if(!u)return null;const f=u[t];return f?f(e,o,c):null},e.mvcPack=function(e,t){n.set(e,t)},e.vcPack=function(e,n){return(t,o=[],c=[])=>n?new e(t,n?new n(t,...c):void 0,...o):new e(t,...o)},Object.defineProperty(e,"__esModule",{value:!0})}));

7

package.json
{
"name": "mvc-pack",
"version": "1.0.0",
"version": "2.0.0",
"description": "Organize MVC components into packs",

@@ -14,3 +14,3 @@ "main": "./main.mjs",

"build": "rollup --config rollup.config.js",
"lint": "eslint main.mjs ./src/* ./test/*",
"lint": "eslint main.mjs ./test/*",
"test": "mocha --ui tdd ",

@@ -31,5 +31,2 @@ "coverage": "c8 --include=src --all --reporter=html --reporter=text npm test",

},
"dependencies": {
"class-wrapper": "^2.2.0"
},
"devDependencies": {

@@ -36,0 +33,0 @@ "c8": "^7.1.2",

84

README.md
# mvc-pack
The main idea is to help to organize models, views and controllers and to have a single point, where all the components are combined together.
The main idea is to help to organize models, views and controllers and to have a single point, where all the components are combined together. This could be treated as a global register of view mapped to a model class. This reduces the interdependency of some simple view in contrast to external views, but it then forcing the need oto manage this maps.

@@ -27,3 +27,3 @@ ## Instalation

```js
const pack = mvcPack(
mvcPack(
SomeModelClass,

@@ -38,3 +38,3 @@ {

console.log(pack(model, 'tabe') instanceof TableView); // -> true
console.log(getView(model, 'table') instanceof TableView); // -> true
```

@@ -68,49 +68,36 @@

It is recommended to create a new base class in scope of an application on top of the `Model` class, in order to attach an event system and be able to trigger events, for example when some property of a public data is changing, or when a model is destructing. The property `public` is recommended to be used just for a reading and use `setData(data)` to set new data to a model. Here is the minimal code needed to attach an EventTarget, that is available in a browser:
It is recommended to create a base model class in scope of an application, in order to attach an event system to trigger and receive events. For example when some property is changing - update all connected views, or when a model is destructing - properly clean up the views.
```js
const BaseModel = Class(Model, null, {
Encapsulate: EventTarget,
class Model {
constructor() {
this._eventSystem = new EventTarget();
setData(data) {
const delta = super.setData(data);
for (let key in delta) {
this.dispatchEvent(new CustomEvent(`update-${key}`));
}
this.dispatchEvent(new CustomEvent('update'));
this.data = {};
}
});
```
for Node.js:
destruct() {
this.data = null;
this.dispatchEvent('destruct');
}
```js
const BaseModel = Class(Model, null, {
Encapsulate: EventEmitter,
setData(data) {
const delta = super.setData(data);
for (let key in delta) {
this.event(`update-${key}`);
for (let key in data) {
this.data[key] = delta[key];
this.dispatchEvent(`update-${key}`);
}
this.emit('update');
this.dispatchEvent('update');
}
});
```
Examples above are using [`class-wrapper`](https://www.npmjs.com/package/class-wrapper) to mix in an event system into a class inherited from a Model. A pure JS example is like this (for a browser):
dispatchEvent(type) {
this._eventSystem.dispatchEvent(new CustomEvent(type));
}
```js
class BaseModel extends Model {
constructor(data) {
super(data);
this.eventSystem = new EventTarget();
addEventListener(type, listener) {
this._eventSystem.addEventListener(type, listener);
}
setData(data) {
const delta = super.setData(data);
for (let key in delta) {
this.eventSystem.dispatchEvent(new CustomEvent(`update-${key}`));
}
this.eventSystem.dispatchEvent(new CustomEvent('update'));
removeEventListener(type, listener) {
this._eventSystem.removeEventListener(type, listener);
}

@@ -123,11 +110,12 @@ }

In context of this package a "View" is a final chain between a model and an information representation. A view can be an HTML representation, so a View class in this context is a class that, for example creates all the needed HTML elements and or combines other Views to display some information. It also hangs listeners to the interactive elements to be able to send updates back to the model.
This package provides the base class for all the views - `View` class:
In context of this package a "View" is a final chain between a model and the information representation. A view can be an HTML representation, so a View class in this context is a class that, for example creates all the needed HTML elements and or combines other Views to display some information.
An example to assotiate only a view with a model:
```js
class TextView extends View {
class TextView {
...
}
class TableView extends View {
class TableView {
...

@@ -145,3 +133,3 @@ }

but it also can work with other classes, that needs more arguments to be constructed or need to do some extra preparations:
It also can work with other classes, that needs more arguments to be constructed or need to do some extra build steps:

@@ -171,11 +159,6 @@ ```js

Under this conditions a controller between them can be easily inserted:
Under this conditions a controller between them can be easily inserted - a view must use a controller interface to get and display data, or use it to convert into raw format and set into the model..
- controller must then listen the needed events of a model, process the model data and set the it to a view;
- view must set the new data over the connected controller, so that the controller will adapt the data to the model format and set it to the model.
This package provides the base class for controllers - `Controller` class:
```js
class TextController extends Controller {
class TextController {
...

@@ -190,4 +173,5 @@ }

);
```
```js
class CustomController {

@@ -194,0 +178,0 @@ ...

src/Controller.mjs
src/Model.mjs
src/packs.mjs
src/View.mjs
main.mjs

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

About

Packages

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc