{"version":3,"sources":["webpack:///./src/components/mathematics/Math12thGrade/Mappings/Lesson.vue?be8c","webpack:///./src/components/mathematics/Math12thGrade/Mappings/Lesson.vue","webpack:///./src/components/mathematics/Math12thGrade/Mappings/Boxes.js","webpack:///src/components/mathematics/Math12thGrade/Mappings/Lesson.vue","webpack:///./src/components/mathematics/Math12thGrade/Mappings/Lesson.vue?817b","webpack:///./src/components/mathematics/Math12thGrade/Mappings/Lesson.vue?06f0"],"names":["ref","attrs","staticClass","_c","_vm","_self","staticRenderFns","Boxes","box1","JXG","Options","board","minimizeReflow","point","showInfoBox","highlight","image","text","fixed","curve","cssDefaultStyle","graph","createSpace","options","layer","makeResponsive","createAxes","placeTitle","placeLogo","i","shuffle","placeShuffle","rght","placeImage","wrng","setAttribute","visible","setLabel","label","alignX","offset","CssStyle","fontSize","on","this","test","placeTest","removeObject","Points","v","h","k","xList","yList","evt","mouseover","create","getUsrCoordsOfMouse","name","size","snapToGrid","color","drawSegment","X","Y","dash","update","array","domain","linRange","quadRange","absRange","push","JSON","stringify","xText","writeMediumText","yText","_loop","_k","aText","bText","created","_this","$store","commit","title","newTopics","img","action","goto","newshowhome","newMath","newLeftArrow","newModule","mounted","MathJax","Hub","Queue","metaInfo","meta","vmid","content","component"],"mappings":"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","file":"js/chunk-a02ba478.af44a291.js","sourcesContent":["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=4bfe1d45&prod&lang=scss&\"","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',[_c('h3',{ref:\"intro\"},[_vm._v(\"\\n      What is a Function?\\n    \")]),_vm._m(0),_c('h3',{ref:\"types\"},[_vm._v(\"\\n      Notation\\n    \")]),_vm._m(1),_c('h3',{ref:\"pg\"},[_vm._v(\"\\n      MagicGraph | Find the Function\\n    \")]),_c('br'),_c('h5',[_vm._v(\"Getting Started\")]),_vm._m(2),_c('h5',[_vm._v(\" Icons on the MagicGraph \")]),_vm._m(3),_c('br'),_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('p',{staticClass:\"big mt-3\"},[_vm._v(\"\\n      A function (also called a mapping) is a mathematical rule that relates every element in one set to\\n      exactly one elment in another set. \"),_c('br'),_vm._v(\"\\n      The first set of numbers is called the domain of the function while the other set of numbers is called the range of the function.\\n      \"),_c('br'),_vm._v(\"\\n      For example, the relation described by  \\\\( y = 2x+3\\\\) is a function because for every value of \\\\(x\\\\), there is exactly one value of \\\\(y\\\\).\\n    \")])\n},function (){var _vm=this,_c=_vm._self._c;return _c('p',{staticClass:\"big mt-3\"},[_vm._v(\"\\n      The mathematical notation for a function is  \\\\(y = f(x)\\\\), and is read as — \\\\(y\\\\)  is equal to \\\\(f\\\\) of\\n      \\\\(x\\\\).\"),_c('br'),_vm._v(\" The letter \\\\(f\\\\) stands for the function, \\\\(x\\\\) stands for the input variable and \\\\(y\\\\) stands for the output variable.\\n    \")])\n},function (){var _vm=this,_c=_vm._self._c;return _c('p',{staticClass:\"big mt-3\"},[_vm._v(\"\\n      In this MagicGraph, you are given two sets of numbers: x and y. Your goal is\\n      to select the function from the graph that represents the mapping from x to y.\\n      \"),_c('br'),_vm._v(\"\\n      To select a function, tap on it. Once selected, then tap on the test button to check your answer.\\n      \"),_c('br')])\n},function (){var _vm=this,_c=_vm._self._c;return _c('p',[_vm._v(\"\\n      You can tap on \"),_c('i',{staticClass:\"shuffler ma-1\"}),_vm._v(\" icon  to shuffle numbers.\\n      You can tap on the \"),_c('i',{staticClass:\"tester ma-1\"}),_vm._v(\" icon to check your answer.\\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    placeUndo,\r\n    placeRedo,\r\n    placeBoldText,\r\n    placeBoldLeftText,\r\n    placeErase,\r\n    plotFunction,\r\n    createAxes,\r\n    createSpace,\r\n    drawPoint,\r\n    writeMediumText,\r\n    writeSmallText,\r\n    writeLargeText,\r\n    drawSegment\r\n} from '../../../../common/edliy.js';\r\nconst Boxes = {\r\n  box1: function () {\r\n///////////////////////////////////GLOBAL SETTINGS//////////////////////\r\n\tJXG.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//////////////////////////////////LOCAL SETTINGS//////////////////////////////////\r\nvar graph = createSpace(-2, 11, -2, 11);\r\ngraph.options.layer['image'] =12;\r\ngraph.options.layer['circle'] =13;\r\ngraph.options.layer['chart'] =14;\r\ngraph.options.layer['sector'] =15;\r\ngraph.options.layer['line'] =15;\r\n/////////////////////////////////////////////////////////////////////\r\nmakeResponsive(graph);\r\n///////////////////////////////////////////////////////////\r\ncreateAxes(graph);\r\nplaceTitle(graph, 'Visualizing Mappings','(Draw X-Y Points on the Graph)');\r\nplaceLogo(graph);\r\nvar i=1; var j=0; var x ='x'; var y ='y';\r\nvar shuffle = placeShuffle(graph);\r\nvar rght = placeImage(graph, '/assets/check.svg', 7.5, -1.5);\r\nvar wrng = placeImage(graph, '/assets/cross.svg', 7.5, -1.5);\r\nrght.setAttribute({visible:false});\r\nwrng.setAttribute({visible:false});\r\nshuffle.setLabel('Tap to Shuffle');\r\nshuffle.label.setAttribute({visible:false, alignX:'middle', offset:[0, -15], CssStyle:'fontFamily:Oswald', fontSize:12});\r\nshuffle.on('over', function () {this.label.setAttribute({visible:true});});\r\nshuffle.on('out', function () {this.label.setAttribute({visible:false});});\r\n///////////////////////////////////////////////////\r\nvar test =placeTest(graph);\r\ntest.setLabel('Tap to Check Your Answer');\r\ntest.label.setAttribute({visible:false, alignX:'middle', offset:[0, -15], CssStyle:'fontFamily:Oswald', fontSize:12});\r\ntest.on('over', function () {this.label.setAttribute({visible:true});});\r\ntest.on('out', function () {this.label.setAttribute({visible:false});});\r\n////////////////////////////////////////////////////\r\nshuffle.on('down', function(){\r\n  rght.setAttribute({visible:false});\r\n  wrng.setAttribute({visible:false});\r\n  graph.removeObject([Points,v, h]);\r\n  k =0;\r\n  if(i<3){i+=1;}else{i=1}\r\n});\r\n//////////////////////////////////////////////\r\nvar k=0;\r\nvar Points=[];\r\nvar v=[];\r\nvar h=[];\r\nvar xList=[0,0,0,0];\r\nvar yList=[1,1,1,1];\r\n//////////////////////////////////////////////////\r\ngraph.on('up',\r\n          function (evt)\r\n          {\r\n          if(k<4 && !shuffle.mouseover && !test.mouseover)\r\n          {\r\n          Points[k] = graph.create('point', graph.getUsrCoordsOfMouse(evt), {name:'',size:4, snapToGrid:true});\r\n          Points[k].setAttribute({fixed:true, color:'blue'});\r\n          v[k] =drawSegment(graph, [Points[k].X(), Points[k].Y()], [Points[k].X(), 0.0]);\r\n          v[k].setAttribute({dash:1});\r\n          h[k] = drawSegment(graph, [Points[k].X(), Points[k].Y()], [0.0, Points[k].Y()]);\r\n          h[k].setAttribute({dash:1});\r\n          xList[k] = Points[k].X();\r\n          yList[k] = Points[k].Y();\r\n          k+=1;\r\n          }\r\n          graph.update();\r\n          });\r\n/////////////////////////////////////////////////////////\r\nvar array =[];\r\nvar domain=[1, 3, 5, 7];\r\nvar linRange = [2, 4, 6, 8];\r\nvar quadRange=[0, 1, 3, 5];\r\nvar absRange=[6, 5, 4, 3];\r\narray.push(domain);\r\narray.push(linRange);\r\narray.push(quadRange);\r\narray.push(absRange);\r\n/////////////////////////////Cubic FUNCTION//////////////\r\ntest.on('down', function(){\r\n  rght.setAttribute({visible:false});\r\n  wrng.setAttribute({visible:false});\r\n  if(JSON.stringify(xList)==JSON.stringify(domain) && JSON.stringify(yList)==JSON.stringify(array[i])){rght.setAttribute({visible:true})}else{wrng.setAttribute({visible:true})}});\r\n\r\n//writeMediumText(graph, 2+0.5, 7+0.5, ()=>xList);\r\n////////////////////////////////////////////////\r\nvar xText =writeMediumText(graph, -1.5, 8+0.5-k, 'x');\r\nxText.setAttribute({color:'blue'});\r\nvar yText =writeMediumText(graph, -1+0.5, 8+0.5-k,'y' );\r\nyText.setAttribute({color:'blue'});\r\nfor(let k=0; k<4; k++){\r\nvar aText =writeMediumText(graph, -1.5, 7+0.5-k, ()=>array[0][k]);\r\naText.setAttribute({color:'blue'});\r\nvar bText= writeMediumText(graph, -1+0.5, 7+0.5-k, ()=>array[i][k]);\r\nbText.setAttribute({color:'blue'});\r\n}\r\n/////////////////////////////////////////////////////\r\n///////////////////////////////////////////////////////////////////////////////\r\n\r\n////////////////////////////////////////////END OF OPERATIONS///////////////////////////////\r\n//brd1.unsuspendUpdate();\r\n},\r\n}\r\nexport default Boxes;\r\n","<template>\r\n  <div>\r\n    <h3 ref=\"intro\">\r\n      What is a Function?\r\n    </h3>\r\n\r\n    <p class=\"big mt-3\">\r\n      A function (also called a mapping) is a mathematical rule that relates every element in one set to\r\n      exactly one elment in another set. <br>\r\n      The first set of numbers is called the domain of the function while the other set of numbers is called the range of the function.\r\n      <br>\r\n      For example, the relation described by  \\( y = 2x+3\\) is a function because for every value of \\(x\\), there is exactly one value of \\(y\\).\r\n    </p>\r\n    <h3 ref=\"types\">\r\n      Notation\r\n    </h3>\r\n    <p class=\"big mt-3\">\r\n      The mathematical notation for a function is  \\(y = f(x)\\), and is read as &mdash; \\(y\\)  is equal to \\(f\\) of\r\n      \\(x\\).<br> The letter \\(f\\) stands for the function, \\(x\\) stands for the input variable and \\(y\\) stands for the output variable.\n    </p>\r\n    <!--\r\n    <h3 ref=\"types\">\r\n      Finding Probability of an Event\r\n    </h3>\r\n    <br>\r\n    <p>\r\n      Let's consider a random experiment (say rolling of a die) that can give multiple outcomes (for example &mdash; the rolling of a die can give 1, 2, 3, 4, 5, or 6).\r\n<br><br>\r\n      Let's say we have to calculate the probability of occurrence of a given outcome (say getting a 2). Below are the steps to find this probability.\r\n    </p>\r\n    <ul class=\"a mx-3\">\r\n      <li> <h5> Step 1: Total Number of Possible Outcomes (<i>N</i> )</h5> </li>\r\n      <p>\n        Start with finding the number of all possible outcomes that can come\r\n         out of the random experiment.  Let's call this number <i>N</i>.\r\n      </p>\r\n      <li> <h5> Step 2: Number of Favorable Outcomes (<i>n</i> ) </h5> </li>\r\n      <p>\r\n        Next, we calculate the number of ways in which the desired outcome can be obtained.\r\n         Let's call this number <i>M</i>.\r\n      </p>\r\n      <li> <h5> Step 3: Calculate the Ratio <i>M</i> over <i>N</i></h5> </li>\r\n      <p>\r\n        Calculate the ratio of \\(M\\) over \\(N\\). This ratio gives the probability of event A.\r\n        $$\\text{Probability of Event A=}P(A) = \\frac{M}{N}$$\r\n      </p>\r\n    </ul> -->\r\n    <h3 ref=\"pg\">\n      MagicGraph | Find the Function\r\n    </h3>\r\n    <br>\r\n    <h5>Getting Started</h5>\r\n    <p class=\"big mt-3\">\n      In this MagicGraph, you are given two sets of numbers: x and y. Your goal is\r\n      to select the function from the graph that represents the mapping from x to y.\r\n      <br>\r\n      To select a function, tap on it. Once selected, then tap on the test button to check your answer.\r\n      <br>\r\n    </p>\r\n    <h5> Icons on the MagicGraph </h5>\r\n    <p>\r\n      You can tap on <i class=\"shuffler ma-1\" /> icon  to shuffle numbers.\r\n      You can tap on the <i class=\"tester ma-1\" /> icon to check your answer.\r\n    </p>\r\n    <br>\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: 'FunctionsAndRelations',\r\n  created: function () {\r\n    this.$store.commit('navigation/resetState');\r\n    let title = 'Functions & Relations ';\r\n    this.$store.commit('navigation/changeTitle', title);\r\n    this.$store.commit('navigation/changeMenu', title);\r\n    let newTopics = [\r\n      {title: 'Probability', img:'/assets/number-1.svg', action: () => this.goto('intro')},\r\n      {title: 'Probability of an Event', img:'/assets/number-2.svg', action: () => this.goto('types')},\r\n      {title: 'MagicGraph',img:'/assets/touch.svg', action: () => this.goto('pg')},\r\n    ];\r\n    this.$store.commit('navigation/replaceTopics', newTopics);\r\n    let newshowhome = false;\r\n    this.$store.commit('navigation/toggleshowhome', newshowhome);\r\n    let newMath =true;\r\n    this.$store.commit('navigation/replaceMath', newMath);\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: 'Functions',\r\n          //titleTemplate: '%s | Learn interactively',\r\n          meta: [\r\n                  {vmid:'description', name: 'description', content: 'Learn interactively about functions and mappings'}\r\n                ]\r\n        }\r\n   },\r\n}\r\n</script>\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.icn{\r\ncolor: var(--v-red-base);;\r\n}\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=4bfe1d45&\"\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=4bfe1d45&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"],"sourceRoot":""}