{"version":3,"sources":["webpack:///./src/components/mathematics/Math6thGrade/demoGeometric/Lesson.vue","webpack:///./src/components/mathematics/Math6thGrade/demoGeometric/Boxes.js","webpack:///src/components/mathematics/Math6thGrade/demoGeometric/Lesson.vue","webpack:///./src/components/mathematics/Math6thGrade/demoGeometric/Lesson.vue?d3e2","webpack:///./src/components/mathematics/Math6thGrade/demoGeometric/Lesson.vue?37a0","webpack:///./src/components/mathematics/Math6thGrade/demoGeometric/Lesson.vue?1024"],"names":["ref","_vm","staticClass","_m","attrs","_c","staticRenderFns","_self","_v","this","render","Boxes","box1","brd2","JXG","JSXGraph","initBoard","boundingbox","keepaspectratio","axis","ticks","grid","pan","enabled","zoom","showCopyright","showNavigation","Options","board","minimizeReflow","point","showInfoBox","highlight","image","text","fixed","curve","cssDefaultStyle","options","layer","makeResponsive","i","placeTitle","create","fontSize","canvasHeight","cssStyle","shuffle","placeShuffle","setLabel","label","setAttribute","visible","alignX","offset","CssStyle","on","erase","placeErase","dash","strokeColor","point1","fillColor","face","size","point2","Color","A","name","color","B","C","snapToGrid","borders","lac","strokeWidth","Pt1","attractors","attractorDistance","snapDistance","Pt0","X","Y","circ","center","radiuspoint","anglepoint","Pt2","ang","Math","Geometry","rad","PI","toFixed","radius","opacity","txt","acute","Value","created","_this","$store","commit","newTopics","title","img","action","goto","newMath","newshowhome","newLeftArrow","newModule","mounted","MathJax","Hub","Queue","metaInfo","titleTemplate","meta","content","component"],"mappings":"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","file":"js/chunk-dbba2d1a.7e2d5f14.js","sourcesContent":["var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',[_c('h3',{ref:\"intro\"},[_vm._v(\"\\n    Geometry: Lengths & Angles\\n  \")]),_c('br'),_c('p',[_vm._v(\"\\n    Points and lines are essential elements of any geometry. Lengths and angles\\n    are quantities that describe the spatial location/orientation of points and lines relative to one another.\\n  \")]),_vm._m(0),_c('h3',{ref:\"meas\"},[_vm._v(\"\\n    Measuring Lengths and Angles\\n  \")]),_c('p'),_c('ul',{staticClass:\"a mx-3 my-3\"},[_vm._m(1),_c('br'),_c('br'),_c('v-layout',{attrs:{\"justify-center\":\"\"}},[_c('v-img',{attrs:{\"contain\":\"\",\"src\":\"/assets/ruler.svg\",\"alt\":\"A ruler and a divider\",\"max-height\":\"250px\",\"max-width\":\"250px\"}})],1),_c('br'),_c('br'),_c('li',[_c('h5',[_vm._v(\" Measuring Angles \")]),_vm._v(\"\\n      The angle between two line segments can be measured using a device called a protractor (shown below).\\n      \"),_c('v-layout',{attrs:{\"justify-center\":\"\"}},[_c('v-img',{attrs:{\"contain\":\"\",\"src\":\"/assets/protractor.svg\",\"alt\":\"A protractor\",\"max-height\":\"350px\",\"max-width\":\"350px\"}})],1)],1)],1),_c('h3',{ref:\"graph\"},[_vm._v(\"\\n    MagicGraph | Lengths & Angles of a Right-angled Triangle\\n  \")]),_c('br'),_c('p',[_vm._v(\" The goal of this MagicGraph is to help students learn measuring lengths and angles. \")]),_vm._m(2),_c('v-responsive',[_c('v-layout',{attrs:{\"justify-center\":\"\"}},[_c('div',{staticClass:\"edliy-box-about\",attrs:{\"id\":\"jxgbox1\"}})])],1)],1)\n}\nvar staticRenderFns = [function (){var _vm=this,_c=_vm._self._c;return _c('ul',{staticClass:\"a mx-3 my-3\"},[_c('li',[_c('h5',[_vm._v(\" Length \")]),_vm._v(\"\\n      The length describes the distance of one point relative to another point.\\n      For example, the length of a side of a triangle describes the distance between the two endpoints of that side.\\n    \")]),_c('li',[_c('h5',[_vm._v(\" Angle \")]),_vm._v(\"\\n      The angle describes the orientation or direction of one line segment relative to another line segment.\\n      For example, an angle in a triangle describes the direction of one side of the triangle relative to another side.\\n    \")])])\n},function (){var _vm=this,_c=_vm._self._c;return _c('li',[_c('h5',[_vm._v(\" Measuring Lengths \")]),_vm._v(\"\\n      The length of a line segment can be measured using a ruler (or a measuring tape) and a divider (shown below).\\n    \")])\n},function (){var _vm=this,_c=_vm._self._c;return _c('ul',{staticClass:\"a mx-3 my-3\"},[_c('li',[_c('h5',[_vm._v(\" Getting Started \")]),_vm._v(\"\\n      You're given a ruler and a protractor. Use the ruler to measure the lengths of the three sides of the triangle. Use the protractor to measure\\n      the angle ∠AOB of the triangle.\\n    \")]),_c('li',[_c('h5',[_vm._v(\" To Explore \")]),_vm._v(\"\\n      Drag point B of the triangle to generate different triangle configurations. Explore acute, obtuse, and right angles.\\n    \")])])\n}]\n\nexport { render, staticRenderFns }","// Import the edliy_utils\r\nimport {\r\n    makeResponsive,\r\n    placeTitle,\r\n    placeImage,\r\n    placeInput,\r\n    placeSlider,\r\n    hoverMe,\r\n    placeRec,\r\n    hiddenPt,\r\n    fixedPt,\r\n    clearInputFields,\r\n    dragMe,\r\n    placeArrow,\r\n    placeGravity,\r\n    placeMiddleText,\r\n    placeLine,\r\n    placePoint,\r\n    placeGlider,\r\n    placeRuler,\r\n    placeLeftText,\r\n    placeRightText,\r\n    placeSliderSwitch,\r\n    placeCircle,\r\n    placeLogo,\r\n    placeShuffle,\r\n    placeTest,\r\n    placeErase,\r\n    placeBoldText\r\n} from '../../../../common/edliy_utils-fractions';\r\nconst Boxes = {\r\n  box1: function () {\r\n\t\tvar brd2 = JXG.JSXGraph.initBoard('jxgbox1',{boundingbox: [-4, 16, 16, -4],keepaspectratio: true, axis:true, ticks:false, grid:true, pan:{enabled:false}, zoom:{enabled:false}, showCopyright:false, showNavigation:false});\r\n    ///////////////////////////////BOARD FEATURE OPTIONS//////////////////////////////\r\n    JXG.Options.board.minimizeReflow = 'none';\r\n    JXG.Options.point.showInfoBox=false;\r\n    JXG.Options.point.highlight=false;\r\n    JXG.Options.image.highlight=false;\r\n    JXG.Options.text.highlight=false;\r\n    JXG.Options.text.fixed=true;\r\n    JXG.Options.curve.highlight=false;\r\n    JXG.Options.text.cssDefaultStyle='fontFamily:Oswald;'\r\n    ///////////////////Z-LAYERING /////////////////////\r\n    brd2.options.layer['angle'] =6;\r\n\t\tbrd2.options.layer['image'] =2;\r\n\t\tbrd2.options.layer['line'] =6;\r\n\t\tbrd2.options.layer['point'] =12;\r\n\t\tbrd2.options.layer['polygon'] =3;\r\n    /////////////////// MAKE RESPONSIVE //////////////////////////\r\n    makeResponsive(brd2);\r\n\t\tvar i =0;\r\n    placeTitle(brd2, 'Lengths & Angles', '')\r\n\t\t//brd2.create('text', [3, 14.8, '<b>Distances & Angles</b>'], {fixed:true, fontSize:function(){return 32*brd2.canvasHeight/800}, cssStyle:'fontFamily:Oswald;'});\r\n\t\tbrd2.create('text', [0.5,13, 'Measuring tape to measure sides AB, OB, and OA of the triangle.'], {fixed:true, fontSize:function(){return 18*brd2.canvasHeight/800}, cssStyle:'fontFamily:Oswald;'});\r\n\t\tbrd2.create('text', [0.5,12, 'Protractor to measure angle &ang;AOB of the triangle.'], {fixed:true, fontSize:function(){return 18*brd2.canvasHeight/800}, cssStyle:'fontFamily:Oswald;'});\r\n    var shuffle = placeShuffle(brd2);\r\n    shuffle.setLabel('Tap to Shuffle');\r\n    shuffle.label.setAttribute({visible:false, alignX:'middle', offset:[0, -15], CssStyle:'fontFamily:Oswald', fontSize:12});\r\n    shuffle.on('over', function () {this.label.setAttribute({visible:true});});\r\n    shuffle.on('out', function () {this.label.setAttribute({visible:false});});\r\n    var erase = placeErase(brd2);\r\n    erase.setLabel('Tap to Erase');\r\n    erase.label.setAttribute({visible:false, alignX:'middle', offset:[0, -15], CssStyle:'fontFamily:Oswald', fontSize:12});\r\n    erase.on('over', function () {this.label.setAttribute({visible:true});});\r\n    erase.on('out', function () {this.label.setAttribute({visible:false});});\r\n\t\t//Tape measure\r\n\t\t//var Ptm1 = brd2.create('point', [-4, -4], {name:'', fillColor:'orange', strokeColor:'black', face:'square', size:function(){return 4*brd2.canvasHeight/800}});\r\n\t\t//var Ptm2 = brd2.create('point', [-6, -6], {name:'', face:'square', size:function(){return 2*brd2.canvasHeight/800}});\r\n\t\t//var Im =brd2.create('image', ['/assets/measure.svg', [-6,-4.45],[2, 2.]], {opacity:1});\r\n\t\tvar tape= brd2.create('tapemeasure', [[8, 5],[12, 5]], {dash:1, strokeColor:'black', point1:{fillColor:'orange', strokeColor:'black', face:'square', size:function(){return 5*brd2.canvasHeight/800}}, point2:{fillColor:'orange', strokeColor:'black', face:'square', size:function(){return 5*brd2.canvasHeight/800}}, label:{offset:[-5, 10], fontSize:function(){return 18*brd2.canvasHeight/800}, Color:'blue', cssStyle:'fontFamily:Oswald'}});\r\n\t\t//\r\n\t\t//var Pt0 =brd2.create('point', [11, 8], {name:'', face:'square', size:function(){return 3*brd2.canvasHeight/800}});\r\n\t\t//Triangle\r\n\t\tvar A =brd2.create('point', [0, 0], {name:'O', size:2, face:'square', color:'black', fixed:true,label:{fontSize:function(){return 16*brd2.canvasHeight/800}, cssStyle:'fontFamily:Oswald'} });\r\n\t\tvar B =brd2.create('point', [5, 0], {name:'A', size:2, color:'black', face:'square', fixed:true,label:{fontSize:function(){return 16*brd2.canvasHeight/800}, cssStyle:'fontFamily:Oswald'}});\r\n\t\tvar C =brd2.create('point', [5, 5], {name:'B (Drag me!)', size:2, color:'black', face:'square', snapToGrid:true,label:{fontSize:function(){return 16*brd2.canvasHeight/800}, cssStyle:'fontFamily:Oswald'}});\r\n\t\tbrd2.create('polygon', [B, A, C], {visible:true, dash:1, borders:{visible:true, strokeColor:'black'}, fillColor:'yellow', fixed:true});\r\n\t\t//\r\n\t\tvar lac = brd2.create('segment', [A, C],{strokeWidth:0});\r\n\t\tvar Pt1 =brd2.create('point', [10, 8], {name:'Drag me!', strokeColor:'black', label:{fontSize:function(){return 12*brd2.canvasHeight/800}, cssStyle:'fontFamily:Oswald', offset:[-10, -15]}, size:function(){return 3*brd2.canvasHeight/800}, attractors:[A, B, C], attractorDistance:0.5, snapDistance:0.5});\r\n\r\n\t\tvar Pt0 =brd2.create('point', [function(){return Pt1.X()+2}, function(){return Pt1.Y()}], {name:'', strokeColor:'black', size:function(){return 3*brd2.canvasHeight/800}, attractors:[A, B, C], attractorDistance:0.5, snapDistance:0.5});\r\n\r\n\t\tvar circ=brd2.create('arc', [Pt1, [function(){return Pt1.X()+2;}, function(){return Pt1.Y();}],[function(){return Pt1.X()-2;}, function(){return Pt1.Y();}]],{visible:true, strokeWidth:0.5, strokeColor:'black', dash:1, center:{visible:false}, radiuspoint:{visible:false}, anglepoint:{visible:false}});\r\n\r\n        var Pt2 =brd2.create('glider', [11,10, circ], {face:'circle', size:3, name:'To Slide!', strokeColor:'black', label:{fontSize:function(){return 12*brd2.canvasHeight/800}, cssStyle:'fontFamily:Oswald'}, attractors:[lac], attractorDistance:0.5, snapDistance:0.05});\r\n\r\n\r\n\t\tvar ang= brd2.create('angle', [Pt0, Pt1, Pt2],{name:function(){return '&alpha; ='+ (JXG.Math.Geometry.rad(Pt0, Pt1, Pt2)*180/Math.PI).toFixed(1)},face:'square', radius:2, strokeColor:'black', label:{offset:[20, -10], fontSize:function(){return 18*brd2.canvasHeight/800}, cssStyle:'fontFamily:Oswald'}, fillColor:'orange'});\r\n\t\t//Protractor\r\n\t\tbrd2.create('image', ['/assets/protractor.svg', [function(){return Pt1.X()-2}, function(){return Pt1.Y()-1}],[4, 4.]], {opacity:1});\r\n\t\tvar txt = ['The angle is a right angle', 'The angle is an acute angle', 'The angle is an obtuse angle']\r\n\t\tvar acute = function(){if(ang.Value()< Math.PI/2){return txt[1]} else if(ang.Value()> Math.PI/2){return txt[2]} else{return txt[0]}};\r\n\t\tC.on('down', function(){return i=0});\r\n\t\tPt2.on('down', function(){return i=1});\r\n\t\tbrd2.create('text', [0.5,-2, function(){return '' + acute()}], {fixed:true, fontSize:function(){return 18*brd2.canvasHeight/800}, cssStyle:'fontFamily:Oswald;', visible:function(){if(i==0){return false}else{return true}}});\r\n\t\t//\r\n    },\r\n    }\r\nexport default Boxes;\r\n","<template>\r\n  <div>\r\n    <h3 ref=\"intro\">\n      Geometry: Lengths & Angles\n    </h3>\r\n    </br>\r\n    <p>\r\n      Points and lines are essential elements of any geometry. Lengths and angles\r\n      are quantities that describe the spatial location/orientation of points and lines relative to one another.\r\n    </p>\r\n    <ul class=\"a mx-3 my-3\">\r\n      <li>\n        <h5> Length </h5>\r\n        The length describes the distance of one point relative to another point.\r\n        For example, the length of a side of a triangle describes the distance between the two endpoints of that side.\r\n      </li>\r\n      <li>\n        <h5> Angle </h5>\r\n        The angle describes the orientation or direction of one line segment relative to another line segment.\r\n        For example, an angle in a triangle describes the direction of one side of the triangle relative to another side.\r\n      </li>\r\n    </ul>\r\n    <h3 ref=\"meas\">\n      Measuring Lengths and Angles\n    </h3>\r\n    <p />\r\n    <ul class=\"a mx-3 my-3\">\r\n      <li>\n        <h5> Measuring Lengths </h5>\r\n        The length of a line segment can be measured using a ruler (or a measuring tape) and a divider (shown below).\r\n      </li>\r\n      <br></br>\r\n      <v-layout justify-center>\r\n        <v-img contain\n               src=\"/assets/ruler.svg\"\n               alt=\"A ruler and a divider\"\n               max-height=\"250px\"\n               max-width=\"250px\"\n        />\r\n      </v-layout>\r\n      <br></br>\r\n      <li>\n        <h5> Measuring Angles </h5>\r\n        The angle between two line segments can be measured using a device called a protractor (shown below).\r\n        <v-layout justify-center>\r\n          <v-img contain\n                 src=\"/assets/protractor.svg\"\n                 alt=\"A protractor\"\n                 max-height=\"350px\"\n                 max-width=\"350px\"\n          />\r\n        </v-layout>\r\n      </li>\r\n    </ul>\r\n    <h3 ref=\"graph\">\n      MagicGraph | Lengths & Angles of a Right-angled Triangle\n    </h3>\r\n    </br>\r\n    <p> The goal of this MagicGraph is to help students learn measuring lengths and angles. </p>\r\n    <ul class=\"a mx-3 my-3\">\r\n      <li>\n        <h5> Getting Started </h5>\r\n        You're given a ruler and a protractor. Use the ruler to measure the lengths of the three sides of the triangle. Use the protractor to measure\r\n        the angle &ang;AOB of the triangle.\r\n      </li><li>\n        <h5> To Explore </h5>\r\n        Drag point B of the triangle to generate different triangle configurations. Explore acute, obtuse, and right angles.\r\n      </li>\r\n    </ul>\r\n    <v-responsive>\r\n      <v-layout justify-center>\r\n        <div id=\"jxgbox1\" class=\"edliy-box-about\" />\r\n      </v-layout>\r\n    </v-responsive>\r\n  </div>\r\n</template>\r\n<script>\r\nimport Boxes from './Boxes.js'\r\nexport default {\r\n  name: 'LengthsandAngles',\r\n  created: function () {\r\n    this.$store.commit('navigation/resetState');\r\n    // Store mutations\r\n    let title = 'Distances & Angles';\r\n    this.$store.commit('navigation/changeTitle', 'Lengths & Angles');\r\n    this.$store.commit('navigation/changeMenu', 'Lengths & Angles');\r\n    let newTopics = [\r\n      {title: 'Lengths & Angles', img:'/assets/number-1.svg', action: () => this.goto('intro')},\r\n      {title: 'Measuring Lengths and Angles', img:'/assets/number-2.svg', action: () => this.goto('meas')},\r\n      {title: 'MagicGraph: Generating Conic Sections', img:'/assets/touch.svg', action: () => this.goto('graph')}\r\n    ];\r\n    this.$store.commit('navigation/replaceTopics', newTopics);\r\n    let newMath =true;\r\n    this.$store.commit('navigation/replaceMath', newMath);\r\n    let newshowhome = false;\r\n    this.$store.commit('navigation/toggleshowhome', newshowhome);\r\n    let newLeftArrow =true;\r\n    this.$store.commit('navigation/replaceLeftArrow', newLeftArrow);\r\n    let newModule=true;\r\n    this.$store.commit('navigation/replaceModule', newModule);\r\n  },\r\n  mounted () {\r\n    MathJax.Hub.Queue([\"Typeset\", MathJax.Hub]);\r\n    Boxes.box1();\r\n  },\r\n  metaInfo() {\r\n  return{ title: 'Lengths and Angles',\r\n          titleTemplate: '%s - Learn interactively',\r\n          meta: [ {name: 'viewport', content: 'width=device-width, initial-scale=1'},\r\n                  {name: 'description', content: 'Learn interactively about lengths and angles.'}\r\n                ]\r\n        }\r\n   },\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\">\r\n@import 'src/styles/edliy-box.scss';\r\n@import 'src/styles/subtopic-menu.scss';\r\n@import 'src/styles/edliy-box-about.scss';\r\n@import 'src/styles/screen-sizes.scss';\r\n</style>\r\n","import mod from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Lesson.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Lesson.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./Lesson.vue?vue&type=template&id=801bb72a&\"\nimport script from \"./Lesson.vue?vue&type=script&lang=js&\"\nexport * from \"./Lesson.vue?vue&type=script&lang=js&\"\nimport style0 from \"./Lesson.vue?vue&type=style&index=0&id=801bb72a&prod&lang=scss&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Lesson.vue?vue&type=style&index=0&id=801bb72a&prod&lang=scss&\""],"sourceRoot":""}