tabbit

Tue Aug 08 2017
Copied to clipboard! Copy reply

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Rosetta Stone® System Requirements</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,height=device-height,initial-scale=1,maximum-scale=1,user-scalable=no,minimum-scale=0.75">
    <meta charset="utf-8">
    <meta property="og:title" content="Rosetta Stone® System Requirements"/>
    <meta name="description" content="Rosetta Stone® Privacy Shield">
    <meta property="og:description" content="Rosetta Privacy Shield"/>
    <meta property="og:image" content="http://www.rosettastone.com/lp/ui/img/rosetta-stone.jpg"/>
    <meta property="og:url" content="http://www.rosettastone.com/"/>
    <meta property="og:site_name" content="www.rosettastone.com"/>
    <meta property="og:type" content="website"/>
    <link rel="Shortcut Icon" href="http://www.rosettastone.com/us-consumer-theme/images/favicon.ico"/>
    <link rel="stylesheet" href="./styles/main.css?t=1478553903076"/>
    <link rel="canonical" href="/system-requirements"/>
    <meta name="google" content="notranslate"/>
    <script src="./scripts/all.js?t=1478553903076"></script><script src="//assets.adobedtm.com/289d54d757557d351111069aa8acc743e67b15e6/satelliteLib-7aef1085f7c59294e8610e2f691a22c48a200841.js"></script><script type="text/javascript">window.rs.pagename="/system-requirements",window.rs.community="USA"</script>

    <script src="http://www.rosettastone.com/lp/globals/models/sitewide.js"></script>
  </head>
  <body>
    <div id="main-container">
      <%= menubar %>
      <style>
        .content {
          margin: 0 auto;
        }

        .header {
          width: 80%;
          margin: 0 auto;
          text-align:  center;
        }
        .header h1 {
          font-size: 2.4vh;
          line-height: 29px;
          margin-top: 80px;
        }

        h1 sup {
          font-size: 70%;
          position: relative;
          top: -10px;
        }

        div.table-wrap {
          border: 1px solid #c9c9c9;
          margin: 0 auto 2em;
          text-align:  center;
          max-width: 600px;
        }

        .language-select {
          margin-top: 3em;
        }
        div.table-wrap h3 {
          background-color: #ecc200;
          text-align: center;
          font-size: 1.2em;
          padding:0.7em 0;
          margin-bottom: 1em;
        }
        form.table {
          margin: 0 auto;
        }

        select {
          margin: 1em auto;
          display:  block;
          padding: 0.5em 2em;
          background: white;
          border: 1px solid #ccc;
          -webkit-appearance: none;
        }

        .device {
          background-image: url(http://www.rosettastone.com/lp/solo/assets/download_product_image.png);
          height: 130px;
          width: 130px;
          margin: 1em auto;
          background-size: contain;
        }
        form.table label {
          display:  block;
          overflow: auto;
          line-height: 26px;
          padding: 0 10px;


        }

        form.table label:hover {
          background: #eee;
        }

        /* input */
        form.table label > div {
          display: inline-block;
          float: left;
          padding: 0.5em;
        }

        form.table label > div.length {
          float: left;
          text-align: left;
          font-weight: bold;
        }

        form.table label > div.prices {
          float: right;

        }
        form.table label > div.prices > div {
          display: inline-block;
        }
        form.table label > div.prices > div.msrp {
          color: #bb1817;
          padding: 0 10px;
          text-decoration: line-through;
        }

        a.addtocart {
          background: #467700;
          color: white;
          display:block;
          margin: 1em 30%;
          text-align: center;
          padding: 1em 0;
        }

        /* Tablet */
        @media only screen and (min-device-width: 768px)
        and (-webkit-device-pixel-ratio: 2) {
           .header h1 {
              line-height: 40px;
            }

            div.table-wrap {
              width: 100%;
            }
        }

        /* Phone */
        @media only screen and (max-device-width: 667px)
        and (-webkit-device-pixel-ratio: 2) {

          #content {
            padding: 0 1em;
          }
          .header {
            margin-top: 6em;
            width: 100%;
          }

          .header h1 {

            line-height: 24px;
          }

          .language-select {
            margin-top: 1em;
          }
          .device {
            height: 90px;
            width: 90px;
          }
          div.table-wrap {
            width: 100%;
          }
          form.table label > div.length {
            width: 40%;
          }
          form.table label > div.prices {
            width: 38%;
          }
          a.addtocart {
            margin: 1em 20%;
          }
        }
      </style>
      <div id="content">

        <div class="header">
          <h1>
            Rosetta Stone<sup>®</sup> Language Learning
            <br>
            Purchase Individual Levels
          </h1>

          <div class="language-select">
            <div><b>Select a Language</b></div>
            <select></select>
          </div>
          <div class="device"></div>
        </div>

        <!-- <div class="section">

        </div> -->

        <div class="table-wrap">
          <h3>Instant Download</h3>

          <form class="table"></form>
          <div>
            <a href="" class="addtocart">ADD TO CART</a>
          </div>
        </div>


      </div> <!-- /content -->
      <%= footer %>


    <script>
      $select = $('select')
      $cart = $('a.addtocart')
      $form = $('form.table')

      var rsi = {
        'Arabic': {
          code: 'ara',
          levels: {
            L1: 95590,
            L2: 96279,
            L3: 96280
          },
        },
        'Chinese (Mandarin)': {
          code: 'chi',
          levels: {
            L1: 95592,
            L2: 96281,
            L3: 96282,
            L4: 96283,
            L5: 96284
          }
        },
        'Dutch': {
          code: 'ned',
          levels: {
            L1: 95595,
            L2: 96327,
            L3: 96328
          },
        },
        'English (American)': {
          code: 'eng',
          levels: {
            L1: 24360,
            L2: 96293,
            L3: 96294,
            L4: 96295,
            L5: 96296
          },
        },
        'English (British)': {
          code: 'ebr',
          levels: {
            L1: 95597,
            L2: 96289,
            L3: 96290,
            L4: 96291,
            L5: 96292
          },
        },
        'Filipino (Tagalog)': {
          code: 'tgl',
          levels: {
            L1: 95600,
            L2: 96339,
            L3: 96340
          },
        },
        'French': {
          code: 'fra',
          levels: {
            L1: 24348,
            L2: 96307,
            L3: 96308,
            L4: 96309,
            L5: 96310
          },
        },
        'German': {
          code: 'deu',
          levels: {
            L1: 24354,
            L2: 96285,
            L3: 96286,
            L4: 96287,
            L5: 96288
          },
        },
        'Greek': {
          code: 'grk',
          levels: {
            L1: 95602,
            L2: 96313,
            L3: 96314
          },
        },
        'Hebrew': {
          code: 'heb',
          levels: {
            L1: 95604,
            L2: 96315,
            L3: 96316
          },
        },
        'Hindi': {
          code: 'hin',
          levels: {
            L1: 95606,
            L2: 96317,
            L3: 96318
          },
        },
        'Irish': {
          code: 'gle',
          levels: {
            L1: 95608,
            L2: 96311,
            L3: 96312
          },
        },
        'Italian': {
          code: 'ita',
          levels: {
            L1: 24351,
            L2: 96319,
            L3: 96320,
            L4: 96321,
            L5: 96322
          },
        },
        'Japanese': {
          code: 'jpn',
          levels: {
            L1: 95610,
            L2: 96323,
            L3: 96324
          },
        },
        'Korean': {
          code: 'kor',
          levels: {
            L1: 95612,
            L2: 96325,
            L3: 96326
          },
        },
        'Persian (Farsi)': {
          code: 'far',
          levels: {
            L1: 95614,
            L2: 96305,
            L3: 96306
          },
        },
        'Polish': {
          code: 'pol',
          levels: {
            L1: 95616,
            L2: 96329,
            L3: 96330
          },
        },
        'Portuguese (Brazil)': {
          code: 'por',
          levels: {
            L1: 95618,
            L2: 96331,
            L3: 96332
          },
        },
        'Russian': {
          code: 'rus',
          levels: {
            L1: 95620,
            L2: 96333,
            L3: 96334,
            L4: 96335,
            L5: 96336
          },
        },
        'Spanish (Latin America)': {
          code: 'esp',
          levels: {
            L1: 24345,
            L2: 96301,
            L3: 96302,
            L4: 96303,
            L5: 96304
          },
        },
        'Spanish (Spain)': {
          code: 'esc',
          levels: {
            L1: 95623,
            L2: 96297,
            L3: 96298,
            L4: 96299,
            L5: 96300
          },
        },
        'Swedish': {
          code: 'sve',
          levels: {
            L1: 95626,
            L2: 96337,
            L3: 96338
          },
        },
        'Turkish': {
          code: 'tur',
          levels: {
            L1: 95628,
            L2: 96341,
            L3: 96342
          },
        },
        'Vietnamese': {
          code: 'vie',
          levels: {
            L1: 95630,
            L2: 96343,
            L3: 96344
          }
        }
      }

      // Will be used for sorting purposes
      var sorted = {
        esp: 1,
        ita: 2,
        fra: 3,
        deu: 4,
        eng: 5
      }

      
      $('select').change(function(e) {
        $form.empty()

        /*var prods = RSI({cat: e.target.value, media: 'download'})
        .filter(function(e, i) {
          return /s5|s3|s2|l1/i.test(e.lvl)
        })
        .sort(function(a, b) {
          if (a.lvl > b.lvl)
          {
            return -1
          }
          if (a.lvl < b.lvl)
          {
            return 1
          }
          return 0
        })*/



        Object.keys(rsi).forEach(function(prod, i) {
          console.log(prods)
          var label = ''
          /*+ '<label>'
          + '  <div class="input">'
          + '    <input type="radio" name="level">'
          + '  </div>'
          + '  <div class="length">Level ' + prod.lvl.slice(1) + '</div>'
          + '  <div class="prices">'
          + '    <div class="msrp">$' + prod.msrp + '</div>'
          + '    <div class="price">$' + prod.price + '</div>'
          + '  </div>'
          + '</label>'
          ;*/

          $form.append(label)
          $form.find('label:first-of-type input').click()
        })

      })

      // Update cart button
      $form.on('change', 'input[type=radio]', function(e) {
        $cart.attr('href', e.target.dataset.carturl)
      })

      // On page load, select a language
      $select.find('option:first-of-type').change()
    </script>


     <!--  <script>window.bottomEmailSubmit=function(t){return t.preventDefault(),jQuery.post("http://www.rosettastone.com?p_p_id=rosettaajaxsubmit_WAR_rosettaajaxsubmitportlet&p_p_lifecycle=2",{email:$(".bottomforms #email").val(),cis_name:"Flash demo",newsletter_type:"DTC_newsletter",website:"US_WEBSITE",form_url:"/personal",cid:jQuery.trim(RSUI.util.getCookie("affiliate"))}).done(function(){$('.emailsignup input[type="submit"]').val("Thanks!")}).fail(function(){$('.emailsignup input[type="submit"]').val("Error")}),!1},$(".emailsignup").on("submit",bottomEmailSubmit)</script> -->
    </div>

  </body>
</html>