2014-10-30 1 views
1

Я использую Meteor и Iron Router, большинство работает, я успешно получил страницу для перенаправления на родину при посещении/но я хочу, чтобы перенаправление перестало работать, когда был сделан выбор на карте.Я пытаюсь построить выбор карты, который позволяет вводить URL-адрес при выборе

Возможно, я не подхожу к этому правильно. Вы увидите ниже в функции клика BC1, что я хочу.

Вот мой MAP.js код ниже

function map(){ 
    Template.map.rendered = function(){ 
    var s = Snap("#map"); 

    // var snap = Snap(912,912); 






    Snap.load("/map.svg", function (f) { 

     var el = f.select("path#Fill-65");//Alberta 

     var BC = f.selectAll("path#Fill-112 , path#Fill-94");// All BC 

     var BC1 = f.select("path#Fill-112");// BC 1 

     var BC2 = f.select("path#Fill-94");//BC 2 

     var SK = f.select("path#Fill-114");//Saskatchewan 

     var MB = f.select("path#Fill-117");//MANITOBA 

     var QB = f.select("path#Fill-116");//QUEBEC 

     var ON = f.select("path#Fill-120");//ONTARIO 

     var T1 = f.select("path#Fill-115");//T1 








     var filterMap = s.paper.filter(Snap.filter.shadow(-2, 0, 3, '#000', '0.5')); 

     var filterMapNone = s.paper.filter(Snap.filter.shadow(0, 0, 0)); 

     BC1.hover(function(){ 
     allBcOn(); 
     }, function() { 
     allBcOff(); 
     }); 


     BC1 .click(function(){ 
     alert("Enter You West Coaster"); 
     enter = "false"; 
     /////SEND TO NEXT PAGE////// 
     }); 


     function allBcOn(){ 
     BC.forEach(function(elem,i) { 
      elem.animate({fill: "#fff"},500); 
      elem.attr({filter: filterMap }); 
     }); 
     } 

     function allBcOff(){ 
     BC.forEach(function(elem,i) { 
      elem.animate({fill: "#C2C2C2"},500); 
      elem.attr({filter: undefined }); 
     }); 
     } 




     el.hover(function(){ 
     //el.attr({fill: "#000"}); 
     el.animate({fill: "#fff"},500); 
     el.attr({filter: filterMap }); 
     }, function() { 
     el.attr({filter: undefined }); 
     el.animate({fill: "#C2C2C2"},500); 

     }); 

     SK.hover(function(){ 
     //el.attr({fill: "#000"}); 
     SK.animate({fill: "#fff"},500); 
     SK.attr({filter: filterMap }); 
     }, function() { 
     SK.attr({filter: undefined }); 
     SK.animate({fill: "#C2C2C2"},500); 

     }); 

     MB.hover(function(){ 
     //el.attr({fill: "#000"}); 
     MB.animate({fill: "#fff"},500); 
     MB.attr({filter: filterMap }); 
     }, function() { 
     MB.attr({filter: undefined }); 
     MB.animate({fill: "#C2C2C2"},500); 

     }); 

     QB.hover(function(){ 
     //el.attr({fill: "#000"}); 
     QB.animate({fill: "#fff"},500); 
     QB.attr({filter: filterMap }); 
     }, function() { 
     QB.attr({filter: undefined }); 
     QB.animate({fill: "#C2C2C2"},500); 

     }); 

     ON.hover(function(){ 
     //el.attr({fill: "#000"}); 
     ON.animate({fill: "#fff"},500); 
     ON.attr({filter: filterMap }); 
     }, function() { 
     ON.attr({filter: undefined }); 
     ON.animate({fill: "#C2C2C2"},500); 

     }); 

     T1.hover(function(){ 
     //el.attr({fill: "#000"}); 
     T1.animate({fill: "#fff"},500); 
     T1.attr({filter: filterMap }); 
     }, function() { 
     T1.attr({filter: undefined }); 
     T1.animate({fill: "#C2C2C2"},500); 

     }); 

     g = f.select("g"); 

     s.append(g); 


    }); 
    } 

**

UPDATE

**

Это мой новый код. Для железного маршрутизатора. Я не знаю, где положить функцию map.js click, чтобы она работала, и когда я посещаю/дух, я получаю ошибку ниже нового кода. Страница/sprit должна отправить вас на домашнюю страницу, если вы не сделали клик на bcClick.

Router.configure({ 
    layoutTemplate: 'layout', 
    loadingTemplate: 'loading', 
    notFoundTemplate: 'notFound', 

    waitOn: function() { return Meteor.subscribe('posts'); } 
}); 

Router.map(function() { 
    this.route('home', {path: '/'}); 
    this.route('postsList', {path: '/spirit'}); 
    this.route('postPage', { 
    path: '/spirit/:_id', 
    data: function() { return Posts.findOne(this.params._id); } 
    }); 
    this.route('login', {path: '/login'}); 
}); 


Router.onBeforeAction('loading'); 
Router.onBeforeAction('dataNotFound', {only: 'postPage'}); //Show all data when post ID is oncorrect in URL 
Router.onBeforeAction(function() { 
    if (Session.get("enter") === true) { 
     this.render('home'); 
    } else { 
     this.next(); 
    } 
}, { only: ['postsList'] }); 

Ошибка

Exception from Tracker recompute function: undefined is not a function 
TypeError: undefined is not a function 
    at Router.onBeforeAction.only (http://localhost:3000/lib/router.js?4e5fa4c0e6dac39de81308142d50f13543d19152:26:14) 
    at RouteController.runHooks (http://localhost:3000/packages/iron_router.js?da7f2ac81c3fd9daebf49ce9a6980a54caa1dc17:843:16) 
    at http://localhost:3000/packages/iron_router.js?da7f2ac81c3fd9daebf49ce9a6980a54caa1dc17:2302:14 
    at Tracker.Computation._compute (http://localhost:3000/packages/tracker.js?192a05cc46b867dadbe8bf90dd961f6f8fd1574f:288:36) 
    at Tracker.Computation._recompute (http://localhost:3000/packages/tracker.js?192a05cc46b867dadbe8bf90dd961f6f8fd1574f:302:14) 
    at Tracker.flush (http://localhost:3000/packages/tracker.js?192a05cc46b867dadbe8bf90dd961f6f8fd1574f:430:14) 

UPDATE NUMERO ДВА

У меня есть полупроницаемую рабочий пример кода маршрутизатора так, как я ожидал. Моя единственная проблема заключается в том, что при посещении/духе обновление перенаправляет вас, я хочу, чтобы сеанс браузера запоминался, когда пользователь нажал ссылку и разрешил после первого щелчка просмотреть страницу antytime.

Вы можете посетить сайт here, чтобы посмотреть, что я имею в виду.

Router.configure({ 
    layoutTemplate: 'layout', 
    loadingTemplate: 'loading', 
    notFoundTemplate: 'notFound', 

    waitOn: function() { return Meteor.subscribe('posts'); } 
}); 

Router.map(function() { 
    this.route('homePage', {path: '/'}); 
    this.route('postsList', {path: '/spirit'}); 
    this.route('postPage', { 
    path: '/spirit/:_id', 
    data: function() { return Posts.findOne(this.params._id); } 
    }); 
    this.route('login', {path: '/login'}); 
    this.route('landing', {path: '/landing'}); 
}); 

Router.onBeforeAction('loading'); 
Router.onBeforeAction('dataNotFound', {only: 'postPage'}); //Show all data when post ID is oncorrect in URL 
Router.onBeforeAction(function(){ 


    var enter = Session.get("enter"); 
    if (typeof enter != "undefined" && enter === true) { 
    alert("welcome"); 
    this.render('postsList') 
    } else { 
    this.redirect('homePage'); 

    } 


}, {only: 'postsList'}); //Show all data when post ID is oncorrect in URL 

if (Meteor.isClient) { 
    // counter starts at 0 
    //Session.setDefault("counter", 0); 

    Template.homePage.events({ 
    'click a': function() { 
     // increment the counter when button is clicked 
     Session.set("enter", true); 
    } 
    }); 
} 
+0

Насколько я могу сказать, ваш «ввести» переменная определена как в глобальном и локальном пространстве имен, поэтому ваши изменения не будут отражены. –

+0

Есть ли у вас предложение относительно того, что я могу сделать. –

ответ

1

Да, вы должны переписать этот код, чтобы в полной мере использовать Iron Router onBeforeAction.

Вот пример кода, который вы можете использовать в качестве ссылки. Однако я его не тестировал. Вот соответствующая часть маршрутизатора:

Router.route('/', function() { 
    this.render('home'); 
}); 

Router.route('/spirit', function() { 
    this.render('postsList'); 
}); 

Router.onBeforeAction(function() { 
    if (Session.get("enter") === true) { 
     this.render('home'); 
    } else { 
     this.next(); 
    } 
}, { only: ['postsList'] }); 

И в вашем случае до нашей эры, вы должны сделать что-то вроде:

BC1 .click(function(){ 
    alert("Enter You West Coaster"); 
    Session.set('enter', false); 
    /////SEND TO NEXT PAGE////// 
}); 

Это должно дать вам указатель на то, как вы должны структурировать маршрутизации.

UPDATE

Я уменьшил вашу проблему на примере. Попробуйте это:

метеор испытаний map.html

<head> 
    <title>meteor-test-map</title> 
</head> 

<body> 
</body> 

<template name="layout"> 
Main layout 
    {{> yield}} 
</template> 

<template name="postsList"> 
Posts list 
<button>Click Me</button> 
</template> 

<template name="spirit"> 
Spirit 
</template> 

<template name="home"> 
Home 
</template> 

<template name="loading"> 
Loading 
</template> 

метеор испытаний map.js

Router.configure({ 
    layoutTemplate: 'layout', 
    loadingTemplate: 'loading', 
    notFoundTemplate: 'notFound', 

    waitOn: function() { return Meteor.subscribe('posts'); } 
}); 

Router.map(function() { 
    this.route('home', {path: '/'}); 
    this.route('postsList', {path: '/spirit'}); 
    this.route('postPage', { 
    path: '/spirit/:_id', 
    data: function() { return Posts.findOne(this.params._id); } 
    }); 
    this.route('login', {path: '/login'}); 
}); 

Router.onBeforeAction('loading'); 
Router.onBeforeAction('dataNotFound', {only: 'postPage'}); //Show all data when post ID is oncorrect in URL 

Router.onBeforeAction(function() { 
    var enter = Session.get("enter"); 
    if (typeof enter != "undefined" && enter === true) { 
     this.render('home'); 
    } else { 
     this.next(); 
    } 
}, { only: ['postsList'] }); 


Posts = new Meteor.Collection("posts"); 

if (Meteor.isClient) { 
    // counter starts at 0 
    Session.setDefault("counter", 0); 

    Template.postsList.events({ 
    'click button': function() { 
     // increment the counter when button is clicked 
     Session.set("enter", true); 
    } 
    }); 
} 

if (Meteor.isServer) { 
    Meteor.startup(function() { 
    // code to run on server at startup 
    }); 

    Meteor.publish("posts", function() { 
    return Posts.find(); 
    }); 
} 
+0

Как справиться с глобальным и местным указателем имен. Событие BC1click является бесплатным железным маршрутизатором? –

+0

Я догадываюсь, как запустить javscript для карты перед оператором if? –

+0

Я обновил свой код, все еще имея проблемы. –