test parse role
HTML
<script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.1/underscore-min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.2/backbone-min.js"></script>
<script src="http://www.parsecdn.com/js/parse-1.2.7.min.js"></script>
<div class="content">
</div>
<script type="text/template" id="manage-posts-template">
<div id="user-info">
Signed in as You
</div>
<div class="section">
<header id="header">
<input id="new-Post" placeholder=" Input " type="text" />
</header>
<div id="main">
<ul id="post-list">
</ul>
</div>
</div>
</script>
<script type="text/template" id="item-template">
<div class="view">
<a href="#" class="relation">
<img src="http://files.parse.com/1315e4d8-f302-4337-adbe-d8650ab5c312/bc5184a6-3ea8-4169-ba6a-033cf234a26a-pic" style="vertical-align:middle" width="40" height="40">
</a>
<label class="post-content"><%= name %></label>
<a href="#" class="innrrole">
<img src="http://files.parse.com/1315e4d8-f302-4337-adbe-d8650ab5c312/bc5184a6-3ea8-4169-ba6a-033cf234a26a-pic" style="vertical-align:middle" width="40" height="40">
</a>
</div>
</li>
</script>
<script type="text/template" id="role-template">
<div class="role">
<label class="role-content"><%= name %></label>
<a href="#" class="rmgroup">
<img src="http://files.parse.com/1315e4d8-f302-4337-adbe-d8650ab5c312/bc5184a6-3ea8-4169-ba6a-033cf234a26a-pic"
style="vertical-align:middle" width="40" height="40">
</a>
</div>
</li>
</script>
<script type="text/template" id="manage-roles-template">
<p id=prole-info/>
<div class="section">
<header id="header">
<input id="new-Role" placeholder="Type-Role-Name-here:" type="text" />
</header>
<div...
CSS
html, body {
margin: 0;
padding: 0;
}
button {
margin: 0;
padding: 0;
border: 0;
background: none;
font-size: 100%;
vertical-align: baseline;
font-family: inherit;
color: inherit;
-webkit-appearance: none;
-ms-appearance: none;
-o-appearance: none;
appearance: none;
}
body {
font: 14px'Helvetica Neue', Helvetica, Arial, sans-serif;
line-height: 1.4em;
background: #eeeeee ;
color: #4d4d4d;
width: 550px;
margin: 0 auto;
-webkit-font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
-ms-font-smoothing: antialiased;
-o-font-smoothing: antialiased;
font-smoothing: antialiased;
}
#postapp {
background: #fff;
background: rgba(255, 255, 255, 0.9);
margin: 130px 0 40px 0;
border: 1px solid #ccc;
position: relative;
border-top-left-radius: 2px;
border-top-right-radius: 2px;
box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.2), 0 25px 50px 0 rgba(0, 0, 0, 0.15);
}
#postapp:before {
content:'';
border-left: 1px solid #f5d6d6;
border-right: 1px solid #f5d6d6;
width: 2px;
position: absolute;
top: 45px;
top: 0px;
left: 40px;
height: 100%;
}
#postapp input::-webkit-input-placeholder {
font-style: italic;
}
#postapp input:-moz-placeholder {
font-style: italic;
color: #a9a9a9;
}
#postapp h1 {
position: absolute;
top: -120px;
width: 100%;
font-size: 70px;
font-weight: bold;
text-align: center;
color: #888;
-webkit-text-rendering: optimizeLegibility;
-moz-text-rendering: optimizeLegibility;
-ms-text-rendering: optimizeLegibility;
-o-text-rendering: optimizeLegibility;
text-rendering: optimizeLegibility;
}
.section {
position: relative;
}
#header {
padding-top: 15px;
border-radius: inherit;
}
#header:before {
content:'';
position: absolute;
top: 0;
right: 0;
left: 0;
height: 15px;
z-index: 2;
border-bottom: 1px solid...
JavaScript
Parse.$ = jQuery;
//IM me for how to get Parse.token if needed
Parse.initialize("3KxPBT...", "hxzy...");
var GroupCollection = new Backbone.Collection([
{name: "_sanfrn_7th"},
{name: "chicago_4th"}
]);
var RoleCollection = new Backbone.Collection([
{name: "Tim"},
{name: "Ida"},
{name: "Rob"}
]);
//POST MODEL
var Post = Parse.Role.extend({});
// POST COLLECTION
var PostList = Parse.Collection.extend({
model: Post
});
var Roles = new PostList();
//ROLE ROLE VIEW
var RoleRoleView = Parse.View.extend({
tagName: "li",
// TEMPLATE
template: _.template($('#role-template').html()),
events: {
'click .rmgroup': 'rmagrp'
},
initialize: function () {
var self = this;
_.bindAll(this, 'render', 'rmagrp');
this.render();
},
render: function () {
$(this.el).html(this.template(this.model.toJSON()));
return this;
},
rmagrp: function (Post) {
console.log("CLK on A tag");
alert("bugout");
var userId = Post.id;
var roleId = this.options.role;
}
});
var ManageRolesView = Parse.View.extend({
// Delegated events for creating new items, and clearing completed ones.
events: {
// "keypress #new-Role": "createOnEnter"
},
el: ".content",
initialize: function (options) {
var self = this;
var roleName = this.options.rolename;
Roles.bind('reset', this.addAll);
_.bindAll(this, 'addOne', 'addAll');
this.$el.html(_.template($("#manage-roles-template").html()));
this.$("#prole-info").html(roleName);
this.$("#role-list").html("");
this.addAll();
},
// Add a single Post item to the list by creating a view for it, and
// appending its element to the `<ul>`.
addOne: function (Role) {
var view = new RoleRoleView({
model: Role
});
...