diff --git a/scripts/CardGridController.js b/scripts/CardGridController.js index cab0f5c..74d3338 100644 --- a/scripts/CardGridController.js +++ b/scripts/CardGridController.js @@ -6,7 +6,7 @@ angular.module('flashy.CardGridController', ['ui.router', 'ngAnimate', 'ngWebSoc $scope.affectedCards = []; // cards affected by a position change move $scope.numCols = 0; $scope.height = 0; // height of a card - $scope.section = $rootScope.SectionResource.get({sectionId: sectionId}); + $scope.section = $rootScope.SectionResource.get({sectionId: sectionId}); $scope.deck = new Deck(sectionId, { cardHideCallback: function(card) { $scope.hideCardFromGrid(card); @@ -44,7 +44,7 @@ angular.module('flashy.CardGridController', ['ui.router', 'ngAnimate', 'ngWebSoc $('.cardColumn .card.flashy i.medium').css({ 'font-size': 400 * width / 250 + '%' }); - $scope.height = width * 3 / 5; + $scope.height = width * 3 / 5; }; $scope.refreshLayout = function() { diff --git a/scripts/FeedController.js b/scripts/FeedController.js index beb1a98..14bb957 100644 --- a/scripts/FeedController.js +++ b/scripts/FeedController.js @@ -6,242 +6,241 @@ angular.module('flashy.FeedController', 'flashy.DeckFactory']).controller('FeedController', function($scope, $rootScope, $state, $http, $window, $timeout, $stateParams, $websocket, $interval, UserService, Flashcard, Deck) { angular.module('flashy.CardGridController').CardGridController.apply(this, arguments); - var promise; - $rootScope.debugFlashcard = false; + var promise; + sectionId = parseInt($stateParams.sectionId); $scope.updateCardScore = function(card, scoreChange) { console.log('update card score'); // if no colNum is attached, then this doesn't exist on the feed yet if (!card.colNum) return; - card.score += scoreChange; - var col = card.colNum; - var rank = card.colRank; - var s = Math.sign(scoreChange); - - rank -= s; - if (rank < 0) return; - if (rank == $scope.cardCols[col].length) return; - - $scope.affectedCards = []; - while (s * $scope.cardCols[col][rank].score < s * card.score) { - $scope.affectedCards.push($scope.cardCols[col][rank]); - rank -= s; - if (rank < 0) break; - if (rank == $scope.cardCols[col].length) break; - } - rank += s; - - var upMove = $scope.height; - var downMove = $scope.height; - if (s > 0) { - card.moveUp = true; - upMove *= $scope.affectedCards.length; - /*for (i=0; i<$scope.affectedCards.length; i++) { - $scope.affectedCards[i].moveDown = true; - }*/ - } else { - card.moveDown = true; - downMove *= $scope.affectedCards; - /*for (i=0; i<$scope.affectedCards.length; i++) { - $scope.affectedCards[i].moveUp = true; - }*/ - } - - $('.card.flashy.card-moveUp').css({ + card.score += scoreChange; + var col = card.colNum; + var rank = card.colRank; + var s = Math.sign(scoreChange); + + rank -= s; + if (rank < 0) return; + if (rank == $scope.cardCols[col].length) return; + + $scope.affectedCards = []; + while (s * $scope.cardCols[col][rank].score < s * card.score) { + $scope.affectedCards.push($scope.cardCols[col][rank]); + rank -= s; + if (rank < 0) break; + if (rank == $scope.cardCols[col].length) break; + } + rank += s; + + var upMove = $scope.height; + var downMove = $scope.height; + if (s > 0) { + card.moveUp = true; + upMove *= $scope.affectedCards.length; + /*for (i=0; i<$scope.affectedCards.length; i++) { + $scope.affectedCards[i].moveDown = true; + }*/ + } else { + card.moveDown = true; + downMove *= $scope.affectedCards; + /*for (i=0; i<$scope.affectedCards.length; i++) { + $scope.affectedCards[i].moveUp = true; + }*/ + } + + $('.card.flashy.card-moveUp').css({ 'margin-top': 300 + 'px', // how much moveUp moves - 'z-index': '99' + 'z-index': '99' }); - - $('.card.flashy.card-moveDown').css({ + + $('.card.flashy.card-moveDown').css({ 'margin-top': 300 + 'px', // how much moveDown moves }); - - $timeout(function() { - $('.card.flashy.card-moveUp').css({ - 'margin-top': '6px', - }); - - $('.card.flashy.card-moveDown').css({ - 'margin-top': '6px', - }); - if (s > 0) { - card.moveUp = false; - for (i=0; i<$scope.affectedCards.length; i++) { - $scope.affectedCards[i].moveDown = false; - } - } else { - card.moveDown = false; - for (i=0; i<$scope.affectedCards.length; i++) { - $scope.affectedCards[i].moveUp = false; - } - } - $scope.cardCols[col].splice(rank, 0, $scope.cardCols[col].splice(card.colRank, 1)[0]); - }, 1000); - - $scope.updateColRanks($scope.cardCols[card.colNum]); // can be optimized out - }; + $timeout(function() { + $('.card.flashy.card-moveUp').css({ + 'margin-top': '6px', + }); + $('.card.flashy.card-moveDown').css({ + 'margin-top': '6px', + }); + if (s > 0) { + card.moveUp = false; + for (i = 0; i < $scope.affectedCards.length; i++) { + $scope.affectedCards[i].moveDown = false; + } + } else { + card.moveDown = false; + for (i = 0; i < $scope.affectedCards.length; i++) { + $scope.affectedCards[i].moveUp = false; + } + } + $scope.cardCols[col].splice(rank, 0, $scope.cardCols[col].splice(card.colRank, 1)[0]); + }, 1000); - $scope.feed_ws = $websocket($scope.ws_host + '/ws/feed/' + $scope.sectionId + '?subscribe-broadcast'); - $scope.feed_ws.onMessage(function(e) { + $scope.updateColRanks($scope.cardCols[card.colNum]); // can be optimized out + }; - console.log('oh yeaaaaaaaaaaaaaaaaaaa'); + $scope.feed_ws = $websocket($scope.ws_host + '/ws/feed/' + sectionId + '?subscribe-broadcast'); + $scope.feed_ws.onMessage(function(e) { + console.log('oh yeaaaaaaaaaaaaaaaaaaa'); data = JSON.parse(e.data); console.log('message', data); if (data.event_type == 'new_card') { - $scope.addCardToGrid(new Flashcard(data.flashcard, $scope.deck)); + $scope.addCardToGrid(new Flashcard(data.flashcard, $scope.deck)); } else if (data.event_type == 'score_change') { - card = new Flashcard(data.flashcard); // doesnt create a card if it exists - console.log('score change'); - $scope.updateCardScore(card, data.flashcard.score - card.score); + card = new Flashcard(data.flashcard); // doesnt create a card if it exists + card.score = data.flashcard.score; + console.log('score change'); + $scope.updateCardScore(card, data.flashcard.score - card.score); } - }); + }); - $scope.pushCard = function() { + $scope.pushCard = function() { var myCard = { - // we can't trim this string because it'd mess up the blanks. Something to fix. - 'text': $('#new-card-input').text(), - 'mask': $scope.newCardBlanks, - section: $scope.section.id + // we can't trim this string because it'd mess up the blanks. Something to fix. + 'text': $('#new-card-input').text(), + 'mask': $scope.newCardBlanks, + section: $scope.section.id }; if (myCard.text == '') { - console.log('blank flashcard not pushed:' + myCard.text); - return closeNewCard(); + console.log('blank flashcard not pushed:' + myCard.text); + return closeNewCard(); } $http.post('/api/flashcards/', myCard). success(function(data) { - console.log('flashcard pushed: ' + myCard.text); - if (!UserService.hasVerifiedEmail()) { - Materialize.toast("
Thanks for contributing! However, others won't see your card until you verify your email address
", 4000); - } + console.log('flashcard pushed: ' + myCard.text); + if (!UserService.hasVerifiedEmail()) { + Materialize.toast("
Thanks for contributing! However, others won't see your card until you verify your email address
", 4000); + } }); return $scope.closeNewCardModal(); - }; + }; - /* Key bindings for the whole feed window. Hotkey it up! */ - var listenForC = true; + /* Key bindings for the whole feed window. Hotkey it up! */ + var listenForC = true; - // Need to pass these options into openmodal and leanmodal, - // otherwise the ready handler doesn't get called + // Need to pass these options into openmodal and leanmodal, + // otherwise the ready handler doesn't get called - modal_options = { + modal_options = { dismissible: true, // Modal can be dismissed by clicking outside of the modal opacity: 0, // Opacity of modal background in_duration: 300, // Transition in duration out_duration: 200, // Transition out duration ready: function() { - $('#new-card-input').focus(); - document.execCommand('selectAll', false, null); + $('#new-card-input').focus(); + document.execCommand('selectAll', false, null); } - }; + }; - $(document).keydown(function(e) { + $(document).keydown(function(e) { var keyed = e.which; if (keyed == 67 && listenForC) { // "c" for compose - $scope.openNewCardModal(); - e.preventDefault(); - return false; + $scope.openNewCardModal(); + e.preventDefault(); + return false; } else if (keyed == 27) { // clear on ESC - $scope.closeNewCardModal(); + $scope.closeNewCardModal(); } - }); + }); - $scope.openNewCardModal = function() { + $scope.openNewCardModal = function() { $('#newCard').openModal(modal_options); listenForC = false; $('#new-card-input').html('Write a flashcard!'); - }; + }; - $scope.closeNewCardModal = function() { + $scope.closeNewCardModal = function() { listenForC = true; $('#new-card-input').html('').blur(); $('#newCard').closeModal(modal_options); - }; + }; - $('.tooltipped').tooltip({delay: 50}); - // the "href" attribute of .modal-trigger must specify the modal ID that wants to be triggered - $('.modal-trigger').leanModal(modal_options); - $('#new-card-input').on('keydown', function(e) { + $('.tooltipped').tooltip({delay: 50}); + // the "href" attribute of .modal-trigger must specify the modal ID that wants to be triggered + $('.modal-trigger').leanModal(modal_options); + $('#editCardA').leanModal(modal_options); + $('#new-card-input').on('keydown', function(e) { if (e.which == 13) { - e.preventDefault(); - if ($scope.submit_enabled) { - $scope.pushCard(); - listenForC = true; - } - return false; + e.preventDefault(); + if ($scope.submit_enabled) { + $scope.pushCard(); + listenForC = true; + } + return false; } else { } - }); - $('button#blank-selected').click(function() { + }); + $('button#blank-selected').click(function() { console.log(window.getSelection()); document.execCommand('bold'); - }); - $scope.newCardBlanks = []; - $scope.refreshNewCardInput = function() { + }); + $scope.newCardBlanks = []; + $scope.refreshNewCardInput = function() { $scope.newCardText = $('#new-card-input').text(); $scope.submit_enabled = $scope.newCardText.length >= 5 && $scope.newCardText.length <= 160; var i = 0; $scope.newCardBlanks = []; $('#new-card-input')[0].childNodes.forEach(function(node) { - node = $(node)[0]; - if (node.tagName == 'B') { - var text = $(node).text(); - var leftspaces = 0, rightspaces = 0; - // awful way to find the first non-space character from the left or the right. thanks.js - while (text[leftspaces] == ' ' || text[leftspaces] == '\xa0') leftspaces++; - while (text[text.length - 1 - rightspaces] == ' ' || text[text.length - 1 - rightspaces] == '\xa0') rightspaces++; - console.log(leftspaces, text.length); - if (leftspaces != text.length) $scope.newCardBlanks.push([i + leftspaces, i + text.length - rightspaces]); - i += text.length; - } else if (!node.data) { - i += $(node).text().length; - } else { - i += node.data.length; - } + node = $(node)[0]; + if (node.tagName == 'B') { + var text = $(node).text(); + var leftspaces = 0, rightspaces = 0; + // awful way to find the first non-space character from the left or the right. thanks.js + while (text[leftspaces] == ' ' || text[leftspaces] == '\xa0') leftspaces++; + while (text[text.length - 1 - rightspaces] == ' ' || text[text.length - 1 - rightspaces] == '\xa0') rightspaces++; + console.log(leftspaces, text.length); + if (leftspaces != text.length) $scope.newCardBlanks.push([i + leftspaces, i + text.length - rightspaces]); + i += text.length; + } else if (!node.data) { + i += $(node).text().length; + } else { + i += node.data.length; + } }); $scope.newCardBlanks.sort(function(a, b) { - return a[0] - b[0]; + return a[0] - b[0]; }); i = 0; newtext = ''; $scope.newCardBlanks.forEach(function(blank) { - newtext += $scope.newCardText.slice(i, blank[0]); - newtext += '' + $scope.newCardText.slice(blank[0], blank[1]) + ''; - i = blank[1]; + newtext += $scope.newCardText.slice(i, blank[0]); + newtext += '' + $scope.newCardText.slice(blank[0], blank[1]) + ''; + i = blank[1]; }); newtext += $scope.newCardText.slice(i); //$scope.newCardFormattedText = newtext; - }; - $scope.shuffleCards = function() { + }; + $scope.shuffleCards = function() { $timeout(function() { - (function(o) { - for (var j, x, i = o.length; i; j = Math.floor(Math.random() * i), x = o[--i], o[i] = o[j], o[j] = x); - return o; - })($scope.cardCols[0]); + (function(o) { + for (var j, x, i = o.length; i; j = Math.floor(Math.random() * i), x = o[--i], o[i] = o[j], o[j] = x); + return o; + })($scope.cardCols[0]); }); - }; - $scope.$on('$destroy', function() { + }; + $scope.$on('$destroy', function() { $scope.feed_ws.close(); $interval.cancel(promise); - }); - return $http.get('/api/sections/' + sectionId + '/feed/'). - success(function(data) { + }); + return $http.get('/api/sections/' + sectionId + '/feed/'). + success(function(data) { console.log(data); $scope.cards = data.map(function(card) { - return new Flashcard(card, $scope.deck); + return new Flashcard(card, $scope.deck); }); $scope.refreshLayout().then(function() { - $timeout($scope.refreshColumnWidth).then(function() { - $scope.showGrid = true; - }); - console.log('layout done'); + $timeout($scope.refreshColumnWidth).then(function() { + $scope.showGrid = true; + }); + console.log('layout done'); }); - }); + }); - }); + }); diff --git a/scripts/FlashcardFactory.js b/scripts/FlashcardFactory.js index 6cc5a8b..f2b2214 100644 --- a/scripts/FlashcardFactory.js +++ b/scripts/FlashcardFactory.js @@ -22,13 +22,30 @@ angular.module('flashy.FlashcardFactory', ['ui.router']). p = this.textPieces[i]; this.formatted_text += p.blank ? '' + p.text + '' : p.text; } - this.moveUp = false; - this.moveDown = false; - this.colNum = 0; - this.colRank = 0; + this.moveUp = false; + this.moveDown = false; + this.colNum = 0; + this.colRank = 0; FlashcardCache[this.id] = this; }; + Flashcard.editModalOptions = { + dismissible: true, // Modal can be dismissed by clicking outside of the modal + opacity: 0, // Opacity of modal background + in_duration: 300, // Transition in duration + out_duration: 200, // Transition out duration + ready: function () { + + $('#edit-card-input').html(editableText); + console.log('opening card edit'); + + }, + complete: function () { + + console.log("EDIT MODAL CLOSED"); + + } + }; Flashcard.prototype.isInDeck = function () { return !(typeof Deck.contains(this.id) === 'undefined'); }; @@ -54,115 +71,92 @@ angular.module('flashy.FlashcardFactory', ['ui.router']). Deck = null; FlashcardCache = []; }; - Flashcard.linkDeck = function(deck){ + Flashcard.linkDeck = function (deck) { Deck = deck; } Flashcard.prototype.edit = function () { - - - var editableText = this.formatted_text; - - $('.modal-trigger').leanModal({ - dismissible: true, // Modal can be dismissed by clicking outside of the modal - opacity: .5, // Opacity of modal background - in_duration: 300, // Transition in duration - out_duration: 200, // Transition out duration - ready: function () { - - $('#edit-card-input').html(editableText); - - - }, // Callback for Modal open - complete: function () { - - console.log("EDIT MODAL CLOSED"); - - } // Callback for Modal close - }); - + var editableText = this.formatted_text; + $('#editModalA').leanModal(Flashcard.modal_options); + $('#editModalA').openModal(Flashcard.modal_options); }; Flashcard.prototype.refreshEditCardInput = function () { - this.editCardText = $('#edit-card-input').text(); - - this.submit_enabled = this.editCardText.length >= 5 && this.editCardText.length <= 160; - - - - var i = 0; - this.editCardBlanks = []; - $('#edit-card-input')[0].childNodes.forEach(function (node) { - node = $(node)[0]; - if (node.tagName == 'B') { - var text = $(node).text(); - var leftspaces = 0, rightspaces = 0; - // awful way to find the first non-space character from the left or the right. thanks.js - while (text[leftspaces] == ' ' || text[leftspaces] == '\xa0') leftspaces++; - while (text[text.length - 1 - rightspaces] == ' ' || text[text.length - 1 - rightspaces] == '\xa0') rightspaces++; - console.log(leftspaces, text.length); - if (leftspaces != text.length) $scope.editCardBlanks.push([i + leftspaces, i + text.length - rightspaces]); - i += text.length; - } else if (!node.data) { - i += $(node).text().length; - } else { - i += node.data.length; - } - }); - this.editCardBlanks.sort(function (a, b) { - return a[0] - b[0]; - }); - i = 0; - newtext = ''; - this.editCardBlanks.forEach(function (blank) { - newtext += this.editCardText.slice(i, blank[0]); - newtext += '' + this.editCardText.slice(blank[0], blank[1]) + ''; - i = blank[1]; - }); - newtext += this.editCardText.slice(i); - //$scope.newCardFormattedText = newtext;*/ + this.editCardText = $('#edit-card-input').text(); + + this.submit_enabled = this.editCardText.length >= 5 && this.editCardText.length <= 160; + + var i = 0; + this.editCardBlanks = []; + $('#edit-card-input')[0].childNodes.forEach(function (node) { + node = $(node)[0]; + if (node.tagName == 'B') { + var text = $(node).text(); + var leftspaces = 0, rightspaces = 0; + // awful way to find the first non-space character from the left or the right. thanks.js + while (text[leftspaces] == ' ' || text[leftspaces] == '\xa0') leftspaces++; + while (text[text.length - 1 - rightspaces] == ' ' || text[text.length - 1 - rightspaces] == '\xa0') rightspaces++; + console.log(leftspaces, text.length); + if (leftspaces != text.length) $scope.editCardBlanks.push([i + leftspaces, i + text.length - rightspaces]); + i += text.length; + } else if (!node.data) { + i += $(node).text().length; + } else { + i += node.data.length; + } + }); + this.editCardBlanks.sort(function (a, b) { + return a[0] - b[0]; + }); + i = 0; + newtext = ''; + this.editCardBlanks.forEach(function (blank) { + newtext += this.editCardText.slice(i, blank[0]); + newtext += '' + this.editCardText.slice(blank[0], blank[1]) + ''; + i = blank[1]; + }); + newtext += this.editCardText.slice(i); + //$scope.newCardFormattedText = newtext;*/ }; - - Flashcard.prototype.pushCard = function () { - //console.log() + //console.log() - var myCard = { - 'text': $('#edit-card-input').text(), - 'mask': this.editCardBlanks, - //section: this.section.id - }; - if (myCard.text == '') { - console.log('blank flashcard not pushed:' + myCard.text); - //return closeNewCard(); + var myCard = { + 'text': $('#edit-card-input').text(), + 'mask': this.editCardBlanks, + //section: this.section.id + }; + if (myCard.text == '') { + console.log('blank flashcard not pushed:' + myCard.text); + //return closeNewCard(); - $('#editModal').closeModal(modal_options); + $('#editModal').closeModal(modal_options); - } - $http.patch('/api/flashcards/' + this.id, myCard). - success(function (data) { - console.log('flashcard pushed: ' + myCard.text); - if (!UserService.hasVerifiedEmail()) { - Materialize.toast("
Thanks for contributing! However, others won't see your card until you verify your email address
", 4000); - } - }); + } + $http.patch('/api/flashcards/' + this.id, myCard). + success(function (data) { + console.log('flashcard pushed: ' + myCard.text); + if (!UserService.hasVerifiedEmail()) { + Materialize.toast("
Thanks for contributing! However, others won't see your card until you verify your email address
", 4000); + } + }); - $('#editModal').closeModal(modal_options); + $('#editModal').closeModal(modal_options); - } + }; - Flashcard.prototype.discardChanges = function() { + Flashcard.prototype.discardChanges = function () { - $('#editModal').closeModal(modal_options); + $('#editModal').closeModal(modal_options); - } + }; return Flashcard; diff --git a/templates/feed.html b/templates/feed.html index 0bb60f1..b8f91fc 100644 --- a/templates/feed.html +++ b/templates/feed.html @@ -1,3 +1,4 @@ +