Skip to content

Instantly share code, notes, and snippets.

@urosgruber
Last active August 29, 2015 14:12
Show Gist options
  • Save urosgruber/84a70c7980ec13f2dfbc to your computer and use it in GitHub Desktop.
Save urosgruber/84a70c7980ec13f2dfbc to your computer and use it in GitHub Desktop.

Revisions

  1. urosgruber revised this gist Jan 2, 2015. 1 changed file with 5 additions and 1 deletion.
    6 changes: 5 additions & 1 deletion application.js
    Original file line number Diff line number Diff line change
    @@ -47,10 +47,14 @@ ShuttersView = Backbone.Marionette.CompositeView.extend({
    // Startup

    MyApp.addInitializer(function(options){
    var shutters = new ShutterCollection();
    shutters.fetch();

    var shuttersView = new ShuttersView({
    //model : ShutterModel,
    collection : ShutterCollection
    collection : sutters
    });

    MyApp.mainRegion.show(shuttersView);
    });

  2. @jturnsek jturnsek created this gist Jan 2, 2015.
    59 changes: 59 additions & 0 deletions application.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,59 @@
    MyApp = new Backbone.Marionette.Application();

    MyApp.addRegions({
    mainRegion: "#content"
    });

    // Models

    ShutterModel = Backbone.Model.extend({
    urlRoot: "/api/shutters",
    idAttribute: "_id"
    });

    ShutterCollection = Backbone.Collection.extend({
    model: ShutterModel,
    url: "/api/shutters"
    });

    // Views

    ShutterView = Backbone.Marionette.ItemView.extend({
    template: "#shutter-template",
    tagName: "tr",
    //className: "shutter",

    events: {
    'click .up img': 'shutterUp',
    'click .down img': 'shutterDown'
    },

    shutterUp: function(){
    console.log("Shutter Up");
    },

    shutterDown: function(){
    console.log("Shutter Down");
    }
    });

    ShuttersView = Backbone.Marionette.CompositeView.extend({
    //id: "shutters",
    template: "#shutters-template",
    childView: ShutterView,
    childViewContainer: ".collection-container"
    });

    // Startup

    MyApp.addInitializer(function(options){
    var shuttersView = new ShuttersView({
    //model : ShutterModel,
    collection : ShutterCollection
    });
    MyApp.mainRegion.show(shuttersView);
    });

    $(document).ready(function(){
    MyApp.start();
    });
    38 changes: 38 additions & 0 deletions index.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,38 @@
    <!DOCTYPE html>
    <html>

    <head>
    <title>Remote Shutter Control</title>

    <script src="./lib/jquery-2.1.3.js"></script>
    <script src="./lib/underscore.js"></script>
    <script src="./lib/backbone.js"></script>
    <script src="./lib/backbone.wreqr.js"></script>
    <script src="./lib/backbone.babysitter.js"></script>
    <script src="./lib/backbone.marionette.js"></script>

    <link href="./css/bootstrap.css" rel="stylesheet">

    <script src="./js/application.js"></script>
    </head>
    <body>
    <div id="content">
    </div>

    <script type="text/template" id="shutters-template">
    <table class="table-striped table-bordered">
    <!-- want to insert collection children, here -->
    <tbody class="collection-container"></tbody>
    </table>
    </script>

    <script type="text/template" id="shutter-template">
    <td><img class='shutter_pic' src='<%= image_path %>' /></td>
    <td><%= name %></td>
    <td>
    <div class='up'><img src='public/images/up.gif' /></div>
    <div class='down'><img src='public/images/down.gif' /></div>
    </td>
    </script>
    </body>
    </html>