Skip to content

Add searchable drop down selector for resource use #149

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
LunaY0Yuki merged 8 commits into from
Apr 20, 2019
Merged

Add searchable drop down selector for resource use #149

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
6a90fd7
Finish Basic Class Attachment Selector, add related files
LunaY0Yuki Feb 24, 2019
780d26c
change to resourceUse,fix drop down's selected issue
LunaY0Yuki Mar 3, 2019
b5c722f
load and display given resource use in editor
LunaY0Yuki Mar 10, 2019
c6e06e3
fix search bar for resource use
LunaY0Yuki Mar 30, 2019
7635530
get and use actual resource usedata
LunaY0Yuki Mar 30, 2019
0f290cb
add resourceCreator to the treecontext menu option
LunaY0Yuki Mar 31, 2019
cca24d1
fix style
LunaY0Yuki Mar 31, 2019
d80948b
Merge branch 'master' into classAttachment
LunaY0Yuki Apr 20, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
change to resourceUse,fix drop down's selected issue
  • Loading branch information
@LunaY0Yuki
LunaY0Yuki committed Mar 3, 2019
commit 780d26c4b6f1dcaea3953f73dbfcdac3b5dc8869
4 changes: 2 additions & 2 deletions public/js/loginmodal.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ $(document).ready(function()
document.getElementById('my-modal').style.display = "block";
displayContainer("resource");
createNewResource();
$('select[name="classAttach').selectstyle({
$('select[name="attach').selectstyle({
width : 400,
height : 300,
theme : 'light',
Expand All @@ -37,7 +37,7 @@ $(document).ready(function()
displayContainer("resource");
createResource();
editResource();
$('select[name="classAttach').selectstyle({
$('select[name="attach').selectstyle({
width : 400,
height : 300,
theme : 'light',
Expand Down
58 changes: 44 additions & 14 deletions public/js/resource_viewer.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ var received = '{"meta": {"name": "Resource 1", "author_name": "Giselle Serate",
var received2 = '{"meta": {"name": "Resource 1", "author_name": "Giselle Serate", "author_type": "teacher", "use_name":"Notes"}, "contents": [ {"name": "Resource Content BROKENadfs;lj;", "type": "HECK;ijldfskj;l", "content": "<a href=http://google.com>blahhhh</a>", "created": "date", "updated": "date"}]}';
*/

//Dummy Data about the class
/*Dummy Data about the class (don't need to use this anymore)
var classData = {
"data": [
{
Expand Down Expand Up @@ -80,6 +80,37 @@ var classData = {
},
]
};
*/

var resourceUseData = {
"data": [
{
"id": 1,
"name": "Class Notes"
},
{
"id": 2,
"name": "Notes"
},
{
"id": 3,
"name": "Quiz"
},
{
"id": 4,
"name": "Summary"
},
{
"id": 5,
"name": "List of Key Terms"
},
{
"id": 6,
"name": "Reading Notes"
}
]
};

//use when we have more than 1 content
var contentNum = 0;
//use this to fix problem with "add new content" but not submitting
Expand Down Expand Up @@ -178,11 +209,11 @@ function display_content(num, element)

function createResource()
{
selectorCode = createClassSelection(classData); //selector code for class attachment
selectorCode = resourceUseSelection(resourceUseData); //selector code for resource use attachment
//create all the input to create resources
document.getElementById('resource-head').innerHTML="<h1>Resource Editor</h1>"
document.getElementById('modules').innerHTML = "<div class=resource-divider></div> <div class 'resource-creator> Resource Name: <br> \
<input type = 'text' id = 'meta-name'> <br> Resource Use: <select id = 'resource-use'> <option value = 1> Notes </option> <option value = 2> Quiz </option> </select> <br>" + selectorCode + "<div class=resource-divider></div> \
<input type = 'text' id = 'meta-name'> <br> Resource Use: <br>" + selectorCode + "<br> <div class=resource-divider></div> \
<br> </div> <div class = 'content-creator'> Resource Content Name: <br> \
<input type = 'text' id = 'content-name0'> <br> \
Content Type: <select id = 'content-type0'> <option value = 'text'> Text </option> <option value = 'link'> Link </option> </select> <br> \
Expand All @@ -195,11 +226,11 @@ function createResource()

function createNewResource()
{
selectorCode = createClassSelection(classData); //selector code for class attachment
selectorCode = resourceUseSelection(resourceUseData); //selector code for resource use attachment
//create all the input to create resources
document.getElementById('resource-head').innerHTML="<h1>Resource Creator</h1>"
document.getElementById('modules').innerHTML = "<div class=resource-divider></div> <div class 'resource-creator> Resource Name: <br> \
<input type = 'text' id = 'meta-name'> <br> Resource Use: <select id = 'resource-use'> <option value = 1> Notes </option> <option value = 2> Quiz </option> </select> <br>" + selectorCode + "<div class=resource-divider></div> \
<input type = 'text' id = 'meta-name'> <br> Resource Use: <br>" + selectorCode + "<br> <div class=resource-divider></div> \
<br> </div> <div class = 'content-creator'> Resource Content Name: <br> \
<input type = 'text' id = 'content-name0'> <br> \
Content Type: <select id = 'content-type0'> <option value = 'text'> Text </option> <option value = 'link'> Link </option> </select> <br> \
Expand Down Expand Up @@ -231,7 +262,7 @@ function resourceEditor(received)
else if (resource.meta.use_name == "Quiz"){
document.getElementById("resource-use").selectedIndex = 1;
}

for (i=1; i < resource.contents.length; i++)
{
newContent();
Expand Down Expand Up @@ -267,7 +298,6 @@ function submitContent()
Create a resource JSON (w/ resource id & content id)
Call the server to edit the resource
*/
console.log(temp_content_id);
var resourceName = document.getElementById("meta-name").value;
var resourceUse = document.getElementById("resource-use").value;
var contentName = [];
Expand Down Expand Up @@ -443,21 +473,21 @@ function resetContentNum ()
preUpdatedContentNum = contentNum;
}

function createClassSelection (classJson)
function resourceUseSelection (resourceUseJson)
{
/*
@classJson receive data about the class from max's Tree

create the htmlCode to create the selector for classAttachment
*/
var classData = classJson;
var resourceUse= resourceUseJson;

htmlCode = "<select name = 'classAttach' theme='google' width='400' style='' \
placeholder='Attach Your Resource To A Class' data-search='true'> ";
var htmlCode = "<select id = 'resource-use' name = 'attach' theme='google' width='400' style='' \
placeholder='Select the Use of Your Resource' data-search='true'> ";

for (i = 0; i < classData.data.length; i ++){
var c = classData.data[i];
htmlCode += "<option value = '" + c.id + "'> " + c.name + "</option>";
for (i = 0; i < resourceUse.data.length; i ++){
var u = resourceUse.data[i];
htmlCode += "<option value = '" + u.id + "'> " + u.name + "</option>";
}

htmlCode += "</select>";
Expand Down
1 change: 1 addition & 0 deletions public/js/selectStyleSrc/selectstyle.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -91,6 +91,7 @@
var txt = $(this).data('title'),
vl = $(this).attr('value'),
sid = $(this).parent('ul').attr('sid');
$('select[name="attach').val(vl);
$(this).parents('ul#select_style_ul').hide();
$(this).parents('ul#select_style_ul').parent('div').find('div#select_style_text').html(txt);
$('#'+sid).children('option').filter(function(){return $(this).val()==vl}).prop('selected',true).change();
Expand Down