Giter VIP home page Giter VIP logo

com1000's Introduction

COM1000 (Challenge-O-Mattic 1000)

Free Code Camp's Challenge Editor

Note

Users should only download the production version of COM1000, master is not guaranteed to be safe. This will alter the challenge files in your Free Code Camp /seed/challenges directory!

Initial Setup

  • Clone this repo to the same directory where your Free Code Camp directory is (ex> /Users/terakilobyte/Developer)
    • The directory should be something like:
    /Users/terakilobyte/Developer
      |- freecodecamp
      \- COM1000
    
    • git clone https://github.com/FreeCodeCamp/COM1000.git
  • cd COM1000 && npm install
  • <yourFCC_FOLDER_NAME> is whatever you named your Free Code Camp repo locally(mine is freecodecamp).
  • echo 'FCC_FOLDER_NAME = "<yourFCC_FOLDER_NAME>"' >> .env
  • (Optional) Add PORT = XXXX in .env file to change the default port from 3000 to XXXX
  • npm run build

To Run

  • npm start

Contributing

All prs should be filed against the master branch.
Once the master branch is deemed necessary to be pushed into the production branch a pr will be made and QA'd

com1000's People

Contributors

benmcmahon100 avatar kkas avatar ltegman avatar rasheedu avatar saintpeter avatar terakilobyte avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

com1000's Issues

Add Dropdown for Challenge Type

Challenge Type is a numeric, for one of these values:

  common.challengeTypes = {
    HTML: '0',
    JS: '1',  // Waypoint
    VIDEO: '2',
    ZIPLINE: '3',
    BASEJUMP: '4',
    BONFIRE: '5',
    HIKES: '6',
    STEP: '7'
  };

Drop down should display as:
Waypoint (1)
...
Bonfire (5)
...
Step (7)

So you can see the value as well as the common name.

add hints to COM interface

Hints are defined as follows

on the challenge object
{ hints: [ ...String ] }

An array of single line strings.

The default is an empty array

Make it work with new seed structure

We are changing the seed structure to use a nested file and added a few new properties.

challenges/
|- xx-name-of-challenge-super-block
  |- challenge-block.json

adds superBlock and superOrder properties

Currently on branch feature/hikes, but should be merged in soon.

Add testing

From @BerkeleyTrue on October 30, 2015 18:51

Copied from original issue: FreeCodeCamp/ChallengeOMatic1003#7

Add Date Picker for "releasedOn" field

The releasedOn field will not always be set, but if it is, we should have a nice jQuery date picker.

Output format of the date should be:
MMMM D, YYYY
IE:
January 1, 2016

Field must be blankable.

major accessibility issues

Not sure if I'm doing something wrong, could be user error. Would appreciate thoughts.
When I go to the main page, seemingly triggered by the e/files express route, i get a list of files in my ~/freecodecamp/challenges. These files cannot be interacted with in any way I can see. Lastly in the DOM order is a 'choose files' button. Clicking this button seems to do nothing, according to screenreader. Nothing else appears to be on the page.
Would like to add some accessibility and general information to some of the challenges, can't do that now since I don't really fancy editing the raw json data. Any comments very much appreciated :)

Correct default height to editor fields, multiple field types

Various fields are "single line" fields and should display the proper height.

Fields which are limited to a list of values, such as challenge type should display as a drop down. Boolean values should have a true/false or "don't display" value.

Support "Step Challenge" challenge type

Challenge type 7.

These have a unique structure:

description: [
  [
   "Image URL (Required)",
   "Image Description (Required)",
   "Text (Required), One line broken by <br />",
   "Click To Open URL (Optional)"
  ], 
  /* Additional Steps */
]

It seems like a nice interface would have single line for most of these, maybe a multi-line editor for the "text" item (description[2]) that would automatically create <br /> entries.

There would be an "Add New Step" button as well.

"Choose File" should rescan challenge directory

Clicking "Choose File" should rescan the challenge directory.

If a new file has been added and any other file has been removed, then it should re-scan the challenge page to show all latest files.

Current Workaround:-

  • Refesh the page

UI: `fixed` top menu bar at the top

From @SaintPeter on November 24, 2015 21:15

Fix the Choose File/Export/Back menu bar at the top of the screen so it can always be seen/clicked. "Prev/Next" buttons could go here as well.

Copied from original issue: FreeCodeCamp/ChallengeOMatic1003#28

Change default function of "home" and "end" keys

Please add the following code to the CodeMirror init.
CodeMirror.keymap.default.End = "goLineRight"
CodeMirror.keymap.default.Home = "goLineLeft"

This will cause the home and end keys to go to the start/end of the word wrapped line, rather than the absolute end of the line.

Feature: Pick local file, Reload File

From @SaintPeter on November 24, 2015 18:46

Since we're able to write to the local file system, it would be nice to be able to read from it as well.

If we load a local file, we should then be able to "reload" the file, so we can quickly pick up changes we've made by directly editing the JSON.

Low Priority.

Copied from original issue: FreeCodeCamp/ChallengeOMatic1003#26

Tape tests fail to run under Windows

I took a deeper look into this error message:

$ npm test

> [email protected] test d:\mean\COM1000
> node node_modules/.bin/babel-tape-runner tests/**/*.js | faucet

d:\mean\COM1000\node_modules\.bin\babel-tape-runner:4
case `uname` in
^^^^

SyntaxError: Unexpected token case
    at exports.runInThisContext (vm.js:53:16)
    at Module._compile (module.js:414:25)
    at Object.Module._extensions..js (module.js:442:10)
    at Module.load (module.js:356:32)
    at Function.Module._load (module.js:311:12)
    at Function.Module.runMain (module.js:467:10)
    at startup (node.js:136:18)
    at node.js:963:3
 not ok 1 no plan found
not ok 2 no assertions found
⨯ fail  2
npm ERR! Test failed.  See above for more details.

And realized that the command is trying to run a shell script with node. . . 😄

The correct command, I think, is:
node_modules/.bin/babel-tape-runner tests/**/*.js | node node_modules/faucet, but I don't get any output.

Running without faucet gives me:

$ node_modules/.bin/babel-tape-runner tests/**/*.js
TAP version 13
# #reducer.spec
# Test 1 should return a default state if none is provided
ok 1 should be equivalent
# Test 2 should return a new state upon a valid action type
ok 2 should not be equal
# Test 3 should return previous state on invalid action
ok 3 should be equivalent
# #tape.spec
# Test 1 should fail
# Assertion passes
ok 4 should be equal
# Assertion fails
not ok 5 should not be equal
  ---
    operator: notEqual
    expected: undefined
    actual:   5
  ...

1..5
# tests 5
# pass  4
# fail  1

Add <title> to COM page

From @SaintPeter on November 24, 2015 23:11

Call it what it is. "Challenge-O-Matic" in the title.

Copied from original issue: FreeCodeCamp/ChallengeOMatic1003#30

Add translations field

challenges now have a property

{ "translations": Object }

It's keys are IETF language tags. for example...

  "translation": {
    "es": {
      "title": "Challenge TItle",
      "description": [ "line 1" ]
    },
   "pt-PR": ...

The old method of having challenges at the top level will be removed

Tabbed Editor Interface, Group Fields

Fields should be grouped together under tabs to make it easy to edit sections of content and reduce unnecessary scrolling.

First Pass on Grouping:

  • Display
    • title (with Language Selector)
    • description (with Language Selector)
  • Code
    • head
    • challengeSeed
    • tail
    • tests
  • Solutions
    • solution 1
  • Settings
    • isBeta (boolean)
    • updatedOn (Date Picker)
    • challengeType (Dropdown)
    • type (is this even used?)

I'm totally flexible on this grouping, this is just a straw dog.

Assume a "Half Screen Display" until we have live preview. This should be intended to display in a single column, ~1000px wide.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.