⁜ MVC Framework
▴
PAC Framework With MVC Framework Subpatterns ▵
Manage Simplex/Complex Browser Applications & Websites With Familiar Plain JS Notation ▵
Mediate Model, View, Router, And Controller Events With Event-Driven Core Architecture ▵
Capture Detailed Object/Array Mutator Method Events Including Subproperty Events ⁘ Uses Core-Plex - Event Listener Management System
❂ Uses Objecture - Object Watcher, Property Manager
※ Independent Classes
| SYM | NAME | DESCRIPT | API | GUIDE |
| -----: | :--- | :------- | :--: | :--: |
| M | Model | Manage schematized content. |
▶ |
▶ |
| X | Model Schema | Manage data schema. |
▶ |
▶ |
| D | Model Content | Manage data content. |
▶ |
▶ |
| V | View | Manage templated markup elements. |
▶ |
▶ |
| R | Router | Window location router or fetch router. |
▶ |
▶ |
| R
L | Router (Location) | Manage window location. |
▶ |
▶ |
| R
F | Router (Fetch) | Manage AJAX connection. |
▶ |
▶ |
| R
S | Router (Socket) | Manage Socket connection. |
▶ |
▶ |
| C | Control | Manage Model, View, Control, Location/fetch Routers. |
▶ |
▶ |
※ Interdependent Class Structures
| FORMULA | NAME | ACRONYM | DESCRIPT |
| ------: | :--- | :------ | :------- |
|
CMVRC\* | Control (Model, View, Router, Controls) | CMVRC | Control class instances contain model, view, router, and subcontrol class instances. |
|
MVRM\* | Model (View, Router, Models) | MVRM | Model class instances contain view, router, and submodel class instances. |
|
VMRV\* | View (Model, Router, Views) | VMRV | View class instances contain model, router, and subview class instances. |
|
RMVR\* | Router (Model, View, Routers) | RMVR | Router class instances contain model, view, and subrouter class instances. |
※ Illustrations
$3
``
const control = new Control({
models: {
ui: new Model({
selected: false,
anchor: { text: "Product Detail" },
}),
content: new Model({
id: "0246813579",
name: "Some Product Name",
price: "$235.78",
descript: "Some product description.",
graphic: "https://pbs.twimg.com/media/Grhfq0JaIAAPIqI?format=jpg&name=medium",
anchor: "https://x.com/StellarManatee/status/1925394081796223237",
}),
},
views: {
default: new View({
templates: { default: ($models) => {
const { ui, content } + $models
return
${content.name}
${content.descript}
${content.price}
${ui.anchor.text}

![]()
} },
querySelectors: { querySelector: {
'product': ':scope'
} },
})
},
}, {
events: {
'models.ui setProperty:selected': function($event) {
this.views.qs.product.setAttribute($event)
}
},
})
``