razjs - npm Package Compare versions

razjs

Package Overview

Dependencies

Maintainers

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

Comparing version 0.0.1 to 0.1.0

package.json

		{
		"name": "razjs",
		"version": "0.0.1",
		"version": "0.1.0",
		"description": "JS-version of the Razor-Express library (Razor-like template engine for NodeJS Express).",
		@@ -5,0 +5,0 @@ "scripts": {

132

README.md

		@@ -14,2 +14,3 @@ # RazJS
		```HTML
		<script src="node_modules/razjs/raz.js"></script>
		<div id="target">
		@@ -50,2 +51,39 @@ </div>
		```
		HTML output:
		<pre>
		<table>
		<tbody><tr>
		<th>Country</th>
		<th>Area sq.km</th>
		</tr>
		<tr>
		<td>Russia</td>
		<td>17098242</td>
		</tr>
		<tr>
		<td>Canada</td>
		<td>9984670</td>
		</tr>
		<tr>
		<td>United States</td>
		<td>9826675</td>
		</tr>
		<tr>
		<td>China</td>
		<td>9596960</td>
		</tr>
		<tr>
		<td>Brazil</td>
		<td>8514877</td>
		</tr>
		<tr>
		<td>Australia</td>
		<td>7741220</td>
		</tr>
		<tr>
		<td>India</td>
		<td>3287263</td>
		</tr>
		</tbody></table>
		</pre>
		<sup>^ Try it on [jsfiddle.net](https://jsfiddle.net/develax/tfr9zhm5/)</sup>
		@@ -57,2 +95,3 @@
		```HTML
		<script src="node_modules/razjs/raz.js"></script>
		<div id="target">
		@@ -64,11 +103,11 @@ </div>
		```JS
		window.addEventListener('error', function(e) {
		if (!e.error.isRazorError) return;
		e.preventDefault(); // stop propagating
		window.addEventListener('error', function (e) {
		if (!e.error.isRazorError) return;
		setTimeout(() => {
		// The document have to be fully loaded before replacing its whole content - that's why we use timer.
		document.documentElement.innerHTML = e.error.html();
		}, 0);
		e.preventDefault(); // Stop propagating since we've handled it.
		});

		setTimeout(()=>{
		document.documentElement.innerHTML = e.error.html();
		}, 0);
		});

		const num = 1;
		@@ -84,5 +123,82 @@ const template = `
		```
		Rendered HTML:

		![Visualization of Razor-Express error through views chain](https://github.com/DevelAx/RazDoc/blob/master/RazJS/catch-error-example.png?raw=true)

		<sup>^ This code is available in the [RazJsExample](https://github.com/DevelAx/RazJsExample) repository.</sup>

		#### Example 3 (the entire HTML-page with embedded JavaScript)

		```HTML
		<!DOCTYPE html>
		<html lang="en">

		<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta http-equiv="X-UA-Compatible" content="ie=edge">
		<title>RazJS library test - #1</title>
		<style>
		pre {
		background-color:black;
		color:#f3eeb5;
		padding: 0 0.5rem;
		border: 1rem ridge #ababab;
		}
		</style>
		<script src="node_modules/razjs/raz.js"></script>
		<script type="text/javascript">
		function test() {
		var template = `
		<h1>@Model.title</h1>
		<strong>Days of the week:</strong>
		<ul>
		@for (var i = 0; i < Model.days.length; i++) {
		<li>@Model.days[i]</li>
		}
		</ul>
		<div>Today is <i>@Model.today()</i>.</div>
		<br />
		<hr />
		<div>
		<h2>The Razor-syntax template used in this example</h2>
		<pre>
		@Model.template
		</pre>
		</div>`;
		var model = {
		title: document.title,
		day: new Date().getDay(),
		days: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
		today: function () {
		return this.days[this.day];
		},
		template
		}
		document.body.insertAdjacentHTML('afterbegin', raz.render(template, model));
		}
		</script>
		</head>

		<body onload="test()">
		</body>

		</html>
		```
		HTML output:

		Days of the week:
		- Sunday
		- Monday
		- Tuesday
		- Wednesday
		- Thursday
		- Friday
		- Saturday

		Today is _Thursday_.

		<sup>^ Try it on [jsfiddle.net](https://jsfiddle.net/develax/ub5os9hn/4/) or the [RazJsExample](https://github.com/DevelAx/RazJsExample) repository.</sup>

		----------------
		> More syntax construction examples on [Razor-Express syntax reference for NodeJS & Express](https://github.com/DevelAx/RazorExpress/blob/master/docs/syntax.md).

Improved metrics