Quick Start Tutorial for the Impatient
We have things to do. Let’s use Maria to build an application called “checkit” to organize our to-dos.
By the end of this tutorial, you’ll understand how the components communicate in an application written in the MVC style with Maria and be ready to create more complex client-side application on your own.
Let’s go...
Separate Their Code From Our Code
There are generic libraries out there in the world that are written, ready, and just waiting for us to download for use in our application. There is application-specific source code that we will write. Create a checkit/
directory to contain the entire application with lib/
and src/
sub-directories to keep these two types of files separate.
-
checkit/
lib/
src/
Download Maria and Other Libraries
To give our application structure, we’ll use the Maria framework. Download the latest version from the following link and save it as checkit/lib/maria/maria.js
.
http://peter.michaux.ca/downloads/maria/current/maria.js
In this application, we’ll need to manipulate the class
attribute values of DOM elements. We’ll use the Aristocrat library. Download the latest version from the following link and save it as checkit/lib/aristocrat/aristocrat.js
.
http://peter.michaux.ca/downloads/aristocrat/current/aristocrat.js
Namespace Our Application Code
The conventions built into Maria expect our application classes are all properties of a single namespace object. Create a file checkit/src/js/namespace.js
defining our namespace object.
var checkit = {};
Prepare for Our Own Utilities
It’d be great if every miscellaneous utility function we need in our application was available in a third-party library; however, that is rarely the case in any application. Create a checkit/src/js/util.js
file where we’ll add utility functions that we’ll write as we find needs for them.
Modelling To-do Items
We’re building an application for organizing to-do items. For each individual thing we need to do, we’ll create a model object representing that individual to-do.
We must design a class for an individual to-do. The two fundamental questions we’ll ask a to-do model object are:
- What needs doing?
- Has it already been done?
Create a checkit/src/js/models/
directory for all our model classes.
We’ll use maria.Model
as the parent class for our checkit.TodoModel
class in a file called checkit/src/js/models/TodoModel.js
.
maria.Model.subclass(checkit, 'TodoModel', {
attributes: {
content: {
type: 'string',
trim: true
},
done: {
type: 'boolean'
}
}
});
To find out more about this checkit.TodoModel
class, let’s get our hands dirty and experiment in a browser console like Firebug.
Create an HTML document called checkit/src/index.html
that loads both the libraries and our application code.
<!DOCTYPE html>

<title>checkit</title>

With the above page loaded in the browser, we can interactively explore in the console.
Create a new to-do and check its default content and done values.
> var todoModel = new checkit.TodoModel();
undefined
> todoModel.getContent();
""
> todoModel.isDone();
false
Let’s make the to-do more motivating to do.
> todoModel.setContent('test drive Ferrari');
undefined
> todoModel.getContent();
"test drive Ferrari"
Looking good so far but those are just getters and setters. We haven’t seen any MVC magic yet. The observer pattern is the first bit of magic we’ll explore.
In most MVC applications, a model object communicates with one or more view objects via the observer pattern. When a particular event type happens on the model, the model notifies all the views who’ve added themselves as observers of that event type on that view. This gives the views an opportunity to react to the model’s event. Typically a view object wants to keep its visual representation up-to-date to match the model object’s current state. The observer pattern creates a very loose coupling between a model and the views as the model object doesn’t know or even care about what the view objects are doing.
Let’s see the observer pattern relationship between a to-do model object and fake view object.
We create a fake view object and add it as an observer of the to-do model object.
> var view = {update: function (evt) {console.log('The model changed!');}};
undefined
> maria.on(todoModel, 'change', view, 'update');
undefined
Now a change to the model object’s done value will cause the model to call the view’s update
method.
> todoModel.setDone(true);
"The model changed!"
undefined
If we remove the observer from the model and change the done value again, we see the view is no longer notified.
> maria.off(todoModel, 'change', view, 'update');
undefined
todoModel.setDone(false);
undefined
Try adding multiple fake views as observers of one model. Try calling todoModel.setDone(true)
multiple times consecutively. What information does the evt
object contain that is passed to the observer's method? Experiment. Explore.
If you are a devout test-driven developer, you’re surely disappointed that code’s been written but tests haven’t. Forgive us. We have sinned. Now is a good time to repent and make amends. Add your test library in a subdirectory of checkit/lib/
if necessary, your tests in a checkit/tst/
or checkit/spec/
directory, and float your boat. By the way, I recommend you check out the great Buster automated testing tools which are used for testing the Maria source code.
Viewing a To-do
Now that we can model a to-do item, we’ll need a way to show it in the browser. We'll create a view for a to-do. Creating a view can use several files. In this case, there will be an HTML template, some CSS, a couple images, and the JavaScript that brings to view to life.
Create a directory checkit/src/js/templates/
for all our HTML templates.
Add the following code to a file checkit/src/js/templates/TodoTemplate.js
.
checkit.TodoTemplate =
'
' +
' ' +
'' +
'
';
(In a full, industrial-strength development environment this template would be expressed in a file containing only HTML and be compiled to the JavaScript above as part of the server/build functionality. Due to the limitations of a simple example that does not require any special server environment to try, the manually compiled version is included.)
Notice that the elements that will be interesting to our JavaScript view objects are identified by class attributes. There are no id attributes. This is always a good practice and is necessary so that we can have multiple to-do items displayed simultaneously in the browser.
Create a directory checkit/src/css/
for all our CSS files.
The CSS for the to-do view goes in checkit/src/css/Todo.css
.
.Todo {
list-style-type: none;
margin: 0;
padding: 0;
position: relative;
height: 20px;
padding-left: 20px;
}
.TodoDone {
color: #999;
text-decoration: line-through;
}
.Todo .checkbox {
height: 20px;
width: 20px;
background: url(../img/undone.png) no-repeat center center;
cursor: pointer;
display: block;
position: absolute;
top: 0;
left: 0;
}
.TodoDone .checkbox {
background-image: url(../img/done.png);
}
Create a directory checkit/src/img/
for all our images.
Save the following two images.
checkit/src/img/undone.png
checkit/src/img/done.png
The HTML, CSS, and images files above are things that a non-programmer might work on. We want to keep their work as non-technical as possible.
The part that most programmers will find interesting is bringing the to-do item to life so that it always reflects the state of a particular to-do model object and reacting to user clicks to mark the to-do as complete. Some JavaScript please...
Create a directory checkit/src/js/views/
for all our view classes.
Create a file checkit/src/js/views/TodoView.js
containing the following.
maria.ElementView.subclass(checkit, 'TodoView', {
uiActions: {
'click .checkbox': 'onClickCheckbox'
},
properties: {
buildData: function () {
var model = this.getModel();
this.find('.content').innerHTML = checkit.escapeHTML(model.getContent());
aristocrat[model.isDone() ? 'addClass' : 'removeClass'](
this.find('.Todo'), 'TodoDone');
},
update: function () {
this.buildData();
}
}
});
The uiActions
specify user events that will be passed on to a controller object which we’ll see soon. For a to-do, the only thing the user can do is check or uncheck that the to-do is done or not done.
By naming convention, Maria knows to use the HTML in checkit.TodoTemplate
when creating a checkit.TodoView
. This HTML is used to construct a DOM node that will represent the to-do on screen. The buildData
property is used to show the to-do model data in that DOM node. In this case, we just need to show the content and whether or not the to-do is done.
When the view’s model object changes, the view’s update
method will be called. Since an update requires that we just do the same things that are done in buildData
to keep the view in sync with model, we can simply reuse buildData
. Reusing various bits of building code during updating is a common way to keep a view up-to-date as the model changes.
The view uses a utility function that we can add to checkit/src/js/util.js
.
checkit.escapeHTML = function (str) {
return str.replace('&', '&').replace('<', '<');
};
We’re itching to see our to-do in the browser. Update our checkit/src/index.html
file.
<!DOCTYPE html>

<title>checkit</title>
<link href="css/Todo.css" rel="stylesheet" type="text/css">

Reloading the index page and run the following in the console.
> var todoModel = new checkit.TodoModel();
undefined
> todoModel.setContent('climb a mountain');
undefined
> var view = new checkit.TodoView(todoModel);
undefined
> document.body.appendChild(view.build());
undefined
There it is. Our nice to-do view sitting pretty in the browser!
What I’ll bet you’re really dying to see is the observer pattern in action and the view staying in sync with the model object’s changing state. It’s easy to see with a few more lines in the console.
> todoModel.setContent('climb Everest');
undefined
> todoModel.setDone(true);
undefined
> todoModel.setDone(false);
Ta-da! Magic. Notice we don’t have to manually add the view as an observer of the model. The Maria framework makes that connection for us.
Try adding two views with the same model to the document. Changing the model object once will update both views! That is a peak at more MVC magic.
Reacting to User Action with Controllers
In the checkit.TodoView
we’ve used the uiActions
to map a click on the to-do’s checkbox to a checkit.TodoController
object. Since we haven’t written the controller class yet, clicking on the to-do’s checkbox will cause an error. Let’s fix that.
Create a directory checkit/src/js/controllers/
for all our controller classes.
Create the checkit.TodoController
class in a file called checkit/src/js/controllers/TodoController.js
.
maria.Controller.subclass(checkit, 'TodoController', {
properties: {
onClickCheckbox: function () {
this.getModel().toggleDone();
}
}
});
It is about as simple a controller class as possible. For a to-do that is not yet done, if the the checkbox is clicked then we want the to-do to become done. If the to-do is already done then a click should change the to-do back to undone. Another way to say it is the controller implements the strategy of what needs to be done when a user action happens. This is the second main design pattern in MVC: the strategy pattern.
Note that we don’t have to create an object of the controller class. Maria does that for us the first time the view needs a controller. By naming convention, Maria knows to use a checkit.TodoController
object for a checkit.TodoView
object. Also, we don’t have to set the model object in the controller object. Maria does that for us so that the controller’s model always matches the view’s model. Following the conventions means Maria will do all this wiring for us.
We don't want to use the console to add a to-do view to page each time we reload the browser so let’s add a checkit/src/js/bootstrap.js
file to do that for us. This file will evolve as our application does.
(function () {
var todoModel = new checkit.TodoModel();
todoModel.setContent('climb a mountain');
var view = new checkit.TodoView(todoModel);
document.body.appendChild(view.build());
}());
Update the checkit/src/index.html
file.
<!DOCTYPE html>

<title>checkit</title>
<link href="css/Todo.css" rel="stylesheet" type="text/css">

When you reload the browser, the to-do should be visible. Now click the checkbox and watch the to-do change from undone to done over and over again. Climbing a mountain was never so easy.
Now you’ve seen model, view, and controller objects in action and communicating. A view visually represents the state of a model. A model notifies views when the model changes and the views update themselves. A view delegates user events to a controller. The controller modifies the model as necessary. That is a lot to see already.
It even works in Internet Explorer 6.
Modelling a Set of To-dos
There’s never enough time in life for all things we want to do. We need to manage a set of to-dos. As life moves along, we’ll think of more things to do and hopefully we’ll actually get some things done. We'll add and delete individual to-do objects from another kind of model object representing a set of to-dos. Let’s create a class who’s objects are just that.
An object of the maria.SetModel
class is an unordered set that can hold any number of other model objects. Observers of a set model are notified when those other model objects are added or deleted from the set. We can subclass maria.SetModel
as a starting point for our checkit.TodosModel
class in a file checkit/src/js/models/TodosModel.js
.
maria.SetModel.subclass(checkit, 'TodosModel', {
properties: {
isAllDone: function () {
return (this.size > 0) &&
this.every(function (todo) {
return todo.isDone();
});
},
isAllUndone: function () {
return this.every(function (todo) {
return !todo.isDone();
});
},
markAllDone: function () {
this.forEach(function (todo) {
todo.setDone(true);
});
},
markAllUndone: function () {
this.forEach(function (todo) {
todo.setDone(false);
});
},
deleteDone: function () {
var doneTodos = [];
this.forEach(function (todo) {
if (todo.isDone()) {
doneTodos.push(todo);
}
});
this['delete'].apply(this, doneTodos);
}
}
});
Add this file to the checkit/src/index.html
page.
<!DOCTYPE html>

<title>checkit</title>
<link href="css/Todo.css" rel="stylesheet" type="text/css">

Reload the browser and explore some more. Create a set for to-dos and add an observer who will log to-dos added to the set.
> var todosModel = new checkit.TodosModel();
undefined
> var view = {update: function (evt) {console.log(evt.addedTargets.map(function (todo) {return todo.getContent();}));}};
undefined
> maria.on(todosModel, 'change', view, 'update');
undefined
Now add a to-do to the set.
> var todoModel = new checkit.TodoModel();
undefined
> todoModel.setContent('dinner date with Maria');
undefined
> todosModel.add(todoModel);
["dinner date with Maria"]
true
There are a few things we should probably do before our date. Let’s add them.
> var flowers = new checkit.TodoModel();
undefined
> flowers.setContent('buy flowers');
undefined
> var shower = new checkit.TodoModel();
undefined
> shower.setContent('take a shower');
undefined
> todosModel.add(flowers, shower);
["buy flowers", "take a shower"]
true
We see that adding multiple to-do models to the set with one call to the set’s add
method means only one event is fired. This reduces the number of updates that views have to do. Since updating views usually involves manipulating the DOM and manipulating the DOM is usually slow, keeping view updates to a minimum is a particularly good part of the application to be conservative.
When we go out and buy the flowers, we’ll mark the corresponding to-do as done. Let’s change the view’s update
method so we can examine what happens to the set when the to-do is marked as done. Remember that the view is observing the set.
> view.update = function (evt) {console.log(evt.target.constructor === checkit.TodoModel, evt.currentTarget.constructor === checkit.TodosModel);};
function ()
> flowers.setDone(true);
true true
undefined
What’s important to note above is that the evt.target
is the flowers to-do but that the event bubbles up to the containing to-dos set which is the evt.currentTarget
. This bubbling makes it possible for views to observe all the activity on an entire set of models without our application code having to manually add and remove the view as an observer for each model in the set.
We might want to clean up our to-dos set by deleting all the to-do models that are done.
> todosModel.deleteDone();
false true
undefined
> todosModel.size;
2
You may have noticed that the implementation of the deleteDone
method contains this['delete']
syntax. Since delete
is a JavaScript keyword, older browsers did not allow us to write the simpler this.delete
syntax which works in newer browsers.
Our model layer is complete.
Well. The tests. Yes, yes. Please write them.
Viewing a Set of To-dos
Now that we can model a set of to-dos, it would be great to see them. Let’s build a list view for to-dos.
Create a list template in checkit/src/js/templates/TodosListTemplate.js
.
checkit.TodosListTemplate =
'

';
A little bit of CSS for the view in checkit/src/css/TodosList.css
.
.TodosList {
margin: 0;
padding: 0;
}
Simple so far.
The checkit.TodosListView
class will inherit from maria.SetView
. This means our view will automatically add and delete child checkit.TodoView
objects for us when a checkit.TodoModel
is added or deleted from the checkit.TodosModel
. Add the following in checkit/src/js/views/TodosListView.js
.
maria.SetView.subclass(checkit, 'TodosListView', {
properties: {
createChildView: function (todoModel) {
return new checkit.TodoView(todoModel);
}
}
});
To see a list in the browser, let’s update the checkit/src/js/bootstrap.js
file to create a set model containing a few to-do items and add a view to the page.
maria.on(window, 'load', function () {
var todosModel = new checkit.TodosModel();
var todoModel = new checkit.TodoModel();
todoModel.setContent('dinner date with Maria');
todosModel.add(todoModel);
var todoModel = new checkit.TodoModel();
todoModel.setContent('buy flowers');
todosModel.add(todoModel);
var todoModel = new checkit.TodoModel();
todoModel.setContent('take a shower');
todosModel.add(todoModel);
var view = new checkit.TodosListView(todosModel);
document.body.appendChild(view.build());
});
Update checkit/src/index.html
to load all our new files.
<!DOCTYPE html>

<title>checkit</title>
<link href="css/TodosList.css" rel="stylesheet" type="text/css">
<link href="css/Todo.css" rel="stylesheet" type="text/css">

Reload the browser and voila! A set of to-dos displayed as a list in the browser.
Feel free to click the checkboxes of the to-do items in the list.
Note there is no controller class called checkit.TodosListController
. Since a checkit.TodosListView
object never delegates any decisions to a controller object, a controller object is never created and so it is ok that the checkit.TodosListController
is not defined.
Creating To-do Items
There is an obviously missing piece of functionality. We need to be able to create to-do items through a form in the user interface and see them appear in the list. Easy peasy. Just another round of HTML, CSS, a view and a controller.
Create a template in checkit/src/js/templates/TodosInputTemplate.js
.
checkit.TodosInputTemplate =
'
' +
'<input class="content" placeholder="What needs to be done?" type="text">' +
'Press enter to add this task.' +
'
';
A bit of CSS in checkit/src/css/TodosInput.css
.
.TodosInput .instructions {
visibility: hidden;
}
.TodosInputPending .instructions {
visibility: visible;
}
The actual view class in checkit/src/js/views/TodosInputView.js
.
maria.ElementView.subclass(checkit, 'TodosInputView', {
uiActions: {
'focus .content': 'onFocusInput' ,
'blur .content': 'onBlurInput' ,
'keyup .content': 'onKeyupInput' ,
'keypress .content': 'onKeypressInput'
},
properties: {
getInputValue: function () {
return this.find('.content').value;
},
clearInput: function () {
this.find('.content').value = '';
},
setPending: function (pending) {
aristocrat[pending ? 'addClass' : 'removeClass'](
this.find('.TodosInput'), 'TodosInputPending');
}
}
});
This view does take user events and delegates them to four methods in a controller. Create the controller class in, you guessed it, checkit/src/js/controllers/TodosInputController.js
.
maria.Controller.subclass(checkit, 'TodosInputController', {
properties: {
onFocusInput: function () {
this.onKeyupInput();
},
onBlurInput: function () {
this.getView().setPending(false);
},
onKeyupInput: function () {
var view = this.getView();
view.setPending(!checkit.isBlank(view.getInputValue()));
},
onKeypressInput: function (evt) {
if (evt.keyCode == 13) {
var view = this.getView();
var value = view.getInputValue();
if (!checkit.isBlank(value)) {
var todo = new checkit.TodoModel();
todo.setContent(value);
this.getModel().add(todo);
view.clearInput();
}
}
}
}
});
The controller uses another utility so we add that to the checkit/src/js/util.js
file.
checkit.isBlank = function (str) {
return /^\s*$/.test(str);
};
Update the checkit/src/js/bootstrap.js
so that the to-do set starts empty and the input form is added.
maria.on(window, 'load', function () {
var model = new checkit.TodosModel();
var view = new checkit.TodosInputView(model);
document.body.appendChild(view.build());
var view = new checkit.TodosListView(model);
document.body.appendChild(view.build());
});
Add the new files to checkit/src/index.html
.
<!DOCTYPE html>

<title>checkit</title>
<link href="css/TodosInput.css" rel="stylesheet" type="text/css">
<link href="css/TodosList.css" rel="stylesheet" type="text/css">
<link href="css/Todo.css" rel="stylesheet" type="text/css">

Reload the browser and fill the list with all the things you want to-do.
A Toolbar to Manage the Set of To-dos
Our application is quite advanced already. We’ll carry on and add a toolbar that allows us to mark all to-do items in the set as done or undone and allows us to clear all completed to-do items from the set.
Create a template in checkit/src/js/templates/TodosToolbarTemplate.js
.
checkit.TodosToolbarTemplate =
'
' +
'

 ' +
'
<input class="deleteDone" type="button" value="delete complete"></input>
' +
'
';
The CSS in checkit/src/css/TodosToolbar.css
.
.TodosToolbar {
margin: 0;
padding: 0;
position: relative;
}
.TodosToolbar li {
list-style-type: none;
margin: 0;
padding: 0;
display: inline;
}
.TodosToolbar .allCheckbox {
height: 20px;
width: 20px;
background: url(../img/undone.png) no-repeat center center;
cursor: pointer;
display: block;
float: left;
}
.TodosToolbar .allCheckboxAllDone {
background-image: url(../img/done.png);
}
The view class in checkit/src/js/views/TodosToolbarView.js
.
maria.ElementView.subclass(checkit, 'TodosToolbarView', {
uiActions: {
'click .allCheckbox': 'onClickAllCheckbox',
'click .deleteDone' : 'onClickDeleteDone'
},
properties: {
buildData: function () {
var model = this.getModel();
var checkbox = this.find('.allCheckbox');
var button = this.find('.deleteDone');
var isAllDone = model.isAllDone();
aristocrat[isAllDone ? 'addClass' : 'removeClass'](
this.find('.allCheckbox'), 'allCheckboxAllDone');
button.disabled = model.isAllUndone();
},
update: function () {
this.buildData();
}
}
});
The controller in checkit/src/js/controllers/TodosToolbarController.js
.
maria.Controller.subclass(checkit, 'TodosToolbarController', {
properties: {
onClickAllCheckbox: function () {
var model = this.getModel();
if (model.isAllDone()) {
model.markAllUndone();
} else {
model.markAllDone();
}
},
onClickDeleteDone: function () {
this.getModel().deleteDone();
}
}
});
Create a new toolbar view during bootstrapping in checkit/src/js/bootstrap.js
.
maria.on(window, 'load', function () {
var model = new checkit.TodosModel();
var view = new checkit.TodosInputView(model);
document.body.appendChild(view.build());
var view = new checkit.TodosToolbarView(model);
document.body.appendChild(view.build());
var view = new checkit.TodosListView(model);
document.body.appendChild(view.build());
});
And update checkit/src/index.html
.
<!DOCTYPE html>

<title>checkit</title>
<link href="css/TodosInput.css" rel="stylesheet" type="text/css">
<link href="css/TodosToolbar.css" rel="stylesheet" type="text/css">
<link href="css/TodosList.css" rel="stylesheet" type="text/css">
<link href="css/Todo.css" rel="stylesheet" type="text/css">

Reload the browser and play with the new toolbar tools.
Combine Smaller Views Into a Single View
Our bootstrap file currently creates three views, all observing the same model, and add each view to the page. That is fine and dandy. It something you want to do at times. That said, it is also useful to be able to gather together multiple views as children of a single parent view. This allows the bootstrapping code to deal with only one view (i.e. the parent view) and the three child views will still appear in the page. This is the beauty of the composite pattern: the third of the three primary patterns in the MVC architecture.
Create a new template file for our parent view in checkit/src/js/templates/TodosAppTemplate.js
checkit.TodosAppTemplate =
'

';
Create a new view in checkit/src/js/views/TodosAppView.js
maria.ElementView.subclass(checkit, 'TodosAppView', {
constructor: function (model) {
checkit.TodosAppView.superConstructor.apply(this, arguments);
this.appendChild(new checkit.TodosInputView(model));
this.appendChild(new checkit.TodosToolbarView(model));
this.appendChild(new checkit.TodosListView(model));
}
});
This view shows a feature of the subclass
mechanism that we haven't seen before. The optional constructor
property makes it possible to specify the constructor function that is checkit.TodosAppView
. Just remember to call the super class constructor function with the appropriate arguments as shown with apply
in the first line of this constructor function.
Update the checkit/src/js/bootstrap.js
file to create a single checkit.TodosAppView
instead of three separate views for the input, toolbar, and list views.
maria.on(window, 'load', function () {
var model = new checkit.TodosModel();
var view = new checkit.TodosAppView(model);
document.body.appendChild(view.build());
});
Finally update the checkit/src/index.html
page.
<!DOCTYPE html>

<title>checkit</title>
<link href="css/TodosInput.css" rel="stylesheet" type="text/css">
<link href="css/TodosToolbar.css" rel="stylesheet" type="text/css">
<link href="css/TodosList.css" rel="stylesheet" type="text/css">
<link href="css/Todo.css" rel="stylesheet" type="text/css">

When you reload the page, you’ll see that nothing has changed. The three smaller views appear just as they did before but the bootstrapping code has been significantly simplified. Bootstrapping is only concerned with dealing with one view and can ignore the fact that that view is a composite comprised of three other views.
The Grand Finally
To witness the amazing power of the MVC architecture, try the following checkit/src/js/bootstrap.js
file.
maria.on(window, 'load', function () {
var model = new checkit.TodosModel();
for (var i = 0; i < 2; i++) {
var view = new checkit.TodosAppView(model);
document.body.appendChild(view.build());
}
});
Reload the browser. Create a few to-do items. Mark some of them as done. Click the delete button.
Yes this is exciting. Remain calm.  Meditate on what you have just witnessed. Then join us over at the Maria project on GitHub.


1)
A city has many tall
.
buildings
2)
That lady is wearing a gold
in her finger.
ring
3)
Tom’s
had a cavity.
tooth
4)
The children went down the
in the park.
slides
5)
Kate’s
were all over the floor.
crayons
6)
A
ran across the street.
cat
7)
There were ten
in the pod.
peas
8)
I have long
.
hair
9)
The maid is washing the
.
dishes
10)
May I have some
in my tea?
sugar


It is possible to display a grid cell as a hyperlink specifying the value of the "HREF template" property for the appropriate column.
In the example below this value for the Name column is set to https://en.wikipedia.org/wiki/%name%.
https://en.wikipedia.org/wiki/%name%


Library Login Form
Sign In
Forgot Password?
Sign Up
By creating an account, you agree to our
Terms And Conditions
Forgot Password
Enter the email with which u have registered to our site and a password reset link will be sent to your email
Return to login


--- route: nested-html-page title: Nested HTML Page draft: false hidden: false auth_required: false ---


For the lamb mince, heat a frying pan until hot, add the olive oil, onion and garlic and cook for 3-4 minutes, until just softened.
Add the lamb mince and cook for 2-3 minutes, until browned.
Add the cumin, coriander, cinnamon and tomato puré and cook for a further minute.
Add the lamb stock, sultanas and pine nuts and bring to the boil, then reduce the heat and simmer for 15 minutes.
Add the fresh coriander and season, to taste, with salt and freshly ground black pepper. Remove from the heat and leave to cool slightly.
For the rolled marrow, heat a separate frying pan until hot. Add half of the olive oil, the onion and garlic and cook for 2-3 minutes, until softened.
Add the tomatoes, sugar and ground coriander seeds and bring to the boil. Reduce the heat and simmer for 20 minutes, or until the sauce has thickened. Season, to taste, with salt and freshly ground black pepper.
Heat a separate frying pan until hot, add the remaining olive oil and the sliced marrow strips in batches and fry on each side for 30-50 seconds, until just softened and starting to turn golden-brown. Remove and drain on kitchen paper while you cook the remaining strips.
Place the marrow slices onto a clean work surface and season well with salt and freshly ground black pepper.
Spoon some of the lamb mince mixture into the centre of each marrow slice and roll it up around the mince. Transfer each stuffed roll into an ovenproof dish, seam-side down.
Spoon the tomato sauce over the stuffed marrow rolls, then top with pieces of mozzarella and sprinkle with parmesan.
Cover the dish with aluminium foil and place into the oven to bake for 15 minutes. Remove the foil and return to the oven for a further 5-8 minutes, or until golden-brown all over.
For the salad, whisk the lemon juice and olive oil together in a bowl and season to taste with salt and freshly ground black pepper.
Place the salad leaves into a serving bowl and drizzle with the dressing. Toss the salad to coat well.
To serve, place two stuffed marrow rolls onto each plate and spoon a little sauce over. Serve with the salad alongside.


2016 monthly gross income for top films released in 2016
Walt Disney Studios had an increase in profits of film in May and then a slow decline of profits through the end of the summer.
Highest Grossing Month for the Studio: June, 67.1 Million
Lowest Grossing Month for the Studio: September, 63.5 Million
Average Grossing Month for the Studio: $64.6 Million
Highest Grossing Individual Film: Star Wars Ep. VII: The Forc…, $651.0 Million
Average Gross For Film Film: 16.8 Million


require.js: JSONP Test
Test for usage of a JSONP URL as a dependency.
REQUIRES access to internet/Google to run the test. Otherwise it will fail.
Check console for messages


--- layout: page title: Contact show_in_sidebar: true sidebar_order: 2 show_in_sidebar: true seo_title: "Contact Chris Hodgson - Freelance Web Developer Sheffield" seo_description: "I’m a Freelance Web Developer based near Sheffield working with clients around Yorkshire and Manchester." keyword: Freelance Web Developer date: 2018-07-02 ---


Your Friends and Neighbors (1998) Jason Patric, Ben Stiller, Catherine Keener, Aaron Eckhart, Amy Brenneman, Nastassja Kinski. Written and directed by Neil LaBute. 100 minutes. R, 4 stars (out of five stars)
Review by Ed Johnson-Ott, NUVO Newsweekly www.nuvo-online.com/film/ Archive reviews at http://us.imdb.com/M/reviews_by?Edward+Johnson-ott To receive reviews by e-mail at no charge, send subscription requests to<EMAIL_ADDRESS>During sex-ed back in school, the first thing our teacher said was "Sex is communication. If you remember nothing else about my class, please try to remember that." "Your Friends and Neighbors" is about six people who have a great deal of trouble communicating. Variously angry, self- absorbed, over-analytical or simply needy, they couple in a variety of sexual combinations, but no one ever seems to end up satisfied.
After a screening of this pitch-black comedy, one very upset journalist exclaimed "They're not my friends and neighbors! I don't know these people. I don't want to know these people!" I said nothing, but realized that I do know these people. I dated one of them. To be completely honest, there was an awful period of time when I was one of them. Extreme as they may be, the characters in "Your Friends and Neighbors" are drawn from contemporary culture. Look closely and you'll realize that they really are your friends and neighbors, and maybe you as well.
This is the second film from Fort Wayne writer and director Neil LaBute. His first, the brilliant "In the Company of Men," created a sensation last year and made most "Best of" lists at years-end. A dark study of power and cruelty, the film ended with a revelatory scene that forced audience members to rethink everything they had witnessed up to that moment. "Your Friends and Neighbors" contains no such scene. The last act of the film takes place in your head, as you try to sort out the actions and motivations of these six people.
Jason Patric is a hard-bodied predator who rehearses his sex talk and plays tapes of it on his Walkman during workouts. Asked if he considers himself a good person, he angrily snaps "Hey, I'm eating lunch!" then tells of using pilfered hospital stationery to exact revenge by sending an anonymous note to an ex-girlfriend stating that she had been exposed to the HIV virus. He acknowledges that he may face repercussions if Judgment Day ever comes, but "until then, we're on my time."
Aaron Eckhart (Chad from "In the Company of Men") is a rumpled sad sack who confesses that his favorite lover is himself. He's not kidding. After a failed sex session with Amy Brenneman, his unassuming wife, he masturbates beneath the covers while she curls in the fetal position and pretends to be asleep.
 "Let's just do it," she growls in frustration, "I don't need the narration." Both try to augment their hollow love lives by seeking extracurricular partners. Ben invites Amy to have an affair with him, while Catherine cozies up to Nastassja Kinski, an artist's assistant at a local gallery. After they have sex and Kinski asks Keener which part of the lovemaking was her favorite, she replies, "I liked the silence best.''
"Your Friends and Neighbors" is often bleak and occasionally nightmarish, but also extremely funny. LaBute films his dark character study using a number of distancing devices. There are no exterior shots in the story's generic city, and the character's names are never spoken. As a result, we watch them with an almost clinical detachment, enabling us to laugh, rather than cry, at the foibles of the sextet.
The acting is quite good as well. Jason Patric's intensity has worked against him in previous films, but it's completely appropriate for this character, and he gives a blistering performance. His finest moment comes when he describes his most memorable sexual experience.  It's twisted, horrific and a terrific piece of acting.
Aaron Eckhart is exceptional as the antithesis of his "In the Company of Men" character, particularly during a wonderfully nuanced confrontational scene with his wife. Catherine Keener imbues her damaged character with a humanity that softens the cold words she speaks. Her facial expressions when Jason Patric verbally assaults her in a bookstore are heartbreaking. As the foppish professor, Ben Stiller is appropriately smarmy, while Nastassja Kinski gives her character a wispy, beguiling feel. Amy Brenneman also impresses as the most enigmatic of the group.
LaBute uses extended takes, stylistic repetition and variations of the same scene to give the film symmetry. Sometimes it works and sometimes it seems overly mannered. I've watched "Your Friends and Neighbors" three times and, at different points, viewed LaBute as a ferociously honest visionary and a smug elitist. I'm sure he would be delighted at my reactions. His ability to both enthrall and anger is testimony to his skills as a filmmaker and provocateur. Neil LaBute is the real deal and "Your Friends and Neighbors" is a hell of a movie.
© 1998 Ed Johnson-Ott
The review above was posted to the
rec.arts.movies.reviews newsgroup (de.rec.film.kritiken for German reviews).
The Internet Movie Database accepts no responsibility for the contents of the
review and has no editorial control. Unless stated otherwise, the copyright
belongs to the author.
Please direct comments/criticisms of the review to relevant newsgroups.
Broken URLs inthe reviews are the responsibility of the author.
The formatting of the review is likely to differ from the original due
to ASCII to HTML conversion.
Related links: index of all rec.arts.movies.reviews reviews


| variableId { componentSelector } |
If the variable is an array, collection, record or union, its parts (components) can be selected using subscripts and field names (using componentSelectors). The form of a componentSelector is one of:\
| (a) | ( expn {, expn} ) | ||
| (b) | . fieldId |
Form (a) is used for subscripting (indexing) arrays and collections. The number of array subscripts must be the same as in the array's declaration. A collection has exactly one subscript, which must be a pointer to the collection. Form (b) is used for selecting a field of a record or union.
var k : int
var a : array 1 .. 100 of real
var r :
record
name : string ( 20 )
phone : string ( 8 )
end record
k := 5
a ( k ) := 3.14159
r . name := "Steve Cook"


Adrian Gonzalez Barbosa
Software engineer
Hi, I’m a sysadmin and developer from Spain, currently
located in Ourense, Galicia. I've been working since I started the degree in Computing in 2011
in order to improve my experience, after graduating I've started the Master in Computing, since then, I've kept being a self-learner in the field of IT. I've been in multiple startups and have
my own stack of solo projects, don't hesitate and check my repos.
past
2015 — Worked as web developer in Ziblec
2015 — Graduated from University of Vigo
2016 — DevOps at AceCaliber
2017 — Consultant for Arbentia
now
2018 — DevOps at TxStockData (in the SenseiZero proyect).
languages
English; Spanish; Galician;


CORNER
CAFÉ
Proudly Serving Strange Food Since 1994
The origins of the Corner Cafe began in 1967 when Chris Duffey made his first potato chip sandwich. He knew he liked to not only eat sandwiches, but invent and make them. Through a special turn of events, he started working in restaurants. He walked through the snow three miles each way and finished his degree in Business Management at the University of West Georgia.
In 1994, while managing a local restaurant, he began to dream about a restaurant with sandwiches and NO BOUNDARIES. If it could be cooked, then it certainly belonged between bread. While plotting his scheme of opening a new restaurant, he was overheard by fellow employee Michael Bunch. Bunch asked how much it would cost to open the restaurant and Chris told him. A week later, Bunch returned with a checkbook and gave it to Chris. Thus began the partnership. In May of 1994, the Corner Cafe opened its doors.
In the beginning, there was lots of music, poetry and anything that would get people in the door. Bunch booked the entertainment and made sure that whether it was good or horrible, it was always entertaining. Many local Carrollton celebrities got their start at the Corner. But as they came and enjoyed the entertainment, they also enjoyed the food-fresh baked foccacia, cream cheese, avocado, bacon, pot roast like your mom would make…The atmosphere at the Corner is quirky and laid-back-everyone is welcomed.
Chris and Bunch might have started the Corner Cafe, but over the years it has evolved into a community collaboration. Recently, the Corner Cafe was featured on GPTV’s Georgia Traveler. In conclusion, if a sandwich is made for a to-go order and no one picks it up, was the sandwich actually made?


Looking to contribute something to CoreUI Free Angular Admin Template? Here's how you can help.
Please take a moment to review this document in order to make the contribution process easy and effective for everyone involved.
Following these guidelines helps to communicate that you respect the time of the developers managing and developing this open source project. In return, they should reciprocate that respect in addressing your issue or assessing patches and features.
The issue tracker is the preferred channel for bug reports, features requests and submitting pull requests, but please respect the following restrictions:
Please do not use the issue tracker for personal support requests.
Please do not post comments consisting solely of "+1" or ":thumbsup:". Use GitHub's "reactions" feature instead.
Please do not open issues or pull requests regarding the code in @coreui/coreui
and @coreui/coreui-angular
(open them in their respective repositories).
A bug is a demonstrable problem that is caused by the code in the repository. Good bug reports are extremely helpful, so thanks!
Guidelines for bug reports:
Validate and lint your code — to ensure your problem isn't caused by a simple error in your own code.
Use the GitHub issue search — check if the issue has already been reported.
Check if the issue has been fixed — try to reproduce it using the latest master
or development branch in the repository.
Isolate the problem — ideally create a reduced test case and a live example. This JS Bin is a helpful template.
A good bug report shouldn't leave others needing to chase you up for more information. Please try to be as detailed as possible in your report. What is your environment? What steps will reproduce the issue? What browser(s) and OS experience the problem? Do other browsers show the bug differently? What would you expect to be the outcome? All these details will help people to fix any potential bugs.
Example:
Short and descriptive example bug report title
A summary of the issue and the browser/OS environment in which it occurs. If suitable, include the steps required to reproduce the bug.
- This is the first step
- This is the second step
- Further steps, etc.
<url>
- a link to the reduced test caseAny other information you want to share that is relevant to the issue being reported. This might include the lines of code that you have identified as causing the bug, and potential solutions (and your opinions on their merits).
Feature requests are welcome. Before opening a feature request, please take a moment to find out whether your idea fits with the scope and aims of the project. It's up to you to make a strong case to convince the project's developers of the merits of this feature. Please provide as much detail and context as possible.
Good pull requests—patches, improvements, new features—are a fantastic help. They should remain focused in scope and avoid containing unrelated commits.
Please ask first before embarking on any significant pull request (e.g. implementing features, refactoring code, porting to a different language), otherwise you risk spending a lot of time working on something that the project's developers might not want to merge into the project.
Adhering to the following process is the best way to get your work included in the project:
Fork the project, clone your fork, and configure the remotes:
# Clone your fork of the repo into the current directory
git clone https://github.com/<your-username>/free-angular-admin-template.git
# Navigate to the newly cloned directory
cd free-angular-admin-template
# Assign the original repo to a remote called "upstream"
git remote add upstream https://github.com/coreui/coreui-free-angular-admin-template.git
If you cloned a while ago, get the latest changes from upstream:
git checkout master
git pull upstream master
Create a new topic branch (off the main project development branch) to contain your feature, change, or fix:
git checkout -b <topic-branch-name>
Commit your changes in logical chunks. Please adhere to these git commit message guidelines or your code is unlikely to be merged into the main project. Use Git's interactive rebase feature to tidy up your commits before making them public.
Locally merge (or rebase) the upstream development branch into your topic branch:
git pull [--rebase] upstream master
Push your topic branch up to your fork:
git push origin <topic-branch-name>
Open a Pull Request with a clear title and description against the master
branch.
IMPORTANT: By submitting a patch, you agree to allow the project owners to license your work under the terms of the MIT License.
Inspired by Sparkbox's awesome article on semantic commit messages.  See this A11Y Project post for more details.$().focus()
). Instead, use $().trigger(eventType, ...)
or $().on(eventType, ...)
, depending on whether you're firing an event or listening for an event. (For example, $().trigger('focus')
or $().on('focus', function (event) { /* handle focus event */ })
) We do this to be compatible with custom builds of jQuery where the event aliases module has been excluded.By contributing your code, you agree to license your contribution under the MIT License.


Ever had too may events to keep track of? Ever had an Existensial Crisis owing to the fact that you forgot to apply for a Hackathon and missed all that shwaaaag? Ever wished you could find all these events in one place such that they were easy to find and you could even get automated alerts of any such upcoming event? Fear not. #FOMOTherapy is here.


What is the Cyclomatic Complexity(CC) ?
Cyclomatic complexity is a software metric (measurement), used to indicate the complexity of a program.
It is a quantitative measure of the number of linearly independent paths through a program's code.
How to REDUCE Cyclomatic Complexity(CC) ?
1. Add private methods with meaningful names to remove duplicate code
2. Add private methods with meaningful names to wrap any functionalities that are not directly related to business logic such as
SAMPLE CODE
@ Bad Code
public ResponseObject generateResponseObject(String route) {
ResponseObject responseObject;
if (route.equals("time")) {
responseObject = new TimeResponse();
} else if (route.equals("echo")) {
responseObject = new EchoResponse();
} else if (route.equals("redirect")) {
responseObject = new RedirectResponse();
} else if (route.equals("file")) {
responseObject = new FileResponse();
} else {
responseObject = new FormResponse();
}
return responseObject;
}
@ Good Code
public ResponseObject generateResponseObject(HashMap routes) {
ResponseObject responseObject;
String route = httpRequestContent.get("route");
responseObject = routes.get(route);
return responseObject;
}


A dataset containing the values and other attributes of > 580 force of infection estimates of dengue. The variables are as follows:
foi
A data frame with 382 rows and 11 variables:
unique identifier
type of study where the force of infection estimate was sourced from (serology, caseReport, pseudoAbsence)
date of the study
longitude of the location of the study
latitude of the location of the study
country where the study was carried out
3-digits country code
GADM administrative unit level 0 code
GADM administrative unit level 1 code
force of infection estimate (0.00000000--0.06159744)
size of the human population in level 1 adm unit


Honzi/Guides/Terraria
- Base Building:
- Build a base at the initial spawn location, for you will return there when you load the world or die.
- Put an object that you can move thru, such as a platform, on the inside of your main entrance doors. This will prevent enemies from opening them from the outside.
- Utilize the following in every base:
- Campfire: increased life regeneration.
- Cooking Pot: crafting.
- Glass Kiln: crafting.
- Heavy Work Bench: crafting.
- Work Bench: crafting.
- Utilize optional items if their effects are desired:
- Mushroom Grass: Glowing Mushrooms and Mushroom Seeds.
- Sunflowers: increased movement speed and reduced enemy spawn rate.
- Enable "UseExperimentalFeatures" to see and set world generation seeds. This allows you to scout ahead or farm materials in disposable copies of your main world.
- Entering a created world spawns you at the same spawn location as when it was first created, regardless of your location when you saved and exited.
- Renewable Items
- Take your coins out of a chest and then put them back into the chest to properly stack coins without making additional stacks.
- Your character's inventory remains constant, even when switching to different worlds. This results in unlimited of every resource, as long as you are willing to gather them in a different world.


Next you can learn general concepts about Bee applications:
A Bee project is a folder with a specific structure. A project contains one or more applications that can run independent of each other on same computer or a group of computers. For example applications can be designed to collaborate with each other into n-tire architecture or can be a group of OS commands for image manipulation.
project tree
Next project tree contains two applications: client/server and show folders where you should put your code (src+lib) and documentation (doc). This is a recommendation but not a hard rule. You can organize your project better if you are experienced developer.
$pro_home
|-- bin
| |-- client.exe
| |-- server.exe
|
|-- src
| |-- module1.bee
| |-- module2.bee
|
|-- lib
| |-- library1.bee
| |-- library2.bee
|
|-- doc
| |-- readme.md
| |-- index.html
|
|-- client.bee
|-- server.bee
System variables are using "$" prefix. There are several predefined system variables available in Bee. These can be used to locate project files or connect to databases. You can define new system variables at the beginning of main module or in configuration files.
| Variable | Environment | Description |
|---|---|---|
| $bee_home | BEE_HOME | Bee home folder |
| $bee_lib | BEE_LIB | Bee library home |
| $bee_path | BEE_PATH | Bee library path |
| $pro_home | N/A | Project home folder |
| $pro_lib | N/A | Project library folder |
| $pro_mod | N/A | Project modules folder |
| $pro_log | N/A | Log output folder |
Compiler directives are system variables that control the compilation process. You can setup these options in compiler configuration file or in source file. You can not change these options after compilation. They are available for introspection.
System environment variables are using the same prefix "$". So there is a conflict. To avoid this conflict, you should use capital letters for environment variables. Bee is loading only environment variables specific to Bee.
| Constant | Default | Description |
|---|---|---|
| $max_precision | 0.00001 | Control numeric precision |
| $max_recursion | 10000 | Control how deep a recursion before give up |
| $max_iteration | 0 | Control how many iterations before give up |
| $loop_timeout | 60 | Control time in seconds before a loop is forced to give up |
| $log_debug | "Off" | Control if debug information is included |
| $log_echo | "Off" | Control if statement is printed to console in case of error |
| $log_trace | "Off" | Control if @trace variable is getting populated with information |
| $date_format | "DMY" / "MDY" | Control date format: DD/MM/YYYY or MM/DD/YYYY |
| $time_format | "T24" / "T12" | Control time format: HH:MM:SS,MS am/pm or HH:MM:SS,MS |
| $platform | "Windows" | Alternative: "Linux", "Mac" is the target platform |
Global variables are defined usually at the beginning of a module outside of any rule.
Following system variables are available for debugging:
| $timer | duration information about last statement |
| $stack | debug information about current call stack |
| $trace | reporting information about statements |
| $query | last query statement |
| $error | last error object |
| $threads | number of active threads |
| $trial | trial object, contain last trial messages |
As we mentioned already Bee is modular. It means one large project can be split into parts. Each part can contain reusable rules. A module can load several other modules. An application need an entry point that orchestrate the program execution. This is called the "main" module. Below we explain each kind of module:
Main module contains declarations for the main rule. One project can have one or more main modules. Each main module represent one single application. Main module is located in the project root folder.
Notes:
A good designer will split a large problem into secondary modules. These modules are similar to the main module except they do not have the main rule. One secondary module can be used in one or more relate applications. Secondary modules are located in src folder. These modules can be loaded into other modules to be re-used.
Notes:
A library module is a file located in "lib" folder having extension *.bee. It is called simply: module. A library module can load other library modules and can execute its rules multiple times. You can install new libraries by downloading from the internet a package. Lib folder can have multiple sub-folders, where you create or modify a set of related libraries to be distributed for other people using a package creator tool.
A module can define "rules". These are sub-programs that can be executed on demand. One special rule is the main rule that can be defined only in the main module. This rule can receive multiple parameters and is automatically executed when a program starts.
# main rule
rule main(*params ∈ S):
** read the number of parameters
new c := params.count;
panic if (c = 0);
** print comma separated parameters
new i:= 0 ∈ Z;
while (i < c) do
write params[i];
let i += 1;
write "," if (i < c);
repeat;
** print the buffer to console
print;
return;
Do not try to understand this example right now. It is just a warming-up code!
Library modules that are reusable for multiple projects can be imported in Bee "lib" sub-folder. This folder is available in Bee as a system constant called: $bee_lib. You can install a set of libraries in a sub-folder of "$bee_lib". Then you can reuse external library by using "load" keyword. The folders can be concatenated using "." string operator.
# loading modules
use $bee_lib.folder_name.(*); -- load all modules from folder
use $bee_lib.folder_name.(x,y,z); -- load modules x.bee, y.bee and z.bee
Qualifier Bee can use "dot notation" to locate external members. This technique is used to avoid name collision if one library has names that collide with other library.
# load a single module and create a qualifier
use $bee_lib.folder_name.module_name as qualifier; -- load a single module
...
apply qualifier.member_name; -- using dot notation with qualifier
...
1. A module can be loaded using a qualifier multiple times. However I do not see a useful use-case for this feature yet. I think is unusual to have same module loaded twice. It will be a waste of resources to do this.
2. All public members must use the specified qualifier or you can use "with" block to suppress the qualifier for a region of code. Using "with" is useful but sometimes not good enough so we have also invented the "alias".
#load examples
use cpp:$runtime.cpp_lib.(*); -- load cpp library
use asm:$runtime.asm_lib.(*); -- load asm library
use bee:$runtime.bee_lib.(*); -- load bee core library
use pro:$program.pro_lib.(*); -- load project library
One application has a global scope where variables and constants are allocated. Each secondary module can contribute with global variables and public elements that can be merged in this single scope. Global scope can be also called application scope;
A module has its own scope, that is called name-space where you can define members and statements. Module scope can contain public or private members. Public members start with "." while private members do not have any prefix or suffix.
#define a module
module demo_module:
** public constant
set .pi: 3.14;
** expression rule foo is private
rule foo(x ∈ N) ∈ N => (x + 1);
** block rule bar is public
rule .bar(x, y ∈ N) => (r ∈ N):
** define local variable
new str := "test";
...
** assign the result
let r := x + y; -- r, x, y are locals
return;
The main module can load numerous secondary modules or libraries. After loading, all public elements of a library can be accessed on demand using dot notation. You can not have collisions of names, except if you use "with" blocks. To simplify the code you can use "alias" statement and can rename a rule belonging to loaded modules.
Aliases:
You can create an alias for a specific member to eliminate the qualifier. This rule can be used to "merge" public members into current scope. A member can have one single alias in a module. If you do it multiple times, only the last alias is used. It is a bad practice to change the alias of a member.
** import library module
use library as qualifier
** create alias for a particular member
alias new_name: qualifier.member_name;
This example demonstrate how to use a rule from a module named "module_name"
#define program name
** loading a module with qualifier
use $pro.src.demo_module as demo;
** give alias to module rule
alias sum = demo.bar;
** define main rule
rule main:
** call rule using qualifier
new test := demo.bar(1,1); -- 2
** call rule using alias
new result := sum(1,1); -- 2
** call rule using "with" block
with demo do
print foo(2); -- 3
print bar(2,1); -- 3
done;
return;
Hiding: To hide a public member instead of making an alias you can use keyword "hide". You can hide any public members from a loaded module. If you use a regular expression you can hide several public members that use a specific pattern.
hide qualifier.member_name;
hide qualifier.(reg_exp_pattern);
You can execute the public methods of a secondary module in two modes: synchronous mode and asynchronous mode. This is how you can split a large applications into smaller, more manageable parts that can be executed in parallel.
In next module called: "test_module.bee", we create a public rule that delay execution for several seconds using "wait" then it returns a result "r" equal to the argument value "t". So the rule basicity does nothing but wait.
# secondary module: test_module.bee
rule .test(t ∈ Z) => (r ∈ N):
let r := t; -- prepare the result
wait t; -- wait for t seconds
return;
Let's use the module previously defined in synchronous mode.
# main module
use $pro_src.test_module;
alias test = test_module.test;
+--------------------------------
execute test() and append result
at the end of "collect" list
--------------------------------+
rule main:
** define a collector (list)
new collect ∈ (N);
apply collect <+ test(30);
apply collect <+ test(40);
apply collect <+ test(10);
apply collect <+ test(20);
** the collector is unordered
print collect; -- (30,40,10,20)
return;
Let's use the module previously defined in asynchronous mode. For this we use keywords "begin" to start a process and "wait" for all asynchronous sub-processes to synchronize.
# main module
use $pro_src.test_aspect.(*);
+-----------------------------------------
execute test() and append result
at the end of "collect" list
-----------------------------------------+
rule main:
** define a collector (list)
new collect ∈ (N);
begin collect <+ test(30); -- open one thread
begin collect <+ test(40); -- open one thread
begin collect <+ test(10); -- open one thread
begin collect <+ test(20); -- open one thread
wait; -- stop and wait for the all open threads to finish
** the collector is ordered
print collect; -- (10,20,30,40)
return;
Note: By using begin and wait you can create multi-session applications. Each aspect is executed on a different core, and the application runs them in parallel. The main thread is waiting using resolve keyword for the threads to finish.
Read next: Data Types


Nalanda near Patna is where you can find the archaeological remains of a Mahavihara or Buddhist monastery, which was one of the earliest and finest universities in India. In ancient days, this monastic and scholastic institution was located in the kingdom of Magadha, which is now the modern state of Bihar. Nalanda University Archaeological Complex is currently located about 84 km away from Patna, the capital city of Bihar. A visit to the complex makes for an enriching journey into history, architecture, culture, and Buddhism.
Nalanda near Patna is where you can find the archaeological remains of a Mahavihara or Buddhist monastery, which was one of the earliest and finest universities in India. In ancient days, this monastic and scholastic institution was located in the kingdom of Magadha, which is now the modern state of Bihar. Nalanda University Archaeological Complex is currently located about 84 km away from Patna, the capital city of Bihar. A visit to the complex makes for an enriching journey into history, architecture, culture, and Buddhism.
Mysore Palace, also called Amba Vilas Palace, is one of the most magnificent and largest palaces in India. Situated in the southern state of Karnataka, it used to be the official residence of the Wodeyar Dynasty, the rulers of Mysore from 1399 to 1950. The grand palace stands tall in the heart of Mysore city and attracts visitors from across the world. Mysore Palace is built in the Indo-Saracenic style with a touch of Hindu, Mughal, Rajput, and Gothic architectural styles. The three-storied palace along with a 145 feet five-storied tower was built using fine grey granite while deep pink marble was used for the domes.


fdsfdssddddddddddddddddddddddddddddddd sfsdkfldskf ldskfosdkfofk eowfkoewfk ewokferegerg ewofkewofkeo wfewfefefefefdsgfdgdfgdfg


{% extends "movie_library/base.html" %} {% block title%}tmDB - Featured Movies{% endblock%} {% block content %}


Plant Sculptures -
One of the striking features of the Gardens is the works of topiary. The intricately trimmed shrubs take the shape of animals and provide many photo ops for excited visitors, about 2 million of whom visit the gardens every year. Visitors can take walks under the shade of the pergolas, passageways covered by creeper plants and rest under one of the many gazebos that speckle the area.


--- { "atomic": "molecule", "dna": "btn-disabled" } ---
Adding the disabled attribute to a button will apply the disabled state.


Ben Webster
Ben is Founder and CEO of Mosaik.
Ben previously worked at the International Organisation for Migration (IOM) Syria crisis team in Jordan, the UK Foreign Office, and Transparency International, and has led research on peer-to-peer platforms for the UK Government.


Stephany was born in Memphis, Tennessee, but her family moved to Lincoln when she was five years old. She would return to the south for her high school years, but chose to come back to Lincoln, Nebraska to study at the University of Nebraska-Lincoln in 2008.
She graduated with her Bachelors’ degree in Political Science and German and went on to serve in AmeriCorps. Stephany served with College Possible, a program that matched her values; it believed higher education should be available to everyone, despite income. Stephany taught college preparatory classes to first-generation, low-income students at Omaha North High School. As Omaha North’s first Senior Coach, Stephany was able to get 90% of her students admitted to a four-year college.
After AmeriCorps, Stephany pursued her dream of becoming a lawyer. While in law school, she served the Pro Bono Committee to improve the public service program within the law school and to provide citizens with limited means to more access within the justice system. She also served as the Vice President of the Multicultural legal society, encouraging diverse first-generation students to go to law school.
Since passing the bar, she has served Nebraska a public interest lawyer. Public interest lawyers serve clients with limited means and are paid by nonprofits and governments rather than collecting legal fees from clients. Stephany chose this profession because she believes that every American deserves access to justice, despite their income. Stephany began her law career serving Nebraskans with disabilities at Disability Rights of Nebraska, and has recently begun serving students at the University of Nebraska - Lincoln.


V4 has been the easiest project thus far. I was able to use the learning objectives that pertained
to my project. I didn't spend as much time as I have in the past few weeks. When looking over the objectives I knew exactly
where I wanted to use them in my project. Things came together very nicely.
This week I adding the following to my website: text box in a form,radio buttons in a form,selection list in a form,
text area in a form,submit button in a form, demonstrate how to format a form with CSS,
demonstrate the use of the video element for embedding video in a Web page (HTML),
demonstrate how to format media with CSS,demonstrate the use of the iframe element (HTML),demonstrate a CSS animation or transition.
The only Learning Objective that I didn't use for this project was
M7LO6 Demonstrate the use of check boxes in a form. Also I was not able to get my iframe to work with
the YouTube video I selected so I created my own video to show that I understood the concept.


Let the GAAAAMES BEGINNN!!!!
No birthday can be complete without a solid birthday song...
Light a candle on your (real) cake!
Roses are red,
Violets are blue,
When when the cake's in CSS,
The party's on Zoom.
"Happy birthday to the world's sleepiest dogwalker and sloppiest chess player. How does it feel to be 21? Hope you find it as unnerving as I did a year ago. You probably didn't want your party to be virtual, but I promise we put in more effort than Bollinger did for the graduation ceremony. Nonetheless, I hope you enjoy this very special day. Perhaps you can go do vodka shots with Tama." - Ian
"One year ago on this special day, we were stuffing our faces with cheesy, tomato-y gnocchi in the East Village (there’s gnocchi in the basket!! – courtesy of Huy). Although 2020 hasn’t been as friendly as 2019– and I mean, wow, it’s really sucked– you have really grabbed the bull by the horns (the virus by its ‘crown..?’) and made this year your own. You are already a non-profit founder, a published writer, and this year is only halfway finished. Happy birthday, we’re proud of you Anners!" - Amei
"Hey girl. You should name the plant Larry 4.0 and the sunflower Paul." - Huy


Class TcpStream
Extends StreamA tcp stream represents a TCP connection to a host on the internet. More...
Methods
| Connect : Bool ( host:String, port:Int ) |
Detailed Discussion
A tcp stream represents a TCP connection to a host on the internet.After creating a tcp stream, you should use the Connect method to make a connection to a remote host.
Note that TCP streams are only currently supported on the glfw, ios, android and stdcpp targets.
Here is a simnple example of using a tcp stream to read the monkeycoder site home page:
#If TARGET<>"glfw" And TARGET<>"android" And TARGET<>"ios" And TARGET<>"stdcpp" #Error "Invalid target!" #Endif Import brl.tcpstream Function Main() Local stream:=New TcpStream If Not stream.Connect( "www.monkeycoder.co.nz",80 ) Print "Failed to connect!" Return Endif Print "Connected!" stream.WriteLine "GET / HTTP/1.0" stream.WriteLine "Host: www.monkeycoder.co.nz" stream.WriteLine "" While Not stream.Eof() Local line:=stream.ReadLine() Print line Wend stream.Close Print "BYE!!!!" End
Method Documentation
Method Connect : Bool ( host:String, port:Int )
Attempts to connect to the specified host and returns true if successful.Once connected, you can use stream read/write commands to communicate with the host.


{{(currentAddress$|async).name}} {{(currentAddress$|async).surname}}
{{(currentAddress$|async).phone1}} / {{(currentAddress$|async).phone2}}
{{(currentAddress$|async).address}}
{{(currentAddress$|async).CP}} {{(currentAddress$|async).city}}
{{(currentAddress$|async).country}}


| c!daily |
Gives you your daily tickets (every 24 hours) |
c!daily
|
| c!profile |
Shows your Campfire bot profile |
c!profile
|
| c!tickets |
Check yours or another person's tickets. |
c!tickets @Marshmallow#4434
|
| c!claim |
Claim a promo code |
c!claim XXXXX
|
| c!crime |
Commit a crime |
c!crime
|
| c!deposit |
Deposit money into your safe account. This money cannot be robbed.
|
c!deposit (ammount/all)
|
| c!withdraw |
Take money out of your deposit into your balance. |
c!withdraw (ammount/all)
|
| c!work |
Work a job and get paid |
c!work
|
| c!rob |
Rob another user
|
c!rob @Marshmellow#4434
|


My long term goals are to eventually become a front end web developer. At this stage I am still new to everything in the developer space so I feel like I will get a better idea as I go along what I will enjoy to be focusing on long term and what my career aspirations will be after this course. I find that I am someone who will get the job done themselves and not reach out for others to help along the way despite enjoying working in team environments in the past therefore I would like to develop that further. I believe I am passionate about the digital space, a hard worker and curious in nature. I'm always looking to grow and develop new skills which really excites me about becoming a web developer because you are forever learning new skills and evolving within the technology. My limitations would be working on reaching out and utilising others skills to enhance my own and something I will be working on. When working on my personal projects I am managing my workload in this programme by each week working towards keeping to the timeslots allocated and reaching out at times that I am stuck to get help from my cohort or facilitators. I'll ensure that I don't spend more than 20-30mins on an issue without reaching out for assistance. I will be aiming to spend 1-2 hours per day developing my personal blog whilst allocating other time to learning a developing new skills to incoporate.


To install Rust, open up your terminal, copy the text below, paste it into your terminal and hit enter.
Ensure that you have xcode-tools installed.
Depending on what OS you are running, you might require an extra step or two.
The easiest way to get familiar with Nannou is to explore the examples. To get the examples we just need to clone from the gitHub repository here
If you do not have git installed, Download it here.
Now, change the current directory to nannou.
Run the example using cargo.
The --release flag means we want to build with optimisations enabled.
Note: If you are compiling nannou for the first time you will see cargo download and build all the necessary dependancies.
 Feel free to ask a question or give some feedback.
We would be happy to hear from you!


{% extends 'base.html' %} {% load bootstrap4 %} {% load static %} {% block content %}
Welcome to Moringa Alumni
Forums are groups where you get to meet like minded people and discuss common ideas.
Propose and idea and let other join in. Build great products wth great people
{{news.description|safe}}
{{story.description|safe}}
{{group.description|safe}}


Module asset
Asset manager for Lua.
Loads asset and cache them.
This only provides a streamlined way to handle asset, and doesn’t handle the actual file loading/object creation itself; you are expected to provide your own asset loaders.
See the Asset:__call method for more details on how assets are loaded. Hopefully this will allow you to use asset which are more game-specific than “image” or “audio”.
TODO: async loading
No dependencies.
Usage:
TODO
Functions
| new (directory, loaders[, mode="auto"]) | Create a new asset manager. |
Asset objects
| Asset.prefix | A prefix for asset names. |
| Asset.cache | The asset cache. |
| Asset.loaders | The loaders table. |
| Asset:__call (assetName, ...) | Load (and cache) an asset. |
| Asset:load (list) | Preload a list of assets. |
| Asset:clear () | Allow loaded assets to be garbage collected. |
Functions
- new (directory, loaders[, mode="auto"])
-
Create a new asset manager.
If the caching “mode” is set to auto (default), the asset manager will allow assets to be automaticaly garbage collected by Lua.
If set to “manual”, the assets will not be garbage collected unless the clear method is called. “manual” mode is useful if you have assets that are particularly slow to load and you want full control on when they are loaded and unloaded (typically a loading screen).
Parameters:
- directory string the directory in which the assets will be loaded
- loaders table loaders table: {prefix = function, …}
- mode string caching mode (default "auto")
Returns:
-
Asset
the new asset manager
Asset objects
- Asset.prefix
-
A prefix for asset names.
Type:
string
- Asset.cache
-
The asset cache. Each cached asset is indexed with a string key “type.assetName”.
Type:
table
{["assetName"]=asset} - Asset.loaders
-
The loaders table.
Type:
table
{["prefix"]=function, ...} - Asset:__call (assetName, ...)
-
Load (and cache) an asset.
Asset name are similar to Lua module names (directory separator is the dot . and no extention should be specified). To load an asset, ubiquitousse will try every loaders in the loader list with a name that prefix the asset name. The first value returned will be used as the asset value.
Loaders are called with the arguments:
- path: the asset full path, except extension
- …: other arguments given after the asset name. Can only be number and strings.
Parameters:
- assetName string string the asset’s full name
- ... number/string other arguments for the asset loader
Returns:
-
the asset
Usage:
local image = asset("image.example")
- Asset:load (list)
-
Preload a list of assets.
Parameters:
- list {"asset1",...} list of assets to load
- Asset:clear ()
- Allow loaded assets to be garbage collected. Only useful if the caching mode is set to “manual” duritng creation.


A business planning problem is the difficulty which is inherent in the organizing of limited resources. The difficulty is caused by the large number of possible arrangements that need to be checked as potential best solutions.
Many common and seemingly simple business operations start off small enough to be planned manually, but grow to a size that makes finding the best plan impossible using traditional methods.
A classic example is the traveling salesman problem
Solving your planning problem with Talos Solver is straightforward. First, a solution is defined in terms of what is necessary and what is ideal. Second, an algorithm is created to measure any proposed or existing solutions. Next, a search algorithm is created to efficiently search for and compare solutions. Finally, the process is integrated into your work flow, allowing it to be accessed whenever it is needed.
24 hour scheduling for Alberta Health Services Emergency Department physicians
Doctors work around the clock and at various hospitals across Calgary. Creating a fair, safe and enjoyable work schedule becomes difficult to do by hand with more than about 20 doctors at a single location, and impossible when there is more 80 at multiple locations. Talos Solver is used to generate the best possible schedule, and then allow for editing the result to meet specific cases.
The school bus routing problem is a well known logistics topic. Academic Papers define the problem as: "SBRP seeks to plan an efficient schedule for a fleet of school buses where each bus picks up students from various bus stops and delivers them to their designated schools while satisfying various constraints such as the maximum capacity of a bus, the maximum riding time of a student in a bus, and the time window of a school. "
The Talos SBR focuses on the 'impossible' part of the problem: route selection. Given that a school has existing limitations on bus stop locations, class times, and an existing transportation budget, the SBR will find the best bus routes. Improvements over existing routes are based on reduced bus count or size, reduced maximum student travel time, and reduced total travel time.
A critical feature of the Talos SBR is that pre-existing conditions can be included in the route selection, and the definition of "best" is customized to each model. For example, some schools require grouping by age on each bus, so the best route includes that rule.


hai alana
my name is alana mary alex.
dom
Old Header
break a code line is after an operator or a comma.
Click Me!
animation


RobotLib
com.jdroids.robotlib.command
/
TimedCommand
/
isFinished
isFinished
protected
open
fun
isFinished
(
)
:
Boolean
Overrides
Command.isFinished
Ends command when timed out.


Horrified Labour councillor comes home to find swastika painted on her property
Councillor Cassi Perry tweeted an image showing a Nazi symbol emblazoned on a boat at her home in Cherwell, Oxfordshire
by Kara O'NeillA horrified Labour councillor came home last night to find a swastika painted on her private property.
Councillor Cassi Perry, who represents Banbury Cross and Neithrop, tweeted an image which showed the Nazi symbol scrawled in paint on the side of a boat she keeps at her home in Cherwell, Oxfordshire.
After reporting the incident to the police, Ms Perry then shared the shocking picture on social media.
On Twitter , Ms Perry wrote: "Came home to this sprayed on the side of my boat.
She later added: "Police have taken statements and photos.
"They are concerned it might be linked to some online stalking I've experienced this year.
"I'm hopeful it's just some kids being a***s.
"Self medicating with wine, chocolate and a movie."
Mirror Online contacted Councillor Cassi Perry for comment.
The tweet comes as two-thirds of women MPs admitted progress on tackling violence against female politicians affects whether they will stand for re-election.
At the end of October, Culture Secretary Nicky Morgan announced she was standing down as an MP because of the "clear impact" on her family and the abuse she has received.
The Culture Secretary joined a raft of women leaving parliament citing abuse and the pressures of the job on their mental health or family.
The Loughborough MP is the first member of Boris Johnson's Cabinet to say they will not stand again.
She has represented Loughborough for the Conservatives since 2010 and was previously education secretary.
It laid bare the divisions inside the Conservative Party despite the party insisting they were united ahead of the general election .
Cabinet minister Amber Rudd also announced she will not stand at the election.
And Lib Dem and former Conservative MP Heidi Allen cited “the nastiness and intimidation that has become commonplace” as why she would not seek re-election.
Sixty-five per cent of women MPs quizzed for the poll said progress on tackling violence against women in politics, including online, has an impact on their willingness to stand for re-election, compared with just 24% of men MPs.
The ComRes study of 147 MPs for the Commons Women and Equalities Committee found 43% believe the Speaker should be the single most responsible person for ensuring an inclusive culture in Parliament.
Committee chairwoman Maria Miller said: “A panel of MPs, peers and officials called for a more gender sensitive Parliament in their report to the Speaker in 2018.
“The Women and Equalities Committee’s inquiry has been considering what progress has been made by the House of Commons since then, but we can see from this research that MPs are unclear about who currently is responsible for driving the change that is wanted.
“However, what almost half of them are clear about is that most responsibility for fulfilling this role should lie with the Speaker.
“As part of our inquiry the committee has asked those standing for election to the position of Speaker to outline what they might do to address the issues raised.”


Welcome to guggmeta! This is one of the projects created with the Data API published by Guggenheim Helsinki Design Competition. The main goal of guggmeta is to expose the metadata left behind the PDF documents that were included in the 1,715 anonymous submissions.
Browse the submissions received or conduct your on searches!
This project is open source, which means the code is publicly available, can be reviewed, and anyone can join the project and suggest changes. Check out the repository.


HTML5 Hacks: Semantics
Custom Data and JS Event Delegate
MicroData
New Form Elements
Form Validation
New Events
Input
The Reboot of the Input Tag (HTML5 Input Tag)
New form elements in one form:
First name:
Last name:
E-mail:
Telephone:
Favorite Animal:
ID Number: