From d2760b868876ccb0ad2857a42276830d492cacd5 Mon Sep 17 00:00:00 2001 From: Connor Turland Date: Tue, 9 Sep 2014 18:17:39 -0400 Subject: [PATCH 1/4] change in embedly --- app/assets/application-bkup.css | 1778 ----------------- app/assets/base-bkup.css | 639 ------ app/assets/images/arrowdown_sprite.png | Bin 289 -> 331 bytes app/assets/images/arrowperms_sprite.png | Bin 0 -> 543 bytes app/assets/images/arrowright_sprite.png | Bin 303 -> 349 bytes ...napse32sprite.png => synapse32_sprite.png} | Bin app/assets/javascripts/application.js | 7 +- app/assets/javascripts/compileMapPages.js | 20 - .../jquery.embedly.min.js | 6 - .../javascripts/metamaps/Metamaps.JIT.js | 4 + .../javascripts/metamaps/Metamaps.Router.js | 2 +- .../javascripts/metamaps/Metamaps.Views.js | 2 +- app/assets/javascripts/metamaps/Metamaps.js | 166 +- app/assets/stylesheets/application.css | 29 +- app/assets/stylesheets/base.css | 214 +- app/assets/stylesheets/clean.css | 10 + app/views/layouts/_templates.html.erb | 17 +- app/views/layouts/application.html.erb | 12 +- config/environments/production.rb | 2 +- public/famous/main.js | 10 +- realtime/realtime-server.js | 9 + 21 files changed, 320 insertions(+), 2607 deletions(-) delete mode 100644 app/assets/application-bkup.css delete mode 100644 app/assets/base-bkup.css create mode 100644 app/assets/images/arrowperms_sprite.png rename app/assets/images/{synapse32sprite.png => synapse32_sprite.png} (100%) delete mode 100644 app/assets/javascripts/compileMapPages.js delete mode 100644 app/assets/javascripts/librariesForAllPages/jquery.embedly.min.js diff --git a/app/assets/application-bkup.css b/app/assets/application-bkup.css deleted file mode 100644 index ca3caae3..00000000 --- a/app/assets/application-bkup.css +++ /dev/null @@ -1,1778 +0,0 @@ -/* - * This is a manifest file that'll be compiled into application.css, which will include all the files - * listed below. - * - * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets, - * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path. - * - * You're free to add application-wide styles to this file and they'll appear at the top of the - * compiled file, but it's generally better to create a new file per style scope. - * - *= require_self - *= require_tree . - *= require base - *= require jquery.mCustomScrollbar - *= require jquery-ui -*/ - -/* clear styles */ - -html, -body, -div, -h1, -h2, -h3, -h4, -h5, -h6, -ul, -ol, -dl, -li, -dt, -dd, -p, -blockquote, -pre, -form, -fieldset, -table, -th, -td, -legend { - margin: 0; - padding: 0; -} -img { - border: 0; - padding: 0; - margin: 0; - display: block; - text-indent: -9999px; -} -html, -body, -.main, -.wrapper { - height: 100%; -} -.wrapper.homePage { - /*background: url('mm-homepage-bg-image.png') no-repeat center -249px;*/ -} -.wrapper.mapPage { - overflow: hidden; -} -/* scrollbar override */ - -.mCS_no_scrollbar { - padding-right: 0px !important; -} -.mCSB_container { - margin-right: 15px !important; -} -/* forgot password fix */ - -.forgotPassword input[type="submit"] { - padding: 0 5px; - width: auto; -} -html { - -} -body { - background: #d8d9da url(shattered_@2X.png); - font-family: 'din-medium', helvetica, sans-serif; - color: #424242; -} - - -h1, -h2, -h3, -h4, -h5, -h6 { - font-weight: normal; -} -h1 { - display: block; - text-align: left; - font-family: "vinyl", sans-serif; -} -h2 { - display: block; - text-align: center; - font-family: "katarine-web", sans-serif; - background: url('black_bg.png'); - font-size: 24px; - line-height: 35px; -} -a { - color: #424242; - text-decoration: none; -} -button.button, -a.button, -input[type="submit"] { - border: none; - -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .2); - box-shadow: 0 1px 2px rgba(0, 0, 0, .2); - border: none; - border-bottom-left-radius: 0; - border-top-left-radius: 0; - height: 30px; - outline: none; - padding: 0 0; - width: 60px; - -webkit-box-shadow: none; - box-shadow: none; - background: #AEA9FD; - vertical-align: top; - color: black; - margin: 0px; - cursor: pointer; - display: inline-block; - font-weight: bold; - line-height: 29px; - min-width: 54px; - text-align: center; - text-decoration: none; - -webkit-border-radius: 2px; - border-radius: 2px; - -webkit-user-select: none; -} -button.button:hover, -a.button:hover, -input[type="submit"]:hover { - background: #B6B2FD; -} -/* - * Utility - */ - -.clearfloat { - clear: both; -} -.leaveSpace { - display: block; - height: 50px; -} -.hidden { - display: none; -} -/* - * Layout stuffs - */ - -/*#barometer_tab { - display: none; -}*/ - -#error_explanation { - background: #612127; - padding: 30px; - color: #FFF; -} -#error_explanation h2 { - display: none; -} -#error_explanation ul { - list-style: none; -} -.profile { - height: 100%; - margin-bottom: 50px; -} -.centeredProfile { - margin: 0 auto; - display: block; - width: 830px; -} -.requestInvite { - display: block; - margin: -720px auto 0; -} -.new_session, -.new_user, -.edit_user, -.forgotPassword { - display: block; - width: 250px; - background-color: #E0E0E0; - padding: 20px; - border-radius: 5px; - color: black; - box-shadow: 6px 6px 8px rgba(0, 0, 0, 0.4); -} -.centerGreyForm input[type="text"], -.centerGreyForm input[type="email"], -.centerGreyForm input[type="password"] { - width: 250px; - height: 32px; - font-size: 15px; - direction: ltr; - -webkit-appearance: none; - appearance: none; - display: inline-block; - margin: 0; - padding: 0 8px; - background: #fff; - border: 1px solid #d9d9d9; - border-top: 1px solid #c0c0c0; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - -webkit-border-radius: 1px; - -moz-border-radius: 1px; - border-radius: 1px; - font: -webkit-small-control; - color: initial; - letter-spacing: normal; - word-spacing: normal; - text-transform: none; - text-indent: 0px; - text-shadow: none; - display: inline-block; - text-align: start; -} -.centerGreyForm input[type="text"]:hover, -.centerGreyForm input[type="email"]:hover, -.centerGreyForm input[type="password"]:hover { - border: 1px solid #b9b9b9; - border-top: 1px solid #a0a0a0; - -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); - -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); - box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); -} -#closenewtopic, -#closenewsynapse { - position: absolute; - top: 3px; - right: 3px; -} -.new_topic { - /* start it off screen while it initializes the spinner, then it will be hidden with jquery */ - top: -1000px; - left: -1000px; - display: block; - position: absolute; - width: 300px; - margin: -40px 0 0 -50px; -} -.new_synapse { - display: none; - position: absolute; -} -#new_topic .twitter-typeahead { - position: absolute !important; - top: 40px; - left: 50px; - z-index: 9999; - width: 202px; - height: 37px; - font-family: ':atp'; -} -.new_topic #topic_name, -.new_topic .tt-hint { - width: 190px; - background: rgba(0, 0, 0, 0.8); - height: 25px; - margin: 0; - padding: 5px 5px; - border: 1px solid black; - outline: none; - font-size: 25px; - line-height: 35px; - color: rgba(255, 255, 255, 0.7); - font-family: 'LatoLight'; -} -.openMetacodeSwitcher { - display: block; - height: 20px; - width: 20px; - background-image: url('MMCCicon_metacode_set_change.png'); - background-size: contain; - position: absolute; - z-index: 2; - top: 20px; - left: 30px; -} -#metacodeImg { - height: 120px; -} -#metacodeImgTitle { - float: left; - width: 120px; - text-align: center; - margin-left: 90px; - font-family: 'LatoRegular'; -} -/* synapse autocomplete */ - -.new_topic #topic_name { - color: white; -} -.new_topic .tt-hint { - color: grey; -} -.new_topic #topic_name, -.new_topic .tt-hint { - width: 190px; - background: rgba(0, 0, 0, 0.8); - height: 25px; - margin: 0; - padding: 5px 5px; - border: 1px solid black; - outline: none; - font-size: 18px; - line-height: 35px; - font-family: 'LatoRegular'; -} -.new_synapse #synapse_desc { - color: rgba(255, 255, 255, 0.7); -} -.new_synapse .tt-hint { - color: rgba(255, 255, 255, 0.4); -} -.new_synapse #synapse_desc, -.new_synapse .tt-hint { - width: 200px; - background: rgba(0, 0, 0, 0.8); - height: 18px; - margin: 0; - padding: 5px 5px; - border: 1px solid black; - outline: none; - font-size: 16px; - line-height: 20px; - font-family: 'LatoRegular'; -} -label, -select, -input, -textarea { - display: block; -} -label { - margin-top: 10px; - margin-bottom: 4px; -} -input[type="submit"] { - margin-top: 5px; -} -#user_remember_me { - margin-top: 11px; -} -#user_remember_me, -label[for="user_remember_me"] { - float: left; -} -.contentarea p, -.contentarea ul, -.contentarea ol, -.contentarea table { - font-size: 14px; - line-height: 1.55em; - padding: 0.5em 0 -} -.contentarea ul li { - padding: 0.2em 0; -} -.contentarea ol li { - padding: 0.2em 0; -} -.contentarea ul { - margin: 0 0 0 1em; -} -.contentarea ol { - margin: 0 0 0 1.3em; -} -.main { - /*overflow:hidden; */ -} -#infovis-canvas { - -webkit-touch-callout: none; - -webkit-user-select: none; - -khtml-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; -} -/* --- top options --*/ - -.headertop { - display: block; - position: fixed; - top: 20px; - z-index: 10; - border-radius: 5px; - margin: 10px 0px 10px 10px; - background: #111614; - padding: 5px 10px; - box-shadow: 6px 6px 8px rgba(0, 0, 0, 0.4); -} -.headertop .tab { - background: url(tab.png) no-repeat 0 0; - position: absolute; - top: -11px; - right: -2px; - display: block; - width: 45px; - height: 15px; - cursor: move; -} -.headertop button, -.headertop input { - height: 30px; - background: none; - color: #717474; - font-family: 'LatoLight'; - font-size: 17px; - border: none; - border-right: 1px solid #717474; - cursor: pointer; - margin: 3px 0; - clear: both; - float: right; -} -.headertop button:hover, -.headertop input:hover { - border-right: 1px solid #6d7310; - color: #6d7310; -} -.wrapper { - display: block; - height: 100%; - margin: 0 0; -} - -/* account */ - -.sidebarAccount { - width: 32px; - height: 32px; -} -.unauthenticated .sidebarAccount { - width: 84px; - box-shadow: 0px 1px 1.5px rgba(0,0,0,0.12), 0 1px 1px rgba(0,0,0,0.24); - border-radius: 2px; -} -.sidebarAccountIcon { - cursor: pointer; -} -.authenticated .sidebarAccountIcon { - height: 32px; - width: 32px; -} -.unauthenticated .sidebarAccountIcon { - width: 66px; - height: 14px; - padding: 9px; - border-radius: 2px; - background-color: #E0E0E0; - color: #424242; - text-transform: uppercase; - text-align: center; - font-size: 14px; - line-height: 14px; -} -.sidebarAccountIcon img { - border-radius: 17px; -} -.sidebarAccountBox { - display: none; - height: auto; - padding: 10px; - min-width: 120px; -} -.authenticated .sidebarAccountBox { - width: auto; -} -.unauthenticated .sidebarAccountBox { - width: 200px; -} -.sidebarAccountBox h3 { - font-family: 'vinyl', helvetica, sans-serif; - text-transform: uppercase; - font-style: italic; -} -.sidebarAccountBox ul { - list-style: none; -} -.sidebarAccountBox li.accountIcon { - padding: 0; - background-size: 18px 18px; - background-repeat: no-repeat; - background-position: 0px 6px; - font-size: 18px; - line-height: 20px; -} -li.accountIcon:hover { - background-position: 4px 6px; -} -li.accountMaps { - background-image: url('MMCCicon_map.png'); -} -li.accountSettings { - background-image: url('usersettings.png'); -} -li.accountAdmin { - background-image: url('MMCCicon_admin.png'); -} -li.accountInvite { - background-image: url('MMCCicon_invite.png'); -} -li.accountLogout { - background-image: url('MMCCicon_logout.png'); -} -li.accountIcon a { - display: block; - padding: 6px 0 6px 25px; -} -li.accountInvite span { - display: block; - padding: 6px 0 6px 25px; -} -.sidebarAccountBox a { - -} -.sidebarAccountBox input[type="email"], -.sidebarAccountBox input[type="password"] { - width: 200px; - height: 32px; - font-size: 15px; - direction: ltr; - -webkit-appearance: none; - appearance: none; - display: inline-block; - margin: 0; - padding: 0 8px; - background: #fff; - border: 1px solid #d9d9d9; - border-top: 1px solid #c0c0c0; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - -webkit-border-radius: 1px; - -moz-border-radius: 1px; - border-radius: 1px; - font: -webkit-small-control; - color: initial; - letter-spacing: normal; - word-spacing: normal; - text-transform: none; - text-indent: 0px; - text-shadow: none; - display: inline-block; - text-align: start; -} -.sidebarAccountBox input[type="email"]:hover, -.sidebarAccountBox input[type="password"]:hover { - border: 1px solid #b9b9b9; - border-top: 1px solid #a0a0a0; - -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); - -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); - box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); -} -.sidebarAccountBox .links a { - display: block; - margin-top: 5px; -} -/* Save To New Map */ - -.sidebarFork { - width: 32px; - height: 32px; -} -.sidebarForkIcon { - position: absolute; - width: 32px; - height: 32px; - background: url('fork.png') no-repeat center center; - background-size: 32px 32px; - cursor: pointer; -} -.sidebarForkIcon:hover {} - -.sidebarFork .hoverForTip:hover .tip { - display: block; -} -.sidebarFork .tip { - display: none; - position: absolute; - background: black; - text-align: center; - top: 36px; - right: 0; - color: white; - border-radius: 4px; - font-size: 15px !important; - font-family: 'LatoRegular'; - line-height: 17px; - padding: 3px 5px 2px; - z-index: 100; -} -/* end Save To New Map */ - -/* Filter */ - -.sidebarFilter { - width: 32px; - height: 32px; -} - -.sidebarFilterIcon { - position: absolute; - width: 32px; - height: 32px; - background: url('filter.png') no-repeat center center; - background-size: 32px 32px; - cursor: pointer; -} -.sidebarFilterIcon:hover { - -} - -.sidebarFilterBox { - display:none; - height: 400px; - width: 320px; - padding: 10px; - text-align: center; - overflow-y: auto; -} -h3.filterBox { - text-align: left; - float: left; -} -.sidebarFilterBox span { - float: right; - background: #15bad4; - padding: 1px 4px; - border-radius: 2px; - margin-left: 5px; - cursor: pointer; -} -.sidebarFilterBox ul { - list-style: none; -} -.sidebarFilterBox li { - float: left; - width: 61px; - height: 70px; - cursor: pointer; -} -.sidebarFilterBox li:hover { - background: #000; -} -.sidebarFilterBox li img { - background-color: rgba(255, 255, 255, 0.1); - width: 45px; - height: 45px; - margin: 0 auto; -} -.sidebarFilterBox li p { - font-size: 11px; - line-height: 11px; - font-family: arial, sans-serif; -} -.sidebarFilterBox li.toggledOff { - opacity: 0.4; -} -.sidebarFilterBox h3 { - text-align: left; - text-transform: uppercase; - font-weight: bold; -} -#filter_by_metacode { - border-bottom: 1px solid black; - margin: 5px; -} -#filter_by_mapper { - margin: 5px auto; -} -#filter_by_synapse { - margin: 5px auto; - border-bottom: 1px solid black; -} -/* end filter by metacode */ - -/* collaborate */ - -.sidebarCollaborate { - width: 32px; - height: 32px; -} -.sidebarCollaborateIcon { - position: absolute; - width: 32px; - height: 32px; - background-image: url('junto32.png'); - background-size: 32px 32px; - background-position: center center; - background-repeat: no-repeat; - cursor: pointer; -} -.sidebarCollaborateIcon.blue { - background-image: url('junto32.png'); -} -.sidebarCollaborateBox { - display: none; - height: auto; - width: auto; - padding: 10px; - min-width: 180px; -} -h3.realtimeBoxTitle { - margin-bottom: 10px; - text-align: left; - float: left; - font-family: 'Lato', helvetica, sans-serif; -} -.sidebarCollaborateBox .realtimeOnOff { - float: left; - padding: 4px; - border-radius: 2px; - margin-left: 12px; - cursor: pointer; - width: 31px; - text-align: center; -} -.sidebarCollaborateBox .rtOff { - background: white; - color: black; -} -.sidebarCollaborateBox .rtOff:hover { - padding: 3px; - border: 1px solid #15bad4; -} -.sidebarCollaborateBox .rtOn { - background: #15bad4; - color: white; -} -.realtimeMapperList .rtMapper { - list-style-type: none; - white-space: nowrap; - padding: 2px 5px 2px 30px; - display: block; - background-size: 26px 26px; - background-repeat: no-repeat; - background-position: 4px center; - margin-bottom: 5px; -} -.realtimeMapperList .littleRtOff { - background-image: url('junto24.png'); -} -.realtimeMapperList .littleRtOn { - background-image: url('junto24.png'); -} -/* end collaborate */ - -.nodemargin { - padding-top: 120px; -} -.divider { - margin: 20px 50px 20px 50px; - border-bottom: 2px solid #FFF; -} -.empty { - margin-left: 50px; -} -#menus { - margin: 0 7px; -} -/* right click menu */ - -.rightclickmenu { - position: absolute; - background: white; - z-index: 20; - border-radius: 2px; - color: black; -} -.rightclickmenu ul { - padding: 2px; -} -.rightclickmenu ul li { - list-style: none; - padding: 3px 10px 3px 30px; - font-family: arial, sans-serif; - font-size: 17px; - line-height: 17px; - background-repeat: no-repeat; - background-size: 20px 20px; - background-position: 5px 2px; -} -.rightclickmenu ul li:nth-child(odd) { - background-color: #FFF; -} -.rightclickmenu ul li:nth-child(even) { - background-color: #EEE; -} -.rightclickmenu ul li:hover { - background-color: #BBB; - background-position: 7px 2px; - cursor: pointer; -} -.rightclickmenu .rc-delete { - background-image: url(MMCCicon_delete_black.png); -} -.rightclickmenu .rc-remove { - background-image: url(MMCCicon_remove_from_map_black.png); -} -.rightclickmenu .rc-hide { - background-image: url(MMCCicon_hide.png); -} -.rightclickmenu .rc-center { - background-image: url(MMCCicon_center.png); -} -.rightclickmenu .rc-popout { - background-image: url(MMCCicon_pop-out_black.png); -} -.rightclickmenu .rc-permission { - background-image: url(MMCCicon_edit_permission_black.png); - position: relative; -} -.rightclickmenu .rc-metacode { - background-image: url(blank.png); - position: relative; -} -.rc-metacode li img { -float: left; -} -.rightclickmenu .rc-permission ul, .rightclickmenu .rc-metacode ul { - display: none; - background: white; - top: 0; - left: 100%; - position: absolute; - border-bottom-left-radius: 2px; - border-bottom-right-radius: 2px; - border-top-right-radius: 2px; -} -.rightclickmenu .rc-permission:hover ul, .rightclickmenu .rc-metacode:hover ul { - display: block; -} -.rightclickmenu .rc-permission .toCommons { - background-image: url(MMCCicon_commons.png); -} -.rightclickmenu .rc-permission .toPublic { - background-image: url(MMCCicon_public.png); -} -.rightclickmenu .rc-permission .toPrivate { - background-image: url(MMCCicon_private.png); -} -.rightclickmenu p { - padding: 7px; -} -/* end right click menu */ - -/* topic autocomplete */ - -#new_topic .tt-suggestion.tt-is-under-cursor, -#new_topic .tt-suggestion.tt-is-under-mouse-cursor { - background: #0E161D; -} -#new_topic .tt-suggestion { - padding: 5px; - font-family: 'LatoLight'; - background: rgba(42, 52, 60, 0.9); - ; -} -#new_topic .autocompleteSection { - float: left; -} -#new_topic .topicTitle { - width: 130px; - line-height: 22px; -} -#new_topic .topicPermission { - width: 20px; - height: 20px; - background-repeat: no-repeat; - background-position: center center; - background-size: 16px 16px; -} -#new_topic .topicPermission.commons { - background-image: url(MMCCicon_commons.png); -} -#new_topic .topicPermission.public { - background-image: url(MMCCicon_public.png); -} -#new_topic .topicPermission.private { - background-image: url(MMCCicon_private.png); -} -#new_topic .topicOriginatorIcon { - position: relative; - width: 20px; - height: 20px; - background-repeat: no-repeat; - background-position: center center; - background-size: 16px 16px; - background-image: url(MMCCicon_mapper.png); -} -#new_topic .topicOriginatorIcon:hover .tip { - display: block; -} -#new_topic .tip { - display: none; - position: absolute; - background: white; - width: auto; - top: 0; - left: 23px; - color: black; - white-space: nowrap; - border-radius: 4px; - font-size: 15px !important; - font-family: 'LatoRegular'; - line-height: 15px; - padding: 2px 5px 2px; - z-index: 100; -} -/* synapse autocomplete */ - -#new_synapse .tt-dropdown-menu { - width: 212px; - background: #2A343C; -} -#new_synapse .tt-dropdown-menu h3 { - font-family: 'vinyl', helvetica, sans-serif; - text-transform: uppercase; - font-style: italic; - font-size: 14pxpx; - line-height: 16px; - margin: 3px; -} -#new_synapse .tt-suggestion.tt-is-under-cursor, -#new_synapse .tt-suggestion.tt-is-under-mouse-cursor { - background: #0E161D; -} -#new_synapse .tt-suggestion { - padding: 5px; - font-family: 'LatoLight'; -} -#new_synapse .autocompleteSection { - float: left; -} -#new_synapse .synapseDesc { - width: 162px; - line-height: 22px; -} -#new_synapse .synapsePermission { - width: 20px; - height: 20px; - background-repeat: no-repeat; - background-position: center center; - background-size: 16px 16px; -} -#new_synapse .synapsePermission.commons { - background-image: url(MMCCicon_commons.png); -} -#new_synapse .synapsePermission.public { - background-image: url(MMCCicon_public.png); -} -#new_synapse .synapsePermission.private { - background-image: url(MMCCicon_private.png); -} -#new_synapse .synapseOriginatorIcon { - position: relative; - width: 20px; - height: 20px; - background-repeat: no-repeat; - background-position: center center; - background-size: 16px 16px; - background-image: url(MMCCicon_mapper.png); -} -#new_synapse .synapseOriginatorIcon:hover .tip { - display: block; -} -#new_synapse .tip { - display: none; - position: absolute; - background: white; - width: auto; - top: 0; - left: 23px; - color: black; - white-space: nowrap; - border-radius: 4px; - font-size: 15px !important; - font-family: 'LatoRegular'; - line-height: 15px; - padding: 2px 5px 2px; - z-index: 100; -} -#new_synapse .tt-suggestion .resultnoresult .synapsePermission, -#new_synapse .tt-suggestion .resultnoresult .synapseOriginatorIcon { - display: none; -} -/* map info box */ - -.wrapper div.mapInfoBox { - display: none; - position: absolute; - bottom: 40px; - right: 3px; - background-color: #424242; - color: #F5F5F5; - border-radius: 2px; - width: 360px; - height: 300px; - padding: 0; - font-style: normal; - text-align: center; - box-shadow: 0 3px 3px rgba(0,0,0,0.23), 0px 3px 3px rgba(0,0,0,0.16); -} -.mapInfoName { - font-size: 18px; - line-height: 20px; - height: 20px; - padding: 26px 0; -} -.mapInfoStat { - background-color: #E0E0E0; - font-size: 18px; - line-height: 20px; - height: 48px; - padding: 0; - color: #424242; -} -.wrapper div.mapInfoName span, -.wrapper div.mapInfoDesc span { - float: none !important; - padding-bottom: 10px; -} -.infoStatIcon { - float: left; - width: 25px; - padding: 14px 0px 14px 45px; - height: 20px; - background-repeat: no-repeat; - text-align: left; -} -.mapContributors { - background-image: url(MMCCicon_mapper.png); - background-position: 13px center; - position: relative; -} -.infoStatIcon .tip { - display: none; - position: absolute; - background: white; - min-width: 180px; - max-width: 250px; - text-align: center; - color: black; - border-radius: 4px; - font-size: 15px !important; - line-height: 17px; - padding: 3px 5px 2px; - z-index: 100; -} -.mapContributors .tip { - top: 38px; - left: 6px; -} -.mapInfoBox .mapPermission .tip { - top: 0; - right: 32px; -} -.mapInfoBox .hoverForTip:hover .tip { - display: block; -} -.mapTopics { - background-image: url(topic32.png); - background-position: 13px center; -} -.mapSynapses { - background-image: url(synapse32tmcard.png); - background-position: 13px center; -} -.mapInfoBox .mapPermission { - background-position: 0 center; - width: 32px; - height: 32px; - padding: 0; - margin: 8px 30px 8px 10px; - position: relative; -} -.mapInfoBox .mapPermission.commons { - background-image: url(CO32.png); -} -.mapInfoBox .mapPermission.public { - background-image: url(PU32.png); -} -.mapInfoBox .mapPermission.private { - background-image: url(PR32.png); -} -.yourMap .mapPermission:hover { - background-image: url(arrowexpand.png); - cursor: pointer; -} -.yourMap .mapPermission.minimize { - background-image: url(arrowcollapse.png) !important; - cursor: pointer; -} -.mapInfoBox .mapPermission .permissionSelect { - list-style: none; - width: 32px; - height: 64px; - position: relative; - top: 32px; -} -.mapInfoBox .mapPermission .permissionSelect li { - width: 32px; - height: 32px; - background-repeat: no-repeat; - background-position: center center; -} -.mapInfoBox .mapPermission .permissionSelect .commons { - background-image: url(CO32.png); -} -.mapInfoBox .mapPermission .permissionSelect .public { - background-image: url(PU32.png); -} -.mapInfoBox .mapPermission .permissionSelect .private { - background-image: url(PR32.png); -} -.mapInfoBox .mapPermission .permissionSelect .commons:hover { - background-image: url(CO32b.png); -} -.mapInfoBox .mapPermission .permissionSelect .public:hover { - background-image: url(PU32b.png); -} -.mapInfoBox .mapPermission .permissionSelect .private:hover { - background-image: url(PR32b).png); -} -.mapInfoBox .mapInfoDesc { - font-family: helvetica, sans-serif; - color: #E0E0E0; - margin: 8px; - height: 106px; - font-size: 14px; - line-height: 16px; -} -.mapInfoBox .mapInfoMeta { - height: 35px; - border-top: 1px solid #F5F5F5; - padding: 6px 0 7px; -} -.mapInfoBox .mapInfoMeta p { - margin: 4px 0; - font-size: 12px; - color: #F5F5F5; -} -/* lightboxes */ - -#lightbox_overlay { - top: 0; - left: 0; - width: 100%; - height: 100%; - position: fixed; - z-index: 1000000; - display: none; -} -#lightbox_main { - width: 550px; - height: auto; - margin: 0 auto; - z-index: 2; - position: relative; - top: 50%; - background-color: transparent; - color: black; -} -#lightbox_screen { - top: 0; - left: 0; - z-index: 1; - width: 100%; - position: absolute; - background-color: #000; - opacity: 0.0; - filter: alpha(opacity=0); - -moz-opacity: 0.0; -} -#lightbox_overlay #lightbox_main #lightbox_header { - padding: 6px 5px 1px 0; - background-color: #333; - font-weight: bold; - height: 18px; - border: solid 2px #000; -} -#lightbox_overlay #lightbox_main a#lightbox_close { - /*background-image: url(../images/barometer_close.png);*/ - cursor: pointer; - height: 42px; - outline-color: -moz-use-text-color; - outline-style: none; - outline-width: medium; - overflow: hidden; - position: absolute; - top: -23px; - right: -22px; - width: 42px; - z-index: 4; - border: none; -} -#lightbox_content { - background: white url(metacode-watermark.png) 443px -30px no-repeat; - padding: 20px; - border-radius: 5px; -} -.lightboxContent h3 { - font-style: italic; - text-transform: uppercase; - font-family: 'vinyl'; - font-size: 30px; - line-height: 35px; - color: black; -} -.lightboxContent h3.forCreateMap { - text-align: center; -} -.lightboxContent { - display: none; -} -.openLightbox { - cursor: pointer; -} -/* jquery ui tabs */ - -.ui-tabs-hide { - display: none !important; -} -.ui-tabs-vertical { - width: 55em; -} -.ui-tabs-vertical .ui-tabs-nav { - float: left; - width: 100px; - background: none; - border: none; - font-size: 15px; - padding: 0 !important; -} -.ui-tabs-vertical .ui-tabs-nav li { - clear: left; - width: 100%; - border-top: none !important; - border-left: none !important; - border-bottom: none !important; - background: none !important; - margin: 0 0 .2em 0 !important; - white-space: normal !important; -} -.ui-tabs-vertical .ui-tabs-nav li.ui-state-active, -.ui-tabs-vertical .ui-tabs-nav li.ui-state-hover { - border-right: 1px solid #000; -} -.ui-tabs-vertical .ui-tabs-nav li a { - display: block; - width: 92%; - padding: 4% !important; -} -.ui-tabs-vertical .ui-tabs-panel { - padding: 5px !important; - float: right; - width: 388px; -} -/* switch metacode set */ - -#metacodeSwitchTabs { - width: 100%; - font-family: LatoLight, Arial, Sans-Serif; - font-size: 17px; - line-height: 21px; - border: none; -} -#metacodeSwitchTabs .setTitle { - font-family: Lato, Arial, sans-serif; -} -#metacodeSwitchTabs .setDesc { - margin-bottom: 5px; -} -.customMetacodeList, -.metacodeSetList { - height: 301px; - overflow: hidden; - margin: 5px 0 15px 0; - border-bottom: 1px solid #BBB; -} -.customMetacodeList ul li { - cursor: pointer; -} -.customMetacodeList ul li, -.metacodeSetList ul li { - list-style-type: none; - display: block; - padding: 0px; - width: 92px; - height: 70px; - float: left; - text-align: center; -} -.customMetacodeList li.toggledOff { - opacity: 0.4; -} -.customMetacodeList ul img, -.metacodeSetList ul img { - width: 40px; - height: 40px; - margin: 0 auto; -} -.customMetacodeList ul p, -.metacodeSetList ul p { - display: block; - margin: 0; - background: none; - font-size: 14px; - line-height: 14px; - font-family: Lato; -} -#metacodeSwitchTabs button.button { - width: auto !important; - padding: 0 10px; - font-weight: normal; -} -/* about */ - -#about > p { - color: #000; - font-size: 16px; - line-height: 24px; - margin: 10px 0; -} -#about ul { - list-style: none; -} -#about ul li { - display: inline-block; - padding: 5px; -} -#about li a { - color: #097A51; -} -/* invite */ - -#invite { - color: black; -} -#invite p { - margin: 10px 0; - line-height: 24px; -} -#invite .green { - text-align: center; - display: block; - color: #097A51; -} -/* new map */ - -.new_map { - color: black; -} -.new_map .inputGroup { - margin: 15px 0 5px; -} -.new_map label { - float: left; - width: 100px; - text-align: right; - margin-right: 15px; -} -.new_map input[type="text"] { - width: 336px; - height: 32px; - font-size: 15px; - direction: ltr; - -webkit-appearance: none; - appearance: none; - display: inline-block; - margin: 0; - padding: 0 8px; - background: #fff; - border: 1px solid #d9d9d9; - border-top: 1px solid #c0c0c0; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - -webkit-border-radius: 1px; - -moz-border-radius: 1px; - border-radius: 1px; - font: -webkit-small-control; - color: initial; - letter-spacing: normal; - word-spacing: normal; - text-transform: none; - text-indent: 0px; - text-shadow: none; - display: inline-block; - text-align: start; - font-family: arial; -} -.new_map input[type="text"]:hover, -.new_map textarea:hover { - border: 1px solid #b9b9b9; - border-top: 1px solid #a0a0a0; - -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); - -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); - box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); -} -.new_map textarea { - padding: 8px; - border: 1px solid #d9d9d9; - border-top: 1px solid #c0c0c0; - resize: none; - font: -webkit-small-control; - letter-spacing: normal; - word-spacing: normal; - text-transform: none; - text-indent: 0px; - text-shadow: none; - text-align: start; - font-family: arial; - font-size: 15px; - line-height: 17px; - width: 318px; -} -.new_map .permIcon { - float: left; - width: 92px; - height: 85px; - position: relative; -} -.new_map .mapPermIcon { - width: 60px; - height: 60px; - background-size: 48px 48px; - background-position: center center; - background-repeat: no-repeat; - margin: 0 auto; - cursor: pointer; -} -.new_map .mapCommonsIcon { - background-image: url(MMCCicon_commons.png); -} -.new_map .mapPublicIcon { - background-image: url(MMCCicon_public.png); -} -.new_map .mapPrivateIcon { - background-image: url(MMCCicon_private.png); -} -.new_map .mapCommonsIcon.selected, -.new_map .mapCommonsIcon:hover { - background-image: url(MMCCicon_commons_black.png); -} -.new_map .mapPublicIcon.selected, -.new_map .mapPublicIcon:hover { - background-image: url(MMCCicon_public_black.png); -} -.new_map .mapPrivateIcon.selected, -.new_map .mapPrivateIcon:hover { - background-image: url(MMCCicon_private_black.png); -} -.new_map .permIcon h4 { - font-style: italic; - font-family: 'Vinyl'; - text-transform: uppercase; - font-size: 18px; - line-height: 20px; - color: black; - text-align: center; -} -.new_map .tip { - display: none; - position: absolute; - background: black; - width: 150px; - top: 85px; - left: -29px; - color: white; - border-radius: 4px; - font-size: 15px !important; - font-family: 'LatoRegular'; - line-height: 17px; - padding: 3px 5px 2px; - z-index: 100; - text-align: center; -} -.new_map .hoverForTip:hover .tip { - display: block; -} -.permText { - width: 360px; - margin: 0 auto; - text-align: center; -} -.buttonWrapper { - margin: 10px 0 0 131px; - width: 254px; -} -.onConsole .new_map button.cancel { - margin-right: 20px; -} -.onConsole .new_map button, -.onConsole .new_map input.add { - float: left; - margin-top: 5px; - height: 40px; - font-family: 'LatoItalic'; - font-size: 17px; - width: auto; - padding: 0 30px; - cursor: pointer; - font-weight: normal; -} -.onConsole .new_map button:hover, -.onConsole .new_map input.add:hover { - -webkit-box-shadow: none; - box-shadow: none; -} -/* Cheatsheet */ - -#cheatSheet { - width: 100%; - height: 350px; - font-family: LatoLight, Arial, Sans-Serif; - font-size: 17px; - line-height: 21px; - border: none; -} -#cheatSheet .sectionTitle { - font-family: Lato, Arial, sans-serif; - font-weight: bold; -} -#cheatSheet .csItem { - margin: 5px 0; - font-size: 15px; - line-height: 18px; -} -#cheatSheet .csItem img { - display: inline-block; - margin: 0 2px; -} -#cheatSheet .csTitle { - font-family: Lato, Arial, sans-serif; -} -#cheatSheet .indented { - margin-left: 15px; -} -/* Admin Pages */ - -#wrapper > div.blackBox { - width: 700px; - margin: 0 auto; - padding: 20px 0 20px 20px; - background: rgba(0, 0, 0, 0.4); - color: white; - height: 100%; - overflow: hidden; - position: relative; -} -.blackBox .metacodeSetsDescription { - width: 314px; -} -.blackBox td.metacodeSetDesc { - width: 314px; - word-wrap: break-word; -} -.blackBox .metacodeSetImage { - width: 36px; - height: 36px; - float: left; -} -.blackBox tr { - display: table-row; -} -.blackBox tr:nth-child(odd) { - background: rgba(0, 0, 0, 0.2); -} -.blackBox tr:nth-child(even) { - background: rgba(0, 0, 0, 0.3); -} -.blackBox th, -.blackBox td { - padding: 10px; -} -.blackBox td.iconURL { - max-width: 415px; - word-wrap: break-word; -} -.blackBox .field { - margin: 15px 0 5px; -} -.blackBox label { - float: left; - width: 100px; - margin-right: 15px; -} -.blackBox input[type="text"] { - width: 336px; - height: 32px; - font-size: 15px; - direction: ltr; - -webkit-appearance: none; - appearance: none; - display: inline-block; - margin: 0; - padding: 0 8px; - background: #fff; - border: 1px solid #d9d9d9; - border-top: 1px solid #c0c0c0; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - -webkit-border-radius: 1px; - -moz-border-radius: 1px; - border-radius: 1px; - font: -webkit-small-control; - color: initial; - letter-spacing: normal; - word-spacing: normal; - text-transform: none; - text-indent: 0px; - text-shadow: none; - display: inline-block; - text-align: start; - font-family: arial; -} -.blackBox input[type="text"]:hover, -.blackBox textarea:hover { - border: 1px solid #b9b9b9; - border-top: 1px solid #a0a0a0; - -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); - -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); - box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); -} -.blackBox textarea { - padding: 8px; - border: 1px solid #d9d9d9; - border-top: 1px solid #c0c0c0; - resize: none; - font: -webkit-small-control; - letter-spacing: normal; - word-spacing: normal; - text-transform: none; - text-indent: 0px; - text-shadow: none; - text-align: start; - font-family: arial; - font-size: 15px; - line-height: 17px; - width: 318px; -} -.blackBox .allMetacodes { - padding: 5px 0; -} -.blackBox a.button { - margin-right: 20px; - line-height: 40px; -} -.blackBox a.button, -.blackBox input.add { - float: left; - margin-top: 5px; - height: 40px; - font-family: 'LatoItalic'; - font-size: 17px; - width: auto; - padding: 0 30px; - cursor: pointer; - font-weight: normal; -} -.blackBox a.button:hover, -.blackBox input.add:hover { - -webkit-box-shadow: none; - box-shadow: none; -} -/* FAQ */ - -#wrapper > div.FAQ { - width: 700px; - margin: 0 auto; - padding: 20px 0 20px 20px; - background: rgba(0, 0, 0, 0.4); - color: white; - height: 100%; - overflow: hidden; - position: relative; -} -.FAQ .question { - display: block; - background: rgba(0, 0, 0, 0.4); - padding: 10px 45px 10px 10px; - font-weight: bold; - margin-bottom: 10px; - margin-right: 20px; - line-height: 24px; - position: relative; - cursor: pointer; -} -.FAQ .answer { - padding: 0 30px; - margin-bottom: 20px; - line-height: 24px; - margin-right: 20px; -} -.FAQ .answer.off { - display: none; -} -.FAQ .switch { - position: absolute; - top: 0; - right: 0; - width: 35px; - height: 44px; - background-repeat: no-repeat; - background-position: center center; - background-image: url('/assets/MMCCicon_maximize_arrow.png'); - background-size: 25px 25px; - cursor: pointer; -} -.FAQ .minimizeAnswer { - background-image: url('/assets/MMCCicon_minimize_arrow.png') !important; -} -/* request */ - -#wrapper .requestInvite { - width: 700px; - margin: 0 auto; - padding: 20px; - background: rgba(0, 0, 0, 0.4); - color: white; - height: 100%; - overflow: hidden; -} -.addMap { - display: block; - width: 32px; - height: 32px; - background: url('newmap.png') no-repeat center center; - background-size: 32px 32px; - cursor: pointer; - border-radius: 2px; - margin-right: 10px; -} - - -.home_bg { - display: block; - height: 100%; -} - - -#edit_synapse label, -#edit_synapse_left, -#edit_synapse_right { - display: inline-block; -} -#edit_synapse label.left { - margin-right: 0.5em; -} -.templates { - display: none; -} diff --git a/app/assets/base-bkup.css b/app/assets/base-bkup.css deleted file mode 100644 index 871a861e..00000000 --- a/app/assets/base-bkup.css +++ /dev/null @@ -1,639 +0,0 @@ -#center-container { - position:relative; - height:100%; - width:100%; - /* background-color:#031924; */ - color:#444; -} - -.showcard { - position:absolute; - display:none; - top:100px; - left:100px; - width:300px; - min-height:360px; - background-color:#F5F5F5; - text-align: left; - overflow: visible; - z-index:14000; - color: #424242; - border-radius:2px; - box-shadow: 0px 3px 3px rgba(0,0,0,0.23), 0 3px 3px rgba(0,0,0,0.16); -} - -.text { - margin: 7px; -} - -#infovis { - width:100%; - height:100%; -} - -.showcard .permission { - width:100%; - height:100%; -} - -.CardOnGraph { - display:block; - position:relative; - width:100%; - height:100%; - z-index: 25; -} - -.CardOnGraph .title { - font-size: 18px; - line-height: 22px; - display: block; - padding: 8px 16px; - height: 80px; - text-align: center; - font-family: 'din-regular', sans-serif; -} - -.best_in_place_name { - -} - -.best_in_place_name textarea, .best_in_place_name input { - font-family: 'din-regular', sans-serif; - color: #424242; - font-size: 18px; - line-height: 22px; -height: 15px; -padding: 5px 0; -width: 100%; -margin: 0; -border: 0; -outline: none; -background: none; -text-align:center; -} - -.CardOnGraph .scroll { - display:block; - padding: 8px 16px; - height: 152px; - font-size: 12px; - line-height:15px; - font-family: helvetica, sans-serif; -} - -.CardOnGraph .best_in_place_desc textarea { - font-size: 12px; - line-height:15px; - font-family: helvetica, sans-serif; - color: #424242; -padding: 0; -width: 100%; -margin: 0; -border: 0; -outline: none; -font-size: 12px; -line-height: 15px; -background: none; -} - -.CardOnGraph .desc h3 { - font-style:normal; - margin-top:5px; -} - -.CardOnGraph .best_in_place_desc input { - float: right; - margin: 2px 0px 0px 2px; - padding: 1px 5px; -} - -.CardOnGraph .best_in_place_desc { - display:block; - margin-top:2px; -} - -#edit_synapse .best_in_place_desc { - width: auto; -} - -.CardOnGraph .links { - position:relative; - border-bottom: 1px solid #BDBDBD; - border-top: 1px solid #BDBDBD; -} - -.linkItem { - float:left; - min-width:46px; - height:46px; - background-repeat: no-repeat; - background-position: 0 center; - background-size: 24px 24px; - z-index: 1; - position: relative; - color: #424242; - font-size: 12px; - line-height:12px; - height:12px; - padding:17px 0; -} -.linkItem a { - color: #424242; -} - -.CardOnGraph .icon { - position:absolute; - width:100%; - z-index:1; - padding: 0; -} -.linkItem.contributor { - background-image: url(MMCCicon_mapper_black.png); - margin-left:32px; - z-index:1; - padding:17px 0 17px 28px; -} -.linkItem.mapCount { - background-image: url(MMCCicon_map_black.png); - min-width: 16px; - padding:17px 0 17px 28px; -} -.linkItem.synapseCount { - background-image: url(MMCCicon_synapse_black.png); - min-width: 16px; - padding:17px 0 17px 28px; -} -.linkItem.mapPerm { - -} -.linkItem.mapPerm.co { - background-image: url(MMCCicon_commons.png); -} -.linkItem.mapPerm.pu { - background-image: url(MMCCicon_public.png); -} -.linkItem.mapPerm.pr { - background-image: url(MMCCicon_private.png); -} - -.showcard .yourTopic .mapPerm:hover { - background-image: url(/assets/MMCCicon_maximize_arrow_black.png); - background-size: 31px 25px; - background-position-x: 8px; - cursor:pointer; -} -.showcard .yourTopic .mapPerm.minimize { - background-image: url(MMCCicon_minimize_arrow_black.png) !important; - background-size: 31px 25px; -background-position-x: 8px; -cursor: pointer; -} -.mapPerm .permissionSelect { - list-style: none; - width: 40px; - height: 80px; - position: relative; - top: 40px; -} -.mapPerm .permissionSelect li { - width: 40px; - height: 40px; - background-repeat: no-repeat; - background-position: center center; - background-size: 27px 27px; - background-color: #F5F5F5; -} -.mapPerm .permissionSelect .commons { - background-image: url(MMCCicon_commons.png); -} -.mapPerm .permissionSelect .public { - background-image: url(MMCCicon_public.png); -} -.mapPerm .permissionSelect .private { - background-image: url(MMCCicon_private.png); -} -.mapPerm .permissionSelect .commons:hover { - background-image: url(MMCCicon_commons_black.png); -} -.mapPerm .permissionSelect .public:hover { - background-image: url(MMCCicon_public_black.png); -} -.mapPerm .permissionSelect .private:hover { - background-image: url(MMCCicon_private_black.png); -} - -.CardOnGraph .metacodeTitle { - font-style: italic; - font-family: 'vinyl'; - text-transform: uppercase; - position: absolute; - line-height: 24px; - height:24px; - font-size: 20px; - display: none; - width: 90%; - padding: 11px 0 11px 10%; - background-color: #64BC61; - color: #000; -} -.permission.canEdit .metacodeTitle { - cursor:pointer; - background-image: url(MMCCicon_maximize_arrow_black.png); - background-repeat:no-repeat; - background-position: right center; -} -.permission.canEdit .metacodeTitle.minimize { - background-image: url(MMCCicon_minimize_arrow_black.png); -} - -.CardOnGraph .metacodeImage { - cursor:move; - width:46px; - height:46px; - position:absolute; - left:-23px; - top:0; - background-size:46px 46px; - background-position:0 0; - background-repeat:no-repeat; -} - -#metacodeOptions { - display:none; -} -.CardOnGraph .metacodeSelect { - display:none; - width:100%; - z-index: 2; - position: absolute; - background: #EAEAEA; - height: 150px; -} -.CardOnGraph .metacodeSelect ul { -font-style: italic; -font-family: 'vinyl'; -text-transform: uppercase; -position: absolute; -line-height: 36px; -font-size: 20px; -display:block; -width: 100%; -margin:0; -padding: 0; -list-style:none; -height:150px; -overflow:hidden; -} -.CardOnGraph .metacodeSelect ul li { -background-color: #EAEAEA; -width:100%; -border-bottom:1px solid #AAAAAA; -cursor:pointer; -} -.CardOnGraph .metacodeSelect ul li:hover { -background-color: #F8F8F8; -} -.CardOnGraph .metacodeSelect ul li img, .CardOnGraph .metacodeSelect ul li .mSelectName { -float:left; -} - -.CardOnGraph .hoverForTip:hover .tip, .mapCard .hoverForTip:hover .tip { - display:block; -} -.CardOnGraph .tip, .mapCard .tip { - display:none; - position: absolute; - background: black; - top: 35px; - left: 0; - color: white; - border-radius: 4px; - font-size:15px !important; - font-family:'LatoRegular'; - line-height:17px; - padding: 3px 5px 2px; - z-index:100; -} - - -.CardOnGraph .attachments { - border-top: 1px solid #BDBDBD; - width:100%; - height:47px; -} - -.attachments a { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - margin-left: 40px; - padding-top:9px; - font-size: 16px; - line-height: 16px; -} - -.addAttachment div { - display: inline-block; - width: 150px; - height: 23px; - text-align: center; - padding-top: 25px; - font-size: 12px; - color: #9e9e9e; - cursor: pointer; -} - -.addAttachment div:hover { - color: #616161; -} - -.addLink div { - float: left; -} - -#addLinkBack { - height: 48px; - width: 48px; - cursor: pointer; -} -#addLinkInput { - height: 32px; - width: 236px; - padding: 8px 16px 8px 0; - position: relative; -} - -#addLinkInput input{ -padding: 7px 31px 7px 31px; -height: 16px; -width: 172px; -margin: 0 0 0 0; -border: 1px solid #BDBDBD; -outline: none; -font-size: 16px; -line-height: 16px; -background: white; -color: black; -font-family: 'LatoLight'; -} - -#addLinkReset { - position: absolute; - top: 8px; - right: 16px; - width: 32px; - height: 32px; - cursor: pointer; - float:none; -} - -.cardSettings { - position: absolute; - left: 12px; - top: 12px; -} - -.editSettings { - background: #ddd; - border-radius: 10px; - padding: 5px 0 5px 5px; - position: relative; - left: 16px; - width: 175px; - opacity: 0.98; - box-shadow: 4px 4px 5px #888888; - border: 1px solid #AAA; - z-index: 5; -} - -.editSettings span { - display: inline-block; -} - -.permActivator { - width: 16px; - height: 16px; - background: url('settings.png') no-repeat 0 0; - overflow:hidden; - position: absolute; - left: 0px; - top: 30px; -} - -#edit_synapse .mapPerm, -#edit_synapse .permActivator { - position: static; - display: inline-block; - color: #000; -} - -#edit_synapse .mapPerm { - width: 20px; - height:20px; - background-repeat: no-repeat; - background-size: 20px 20px; - margin: 10px 12px 0 12px; -} -#edit_synapse .mapPerm.co { - background-image: url("/assets/MMCCicon_commons.png"); -} -#edit_synapse .mapPerm.pu { - background-image: url("/assets/MMCCicon_public.png"); -} -#edit_synapse .mapPerm.pr { - background-image: url("/assets/MMCCicon_private.png"); -} - -#edit_synapse .permActivator { - position: absolute; - margin-top: -1.3em; -} - -#edit_synapse { - background: url("/assets/MMCCicon_synapse_black.png") no-repeat scroll 0 center / 30px 30px #FFFFFF; - border-radius: 5px; - padding: 5px 5px 5px 30px; - color: #000; -} - -#edit_synapse_name { - margin-left: 0.4em; - border-bottom: 1px solid black; - text-align:center; - max-width: 160px; -} - -#edgeUser { - display:inline-block; - background-position: center center; - background-repeat: no-repeat; - background-size: 20px 20px; - height: 20px; - min-width: 20px; - position: relative; - background-image: url("MMCCicon_mapper_black.png"); - margin: 10px 0 0 10px; -} -#edgeUser.hoverForTip:hover .tip { - display:block; -} -#edgeUser .tip { - background: none repeat scroll 0 0 #000000; - border-radius: 4px; - color: #FFFFFF; - display: none; - font-family: 'LatoRegular'; - font-size: 15px !important; - line-height: 17px; - padding: 3px 5px 2px; - position: absolute; - left: 0; - text-align: center; - top: 23px; - z-index: 100; -} - -#edit_synapse .click-to-edit { - margin-left: 0.3em; -} - -#edit_synapse.yourEdge .mapPerm:hover { - background-image: url(/assets/MMCCicon_maximize_arrow_black.png); - background-size: 24px 17px; - background-position: 0px 2px; - cursor:pointer; -} -#edit_synapse.yourEdge .mapPerm.minimize { - background-image: url(MMCCicon_minimize_arrow_black.png) !important; - background-size: 24px 17px; - background-position: 0px 2px; - cursor: pointer; -} -#edit_synapse .mapPerm .permissionSelect { - list-style: none; - width: 26px; - height: 52px; - position: relative; - top: 20px; - left:-3px; -} -#edit_synapse .mapPerm .permissionSelect li { - width: 26px; - height: 26px; - background-repeat: no-repeat; - background-position: center center; - background-size: 20px 20px; - background-color:white; -} - - -/* Map Cards */ - -.map { - float:left; - width:220px; - height:340px; - font-size: 12px; - text-align: left; - overflow: visible; - background: #424242; - border-radius:2px; - margin:0 12px 12px 0; -} - -.mapCard { - display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */ - display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */ - display: -ms-flexbox; /* TWEENER - IE 10 */ - display: -webkit-flex; /* NEW - Chrome */ - display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */ - -webkit-box-orient: vertical; - -moz-box-orient: vertical; - -webkit-box-direction: normal; - -moz-box-direction: normal; - -ms-flex-direction: column; - -webkit-flex-direction: column; - flex-direction: column; - position:relative; - width:100%; - height:308px; - padding: 16px 0; - color:#F5F5F5; -} - -.mapCard .title { - font-size:18px; - line-height:22px; - display:block; - padding: 0 16px; - text-align: center; - -webkit-box-flex: none; /* OLD - iOS 6-, Safari 3.1-6 */ - -moz-box-flex: none; /* OLD - Firefox 19- */ - -webkit-flex: none; /* Chrome */ - -ms-flex: none; /* IE 10 */ - flex: none; /* NEW, Spec - Opera 12.1, Firefox 20+ */ - font-family: 'din-regular', sans-serif; -} - -.mapCard .mapScreenshot { - width: 188px; - height: 126px; - padding: 8px 16px; -} -.mapCard .mapScreenshot img { - width: 188px; - height: 126px; -} - -.mapCard .scroll { - display:block; - -webkit-box-flex: 1; /* OLD - iOS 6-, Safari 3.1-6 */ - -moz-box-flex: 1; /* OLD - Firefox 19- */ - -webkit-flex: 1; /* Chrome */ - -ms-flex: 1; /* IE 10 */ - flex: 1; /* NEW, Spec - Opera 12.1, Firefox 20+ */ - overflow-y:auto; - padding:0 16px 8px; - font-family: helvetica, sans-serif; - font-style: italic; - font-size: 12px; -} -.mCS_no_scrollbar { - padding-right: 5px; -} - -.mapCard .mapMetadata { - font-family: 'din-regular', sans-serif; - font-size: 12px; - position:relative; - border-top: 1px solid #BDBDBD; - -webkit-box-flex: none; /* OLD - iOS 6-, Safari 3.1-6 */ - -moz-box-flex: none; /* OLD - Firefox 19- */ - -webkit-flex: none; /* Chrome */ - -ms-flex: none; /* IE 10 */ - flex: none; /* NEW, Spec - Opera 12.1, Firefox 20+ */ -} - -.mapCard .metadataSection { - padding: 8px 16px 0 16px; - width: 78px; - float: left; -} - -.mapPermission { - font-family: 'din-medium', sans-serif; -} -.cCountColor { - font-family: 'din-medium', sans-serif; - color: #DB5D5D; -} -.tCountColor { - font-family: 'din-medium', sans-serif; - color: #4FC059; -} -.sCountColor { - font-family: 'din-medium', sans-serif; - color: #DAB539; -} \ No newline at end of file diff --git a/app/assets/images/arrowdown_sprite.png b/app/assets/images/arrowdown_sprite.png index ec3a4550369baf7b4f598b4dbb21fd401ddd458c..1353452d97d8f9f807bc41ca744521e2260e660d 100755 GIT binary patch delta 259 zcmV+e0sQ`<0?PuB7YZ;41^@s67+?BVks&>Q*hxe|RCwC#l+g{sAQVNZaUUJQz#@*o z7ytcb3KoGGbQ3!P-kNKowm^x&#Dpdd>Em+JKFS$ljN+SX=zw=X2;qX^P*`)7QXZcV zyN}5e?kTf)Vn(b2K)z)lkHyT0)Emr@`7`tiKyyxH0faaV<4b8|t!@|4R7c=BmDv|= zIUIH5bp&=Fbih9Wlv0~~ z;Jt6;1CWb8U?zQ>5lH%gb7dbOxbOjMb-RG3Is&^7S_19@3;=Oby$2`vGA#fA002ov JPDHLkV1f>AZoL2i delta 217 zcmX@jw2*0nIF|wk8v_G_bmxyV6BTXi*Lk`)hE&{2`t$$4J+o><;T47u=2NFm=`m>5 zGF9o7m6l2#u<*&4#OLrwu>VGw6h@Qs`0Fhhn1(}Y?5YI8WQ z>}h!6z#?^tVacn7cia{{W1E!Bn89%a$YP1fir{FeIG7P6XWHO5^0Y>ERCm(0md(ZvH}}=9nLO(%BaiBz+u2JCAzz^{M#%m QpcfcCUHx3vIVCg!0IA(r%m4rY diff --git a/app/assets/images/arrowperms_sprite.png b/app/assets/images/arrowperms_sprite.png new file mode 100644 index 0000000000000000000000000000000000000000..eff00341973b69fc75f27f31f32ecc4f0aed0132 GIT binary patch literal 543 zcmeAS@N?(olHy`uVBq!ia0vp^4nVBH!3HE3&8=$zQk(@Ik;M!Q+`=Ht$S`Y;1W-`2 z#5JNMI6tkVJh3R1!7(L2DOJHUH!(dmC^a#qvhZZ84Fdz?8c!F;kcwMxA|4ht8Hlin zYe-+=?GpA#Y`Dc)(tL@xfcb8NUw~}GYCna%1oI5_1@FJ^yH^>*!P!}Vs=EBXtLLYu zPfs6r=9#^W^O(%!geQtj9Slkh910N1Kx30mx5Rd@bL{4YKKV)vg6dadB!0Z9{>)vV zFJn=Zl_l$*@msGUSd&A4?K<7~^{ZZ;p3IRnT-{AAgk6NT@Gy&mpeB#d45h}MN{s8c zrH`vK7Tas?y56$l@w7Y2?zwkgh%|`VX_$T4tuaw-T9a(1-=heT-8-1YFP54vh&^M+ z*&jRm`GG~8GK(H>;wvydA86e3J4yPuFHiRcu_NrwF4;~z)!)Pvy#@6OF6}xzle7Qh zSMLILYg^&Wyx%qL!D$73;*279(i4^yFEiW0R-)*8+2i_ud4W^=4}CJzKnltO9*^A{ a7#T!w7q91RJYEWnTn0~9KbLh*2~7a^EY{Tk literal 0 HcmV?d00001 diff --git a/app/assets/images/arrowright_sprite.png b/app/assets/images/arrowright_sprite.png index f0242bfb8d62c8c1ddd9895158b5a780fe0710fd..5fb67803c7e3c9e1f15d98c36fadf467166e1717 100755 GIT binary patch delta 278 zcmV+x0qOp)0^I_T7YZ;41^@s67+?BVks&>Q>PbXFRCwC#mB9^yKoCWNc-Io_KuRD` zfR>;|EJbj#17im?up2s1OR)lcd+FjkUHX zn@?xc6f@jC8Ju(5*aH-SvmLnuDWw2EYjOi}lmgy!0dm#={FEBNwXW+*3OG@oeFv+5 zK=DZqln2QzJV+HQhc@x6E%eEk|26)o4~#KA(fgonTfGl}=zRc0?*kx-eb9BC+y|89 zKA-c`v9HyMDK&9Y4kn-qW1w1y$^sS_5uG(xeqAIeLz|6gIGDVi3{?< cOMn3YKiGr%GlDA600000NkvXXu0mh|f`FNK-v9sr delta 231 zcmcc1w4P~#IF|wk8v_G_bmxyV6BTXi_jtNEhE&{2`t$$4J+o><;Q`(R2FZp#Z*OmN zhK&qnmL+Fe4#(6h*ad`zEps@*=u`3JOXClw3j)kVybO$W3U>S^DvdGB2?=%=CU8!X zU|?dKBC%n^>eZ)#f<-RsJ8W+3F4zD0lrg{B5%fqv ei=TmshvCp+hUET_X)ZtyF?hQAxvX",t+=""+this.title+""):"video"===this.type||"rich"===this.type?t=this.html:(this.title=this.title||this.url,t=this.thumbnail_url?"":"",t+=""+this.title+"",t+=this.provider_name?""+this.provider_name+"":"",t+=this.description?'
'+this.description+"
":""),this.options.wrapElement&&(t="<"+this.options.wrapElement+' class="'+this.options.className+'">'+t+""),this.code=t,"replace"===this.options.method?this.$elem.replaceWith(this.code):"after"===this.options.method?this.$elem.after(this.code):"afterParent"===this.options.method?this.$elem.parent().after(this.code):"replaceParent"===this.options.method&&this.$elem.parent().replaceWith(this.code),this.$elem.trigger("displayed",[this])}},t.embedly=new l,t.embedly.display=new h,t.fn.embedly=function(i){if(void 0===i||"object"==typeof i){if(i=t.extend({},e,t.embedly.defaults,"object"==typeof i&&i),r(i.key))return t.embedly.log("error","Embedly jQuery requires an API Key. Please sign up for one at http://embed.ly"),this.each(t.noop);var n={},s=function(e){if(!t.data(t(e),"embedly")){var r=t(e).attr("href"),s=new u(e,r,i);t.data(e,"embedly",s),n.hasOwnProperty(r)?n[r].push(s):n[r]=[s]}},o=this.each(function(){r(t(this).attr("href"))?t(this).find("a").each(function(){r(t(this).attr("href"))||s(this)}):s(this)}),a=t.embedly.ajax(i.endpoint,t.map(n,function(t,e){return e}),i).progress(function(e){t.each(n[e.original_url],function(t,i){i.progress(e)})});return i.progress&&a.progress(i.progress),i.done&&a.done(i.done),o}},t.expr[":"].embedly=function(e){return!r(t(e).data("embedly"))},t.fn.display=function(i,n){if(r(i)&&(i="display"),void 0===n||"object"==typeof n){if(n=t.extend({},e,t.embedly.defaults,"object"==typeof n&&n),r(n.key))return t.embedly.log("error","Embedly jQuery requires an API Key. Please sign up for one at http://embed.ly/display"),this.each(t.noop);var s=function(e){var r=t(e);if(!r.data("display")){var s=r.data("src")||r.attr("href"),o={original_url:s,url:t.embedly.display.build(i,s,n)};r.data("display",o),r.trigger("initialized",[e]);var a="";r.is("a")?r.append(a):r.replaceWith(a)}},o=function(e){return r(t(e).data("src"))&&r(t(e).attr("href"))?!1:!0},a=this.each(function(){o(this)?s(this):t(this).find("img,a").each(function(){o(this)&&s(this)})});return a}},t.expr[":"].display=function(e){return!r(t(e).data("display"))}})(jQuery,window); \ No newline at end of file diff --git a/app/assets/javascripts/metamaps/Metamaps.JIT.js b/app/assets/javascripts/metamaps/Metamaps.JIT.js index f0e1d876..7821dc14 100644 --- a/app/assets/javascripts/metamaps/Metamaps.JIT.js +++ b/app/assets/javascripts/metamaps/Metamaps.JIT.js @@ -586,6 +586,10 @@ Metamaps.JIT = { var node = eventInfo.getNode(); var edge = eventInfo.getEdge(); + if (Metamaps.Active.Map && Metamaps.Realtime.status) { + Metamaps.Realtime.sendCoords(eventInfo.getPos()); + } + //if we're on top of a node object, act like there aren't edges under it if (node != false) { if (Metamaps.Mouse.edgeHoveringOver) { diff --git a/app/assets/javascripts/metamaps/Metamaps.Router.js b/app/assets/javascripts/metamaps/Metamaps.Router.js index 50604f63..c3ca8a65 100644 --- a/app/assets/javascripts/metamaps/Metamaps.Router.js +++ b/app/assets/javascripts/metamaps/Metamaps.Router.js @@ -76,7 +76,7 @@ Metamaps.Views.exploreMaps.setCollection( Metamaps.Maps[capitalize] ); if (Metamaps.Maps[capitalize].length === 0) { - Metamaps.Loading.loader.show(); + Metamaps.Loading.show(); setTimeout(function(){ Metamaps.Maps[capitalize].getMaps(); // this will trigger an explore maps render }, 300); // wait 300 milliseconds till the other animations are done to do the fetch diff --git a/app/assets/javascripts/metamaps/Metamaps.Views.js b/app/assets/javascripts/metamaps/Metamaps.Views.js index e63803c8..cb399c62 100644 --- a/app/assets/javascripts/metamaps/Metamaps.Views.js +++ b/app/assets/javascripts/metamaps/Metamaps.Views.js @@ -67,7 +67,7 @@ Metamaps.Views.init = function () { }, 100); } - Metamaps.Loading.loader.hide(); + Metamaps.Loading.hide(); setTimeout(function(){ var path = Metamaps.currentSection == "" ? "" : "/explore/" + Metamaps.currentPage; Metamaps.Router.navigate(path); diff --git a/app/assets/javascripts/metamaps/Metamaps.js b/app/assets/javascripts/metamaps/Metamaps.js index 5ba821e5..50535fef 100644 --- a/app/assets/javascripts/metamaps/Metamaps.js +++ b/app/assets/javascripts/metamaps/Metamaps.js @@ -115,6 +115,12 @@ Metamaps.Backbone.init = function () { } this.on('change:metacode_id', Metamaps.Filter.checkMetacodes, this); + + var updateName = function () { + if (this.get('node')) this.get('node').name = this.get('name'); + if (Metamaps.Visualize) Metamaps.Visualize.mGraph.plot(); + }; + this.on('change:name', updateName, this); }, authorizeToEdit: function (mapper) { if (mapper && (this.get('permission') === "commons" || this.get('user_id') === mapper.get('id'))) return true; @@ -627,7 +633,7 @@ Metamaps.Create = { */ Metamaps.TopicCard = { openTopicCard: null, //stores the JIT local ID of the topic with the topic card open - linkActionsString: '
share
remove
', + linkActionsString: '
Remove
', init: function () { // initialize best_in_place editing @@ -664,30 +670,31 @@ Metamaps.TopicCard = { var self = Metamaps.TopicCard; var showCard = document.getElementById('showcard'); + // get mapper image + var setMapperImage = function (mapper) { + console.log(mapper); + $('.contributorIcon').attr('src', mapper.get('image')); + }; + Metamaps.Mapper.get(topic.get('user_id'), setMapperImage) // starting embed.ly var addLinkFunc = function () { var addLinkDiv =''; var addLinkDesc ='Enter or paste a link'; - addLinkDiv+='
'; + addLinkDiv+='
'; addLinkDiv+='
'; addLinkDiv+='
'; $('.addAttachment').hide(); $('.attachments').append(addLinkDiv); - $('.showcard #addLinkBack').click(backFunc); $('.showcard #addLinkReset').click(resetFunc); $('.showcard #addLinkInput input').bind("paste keyup",inputEmbedFunc); $('#addLinkInput input').focus(); }; - var backFunc = function () { + var resetFunc = function () { $('.addLink').remove(); $('.addAttachment').show(); }; - var resetFunc = function () { - $('#addLinkInput input').val(''); - $('#addLinkInput input').focus(); - }; var inputEmbedFunc = function (event) { var element = this; @@ -700,23 +707,24 @@ Metamaps.TopicCard = { topic.save({ link: text }); - var embedlyEl = $('', { + var embedlyEl = $('', { id: 'embedlyLink', + 'data-card-chrome': '0', + 'data-card-description': '0', href: text - }); - embedlyEl.embedly({ - query: {maxwidth: 300}, - key: '7983300f4c1f48569ca242e3d6bff1e9' - }); + }).html(text); + //embedlyEl.embedly({ + // query: {maxwidth: 300}, + // key: '7983300f4c1f48569ca242e3d6bff1e9' + //}); $('.addLink').remove(); $('.embeds').append(embedlyEl); + embedly('card', document.getElementById('embedlyLink')); + $('.CardOnGraph').addClass('hasAttachment'); $('.attachments').append(self.linkActionsString); bindLinkActionListeners(); } }, 100); - }; - var shareLinkFunc = function () { - }; var removeLinkFunc = function () { topic.save({ @@ -725,16 +733,17 @@ Metamaps.TopicCard = { $('.embeds').empty(); $('.linkActions').remove(); $('.addAttachment').show(); + $('.CardOnGraph').removeClass('hasAttachment'); }; var bindLinkActionListeners = function () { $('#linkremove').click(removeLinkFunc); - $('#linkshare').click(shareLinkFunc); }; if (topic.get('link')) { - $('#embedlyLink').embedly({ - query: {maxwidth: 300}, - key: '7983300f4c1f48569ca242e3d6bff1e9' - }); + //$('#embedlyLink').embedly({ + // query: {maxwidth: 300}, + // key: '7983300f4c1f48569ca242e3d6bff1e9' + //}); + embedly('card', document.getElementById('embedlyLink')); bindLinkActionListeners(); } $('.showcard #addlink').click(addLinkFunc); @@ -836,21 +845,12 @@ Metamaps.TopicCard = { //bind best_in_place ajax callbacks $(showCard).find('.best_in_place_name').bind("ajax:success", function () { - - var s = $('.showcard').find('.scroll'); - s.height(s.height()).mCustomScrollbar('update'); - - var name = $(this).html(); - topic.set("name", Metamaps.Util.decodeEntities(name)); - Metamaps.Visualize.mGraph.plot(); + var name = Metamaps.Util.decodeEntities($(this).html()); + topic.set("name", name); }); $(showCard).find('.best_in_place_desc').bind("ajax:success", function () { this.innerHTML = this.innerHTML.replace(/\r/g, '') - - var s = $('.showcard').find('.scroll'); - s.height(s.height()).mCustomScrollbar('update'); - var desc = $(this).html(); topic.set("desc", desc); }); @@ -902,18 +902,20 @@ Metamaps.TopicCard = { nodeValues.attachments = ''; if (topic.get('link') && topic.get('link')!=='') { - nodeValues.embeds = ''; + nodeValues.embeds = ''; nodeValues.embeds += topic.get('link'); nodeValues.embeds += ''; addAttachmentHidden='hidden'; nodeValues.attachments += self.linkActionsString; + nodeValues.hasAttachment = "hasAttachment"; } else { nodeValues.embeds = ''; + nodeValues.hasAttachment = ''; } nodeValues.attachments += '
'; - nodeValues.attachments+= ''; - nodeValues.attachments+= '
Upload a file
'; + nodeValues.attachments+= ''; + nodeValues.attachments+= '
Upload a file
'; nodeValues.permission = topic.get("permission"); nodeValues.mk_permission = topic.get("permission").substring(0, 2); @@ -1281,7 +1283,7 @@ Metamaps.Visualize = { self.mGraph.graph.empty(); } - Metamaps.Loading.loader.hide(); + Metamaps.Loading.hide(); // load JSON data, if it's not empty if (!self.loadLater) { //load JSON data. @@ -1460,6 +1462,7 @@ Metamaps.Realtime = { $(".rtMapperSelf").removeClass('littleRtOff').addClass('littleRtOn'); self.status = true; $(".sidebarCollaborateIcon").addClass("blue"); + $(".collabCompass").show(); } }, turnOff: function () { @@ -1470,6 +1473,7 @@ Metamaps.Realtime = { $(".rtMapperSelf").removeClass('littleRtOn').addClass('littleRtOff'); self.status = false; $(".sidebarCollaborateIcon").removeClass("blue"); + $(".collabCompass").hide(); } }, setupSocket: function () { @@ -1500,6 +1504,9 @@ Metamaps.Realtime = { socket.on('maps-' + Metamaps.Active.Map.id + '-lostrealtime', self.lostCollaborator); socket.on('maps-' + Metamaps.Active.Map.id, self.contentUpdate); + + // update mapper compass position + socket.on('maps-' + Metamaps.Active.Map.id + '-updatePeerCoords', self.updatePeerCoords); }, sendRealtimeOn: function () { var self = Metamaps.Realtime; @@ -1536,6 +1543,7 @@ Metamaps.Realtime = { self.mappersOnMap[data.userid] = { name: data.username, + image: data.userimage, realtime: data.userrealtime }; @@ -1552,6 +1560,14 @@ Metamaps.Realtime = { $('#mapper' + data.userid).remove(); $('.realtimeMapperList ul').append(mapperListItem); + + // create a div for the collaborators compass + $('#compass' + data.userid).remove(); + $('
', { + id: 'compass' + data.userid, + text: data.username, + class: 'collabCompass' + }).appendTo('#wrapper'); }, newPeerOnMap: function (data) { var self = Metamaps.Realtime; @@ -1560,21 +1576,30 @@ Metamaps.Realtime = { // data.userid // data.username // data.userimage + // data.coords self.mappersOnMap[data.userid] = { name: data.username, realtime: true }; + // create an item for them in the realtime box var mapperListItem = '
  • '; mapperListItem += ''; mapperListItem += data.username; mapperListItem += '
    '; mapperListItem += '
    • '; - $('#mapper' + data.userid).remove(); $('.realtimeMapperList ul').append(mapperListItem); + // create a div for the collaborators compass + $('#compass' + data.userid).remove(); + $('
    ', { + id: 'compass' + data.userid, + text: data.username, + class: 'collabCompass' + }).appendTo('#wrapper'); + Metamaps.GlobalUI.notifyUser(data.username + ' just joined the map'); // send this new mapper back your details, and the awareness that you've loaded the map @@ -1611,6 +1636,7 @@ Metamaps.Realtime = { self.mappersOnMap[data.userid].realtime = true; $('#mapper' + data.userid).removeClass('littleRtOff').addClass('littleRtOn'); + $('#compass' + data.userid).show(); Metamaps.GlobalUI.notifyUser(data.username + ' just turned on realtime'); }, @@ -1624,9 +1650,42 @@ Metamaps.Realtime = { self.mappersOnMap[data.userid].realtime = false; $('#mapper' + data.userid).removeClass('littleRtOn').addClass('littleRtOff'); + $('#compass' + data.userid).hide(); Metamaps.GlobalUI.notifyUser(data.username + ' just turned off realtime'); }, + updatePeerCoords: function (data) { + var self = Metamaps.Realtime; + var socket = Metamaps.Realtime.socket; + + var c = data.usercoords, + canvas = Metamaps.Visualize.mGraph.canvas, + s = canvas.getSize(), + p = canvas.getPos(), + ox = canvas.translateOffsetX, + oy = canvas.translateOffsetY, + sx = canvas.scaleOffsetX, + sy = canvas.scaleOffsetY; + var pixels = { + x: (c.x / (1/sx)) + p.x + s.width/2 + ox, + y: (c.y / (1/sy)) + p.y + s.height/2 + oy + }; + $('#compass' + data.userid).css({ + left: pixels.x + 'px', + top: pixels.y + 'px' + }); + }, + sendCoords: function (coords) { + var self = Metamaps.Realtime; + var socket = Metamaps.Realtime.socket; + + var update = { + usercoords: coords, + userid: Metamaps.Active.Mapper.id, + mapid: Metamaps.Active.Map.id + }; + socket.emit('updateMapperCoords', update); + }, contentUpdate: function (data) { var self = Metamaps.Realtime; var socket = Metamaps.Realtime.socket; @@ -3167,30 +3226,11 @@ Metamaps.Mapper = { // this function is to retrieve a mapper JSON object from the database // @param id = the id of the mapper to retrieve get: function (id, callback) { - // if the desired topic is not yet in the local topic repository, fetch it - if (Metamaps.Mappers.get(id) == undefined) { - if (!callback) { - var e = $.ajax({ - url: "/users/" + id + ".json", - async: false - }); - Metamaps.Mappers.add($.parseJSON(e.responseText)); - return Metamaps.Mappers.get(id); - } else { - return $.ajax({ - url: "/users/" + id + ".json", - success: function (data) { - Metamaps.Mappers.add(data); - callback(Metamaps.Mappers.get(id)); - } - }); + return $.ajax({ + url: "/users/" + id + ".json", + success: function (data) { + callback(new Metamaps.Backbone.Mapper(data)); } - } else { - if (!callback) { - return Metamaps.Mappers.get(id); - } else { - return callback(Metamaps.Mappers.get(id)); - } - } - }, + }); + } }; // end Metamaps.Mapper diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css index 035659aa..65fadd92 100644 --- a/app/assets/stylesheets/application.css +++ b/app/assets/stylesheets/application.css @@ -270,7 +270,6 @@ input[type="submit"]:active { font-size: 25px; line-height: 35px; color: rgba(255, 255, 255, 0.7); - font-family: 'LatoLight'; } .openMetacodeSwitcher { display: block; @@ -291,7 +290,6 @@ input[type="submit"]:active { width: 120px; text-align: center; margin-left: 90px; - font-family: 'LatoRegular'; } /* synapse autocomplete */ @@ -312,7 +310,6 @@ input[type="submit"]:active { outline: none; font-size: 18px; line-height: 35px; - font-family: 'LatoRegular'; } .new_synapse #synapse_desc { color: rgba(255, 255, 255, 0.7); @@ -331,7 +328,6 @@ input[type="submit"]:active { outline: none; font-size: 16px; line-height: 20px; - font-family: 'LatoRegular'; } label, select, @@ -402,7 +398,6 @@ label { height: 30px; background: none; color: #717474; - font-family: 'LatoLight'; font-size: 17px; border: none; border-right: 1px solid #717474; @@ -646,7 +641,6 @@ label[for="user_remember_me"] { color: white; border-radius: 4px; font-size: 15px !important; - font-family: 'LatoRegular'; line-height: 17px; padding: 3px 5px 2px; z-index: 100; @@ -926,7 +920,6 @@ float: left; } #new_topic .tt-suggestion { padding: 5px; - font-family: 'LatoLight'; background: rgba(42, 52, 60, 0.9); ; } @@ -976,7 +969,6 @@ float: left; white-space: nowrap; border-radius: 4px; font-size: 15px !important; - font-family: 'LatoRegular'; line-height: 15px; padding: 2px 5px 2px; z-index: 100; @@ -1001,7 +993,6 @@ float: left; } #new_synapse .tt-suggestion { padding: 5px; - font-family: 'LatoLight'; } #new_synapse .autocompleteSection { float: left; @@ -1049,7 +1040,6 @@ float: left; white-space: nowrap; border-radius: 4px; font-size: 15px !important; - font-family: 'LatoRegular'; line-height: 15px; padding: 2px 5px 2px; z-index: 100; @@ -1160,14 +1150,14 @@ float: left; background-position: -32px 0; } .yourMap .mapPermission:hover { - background-image: url(arrowdown_sprite.png); + background-image: url(arrowperms_sprite.png); cursor: pointer; - background-position: center -11px; + background-position: -32px 0; } .yourMap .mapPermission.minimize { - background-image: url(arrowdown_sprite.png) !important; + background-image: url(arrowperms_sprite.png) !important; cursor: pointer; - background-position: center -11px; + background-position: 0 0; } .mapInfoBox .mapPermission .permissionSelect { list-style: none; @@ -1427,13 +1417,12 @@ float: left; #metacodeSwitchTabs { width: 100%; - font-family: LatoLight, Arial, Sans-Serif; font-size: 17px; line-height: 21px; border: none; } #metacodeSwitchTabs .setTitle { - font-family: Lato, Arial, sans-serif; + } #metacodeSwitchTabs .setDesc { margin-bottom: 5px; @@ -1474,7 +1463,6 @@ float: left; background: none; font-size: 14px; line-height: 14px; - font-family: Lato; } #metacodeSwitchTabs button.button { width: auto !important; @@ -1633,7 +1621,6 @@ float: left; color: white; border-radius: 4px; font-size: 15px !important; - font-family: 'LatoRegular'; line-height: 17px; padding: 3px 5px 2px; z-index: 100; @@ -1659,7 +1646,6 @@ float: left; float: left; margin-top: 5px; height: 40px; - font-family: 'LatoItalic'; font-size: 17px; width: auto; padding: 0 30px; @@ -1676,13 +1662,11 @@ float: left; #cheatSheet { width: 100%; height: 350px; - font-family: LatoLight, Arial, Sans-Serif; font-size: 17px; line-height: 21px; border: none; } #cheatSheet .sectionTitle { - font-family: Lato, Arial, sans-serif; font-weight: bold; } #cheatSheet .csItem { @@ -1695,7 +1679,7 @@ float: left; margin: 0 2px; } #cheatSheet .csTitle { - font-family: Lato, Arial, sans-serif; + } #cheatSheet .indented { margin-left: 15px; @@ -1816,7 +1800,6 @@ float: left; float: left; margin-top: 5px; height: 40px; - font-family: 'LatoItalic'; font-size: 17px; width: auto; padding: 0 30px; diff --git a/app/assets/stylesheets/base.css b/app/assets/stylesheets/base.css index 07faaad4..ad418082 100644 --- a/app/assets/stylesheets/base.css +++ b/app/assets/stylesheets/base.css @@ -12,7 +12,6 @@ top:100px; left:100px; width:300px; - min-height:360px; background-color:#F5F5F5; text-align: left; overflow: visible; @@ -40,22 +39,27 @@ display:block; position:relative; width:100%; - height:100%; + min-height:360px; z-index: 25; } +.CardOnGraph.hasAttachment { + min-height:0; +} .CardOnGraph .title { font-size: 18px; line-height: 22px; - display: block; + display: table; padding: 8px 16px; height: 80px; text-align: center; font-family: 'din-regular', sans-serif; + width: 268px; } -.best_in_place_name { - +.CardOnGraph .titleWrapper { + display: table-cell; + vertical-align: middle; } .best_in_place_name textarea, .best_in_place_name input { @@ -81,6 +85,9 @@ text-align:center; line-height:15px; font-family: helvetica, sans-serif; } +.CardOnGraph.hasAttachment .scroll { + height: auto; +} .CardOnGraph .best_in_place_desc textarea { font-size: 12px; @@ -126,11 +133,7 @@ background: none; .linkItem { float:left; - min-width:46px; height:46px; - background-repeat: no-repeat; - background-position: 0 center; - background-size: 24px 24px; z-index: 1; position: relative; color: #424242; @@ -150,78 +153,111 @@ background: none; padding: 0; } .linkItem.contributor { - background-image: url(MMCCicon_mapper_black.png); margin-left:32px; z-index:1; - padding:17px 0 17px 28px; + padding:17px 16px 17px 40px; + position: relative; +} +.contributor .contributorIcon { + position: absolute; + top: 8px; + left: 0; + border-radius: 16px; } .linkItem.mapCount { - background-image: url(metamap32.png); - min-width: 16px; - padding:17px 0 17px 28px; + width: 24px; + padding:17px 0 17px 35px; +} +.linkItem.mapCount .mapCountIcon { + position: absolute; + top: 8px; + left: 0; + width: 32px; + height: 32px; + background-image: url(map32_sprite.png); + background-repeat: no-repeat; + background-position: 0 0; +} +.linkItem.mapCount:hover .mapCountIcon { + background-position: 0 -32px; } .linkItem.synapseCount { - background-image: url(synapse32tmcard.png); - min-width: 16px; - padding:17px 0 17px 28px; + width: 24px; + padding:17px 0 17px 35px; +} +.linkItem.synapseCount .synapseCountIcon { + position: absolute; + top: 8px; + left: 0; + width: 32px; + height: 32px; + background-image: url(synapse32_sprite.png); + background-repeat: no-repeat; + background-position: 0 0; +} +.linkItem.synapseCount:hover .synapseCountIcon { + background-position: 0 -32px; } .linkItem.mapPerm { - + width: 32px; + height: 32px; + padding: 0; + min-width: 32px; + margin-top: 8px; + background-image: url(permissions32_sprite.png); + background-position: 0 0; } .linkItem.mapPerm.co { - background-image: url(CO32.png); + background-position: 0 0; } .linkItem.mapPerm.pu { - background-image: url(PU32.png); + background-position: -64px 0; } .linkItem.mapPerm.pr { - background-image: url(PR32.png); + background-position: -32px 0; } .showcard .yourTopic .mapPerm:hover { - background-image: url(arrowexpand.png); - background-size: 31px 25px; - background-position-x: 8px; + background-image: url(arrowperms_sprite.png); + background-position-x: -32px; cursor:pointer; } .showcard .yourTopic .mapPerm.minimize { - background-image: url(arrowcollapse.png) !important; - background-size: 31px 25px; -background-position-x: 8px; + background-image: url(arrowperms_sprite.png) !important; +background-position-x: 0px; cursor: pointer; } .mapPerm .permissionSelect { list-style: none; - width: 40px; - height: 80px; + width: 32px; + height: 64px; position: relative; - top: 40px; + top: 32px; } .mapPerm .permissionSelect li { - width: 40px; - height: 40px; + width: 32px; + height: 32px; background-repeat: no-repeat; - background-position: center center; - background-size: 27px 27px; - background-color: #F5F5F5; + background-position: 0 0; + background-image: url(permissions32_sprite.png); } .mapPerm .permissionSelect .commons { - background-image: url(CO32.png); + background-position: 0 0; } .mapPerm .permissionSelect .public { - background-image: url(PU32.png); + background-position: -64px 0; } .mapPerm .permissionSelect .private { - background-image: url(PR32.png); + background-position: -32px 0; } .mapPerm .permissionSelect .commons:hover { - background-image: url(CO32b.png); + background-position: 0 -32px; } .mapPerm .permissionSelect .public:hover { - background-image: url(PU32b.png); + background-position: -64px -32px; } .mapPerm .permissionSelect .private:hover { - background-image: url(PR32b.png); + background-position: -32px -32px; } .CardOnGraph .metacodeTitle { @@ -311,7 +347,6 @@ float:left; color: white; border-radius: 4px; font-size:15px !important; - font-family:'LatoRegular'; line-height:17px; padding: 3px 5px 2px; z-index:100; @@ -335,59 +370,111 @@ float:left; line-height: 16px; } -.addAttachment div { +#addlink, #addupload { display: inline-block; - width: 150px; - height: 23px; - text-align: center; - padding-top: 25px; + width: 102px; + height: 12px; + text-align: left; + padding: 18px 0 18px 48px; font-size: 12px; color: #9e9e9e; cursor: pointer; + position: relative; } -.addAttachment div:hover { +#addlink:hover, #addupload:hover { color: #616161; } -.addLink div { - float: left; +.attachmentIcon { + background-repeat: no-repeat; + background-position: 0 0; + width: 24px; + height: 24px; + position: absolute; + top: 12px; + left: 12px; +} +#linkIcon { + background-image: url(link_sprite.png); +} +#uploadIcon { + background-image: url(upload_sprite.png); +} +#addlink:hover #linkIcon, #addupload:hover #uploadIcon { + background-position: 0 -24px; } -#addLinkBack { - height: 48px; - width: 48px; - cursor: pointer; +.addLink { + position: relative; } #addLinkInput { height: 32px; - width: 236px; - padding: 8px 16px 8px 0; + width: 268px; + padding: 8px 16px 8px 16px; position: relative; } #addLinkInput input{ -padding: 7px 31px 7px 31px; -height: 16px; -width: 172px; +padding: 9px 7px 9px 31px; +height: 12px; +width: 198px; margin: 0 0 0 0; border: 1px solid #BDBDBD; outline: none; -font-size: 16px; -line-height: 16px; +font-size: 12px; +line-height: 12px; background: white; color: black; -font-family: 'LatoLight'; +font-family: 'din-regular', helvetica, sans-serif; +} +#addLinkIcon { + position: absolute; + top: 12px; + left: 20px; + width: 24px; + height: 24px; + background-repeat: no-repeat; + background-position: 0 0; + background-image: url(link_sprite.png); + pointer-events: none; + z-index: 1; } #addLinkReset { position: absolute; top: 8px; - right: 16px; + right: 15px; width: 32px; height: 32px; cursor: pointer; float:none; + background-image: url(remove.png); + background-repeat: no-repeat; + background-position: center center; +} + +.linkActions { + position: relative; +} + +#linkremove { + height: 12px; + padding: 26px 0 10px; + font-size: 12px; + background-image: url(/assets/remove.png); + background-repeat: no-repeat; + background-position: center 8px; + width: 48px; + text-align: center; + position: absolute; + top: 0; + right: 8px; + cursor: pointer; + color: #9E9E9E; +} +#linkremove:hover { + color: #616161; } .cardSettings { @@ -485,7 +572,6 @@ font-family: 'LatoLight'; border-radius: 4px; color: #FFFFFF; display: none; - font-family: 'LatoRegular'; font-size: 15px !important; line-height: 17px; padding: 3px 5px 2px; diff --git a/app/assets/stylesheets/clean.css b/app/assets/stylesheets/clean.css index a19b20ed..4548ad71 100644 --- a/app/assets/stylesheets/clean.css +++ b/app/assets/stylesheets/clean.css @@ -806,3 +806,13 @@ box-shadow: 0px 1px 1.5px rgba(0,0,0,0.12), 0 1px 1px rgba(0,0,0,0.24); body a#barometer_tab:hover { background-position: 0 -110px; } + + +/* REALTIME */ + +.collabCompass { + position:fixed; + top:50%; + left:50%; + z-index: 4; +} diff --git a/app/views/layouts/_templates.html.erb b/app/views/layouts/_templates.html.erb index 8e9ff38f..9f1e40ea 100644 --- a/app/views/layouts/_templates.html.erb +++ b/app/views/layouts/_templates.html.erb @@ -178,13 +178,15 @@ @@ -92,13 +91,22 @@ Metamaps.Metacodes = <%= Metacode.all.to_json.html_safe %>; Metamaps.Loading = { - loader: new CanvasLoader('loading') + loader: new CanvasLoader('loading'), + hide: function () { + $('#loading').hide(); + }, + show: function () { + $('#loading').show(); + } }; Metamaps.Loading.loader.setColor('#4fb5c0'); // default is '#000000' Metamaps.Loading.loader.setDiameter(28); // default is 40 Metamaps.Loading.loader.setDensity(41); // default is 40 Metamaps.Loading.loader.setRange(0.9); // default is 1.3 Metamaps.Loading.loader.show(); // Hidden by default + + // embedly + !function(a){var b="embedly-platform",c="script";if(!a.getElementById(b)){var d=a.createElement(c);d.id=b,d.src=("https:"===document.location.protocol?"https":"http")+"://cdn.embedly.com/widgets/platform.js";var e=document.getElementsByTagName(c)[0];e.parentNode.insertBefore(d,e)}}(document); <%= render :partial => 'layouts/googleanalytics' if Rails.env.production? %> diff --git a/config/environments/production.rb b/config/environments/production.rb index fdf1495b..0707c5e7 100644 --- a/config/environments/production.rb +++ b/config/environments/production.rb @@ -70,7 +70,7 @@ Metamaps::Application.configure do # config.action_controller.asset_host = "http://assets.example.com" # Precompile additional assets (application.js, application.css, and all non-JS/CSS are already added) - config.assets.precompile += %w( compileMapPages.js ) + #config.assets.precompile += %w( ) # Disable delivery errors, bad email addresses will be ignored # config.action_mailer.raise_delivery_errors = false diff --git a/public/famous/main.js b/public/famous/main.js index 6d452939..364b5904 100644 --- a/public/famous/main.js +++ b/public/famous/main.js @@ -18,6 +18,9 @@ define(function(require, exports, module) { var f = Metamaps.Famous; f.mainContext = Engine.createContext(famous); + f.Surface = Surface; + f.Modifier = Modifier; + f.Transform = Transform; // INFOVIS @@ -102,7 +105,7 @@ define(function(require, exports, module) { f.mainContext.add(f.yield.mod).add(f.yield.surf); f.loadYield = function () { - Metamaps.Loading.loader.hide(); + Metamaps.Loading.hide(); var yield = document.getElementById('yield') ? document.getElementById('yield').innerHTML : false; if (yield) { f.yield.surf.setContent(yield); @@ -192,7 +195,7 @@ define(function(require, exports, module) { f.explore.show(); } else if (Metamaps.currentSection === "") { - Metamaps.Loading.loader.hide(); + Metamaps.Loading.hide(); if (Metamaps.Active.Mapper) { Metamaps.Views.exploreMaps.setCollection( Metamaps.Maps.Mine ); @@ -310,5 +313,8 @@ define(function(require, exports, module) { }; f.mainContext.add(f.toast.mod).add(f.toast.surf); + // an object for the realtime mapper compasses surfaces + f.compasses = {}; + f.logo.show(); }); \ No newline at end of file diff --git a/realtime/realtime-server.js b/realtime/realtime-server.js index b8515b8a..741f56b5 100644 --- a/realtime/realtime-server.js +++ b/realtime/realtime-server.js @@ -104,6 +104,15 @@ function start() { socket.broadcast.emit('maps-' + data.mapid + '-lostrealtime', newUser); }); + socket.on('updateMapperCoords', function (data) { + var peer = { + userid: data.userid, + usercoords: data.usercoords + }; + + socket.broadcast.emit('maps-' + data.mapid + '-updatePeerCoords', peer); + }); + }); } From 28bfb8ac21a6c5aacd4369b2faa12e1d5698d0d3 Mon Sep 17 00:00:00 2001 From: Connor Turland Date: Wed, 10 Sep 2014 15:06:39 -0400 Subject: [PATCH 2/4] better architecture for entering and exiting maps from the home page --- .../javascripts/metamaps/Metamaps.JIT.js | 46 +++++----- .../javascripts/metamaps/Metamaps.Router.js | 18 +++- app/assets/javascripts/metamaps/Metamaps.js | 91 +++++++++++++++---- app/assets/stylesheets/base.css | 2 +- 4 files changed, 112 insertions(+), 45 deletions(-) diff --git a/app/assets/javascripts/metamaps/Metamaps.JIT.js b/app/assets/javascripts/metamaps/Metamaps.JIT.js index 7821dc14..5b9f7458 100644 --- a/app/assets/javascripts/metamaps/Metamaps.JIT.js +++ b/app/assets/javascripts/metamaps/Metamaps.JIT.js @@ -1,4 +1,7 @@ Metamaps.JIT = { + events: { + mouseMove: 'Metamaps:JIT:events:mouseMove' + }, vizData: [], // contains the visualization-compatible graph /** * This method will bind the event handlers it is interested and initialize the class. @@ -35,25 +38,27 @@ Metamaps.JIT = { Metamaps.Synapses.each(function (s) { edge = s.createEdge(); - existingEdge = _.findWhere(edges, { - nodeFrom: edge.nodeFrom, - nodeTo: edge.nodeTo - }) || - _.findWhere(edges, { - nodeFrom: edge.nodeTo, - nodeTo: edge.nodeFrom - }); + if (nodes[edge.nodeFrom] && nodes[edge.nodeTo]) { + existingEdge = _.findWhere(edges, { + nodeFrom: edge.nodeFrom, + nodeTo: edge.nodeTo + }) || + _.findWhere(edges, { + nodeFrom: edge.nodeTo, + nodeTo: edge.nodeFrom + }); - if (existingEdge) { - // for when you're dealing with multiple relationships between the same two topics - if (Metamaps.Active.Map) { - mapping = s.getMapping(); - existingEdge['$mappingIDs'].push(mapping.isNew() ? mapping.cid : mapping.id); + if (existingEdge) { + // for when you're dealing with multiple relationships between the same two topics + if (Metamaps.Active.Map) { + mapping = s.getMapping(); + existingEdge['$mappingIDs'].push(mapping.isNew() ? mapping.cid : mapping.id); + } + existingEdge['$synapseIDs'].push(s.id); + } else { + // for when you're dealing with a topic that has relationships to many different nodes + nodes[edge.nodeFrom].adjacencies.push(edge); } - existingEdge['$synapseIDs'].push(s.id); - } else { - // for when you're dealing with a topic that has relationships to many different nodes - nodes[edge.nodeFrom].adjacencies.push(edge); } }); _.each(nodes, function (node) { @@ -586,10 +591,6 @@ Metamaps.JIT = { var node = eventInfo.getNode(); var edge = eventInfo.getEdge(); - if (Metamaps.Active.Map && Metamaps.Realtime.status) { - Metamaps.Realtime.sendCoords(eventInfo.getPos()); - } - //if we're on top of a node object, act like there aren't edges under it if (node != false) { if (Metamaps.Mouse.edgeHoveringOver) { @@ -617,6 +618,9 @@ Metamaps.JIT = { if (!node && !edge) { $('canvas').css('cursor', 'default'); } + + var pos = eventInfo.getPos(); + $(document).trigger(Metamaps.JIT.events.mouseMove, [pos]); }, // onMouseMoveHandler enterKeyHandler: function () { // this is to submit new topic creation diff --git a/app/assets/javascripts/metamaps/Metamaps.Router.js b/app/assets/javascripts/metamaps/Metamaps.Router.js index c3ca8a65..dadc3771 100644 --- a/app/assets/javascripts/metamaps/Metamaps.Router.js +++ b/app/assets/javascripts/metamaps/Metamaps.Router.js @@ -15,7 +15,7 @@ Metamaps.currentSection = ""; Metamaps.currentPage = ""; - $('.wrapper').removeClass('mapPage'); + $('.wrapper').removeClass('mapPage topicPage'); var classes = Metamaps.Active.Mapper ? "homePage explorePage" : "homePage"; $('.wrapper').addClass(classes); @@ -59,6 +59,8 @@ } Metamaps.Famous.viz.hide(); + Metamaps.Map.end(); + Metamaps.Topic.end(); Metamaps.Active.Map = null; Metamaps.Active.Topic = null; }, @@ -68,7 +70,7 @@ document.title = 'Explore ' + capitalize + ' Maps | Metamaps'; - $('.wrapper').removeClass('homePage mapPage'); + $('.wrapper').removeClass('homePage mapPage topicPage'); $('.wrapper').addClass('explorePage'); Metamaps.currentSection = "explore"; @@ -96,6 +98,8 @@ Metamaps.Famous.explore.show(); Metamaps.Famous.viz.hide(); + Metamaps.Map.end(); + Metamaps.Topic.end(); Metamaps.Active.Map = null; Metamaps.Active.Topic = null; }, @@ -106,7 +110,7 @@ Metamaps.currentSection = "map"; Metamaps.currentPage = id; - $('.wrapper').removeClass('homePage explorePage'); + $('.wrapper').removeClass('homePage explorePage topicPage'); $('.wrapper').addClass('mapPage'); Metamaps.Famous.yield.hide(); @@ -120,11 +124,13 @@ Metamaps.JIT.centerMap(); } Metamaps.Famous.viz.show(); + Metamaps.Topic.end(); Metamaps.Active.Topic = null; Metamaps.GlobalUI.Search.unlock(); Metamaps.GlobalUI.Search.close(0, true); + Metamaps.Map.end(); Metamaps.Map.launch(id); }, topics: function (id) { @@ -134,8 +140,8 @@ Metamaps.currentSection = "topic"; Metamaps.currentPage = id; - $('.wrapper').removeClass('homePage explorePage'); - $('.wrapper').addClass('mapPage'); + $('.wrapper').removeClass('homePage explorePage mapPage'); + $('.wrapper').addClass('topicPage'); Metamaps.Famous.yield.hide(); Metamaps.Famous.maps.hide(); @@ -148,11 +154,13 @@ Metamaps.JIT.centerMap(); } Metamaps.Famous.viz.show(); + Metamaps.Map.end(); Metamaps.Active.Map = null; Metamaps.GlobalUI.Search.unlock(); Metamaps.GlobalUI.Search.close(0, true); + Metamaps.Topic.end(); Metamaps.Topic.launch(id); } }); diff --git a/app/assets/javascripts/metamaps/Metamaps.js b/app/assets/javascripts/metamaps/Metamaps.js index 50535fef..ccdb0638 100644 --- a/app/assets/javascripts/metamaps/Metamaps.js +++ b/app/assets/javascripts/metamaps/Metamaps.js @@ -1402,7 +1402,10 @@ Metamaps.Realtime = { init: function () { var self = Metamaps.Realtime; - $(".rtOn").click(self.turnOn); + var turnOn = function () { + self.turnOn(true); + } + $(".rtOn").click(turnOn); $(".rtOff").click(self.turnOff); $('.sidebarCollaborateIcon').click(self.toggleBox); @@ -1411,15 +1414,8 @@ Metamaps.Realtime = { }); $('body').click(self.close); - var mapperm = Metamaps.Active.Map && Metamaps.Active.Map.authorizeToEdit(Metamaps.Active.Mapper); - - if (mapperm) { - self.socket = io.connect('http://gentle-savannah-1303.herokuapp.com'); - self.socket.on('connect', function () { - console.log('socket connected'); - self.setupSocket(); - }); - } + self.socket = io.connect('http://localhost:5001'); + self.startActiveMap(); }, toggleBox: function (event) { var self = Metamaps.Realtime; @@ -1454,11 +1450,42 @@ Metamaps.Realtime = { }); } }, - turnOn: function () { + startActiveMap: function () { + var self = Metamaps.Realtime; + + var mapperm = Metamaps.Active.Map && Metamaps.Active.Map.authorizeToEdit(Metamaps.Active.Mapper); + + var start = function() { + if (mapperm) { + self.turnOn(); + self.setupSocket(); + } + } + + if (!self.socket) { + self.socket.on('connect', function () { + start(); + }); + } + else if (self.socket) { + self.socket.socket.connect(); + start(); + } + }, + endActiveMap: function () { + var self = Metamaps.Realtime; + + $(document).off(Metamaps.JIT.events.mouseMove); + self.socket.disconnect(); + self.socket.removeAllListeners(); + $(".collabCompass").remove(); + self.status = false; + }, + turnOn: function (notify) { var self = Metamaps.Realtime; if (!self.status) { - self.sendRealtimeOn(); + if (notify) self.sendRealtimeOn(); $(".rtMapperSelf").removeClass('littleRtOff').addClass('littleRtOn'); self.status = true; $(".sidebarCollaborateIcon").addClass("blue"); @@ -1507,6 +1534,11 @@ Metamaps.Realtime = { // update mapper compass position socket.on('maps-' + Metamaps.Active.Map.id + '-updatePeerCoords', self.updatePeerCoords); + + var sendCoords = function (event, coords) { + self.sendCoords(coords); + } + $(document).on(Metamaps.JIT.events.mouseMove, sendCoords); }, sendRealtimeOn: function () { var self = Metamaps.Realtime; @@ -1623,6 +1655,7 @@ Metamaps.Realtime = { delete self.mappersOnMap[data.userid]; $('#mapper' + data.userid).remove(); + $('#compass' + data.userid).remove(); Metamaps.GlobalUI.notifyUser(data.username + ' just left the map'); }, @@ -1679,12 +1712,17 @@ Metamaps.Realtime = { var self = Metamaps.Realtime; var socket = Metamaps.Realtime.socket; - var update = { - usercoords: coords, - userid: Metamaps.Active.Mapper.id, - mapid: Metamaps.Active.Map.id - }; - socket.emit('updateMapperCoords', update); + var map = Metamaps.Active.Map; + var mapper = Metamaps.Active.Mapper; + + if (self.status && map.authorizeToEdit(mapper) && socket) { + var update = { + usercoords: coords, + userid: Metamaps.Active.Mapper.id, + mapid: Metamaps.Active.Map.id + }; + socket.emit('updateMapperCoords', update); + } }, contentUpdate: function (data) { var self = Metamaps.Realtime; @@ -2676,6 +2714,13 @@ Metamaps.Topic = { success: start }); }, + end: function () { + if (Metamaps.Active.Topic) { + $('.rightclickmenu').remove(); + Metamaps.TopicCard.hideCard(); + Metamaps.SynapseCard.hideCard(); + } + }, /* * * @@ -3004,6 +3049,8 @@ Metamaps.Map = { Metamaps.Filter.checkMetacodes(); Metamaps.Filter.checkSynapses(); Metamaps.Filter.checkMappers(); + + Metamaps.Realtime.startActiveMap(); } $.ajax({ @@ -3011,6 +3058,14 @@ Metamaps.Map = { success: start }); }, + end: function () { + if (Metamaps.Active.Map) { + $('.rightclickmenu').remove(); + Metamaps.TopicCard.hideCard(); + Metamaps.SynapseCard.hideCard(); + Metamaps.Realtime.endActiveMap(); + } + }, fork: function () { Metamaps.GlobalUI.openLightbox('forkmap'); diff --git a/app/assets/stylesheets/base.css b/app/assets/stylesheets/base.css index ad418082..60621130 100644 --- a/app/assets/stylesheets/base.css +++ b/app/assets/stylesheets/base.css @@ -540,7 +540,7 @@ font-family: 'din-regular', helvetica, sans-serif; } #edit_synapse { - background: url("synapse32tmcard.png") no-repeat scroll 0 center / 30px 30px #FFFFFF; + background: url("synapse32.png") no-repeat scroll 0 center / 30px 30px #FFFFFF; border-radius: 5px; padding: 5px 5px 5px 30px; color: #000; From ac8c589a77cea0372aaa047c99abd586df3e8667 Mon Sep 17 00:00:00 2001 From: Connor Turland Date: Wed, 10 Sep 2014 15:07:34 -0400 Subject: [PATCH 3/4] config for heroku --- app/assets/javascripts/metamaps/Metamaps.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/assets/javascripts/metamaps/Metamaps.js b/app/assets/javascripts/metamaps/Metamaps.js index ccdb0638..22af697d 100644 --- a/app/assets/javascripts/metamaps/Metamaps.js +++ b/app/assets/javascripts/metamaps/Metamaps.js @@ -1414,7 +1414,7 @@ Metamaps.Realtime = { }); $('body').click(self.close); - self.socket = io.connect('http://localhost:5001'); + self.socket = io.connect('http://gentle-savannah-1303.herokuapp.com'); self.startActiveMap(); }, toggleBox: function (event) { From 3d35d44c3feda39b43b4e0d1dbfc8ffcf89942c6 Mon Sep 17 00:00:00 2001 From: Connor Turland Date: Wed, 10 Sep 2014 15:17:43 -0400 Subject: [PATCH 4/4] realtime improvement --- app/assets/javascripts/metamaps/Metamaps.js | 13 +++++-------- 1 file changed, 5 insertions(+), 8 deletions(-) diff --git a/app/assets/javascripts/metamaps/Metamaps.js b/app/assets/javascripts/metamaps/Metamaps.js index 22af697d..9288d125 100644 --- a/app/assets/javascripts/metamaps/Metamaps.js +++ b/app/assets/javascripts/metamaps/Metamaps.js @@ -1414,7 +1414,7 @@ Metamaps.Realtime = { }); $('body').click(self.close); - self.socket = io.connect('http://gentle-savannah-1303.herokuapp.com'); + self.socket = io.connect('http://localhost:5001'); self.startActiveMap(); }, toggleBox: function (event) { @@ -1462,15 +1462,12 @@ Metamaps.Realtime = { } } - if (!self.socket) { - self.socket.on('connect', function () { - start(); - }); - } - else if (self.socket) { + if (!self.socket.connected) { self.socket.socket.connect(); - start(); } + self.socket.on('connect', function () { + start(); + }); }, endActiveMap: function () { var self = Metamaps.Realtime;